@flows/react-components
Advanced tools
Comparing version
"use client" | ||
"use strict";var J=Object.create;var p=Object.defineProperty,K=Object.defineProperties,Q=Object.getOwnPropertyDescriptor,j=Object.getOwnPropertyDescriptors,oo=Object.getOwnPropertyNames,w=Object.getOwnPropertySymbols,eo=Object.getPrototypeOf,y=Object.prototype.hasOwnProperty,I=Object.prototype.propertyIsEnumerable;var F=(o,e,t)=>e in o?p(o,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):o[e]=t,d=(o,e)=>{for(var t in e||(e={}))y.call(e,t)&&F(o,t,e[t]);if(w)for(var t of w(e))I.call(e,t)&&F(o,t,e[t]);return o},W=(o,e)=>K(o,j(e));var m=(o,e)=>{var t={};for(var r in o)y.call(o,r)&&e.indexOf(r)<0&&(t[r]=o[r]);if(o!=null&&w)for(var r of w(o))e.indexOf(r)<0&&I.call(o,r)&&(t[r]=o[r]);return t};var to=(o,e)=>{for(var t in e)p(o,t,{get:e[t],enumerable:!0})},M=(o,e,t,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let l of oo(e))!y.call(o,l)&&l!==t&&p(o,l,{get:()=>e[l],enumerable:!(r=Q(e,l))||r.enumerable});return o};var b=(o,e,t)=>(t=o!=null?J(eo(o)):{},M(e||!o||!o.__esModule?p(t,"default",{value:o,enumerable:!0}):t,o)),ro=o=>M(p({},"__esModule",{value:!0}),o);var bo={};to(bo,{Modal:()=>no,Tooltip:()=>wo});module.exports=ro(bo);var D=b(require("classnames"));var C={button:"s",primary:"o",secondary:"r"};var L=require("react/jsx-runtime"),g=r=>{var l=r,{className:o,variant:e}=l,t=m(l,["className","variant"]);return(0,L.jsx)("button",d({type:"button",className:(0,D.default)(C.button,C[e],o)},t))};var U=b(require("classnames"));var A=b(require("classnames"));var z={text:"i",body:"f",title:"d"};var _=require("react/jsx-runtime"),c=r=>{var l=r,{className:o,variant:e}=l,t=m(l,["className","variant"]);return(0,_.jsx)("p",d({className:(0,A.default)(z.text,z[e],o)},t))};var H=b(require("classnames"));var G={button:"a"};var O=require("react/jsx-runtime"),u=t=>{var r=t,{className:o}=r,e=m(r,["className"]);return(0,O.jsx)("button",d({type:"button",className:(0,H.default)(G.button,o)},e))};var N=require("react/jsx-runtime");function v(o){return(0,N.jsx)("svg",W(d({height:16,viewBox:"0 0 16 16",width:16,xmlns:"http://www.w3.org/2000/svg",fill:"currentColor"},o),{children:(0,N.jsx)("path",{d:"M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"})}))}var f={overlay:"t",wrapper:"n",modal:"w",footer:"b",close:"p"};var a=require("react/jsx-runtime"),V=o=>(0,a.jsxs)(a.Fragment,{children:[o.overlay?(0,a.jsx)("div",{className:(0,U.default)(f.overlay,o.onClose&&f.clickable),onClick:o.onClose,"aria-hidden":"true"}):null,(0,a.jsx)("div",{className:f.wrapper,children:(0,a.jsxs)("div",{className:f.modal,children:[(0,a.jsx)(c,{variant:"title",children:o.title}),(0,a.jsx)(c,{variant:"body",dangerouslySetInnerHTML:{__html:o.body}}),(0,a.jsx)("div",{className:f.footer,children:o.buttons}),o.onClose?(0,a.jsx)(u,{className:f.close,onClick:o.onClose,children:(0,a.jsx)(v,{})}):null]})})]});var R=require("react/jsx-runtime"),no=o=>(0,R.jsx)(V,{title:o.title,body:o.body,buttons:o.continueText?(0,R.jsx)(g,{variant:"primary",onClick:o.continue,children:o.continueText}):null,overlay:!o.hideOverlay,onClose:o.showCloseButton?o.close:void 0});var x=require("react"),s=require("@floating-ui/react-dom");var n={root:"g",tooltip:"l",arrow:"v","arrow-bottom":"m","arrow-top":"x",footer:"u",close:"h"};var i=require("react/jsx-runtime"),mo=4,$=6,co=8,po=8,X=o=>{var S,E;let e=(0,x.useRef)(null),t=mo+$,{refs:r,middlewareData:l,placement:h,x:Y,y:Z}=(0,s.useFloating)({placement:o.placement,elements:{reference:document.querySelector(o.targetElement)},middleware:[(0,s.flip)({fallbackPlacements:["top","bottom","left","right"]}),(0,s.shift)({crossAxis:!0,padding:co}),(0,s.arrow)({element:e,padding:po}),(0,s.offset)(t)]}),q=h.includes("top")?"bottom":h.includes("bottom")?"top":h.includes("left")?"right":"left",P=(S=l.arrow)==null?void 0:S.x,B=(E=l.arrow)==null?void 0:E.y,T={left:P!=null?`${P}px`:"",top:B!=null?`${B}px`:"",right:"",bottom:"",[q]:`${-$}px`};return(0,x.useEffect)(()=>{o.targetElement||console.error("Flows: Cannot render tooltip without target element")},[o.targetElement]),o.targetElement?(0,i.jsx)("div",{className:n.root,children:(0,i.jsxs)("div",{className:n.tooltip,ref:r.setFloating,style:{left:Y,top:Z},children:[(0,i.jsx)(c,{variant:"title",children:o.title}),(0,i.jsx)(c,{variant:"body",dangerouslySetInnerHTML:{__html:o.body}}),(0,i.jsx)("div",{className:n.footer,children:o.buttons}),o.onClose?(0,i.jsx)(u,{className:n.close,onClick:o.onClose,children:(0,i.jsx)(v,{})}):null,(0,i.jsx)("div",{className:[n.arrow,n["arrow-bottom"]].join(" "),ref:e,style:T}),(0,i.jsx)("div",{className:[n.arrow,n["arrow-top"]].join(" "),style:T})]})}):null};var k=require("react/jsx-runtime"),wo=o=>(0,k.jsx)(X,{title:o.title,body:o.body,targetElement:o.targetElement,placement:o.placement,onClose:o.showCloseButton?o.close:void 0,buttons:o.continueText?(0,k.jsx)(g,{variant:"primary",onClick:o.continue,children:o.continueText}):null}); | ||
"use strict";var z=Object.create;var p=Object.defineProperty,K=Object.defineProperties,Q=Object.getOwnPropertyDescriptor,j=Object.getOwnPropertyDescriptors,tt=Object.getOwnPropertyNames,_=Object.getOwnPropertySymbols,et=Object.getPrototypeOf,N=Object.prototype.hasOwnProperty,$=Object.prototype.propertyIsEnumerable;var L=(t,e,o)=>e in t?p(t,e,{enumerable:!0,configurable:!0,writable:!0,value:o}):t[e]=o,s=(t,e)=>{for(var o in e||(e={}))N.call(e,o)&&L(t,o,e[o]);if(_)for(var o of _(e))$.call(e,o)&&L(t,o,e[o]);return t},k=(t,e)=>K(t,j(e));var f=(t,e)=>{var o={};for(var l in t)N.call(t,l)&&e.indexOf(l)<0&&(o[l]=t[l]);if(t!=null&&_)for(var l of _(t))e.indexOf(l)<0&&$.call(t,l)&&(o[l]=t[l]);return o};var ot=(t,e)=>{for(var o in e)p(t,o,{get:e[o],enumerable:!0})},O=(t,e,o,l)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of tt(e))!N.call(t,n)&&n!==o&&p(t,n,{get:()=>e[n],enumerable:!(l=Q(e,n))||l.enumerable});return t};var v=(t,e,o)=>(o=t!=null?z(et(t)):{},O(e||!t||!t.__esModule?p(o,"default",{value:t,enumerable:!0}):o,t)),lt=t=>O(p({},"__esModule",{value:!0}),t);var mt={};ot(mt,{Modal:()=>nt,Tooltip:()=>ct});module.exports=lt(mt);var H=v(require("classnames"));var G=require("react/jsx-runtime"),C=l=>{var n=l,{className:t,variant:e}=n,o=f(n,["className","variant"]);return(0,G.jsx)("button",s({type:"button",className:(0,H.default)("flows_button",`flows_button_${e}`,t)},o))};var Y=v(require("classnames"));var V=v(require("classnames"));var U=require("react/jsx-runtime"),u=l=>{var n=l,{className:t,variant:e}=n,o=f(n,["className","variant"]);return(0,U.jsx)("p",s({className:(0,V.default)("flows_text",`flows_text_${e}`,t)},o))};var W=v(require("classnames"));var X=require("react/jsx-runtime"),b=o=>{var l=o,{className:t}=l,e=f(l,["className"]);return(0,X.jsx)("button",s({type:"button",className:(0,W.default)("flows_iconButton",t)},e))};var h=require("react/jsx-runtime");function x(t){return(0,h.jsx)("svg",k(s({height:16,viewBox:"0 0 16 16",width:16,xmlns:"http://www.w3.org/2000/svg",fill:"currentColor"},t),{children:(0,h.jsx)("path",{d:"M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"})}))}var r=require("react/jsx-runtime"),Z=t=>(0,r.jsxs)(r.Fragment,{children:[t.overlay?(0,r.jsx)("div",{className:(0,Y.default)("flows_modal_overlay",t.onClose&&"flows_modal_clickable"),onClick:t.onClose,"aria-hidden":"true"}):null,(0,r.jsx)("div",{className:"flows_modal_wrapper",children:(0,r.jsxs)("div",{className:"flows_modal_modal",children:[(0,r.jsx)(u,{variant:"title",children:t.title}),(0,r.jsx)(u,{variant:"body",dangerouslySetInnerHTML:{__html:t.body}}),(0,r.jsx)("div",{className:"flows_modal_footer",children:t.buttons}),t.onClose?(0,r.jsx)(b,{className:"flows_modal_close",onClick:t.onClose,children:(0,r.jsx)(x,{})}):null]})})]});var T=require("react/jsx-runtime"),nt=t=>(0,T.jsx)(Z,{title:t.title,body:t.body,buttons:t.continueText?(0,T.jsx)(C,{variant:"primary",onClick:t.continue,children:t.continueText}):null,overlay:!t.hideOverlay,onClose:t.showCloseButton?t.close:void 0});var c=require("react"),a=require("@floating-ui/react-dom"),P=v(require("classnames"));var i=require("react/jsx-runtime"),rt=4,q=6,it=rt+q,at=8,st=8,J=t=>{var R,M;let e=(0,c.useRef)(null),o=(0,c.useRef)(null),l=(0,c.useRef)(null),n=document.querySelector(t.targetElement),{refs:y,middlewareData:g,placement:w,x:B,y:F}=(0,a.useFloating)({placement:t.placement,elements:{reference:n},whileElementsMounted:a.autoUpdate,middleware:[(0,a.flip)({fallbackPlacements:["top","bottom","left","right"]}),(0,a.shift)({crossAxis:!0,padding:at}),(0,a.arrow)({element:o,padding:st}),(0,a.offset)(it)]});if((0,c.useEffect)(()=>{y.floating.current&&(y.floating.current.style.left=`${B}px`,y.floating.current.style.top=`${F}px`)},[y.floating,B,F]),(0,c.useEffect)(()=>{var I,A;let m=w.includes("top")?"bottom":w.includes("bottom")?"top":w.includes("left")?"right":"left",S=(I=g.arrow)==null?void 0:I.x,D=(A=g.arrow)==null?void 0:A.y;[o,e].forEach(d=>{d.current&&(d.current.style.left=S!=null?`${S}px`:"",d.current.style.top=D!=null?`${D}px`:"",d.current.style.right="",d.current.style.bottom="",d.current.style[m]=`${-q}px`)})},[(R=g.arrow)==null?void 0:R.x,(M=g.arrow)==null?void 0:M.y,w]),(0,c.useEffect)(()=>{t.targetElement||console.error("Flows: Cannot render tooltip without target element")},[t.targetElement]),!t.targetElement)return null;if(l.current&&n){let m=n.getBoundingClientRect();l.current.style.top=`${m.top}px`,l.current.style.left=`${m.left}px`,l.current.style.width=`${m.width}px`,l.current.style.height=`${m.height}px`}return(0,i.jsxs)("div",{className:"flows_tooltip_root",children:[t.overlay?(0,i.jsx)("div",{className:"flows_tooltip_overlay",ref:l}):null,(0,i.jsxs)("div",{className:"flows_tooltip_tooltip",ref:y.setFloating,children:[(0,i.jsx)(u,{variant:"title",children:t.title}),(0,i.jsx)(u,{variant:"body",dangerouslySetInnerHTML:{__html:t.body}}),(0,i.jsx)("div",{className:"flows_tooltip_footer",children:t.buttons}),t.onClose?(0,i.jsx)(b,{className:"flows_tooltip_close",onClick:t.onClose,children:(0,i.jsx)(x,{})}):null,(0,i.jsx)("div",{className:(0,P.default)("flows_tooltip_arrow","flows_tooltip_arrow-bottom"),ref:o}),(0,i.jsx)("div",{className:(0,P.default)("flows_tooltip_arrow","flows_tooltip_arrow-top"),ref:e})]})]})};var E=require("react/jsx-runtime"),ct=t=>(0,E.jsx)(J,{title:t.title,body:t.body,targetElement:t.targetElement,placement:t.placement,overlay:!t.hideOverlay,onClose:t.showCloseButton?t.close:void 0,buttons:t.continueText?(0,E.jsx)(C,{variant:"primary",onClick:t.continue,children:t.continueText}):null}); |
@@ -23,2 +23,3 @@ import { FC } from 'react'; | ||
placement?: Placement; | ||
hideOverlay?: boolean; | ||
}>; | ||
@@ -25,0 +26,0 @@ declare const Tooltip: FC<TooltipProps>; |
"use client" | ||
"use strict";var U=Object.create;var b=Object.defineProperty,K=Object.defineProperties,Q=Object.getOwnPropertyDescriptor,j=Object.getOwnPropertyDescriptors,oo=Object.getOwnPropertyNames,w=Object.getOwnPropertySymbols,to=Object.getPrototypeOf,N=Object.prototype.hasOwnProperty,I=Object.prototype.propertyIsEnumerable;var S=(o,t,e)=>t in o?b(o,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):o[t]=e,d=(o,t)=>{for(var e in t||(t={}))N.call(t,e)&&S(o,e,t[e]);if(w)for(var e of w(t))I.call(t,e)&&S(o,e,t[e]);return o},M=(o,t)=>K(o,j(t));var u=(o,t)=>{var e={};for(var r in o)N.call(o,r)&&t.indexOf(r)<0&&(e[r]=o[r]);if(o!=null&&w)for(var r of w(o))t.indexOf(r)<0&&I.call(o,r)&&(e[r]=o[r]);return e};var eo=(o,t)=>{for(var e in t)b(o,e,{get:t[e],enumerable:!0})},D=(o,t,e,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of oo(t))!N.call(o,a)&&a!==e&&b(o,a,{get:()=>t[a],enumerable:!(r=Q(t,a))||r.enumerable});return o};var g=(o,t,e)=>(e=o!=null?U(to(o)):{},D(t||!o||!o.__esModule?b(e,"default",{value:o,enumerable:!0}):e,o)),ro=o=>D(b({},"__esModule",{value:!0}),o);var vo={};eo(vo,{Modal:()=>so,Tooltip:()=>po});module.exports=ro(vo);var H=g(require("classnames"));var L=g(require("classnames"));var T={text:"R",body:"W",title:"j"};var A=require("react/jsx-runtime"),p=r=>{var a=r,{className:o,variant:t}=a,e=u(a,["className","variant"]);return(0,A.jsx)("p",d({className:(0,L.default)(T.text,T[t],o)},e))};var W=g(require("classnames"));var _={button:"c"};var G=require("react/jsx-runtime"),y=e=>{var r=e,{className:o}=r,t=u(r,["className"]);return(0,G.jsx)("button",d({type:"button",className:(0,W.default)(_.button,o)},t))};var P=require("react/jsx-runtime");function h(o){return(0,P.jsx)("svg",M(d({height:16,viewBox:"0 0 16 16",width:16,xmlns:"http://www.w3.org/2000/svg",fill:"currentColor"},o),{children:(0,P.jsx)("path",{d:"M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"})}))}var c={overlay:"I",wrapper:"B",modal:"P",footer:"S",close:"q"};var i=require("react/jsx-runtime"),O=o=>(0,i.jsxs)(i.Fragment,{children:[o.overlay?(0,i.jsx)("div",{className:(0,H.default)(c.overlay,o.onClose&&c.clickable),onClick:o.onClose,"aria-hidden":"true"}):null,(0,i.jsx)("div",{className:c.wrapper,children:(0,i.jsxs)("div",{className:c.modal,children:[(0,i.jsx)(p,{variant:"title",children:o.title}),(0,i.jsx)(p,{variant:"body",dangerouslySetInnerHTML:{__html:o.body}}),(0,i.jsx)("div",{className:c.footer,children:o.buttons}),o.onClose?(0,i.jsx)(y,{className:c.close,onClick:o.onClose,children:(0,i.jsx)(h,{})}):null]})})]});var V=g(require("classnames"));var k={button:"A",primary:"z",secondary:"y"};var $=require("react/jsx-runtime"),v=r=>{var a=r,{className:o,variant:t}=a,e=u(a,["className","variant"]);return(0,$.jsx)("button",d({type:"button",className:(0,V.default)(k.button,k[t],o)},e))};var m=require("react/jsx-runtime"),so=o=>(0,m.jsx)(O,{title:o.title,body:o.body,overlay:!o.hideOverlay,buttons:(0,m.jsxs)(m.Fragment,{children:[o.previous&&o.previousText?(0,m.jsx)(v,{variant:"secondary",onClick:o.previous,children:o.previousText}):null,o.continueText?(0,m.jsx)(v,{variant:"primary",onClick:o.continue,children:o.continueText}):null]}),onClose:o.showCloseButton?o.cancel:void 0});var x=require("react"),l=require("@floating-ui/react-dom");var s={root:"C",tooltip:"k",arrow:"D","arrow-bottom":"E","arrow-top":"F",footer:"G",close:"H"};var n=require("react/jsx-runtime"),fo=4,X=6,co=8,uo=8,Y=o=>{var E,F;let t=(0,x.useRef)(null),e=fo+X,{refs:r,middlewareData:a,placement:C,x:Z,y:q}=(0,l.useFloating)({placement:o.placement,elements:{reference:document.querySelector(o.targetElement)},middleware:[(0,l.flip)({fallbackPlacements:["top","bottom","left","right"]}),(0,l.shift)({crossAxis:!0,padding:co}),(0,l.arrow)({element:t,padding:uo}),(0,l.offset)(e)]}),J=C.includes("top")?"bottom":C.includes("bottom")?"top":C.includes("left")?"right":"left",B=(E=a.arrow)==null?void 0:E.x,R=(F=a.arrow)==null?void 0:F.y,z={left:B!=null?`${B}px`:"",top:R!=null?`${R}px`:"",right:"",bottom:"",[J]:`${-X}px`};return(0,x.useEffect)(()=>{o.targetElement||console.error("Flows: Cannot render tooltip without target element")},[o.targetElement]),o.targetElement?(0,n.jsx)("div",{className:s.root,children:(0,n.jsxs)("div",{className:s.tooltip,ref:r.setFloating,style:{left:Z,top:q},children:[(0,n.jsx)(p,{variant:"title",children:o.title}),(0,n.jsx)(p,{variant:"body",dangerouslySetInnerHTML:{__html:o.body}}),(0,n.jsx)("div",{className:s.footer,children:o.buttons}),o.onClose?(0,n.jsx)(y,{className:s.close,onClick:o.onClose,children:(0,n.jsx)(h,{})}):null,(0,n.jsx)("div",{className:[s.arrow,s["arrow-bottom"]].join(" "),ref:t,style:z}),(0,n.jsx)("div",{className:[s.arrow,s["arrow-top"]].join(" "),style:z})]})}):null};var f=require("react/jsx-runtime"),po=o=>(0,f.jsx)(Y,{title:o.title,body:o.body,targetElement:o.targetElement,placement:o.placement,onClose:o.showCloseButton?o.cancel:void 0,buttons:(0,f.jsxs)(f.Fragment,{children:[o.previous&&o.previousText?(0,f.jsx)(v,{variant:"secondary",onClick:o.previous,children:o.previousText}):null,o.continueText?(0,f.jsx)(v,{variant:"primary",onClick:o.continue,children:o.continueText}):null]})}); | ||
"use strict";var z=Object.create;var C=Object.defineProperty,K=Object.defineProperties,Q=Object.getOwnPropertyDescriptor,j=Object.getOwnPropertyDescriptors,tt=Object.getOwnPropertyNames,b=Object.getOwnPropertySymbols,et=Object.getPrototypeOf,h=Object.prototype.hasOwnProperty,L=Object.prototype.propertyIsEnumerable;var A=(t,e,o)=>e in t?C(t,e,{enumerable:!0,configurable:!0,writable:!0,value:o}):t[e]=o,s=(t,e)=>{for(var o in e||(e={}))h.call(e,o)&&A(t,o,e[o]);if(b)for(var o of b(e))L.call(e,o)&&A(t,o,e[o]);return t},$=(t,e)=>K(t,j(e));var y=(t,e)=>{var o={};for(var n in t)h.call(t,n)&&e.indexOf(n)<0&&(o[n]=t[n]);if(t!=null&&b)for(var n of b(t))e.indexOf(n)<0&&L.call(t,n)&&(o[n]=t[n]);return o};var ot=(t,e)=>{for(var o in e)C(t,o,{get:e[o],enumerable:!0})},O=(t,e,o,n)=>{if(e&&typeof e=="object"||typeof e=="function")for(let l of tt(e))!h.call(t,l)&&l!==o&&C(t,l,{get:()=>e[l],enumerable:!(n=Q(e,l))||n.enumerable});return t};var w=(t,e,o)=>(o=t!=null?z(et(t)):{},O(e||!t||!t.__esModule?C(o,"default",{value:t,enumerable:!0}):o,t)),nt=t=>O(C({},"__esModule",{value:!0}),t);var ct={};ot(ct,{Modal:()=>lt,Tooltip:()=>mt});module.exports=nt(ct);var W=w(require("classnames"));var H=w(require("classnames"));var G=require("react/jsx-runtime"),p=n=>{var l=n,{className:t,variant:e}=l,o=y(l,["className","variant"]);return(0,G.jsx)("p",s({className:(0,H.default)("flows_text",`flows_text_${e}`,t)},o))};var V=w(require("classnames"));var U=require("react/jsx-runtime"),T=o=>{var n=o,{className:t}=n,e=y(n,["className"]);return(0,U.jsx)("button",s({type:"button",className:(0,V.default)("flows_iconButton",t)},e))};var P=require("react/jsx-runtime");function N(t){return(0,P.jsx)("svg",$(s({height:16,viewBox:"0 0 16 16",width:16,xmlns:"http://www.w3.org/2000/svg",fill:"currentColor"},t),{children:(0,P.jsx)("path",{d:"M3.72 3.72a.75.75 0 0 1 1.06 0L8 6.94l3.22-3.22a.749.749 0 0 1 1.275.326.749.749 0 0 1-.215.734L9.06 8l3.22 3.22a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L8 9.06l-3.22 3.22a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042L6.94 8 3.72 4.78a.75.75 0 0 1 0-1.06Z"})}))}var r=require("react/jsx-runtime"),X=t=>(0,r.jsxs)(r.Fragment,{children:[t.overlay?(0,r.jsx)("div",{className:(0,W.default)("flows_modal_overlay",t.onClose&&"flows_modal_clickable"),onClick:t.onClose,"aria-hidden":"true"}):null,(0,r.jsx)("div",{className:"flows_modal_wrapper",children:(0,r.jsxs)("div",{className:"flows_modal_modal",children:[(0,r.jsx)(p,{variant:"title",children:t.title}),(0,r.jsx)(p,{variant:"body",dangerouslySetInnerHTML:{__html:t.body}}),(0,r.jsx)("div",{className:"flows_modal_footer",children:t.buttons}),t.onClose?(0,r.jsx)(T,{className:"flows_modal_close",onClick:t.onClose,children:(0,r.jsx)(N,{})}):null]})})]});var Y=w(require("classnames"));var Z=require("react/jsx-runtime"),v=n=>{var l=n,{className:t,variant:e}=l,o=y(l,["className","variant"]);return(0,Z.jsx)("button",s({type:"button",className:(0,Y.default)("flows_button",`flows_button_${e}`,t)},o))};var m=require("react/jsx-runtime"),lt=t=>(0,m.jsx)(X,{title:t.title,body:t.body,overlay:!t.hideOverlay,buttons:(0,m.jsxs)(m.Fragment,{children:[t.previous&&t.previousText?(0,m.jsx)(v,{variant:"secondary",onClick:t.previous,children:t.previousText}):null,t.continueText?(0,m.jsx)(v,{variant:"primary",onClick:t.continue,children:t.continueText}):null]}),onClose:t.showCloseButton?t.cancel:void 0});var c=require("react"),a=require("@floating-ui/react-dom"),B=w(require("classnames"));var i=require("react/jsx-runtime"),rt=4,q=6,it=rt+q,at=8,st=8,J=t=>{var R,M;let e=(0,c.useRef)(null),o=(0,c.useRef)(null),n=(0,c.useRef)(null),l=document.querySelector(t.targetElement),{refs:g,middlewareData:_,placement:x,x:E,y:F}=(0,a.useFloating)({placement:t.placement,elements:{reference:l},whileElementsMounted:a.autoUpdate,middleware:[(0,a.flip)({fallbackPlacements:["top","bottom","left","right"]}),(0,a.shift)({crossAxis:!0,padding:at}),(0,a.arrow)({element:o,padding:st}),(0,a.offset)(it)]});if((0,c.useEffect)(()=>{g.floating.current&&(g.floating.current.style.left=`${E}px`,g.floating.current.style.top=`${F}px`)},[g.floating,E,F]),(0,c.useEffect)(()=>{var I,k;let f=x.includes("top")?"bottom":x.includes("bottom")?"top":x.includes("left")?"right":"left",S=(I=_.arrow)==null?void 0:I.x,D=(k=_.arrow)==null?void 0:k.y;[o,e].forEach(d=>{d.current&&(d.current.style.left=S!=null?`${S}px`:"",d.current.style.top=D!=null?`${D}px`:"",d.current.style.right="",d.current.style.bottom="",d.current.style[f]=`${-q}px`)})},[(R=_.arrow)==null?void 0:R.x,(M=_.arrow)==null?void 0:M.y,x]),(0,c.useEffect)(()=>{t.targetElement||console.error("Flows: Cannot render tooltip without target element")},[t.targetElement]),!t.targetElement)return null;if(n.current&&l){let f=l.getBoundingClientRect();n.current.style.top=`${f.top}px`,n.current.style.left=`${f.left}px`,n.current.style.width=`${f.width}px`,n.current.style.height=`${f.height}px`}return(0,i.jsxs)("div",{className:"flows_tooltip_root",children:[t.overlay?(0,i.jsx)("div",{className:"flows_tooltip_overlay",ref:n}):null,(0,i.jsxs)("div",{className:"flows_tooltip_tooltip",ref:g.setFloating,children:[(0,i.jsx)(p,{variant:"title",children:t.title}),(0,i.jsx)(p,{variant:"body",dangerouslySetInnerHTML:{__html:t.body}}),(0,i.jsx)("div",{className:"flows_tooltip_footer",children:t.buttons}),t.onClose?(0,i.jsx)(T,{className:"flows_tooltip_close",onClick:t.onClose,children:(0,i.jsx)(N,{})}):null,(0,i.jsx)("div",{className:(0,B.default)("flows_tooltip_arrow","flows_tooltip_arrow-bottom"),ref:o}),(0,i.jsx)("div",{className:(0,B.default)("flows_tooltip_arrow","flows_tooltip_arrow-top"),ref:e})]})]})};var u=require("react/jsx-runtime"),mt=t=>(0,u.jsx)(J,{title:t.title,body:t.body,targetElement:t.targetElement,placement:t.placement,overlay:!t.hideOverlay,onClose:t.showCloseButton?t.cancel:void 0,buttons:(0,u.jsxs)(u.Fragment,{children:[t.previous&&t.previousText?(0,u.jsx)(v,{variant:"secondary",onClick:t.previous,children:t.previousText}):null,t.continueText?(0,u.jsx)(v,{variant:"primary",onClick:t.continue,children:t.continueText}):null]})}); |
{ | ||
"name": "@flows/react-components", | ||
"version": "0.0.2-canary.7", | ||
"version": "0.0.2-canary.8", | ||
"description": "", | ||
@@ -12,3 +12,3 @@ "license": "MIT", | ||
"@types/jest": "^29.5.14", | ||
"@types/node": "^20.16.3", | ||
"@types/node": "^20.17.10", | ||
"@types/react": "^18.3.12", | ||
@@ -20,3 +20,3 @@ "jest": "^29.7.0", | ||
"typescript": "^5.6.3", | ||
"@flows/react": "0.0.2-canary.7" | ||
"@flows/react": "0.0.2-canary.8" | ||
}, | ||
@@ -23,0 +23,0 @@ "peerDependencies": { |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
29870
-1.58%12
-7.69%124
-0.8%