r-onboarding - npm Package Compare versions

Comparing version 1.0.1 to 2.0.0

dist/r-onboarding.es.js

@@ -30,9 +30,32 @@ import require$$0, { createContext, useState, useRef, useEffect, useContext, useLayoutEffect, forwardRef, useImperativeHandle, Fragment } from "react";
 }
+const defaultROnboardingWrapperOptions = {
+  popper: {},
+  overlay: {
+    enabled: true,
+    padding: 0,
+    borderRadius: 0
+  },
+  scrollToStep: {
+    enabled: true,
+    options: {
+      behavior: "smooth",
+      block: "center",
+      inline: "center"
+    }
+  }
+};
 function useSvgOverlay() {
+  var _a, _b, _c, _d;
   const [path, setPath] = useState("");
   const target = useRef(null);
+  const paddingValue = useRef((_b = (_a = defaultROnboardingWrapperOptions.overlay) == null ? void 0 : _a.padding) != null ? _b : 0);
+  const borderRadiusValue = useRef((_d = (_c = defaultROnboardingWrapperOptions.overlay) == null ? void 0 : _c.borderRadius) != null ? _d : 0);
   const onScroll = () => {
-    updatePath(target.current);
+    updatePath(target.current, {
+      padding: paddingValue.current,
+      borderRadius: borderRadiusValue.current
+    });
   };
-  const updatePath = async (element) => {
+  const updatePath = async (element, options = defaultROnboardingWrapperOptions.overlay) => {
+    var _a2, _b2, _c2, _d2, _e, _f, _g, _h, _i, _j, _k, _l;
     if (!element)
@@ -42,4 +65,40 @@ return;
     const { left, top, width, height } = element.getBoundingClientRect();
-    setPath(`M${innerWidth},${innerHeight}H0V0H${innerWidth}V${innerHeight}ZM${left},${top}a0,0,0,0,0-0,0V${top + height}a0,0,0,0,0,0,0H${left + width}a0,0,0,0,0,0-0V${top}a0,0,0,0,0-0-0Z`);
+    const padding = typeof options.padding === "number" ? {
+      top: options.padding,
+      right: options.padding,
+      bottom: options.padding,
+      left: options.padding
+    } : options.padding;
+    const radius = typeof options.borderRadius === "number" ? {
+      leftTop: options.borderRadius,
+      rightTop: options.borderRadius,
+      rightBottom: options.borderRadius,
+      leftBottom: options.borderRadius
+    } : options.borderRadius;
+    const edges = {
+      top: top - ((_a2 = padding == null ? void 0 : padding.top) != null ? _a2 : 0),
+      right: left + width + ((_b2 = padding == null ? void 0 : padding.right) != null ? _b2 : 0),
+      bottom: top + height + ((_c2 = padding == null ? void 0 : padding.bottom) != null ? _c2 : 0),
+      left: left - ((_d2 = padding == null ? void 0 : padding.left) != null ? _d2 : 0)
+    };
+    const pointsPath = {
+      leftTop: `M${edges.left + ((_e = radius == null ? void 0 : radius.leftTop) != null ? _e : 0)},${edges.top} Q${edges.left},${edges.top} ${edges.left},${edges.top + ((_f = radius == null ? void 0 : radius.leftTop) != null ? _f : 0)}`,
+      rightTop: `V${edges.top + ((_g = radius == null ? void 0 : radius.rightTop) != null ? _g : 0)} Q${edges.right},${edges.top} ${edges.right - ((_h = radius == null ? void 0 : radius.rightTop) != null ? _h : 0)},${edges.top}`,
+      rightBottom: `H${edges.right - ((_i = radius == null ? void 0 : radius.rightBottom) != null ? _i : 0)} Q${edges.right},${edges.bottom} ${edges.right},${edges.bottom - ((_j = radius == null ? void 0 : radius.rightBottom) != null ? _j : 0)}`,
+      leftBottom: `V${edges.bottom - ((_k = radius == null ? void 0 : radius.leftBottom) != null ? _k : 0)} Q${edges.left},${edges.bottom} ${edges.left + ((_l = radius == null ? void 0 : radius.leftBottom) != null ? _l : 0)},${edges.bottom}`
+    };
+    setPath(`
+      M${innerWidth},${innerHeight}
+      H0V0
+      H${innerWidth}V${innerHeight}
+      Z
+      ${pointsPath.leftTop}
+      ${pointsPath.leftBottom}
+      ${pointsPath.rightBottom}
+      ${pointsPath.rightTop}
+      Z
+    `);
     target.current = element;
+    paddingValue.current = padding;
+    borderRadiusValue.current = radius;
   };
@@ -808,3 +867,3 @@ useEffect(() => {
   const attachElement = () => {
-    var _a2, _b2, _c2, _d2, _e;
+    var _a2, _b2, _c2, _d2, _e, _f, _g, _h;
     const element = useGetElement((_b2 = (_a2 = context.step) == null ? void 0 : _a2.attachTo) == null ? void 0 : _b2.element);
@@ -818,4 +877,7 @@ if (!element || !stepElement.current)
     }
-    if (!(mergedOptions == null ? void 0 : mergedOptions.disableOverlay)) {
-      updatePath(element);
+    if ((_f = mergedOptions == null ? void 0 : mergedOptions.overlay) == null ? void 0 : _f.enabled) {
+      updatePath(element, {
+        padding: (_g = mergedOptions == null ? void 0 : mergedOptions.overlay) == null ? void 0 : _g.padding,
+        borderRadius: (_h = mergedOptions == null ? void 0 : mergedOptions.overlay) == null ? void 0 : _h.borderRadius
+      });
     }
@@ -850,5 +912,5 @@ setTargetElementClassName(element);
       },
-      children: /* @__PURE__ */ jsx("div", {
+      children: /* @__PURE__ */ jsxs("div", {
         ref: stepElement,
-        children: context.step ? children || /* @__PURE__ */ jsxs("div", {
+        children: [context.step ? children || /* @__PURE__ */ jsxs("div", {
           className: "r-onboarding-item",
@@ -894,3 +956,5 @@ children: [/* @__PURE__ */ jsxs("div", {
           })]
-        }) : null
+        }) : null, /* @__PURE__ */ jsx("div", {
+          "data-popper-arrow": true
+        })]
       })
@@ -900,14 +964,2 @@ })]
 }
-const defaultROnboardingWrapperOptions = {
-  popper: {},
-  disableOverlay: false,
-  scrollToStep: {
-    enabled: true,
-    options: {
-      behavior: "smooth",
-      block: "center",
-      inline: "center"
-    }
-  }
-};
 const ROnboardingWrapper = forwardRef(({
@@ -959,24 +1011,27 @@ steps,
     return null;
-  return /* @__PURE__ */ jsx(ROnboardingContext.Provider, {
-    value: {
-      options: mergedOptions,
-      step: activeStep,
-      nextStep: toNextStep,
-      previousStep: toPreviousStep,
-      exit: finish,
-      isFirstStep,
-      isLastStep,
-      index
-    },
-    children: children ? /* @__PURE__ */ jsx(Fragment, {
-      children: children({
+  return /* @__PURE__ */ jsx("div", {
+    "data-r-onboarding-wrapper": true,
+    children: /* @__PURE__ */ jsx(ROnboardingContext.Provider, {
+      value: {
+        options: mergedOptions,
         step: activeStep,
-        next: toNextStep,
-        previous: toPreviousStep,
+        nextStep: toNextStep,
+        previousStep: toPreviousStep,
         exit: finish,
-        isFirst: isFirstStep,
-        isLast: isLastStep,
+        isFirstStep,
+        isLastStep,
         index
-      })
-    }, index) : /* @__PURE__ */ jsx(ROnboardingStep, {}, index)
+      },
+      children: children ? /* @__PURE__ */ jsx(Fragment, {
+        children: children({
+          step: activeStep,
+          next: toNextStep,
+          previous: toPreviousStep,
+          exit: finish,
+          isFirst: isFirstStep,
+          isLast: isLastStep,
+          index
+        })
+      }, index) : /* @__PURE__ */ jsx(ROnboardingStep, {}, index)
+    })
   });
@@ -983,0 +1038,0 @@ });

dist/r-onboarding.umd.js

@@ -1,2 +0,12 @@
-(function(x,l){typeof exports=="object"&&typeof module!="undefined"?l(exports,require("react"),require("@popperjs/core")):typeof define=="function"&&define.amd?define(["exports","react","@popperjs/core"],l):(x=typeof globalThis!="undefined"?globalThis:x||self,l(x["r-onboarding"]={},x.react,x.core))})(this,function(x,l,kt){"use strict";function $t(i){return i&&typeof i=="object"&&"default"in i?i:{default:i}}var te=$t(l);const Ot=l.createContext({});function ct(i){return i?typeof i=="string"?document.querySelector(i):typeof i=="function"?i():null:null}function ee(){return{setTargetElementClassName:(b,c)=>{!c||!b||b.classList.add(...c)},unsetTargetElementClassName:(b,c)=>{!c||!b||b.classList.remove(...c)}}}function ne(){const[i,_]=l.useState(""),b=l.useRef(null),c=()=>{u(b.current)},u=async a=>{if(!a)return;const{innerWidth:m,innerHeight:j}=window,{left:N,top:E,width:L,height:z}=a.getBoundingClientRect();_(`M${m},${j}H0V0H${m}V${j}ZM${N},${E}a0,0,0,0,0-0,0V${E+z}a0,0,0,0,0,0,0H${N+L}a0,0,0,0,0,0-0V${E}a0,0,0,0,0-0-0Z`),b.current=a};return l.useEffect(()=>(window.addEventListener("scroll",c),window.addEventListener("resize",c),()=>{window.removeEventListener("scroll",c),window.removeEventListener("resize",c)}),[]),{path:i,updatePath:u}}var q=typeof globalThis!="undefined"?globalThis:typeof window!="undefined"?window:typeof global!="undefined"?global:typeof self!="undefined"?self:{},ft={exports:{}};(function(i,_){var b=200,c="__lodash_hash_undefined__",u=800,a=16,m=9007199254740991,j="[object Arguments]",N="[object Array]",E="[object AsyncFunction]",L="[object Boolean]",z="[object Date]",B="[object Error]",P="[object Function]",F="[object GeneratorFunction]",V="[object Map]",M="[object Number]",R="[object Null]",T="[object Object]",p="[object Proxy]",y="[object RegExp]",v="[object Set]",C="[object String]",U="[object Undefined]",tt="[object WeakMap]",de="[object ArrayBuffer]",pe="[object DataView]",he="[object Float32Array]",ge="[object Float64Array]",_e="[object Int8Array]",be="[object Int16Array]",ve="[object Int32Array]",ye="[object Uint8Array]",me="[object Uint8ClampedArray]",Se="[object Uint16Array]",Te="[object Uint32Array]",we=/[\\^$.*+?()[\]{}|]/g,Oe=/^\[object .+?Constructor\]$/,xe=/^(?:0|[1-9]\d*)$/,d={};d[he]=d[ge]=d[_e]=d[be]=d[ve]=d[ye]=d[me]=d[Se]=d[Te]=!0,d[j]=d[N]=d[de]=d[L]=d[pe]=d[z]=d[B]=d[P]=d[V]=d[M]=d[T]=d[y]=d[v]=d[C]=d[tt]=!1;var Et=typeof q=="object"&&q&&q.Object===Object&&q,Ce=typeof self=="object"&&self&&self.Object===Object&&self,Z=Et||Ce||Function("return this")(),It=_&&!_.nodeType&&_,J=It&&!0&&i&&!i.nodeType&&i,At=J&&J.exports===It,dt=At&&Et.process,Nt=function(){try{var t=J&&J.require&&J.require("util").types;return t||dt&&dt.binding&&dt.binding("util")}catch{}}(),Pt=Nt&&Nt.isTypedArray;function je(t,e,n){switch(n.length){case 0:return t.call(e);case 1:return t.call(e,n[0]);case 2:return t.call(e,n[0],n[1]);case 3:return t.call(e,n[0],n[1],n[2])}return t.apply(e,n)}function Ee(t,e){for(var n=-1,r=Array(t);++n<t;)r[n]=e(n);return r}function Ie(t){return function(e){return t(e)}}function Ae(t,e){return t==null?void 0:t[e]}function Ne(t,e){return function(n){return t(e(n))}}var Pe=Array.prototype,Le=Function.prototype,et=Object.prototype,pt=Z["__core-js_shared__"],nt=Le.toString,I=et.hasOwnProperty,Lt=function(){var t=/[^.]+$/.exec(pt&&pt.keys&&pt.keys.IE_PROTO||"");return t?"Symbol(src)_1."+t:""}(),zt=et.toString,ze=nt.call(Object),Fe=RegExp("^"+nt.call(I).replace(we,"\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g,"$1.*?")+"$"),rt=At?Z.Buffer:void 0,Ft=Z.Symbol,Mt=Z.Uint8Array,Rt=rt?rt.allocUnsafe:void 0,Ut=Ne(Object.getPrototypeOf,Object),Dt=Object.create,Me=et.propertyIsEnumerable,Re=Pe.splice,D=Ft?Ft.toStringTag:void 0,it=function(){try{var t=_t(Object,"defineProperty");return t({},"",{}),t}catch{}}(),Ue=rt?rt.isBuffer:void 0,Ht=Math.max,De=Date.now,Gt=_t(Z,"Map"),Y=_t(Object,"create"),He=function(){function t(){}return function(e){if(!G(e))return{};if(Dt)return Dt(e);t.prototype=e;var n=new t;return t.prototype=void 0,n}}();function H(t){var e=-1,n=t==null?0:t.length;for(this.clear();++e<n;){var r=t[e];this.set(r[0],r[1])}}function Ge(){this.__data__=Y?Y(null):{},this.size=0}function Be(t){var e=this.has(t)&&delete this.__data__[t];return this.size-=e?1:0,e}function Ve(t){var e=this.__data__;if(Y){var n=e[t];return n===c?void 0:n}return I.call(e,t)?e[t]:void 0}function We(t){var e=this.__data__;return Y?e[t]!==void 0:I.call(e,t)}function Ke(t,e){var n=this.__data__;return this.size+=this.has(t)?0:1,n[t]=Y&&e===void 0?c:e,this}H.prototype.clear=Ge,H.prototype.delete=Be,H.prototype.get=Ve,H.prototype.has=We,H.prototype.set=Ke;function A(t){var e=-1,n=t==null?0:t.length;for(this.clear();++e<n;){var r=t[e];this.set(r[0],r[1])}}function Ze(){this.__data__=[],this.size=0}function Je(t){var e=this.__data__,n=at(e,t);if(n<0)return!1;var r=e.length-1;return n==r?e.pop():Re.call(e,n,1),--this.size,!0}function Ye(t){var e=this.__data__,n=at(e,t);return n<0?void 0:e[n][1]}function Xe(t){return at(this.__data__,t)>-1}function Qe(t,e){var n=this.__data__,r=at(n,t);return r<0?(++this.size,n.push([t,e])):n[r][1]=e,this}A.prototype.clear=Ze,A.prototype.delete=Je,A.prototype.get=Ye,A.prototype.has=Xe,A.prototype.set=Qe;function W(t){var e=-1,n=t==null?0:t.length;for(this.clear();++e<n;){var r=t[e];this.set(r[0],r[1])}}function qe(){this.size=0,this.__data__={hash:new H,map:new(Gt||A),string:new H}}function ke(t){var e=st(this,t).delete(t);return this.size-=e?1:0,e}function $e(t){return st(this,t).get(t)}function tn(t){return st(this,t).has(t)}function en(t,e){var n=st(this,t),r=n.size;return n.set(t,e),this.size+=n.size==r?0:1,this}W.prototype.clear=qe,W.prototype.delete=ke,W.prototype.get=$e,W.prototype.has=tn,W.prototype.set=en;function K(t){var e=this.__data__=new A(t);this.size=e.size}function nn(){this.__data__=new A,this.size=0}function rn(t){var e=this.__data__,n=e.delete(t);return this.size=e.size,n}function an(t){return this.__data__.get(t)}function on(t){return this.__data__.has(t)}function sn(t,e){var n=this.__data__;if(n instanceof A){var r=n.__data__;if(!Gt||r.length<b-1)return r.push([t,e]),this.size=++n.size,this;n=this.__data__=new W(r)}return n.set(t,e),this.size=n.size,this}K.prototype.clear=nn,K.prototype.delete=rn,K.prototype.get=an,K.prototype.has=on,K.prototype.set=sn;function un(t,e){var n=yt(t),r=!n&&vt(t),s=!n&&!r&&Zt(t),f=!n&&!r&&!s&&Yt(t),h=n||r||s||f,o=h?Ee(t.length,String):[],g=o.length;for(var O in t)(e||I.call(t,O))&&!(h&&(O=="length"||s&&(O=="offset"||O=="parent")||f&&(O=="buffer"||O=="byteLength"||O=="byteOffset")||Wt(O,g)))&&o.push(O);return o}function ht(t,e,n){(n!==void 0&&!ut(t[e],n)||n===void 0&&!(e in t))&&gt(t,e,n)}function cn(t,e,n){var r=t[e];(!(I.call(t,e)&&ut(r,n))||n===void 0&&!(e in t))&&gt(t,e,n)}function at(t,e){for(var n=t.length;n--;)if(ut(t[n][0],e))return n;return-1}function gt(t,e,n){e=="__proto__"&&it?it(t,e,{configurable:!0,enumerable:!0,value:n,writable:!0}):t[e]=n}var fn=wn();function ot(t){return t==null?t===void 0?U:R:D&&D in Object(t)?On(t):An(t)}function Bt(t){return X(t)&&ot(t)==j}function ln(t){if(!G(t)||En(t))return!1;var e=St(t)?Fe:Oe;return e.test(zn(t))}function dn(t){return X(t)&&Jt(t.length)&&!!d[ot(t)]}function pn(t){if(!G(t))return In(t);var e=Kt(t),n=[];for(var r in t)r=="constructor"&&(e||!I.call(t,r))||n.push(r);return n}function Vt(t,e,n,r,s){t!==e&&fn(e,function(f,h){if(s||(s=new K),G(f))hn(t,e,h,n,Vt,r,s);else{var o=r?r(bt(t,h),f,h+"",t,e,s):void 0;o===void 0&&(o=f),ht(t,h,o)}},Xt)}function hn(t,e,n,r,s,f,h){var o=bt(t,n),g=bt(e,n),O=h.get(g);if(O){ht(t,n,O);return}var w=f?f(o,g,n+"",t,e,h):void 0,Q=w===void 0;if(Q){var Tt=yt(g),wt=!Tt&&Zt(g),qt=!Tt&&!wt&&Yt(g);w=g,Tt||wt||qt?yt(o)?w=o:Fn(o)?w=mn(o):wt?(Q=!1,w=bn(g,!0)):qt?(Q=!1,w=yn(g,!0)):w=[]:Mn(g)||vt(g)?(w=o,vt(o)?w=Rn(o):(!G(o)||St(o))&&(w=xn(g))):Q=!1}Q&&(h.set(g,w),s(w,g,r,f,h),h.delete(g)),ht(t,n,w)}function gn(t,e){return Pn(Nn(t,e,Qt),t+"")}var _n=it?function(t,e){return it(t,"toString",{configurable:!0,enumerable:!1,value:Dn(e),writable:!0})}:Qt;function bn(t,e){if(e)return t.slice();var n=t.length,r=Rt?Rt(n):new t.constructor(n);return t.copy(r),r}function vn(t){var e=new t.constructor(t.byteLength);return new Mt(e).set(new Mt(t)),e}function yn(t,e){var n=e?vn(t.buffer):t.buffer;return new t.constructor(n,t.byteOffset,t.length)}function mn(t,e){var n=-1,r=t.length;for(e||(e=Array(r));++n<r;)e[n]=t[n];return e}function Sn(t,e,n,r){var s=!n;n||(n={});for(var f=-1,h=e.length;++f<h;){var o=e[f],g=r?r(n[o],t[o],o,n,t):void 0;g===void 0&&(g=t[o]),s?gt(n,o,g):cn(n,o,g)}return n}function Tn(t){return gn(function(e,n){var r=-1,s=n.length,f=s>1?n[s-1]:void 0,h=s>2?n[2]:void 0;for(f=t.length>3&&typeof f=="function"?(s--,f):void 0,h&&Cn(n[0],n[1],h)&&(f=s<3?void 0:f,s=1),e=Object(e);++r<s;){var o=n[r];o&&t(e,o,r,f)}return e})}function wn(t){return function(e,n,r){for(var s=-1,f=Object(e),h=r(e),o=h.length;o--;){var g=h[t?o:++s];if(n(f[g],g,f)===!1)break}return e}}function st(t,e){var n=t.__data__;return jn(e)?n[typeof e=="string"?"string":"hash"]:n.map}function _t(t,e){var n=Ae(t,e);return ln(n)?n:void 0}function On(t){var e=I.call(t,D),n=t[D];try{t[D]=void 0;var r=!0}catch{}var s=zt.call(t);return r&&(e?t[D]=n:delete t[D]),s}function xn(t){return typeof t.constructor=="function"&&!Kt(t)?He(Ut(t)):{}}function Wt(t,e){var n=typeof t;return e=e==null?m:e,!!e&&(n=="number"||n!="symbol"&&xe.test(t))&&t>-1&&t%1==0&&t<e}function Cn(t,e,n){if(!G(n))return!1;var r=typeof e;return(r=="number"?mt(n)&&Wt(e,n.length):r=="string"&&e in n)?ut(n[e],t):!1}function jn(t){var e=typeof t;return e=="string"||e=="number"||e=="symbol"||e=="boolean"?t!=="__proto__":t===null}function En(t){return!!Lt&&Lt in t}function Kt(t){var e=t&&t.constructor,n=typeof e=="function"&&e.prototype||et;return t===n}function In(t){var e=[];if(t!=null)for(var n in Object(t))e.push(n);return e}function An(t){return zt.call(t)}function Nn(t,e,n){return e=Ht(e===void 0?t.length-1:e,0),function(){for(var r=arguments,s=-1,f=Ht(r.length-e,0),h=Array(f);++s<f;)h[s]=r[e+s];s=-1;for(var o=Array(e+1);++s<e;)o[s]=r[s];return o[e]=n(h),je(t,this,o)}}function bt(t,e){if(!(e==="constructor"&&typeof t[e]=="function")&&e!="__proto__")return t[e]}var Pn=Ln(_n);function Ln(t){var e=0,n=0;return function(){var r=De(),s=a-(r-n);if(n=r,s>0){if(++e>=u)return arguments[0]}else e=0;return t.apply(void 0,arguments)}}function zn(t){if(t!=null){try{return nt.call(t)}catch{}try{return t+""}catch{}}return""}function ut(t,e){return t===e||t!==t&&e!==e}var vt=Bt(function(){return arguments}())?Bt:function(t){return X(t)&&I.call(t,"callee")&&!Me.call(t,"callee")},yt=Array.isArray;function mt(t){return t!=null&&Jt(t.length)&&!St(t)}function Fn(t){return X(t)&&mt(t)}var Zt=Ue||Hn;function St(t){if(!G(t))return!1;var e=ot(t);return e==P||e==F||e==E||e==p}function Jt(t){return typeof t=="number"&&t>-1&&t%1==0&&t<=m}function G(t){var e=typeof t;return t!=null&&(e=="object"||e=="function")}function X(t){return t!=null&&typeof t=="object"}function Mn(t){if(!X(t)||ot(t)!=T)return!1;var e=Ut(t);if(e===null)return!0;var n=I.call(e,"constructor")&&e.constructor;return typeof n=="function"&&n instanceof n&&nt.call(n)==ze}var Yt=Pt?Ie(Pt):dn;function Rn(t){return Sn(t,Xt(t))}function Xt(t){return mt(t)?un(t,!0):pn(t)}var Un=Tn(function(t,e,n){Vt(t,e,n)});function Dn(t){return function(){return t}}function Qt(t){return t}function Hn(){return!1}i.exports=Un})(ft,ft.exports);var xt=ft.exports,lt={exports:{}},k={};/**
+(function(E,p){typeof exports=="object"&&typeof module!="undefined"?p(exports,require("react"),require("@popperjs/core")):typeof define=="function"&&define.amd?define(["exports","react","@popperjs/core"],p):(E=typeof globalThis!="undefined"?globalThis:E||self,p(E["r-onboarding"]={},E.react,E.core))})(this,function(E,p,ce){"use strict";function fe(a){return a&&typeof a=="object"&&"default"in a?a:{default:a}}var le=fe(p);const zt=p.createContext({});function mt(a){return a?typeof a=="string"?document.querySelector(a):typeof a=="function"?a():null:null}function de(){return{setTargetElementClassName:(y,d)=>{!d||!y||y.classList.add(...d)},unsetTargetElementClassName:(y,d)=>{!d||!y||y.classList.remove(...d)}}}const nt={popper:{},overlay:{enabled:!0,padding:0,borderRadius:0},scrollToStep:{enabled:!0,options:{behavior:"smooth",block:"center",inline:"center"}}};function pe(){var P,B,U,D;const[a,v]=p.useState(""),y=p.useRef(null),d=p.useRef((B=(P=nt.overlay)==null?void 0:P.padding)!=null?B:0),l=p.useRef((D=(U=nt.overlay)==null?void 0:U.borderRadius)!=null?D:0),s=()=>{T(y.current,{padding:d.current,borderRadius:l.current})},T=async(R,m=nt.overlay)=>{var N,H,G,V,W,it,at,st,ut,ct,ft,lt;if(!R)return;const{innerWidth:j,innerHeight:I}=window,{left:L,top:A,width:z,height:S}=R.getBoundingClientRect(),o=typeof m.padding=="number"?{top:m.padding,right:m.padding,bottom:m.padding,left:m.padding}:m.padding,i=typeof m.borderRadius=="number"?{leftTop:m.borderRadius,rightTop:m.borderRadius,rightBottom:m.borderRadius,leftBottom:m.borderRadius}:m.borderRadius,u={top:A-((N=o==null?void 0:o.top)!=null?N:0),right:L+z+((H=o==null?void 0:o.right)!=null?H:0),bottom:A+S+((G=o==null?void 0:o.bottom)!=null?G:0),left:L-((V=o==null?void 0:o.left)!=null?V:0)},x={leftTop:`M${u.left+((W=i==null?void 0:i.leftTop)!=null?W:0)},${u.top} Q${u.left},${u.top} ${u.left},${u.top+((it=i==null?void 0:i.leftTop)!=null?it:0)}`,rightTop:`V${u.top+((at=i==null?void 0:i.rightTop)!=null?at:0)} Q${u.right},${u.top} ${u.right-((st=i==null?void 0:i.rightTop)!=null?st:0)},${u.top}`,rightBottom:`H${u.right-((ut=i==null?void 0:i.rightBottom)!=null?ut:0)} Q${u.right},${u.bottom} ${u.right},${u.bottom-((ct=i==null?void 0:i.rightBottom)!=null?ct:0)}`,leftBottom:`V${u.bottom-((ft=i==null?void 0:i.leftBottom)!=null?ft:0)} Q${u.left},${u.bottom} ${u.left+((lt=i==null?void 0:i.leftBottom)!=null?lt:0)},${u.bottom}`};v(`
+      M${j},${I}
+      H0V0
+      H${j}V${I}
+      Z
+      ${x.leftTop}
+      ${x.leftBottom}
+      ${x.rightBottom}
+      ${x.rightTop}
+      Z
+    `),y.current=R,d.current=o,l.current=i};return p.useEffect(()=>(window.addEventListener("scroll",s),window.addEventListener("resize",s),()=>{window.removeEventListener("scroll",s),window.removeEventListener("resize",s)}),[]),{path:a,updatePath:T}}var rt=typeof globalThis!="undefined"?globalThis:typeof window!="undefined"?window:typeof global!="undefined"?global:typeof self!="undefined"?self:{},Tt={exports:{}};(function(a,v){var y=200,d="__lodash_hash_undefined__",l=800,s=16,T=9007199254740991,P="[object Arguments]",B="[object Array]",U="[object AsyncFunction]",D="[object Boolean]",R="[object Date]",m="[object Error]",j="[object Function]",I="[object GeneratorFunction]",L="[object Map]",A="[object Number]",z="[object Null]",S="[object Object]",o="[object Proxy]",i="[object RegExp]",u="[object Set]",x="[object String]",N="[object Undefined]",H="[object WeakMap]",G="[object ArrayBuffer]",V="[object DataView]",W="[object Float32Array]",it="[object Float64Array]",at="[object Int8Array]",st="[object Int16Array]",ut="[object Int32Array]",ct="[object Uint8Array]",ft="[object Uint8ClampedArray]",lt="[object Uint16Array]",Se="[object Uint32Array]",we=/[\\^$.*+?()[\]{}|]/g,xe=/^\[object .+?Constructor\]$/,Oe=/^(?:0|[1-9]\d*)$/,g={};g[W]=g[it]=g[at]=g[st]=g[ut]=g[ct]=g[ft]=g[lt]=g[Se]=!0,g[P]=g[B]=g[G]=g[D]=g[V]=g[R]=g[m]=g[j]=g[L]=g[A]=g[S]=g[i]=g[u]=g[x]=g[H]=!1;var Ut=typeof rt=="object"&&rt&&rt.Object===Object&&rt,Ce=typeof self=="object"&&self&&self.Object===Object&&self,$=Ut||Ce||Function("return this")(),Dt=v&&!v.nodeType&&v,q=Dt&&!0&&a&&!a.nodeType&&a,Ht=q&&q.exports===Dt,wt=Ht&&Ut.process,Gt=function(){try{var t=q&&q.require&&q.require("util").types;return t||wt&&wt.binding&&wt.binding("util")}catch{}}(),Vt=Gt&&Gt.isTypedArray;function je(t,e,n){switch(n.length){case 0:return t.call(e);case 1:return t.call(e,n[0]);case 2:return t.call(e,n[0],n[1]);case 3:return t.call(e,n[0],n[1],n[2])}return t.apply(e,n)}function Ee(t,e){for(var n=-1,r=Array(t);++n<t;)r[n]=e(n);return r}function Ie(t){return function(e){return t(e)}}function Ae(t,e){return t==null?void 0:t[e]}function Ne(t,e){return function(n){return t(e(n))}}var Pe=Array.prototype,Re=Function.prototype,dt=Object.prototype,xt=$["__core-js_shared__"],pt=Re.toString,F=dt.hasOwnProperty,Wt=function(){var t=/[^.]+$/.exec(xt&&xt.keys&&xt.keys.IE_PROTO||"");return t?"Symbol(src)_1."+t:""}(),Kt=dt.toString,Le=pt.call(Object),ze=RegExp("^"+pt.call(F).replace(we,"\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g,"$1.*?")+"$"),ht=Ht?$.Buffer:void 0,Qt=$.Symbol,Zt=$.Uint8Array,Jt=ht?ht.allocUnsafe:void 0,Yt=Ne(Object.getPrototypeOf,Object),Xt=Object.create,Fe=dt.propertyIsEnumerable,Me=Pe.splice,K=Qt?Qt.toStringTag:void 0,gt=function(){try{var t=jt(Object,"defineProperty");return t({},"",{}),t}catch{}}(),Be=ht?ht.isBuffer:void 0,$t=Math.max,Ue=Date.now,qt=jt($,"Map"),k=jt(Object,"create"),De=function(){function t(){}return function(e){if(!Z(e))return{};if(Xt)return Xt(e);t.prototype=e;var n=new t;return t.prototype=void 0,n}}();function Q(t){var e=-1,n=t==null?0:t.length;for(this.clear();++e<n;){var r=t[e];this.set(r[0],r[1])}}function He(){this.__data__=k?k(null):{},this.size=0}function Ge(t){var e=this.has(t)&&delete this.__data__[t];return this.size-=e?1:0,e}function Ve(t){var e=this.__data__;if(k){var n=e[t];return n===d?void 0:n}return F.call(e,t)?e[t]:void 0}function We(t){var e=this.__data__;return k?e[t]!==void 0:F.call(e,t)}function Ke(t,e){var n=this.__data__;return this.size+=this.has(t)?0:1,n[t]=k&&e===void 0?d:e,this}Q.prototype.clear=He,Q.prototype.delete=Ge,Q.prototype.get=Ve,Q.prototype.has=We,Q.prototype.set=Ke;function M(t){var e=-1,n=t==null?0:t.length;for(this.clear();++e<n;){var r=t[e];this.set(r[0],r[1])}}function Qe(){this.__data__=[],this.size=0}function Ze(t){var e=this.__data__,n=_t(e,t);if(n<0)return!1;var r=e.length-1;return n==r?e.pop():Me.call(e,n,1),--this.size,!0}function Je(t){var e=this.__data__,n=_t(e,t);return n<0?void 0:e[n][1]}function Ye(t){return _t(this.__data__,t)>-1}function Xe(t,e){var n=this.__data__,r=_t(n,t);return r<0?(++this.size,n.push([t,e])):n[r][1]=e,this}M.prototype.clear=Qe,M.prototype.delete=Ze,M.prototype.get=Je,M.prototype.has=Ye,M.prototype.set=Xe;function J(t){var e=-1,n=t==null?0:t.length;for(this.clear();++e<n;){var r=t[e];this.set(r[0],r[1])}}function $e(){this.size=0,this.__data__={hash:new Q,map:new(qt||M),string:new Q}}function qe(t){var e=vt(this,t).delete(t);return this.size-=e?1:0,e}function ke(t){return vt(this,t).get(t)}function tn(t){return vt(this,t).has(t)}function en(t,e){var n=vt(this,t),r=n.size;return n.set(t,e),this.size+=n.size==r?0:1,this}J.prototype.clear=$e,J.prototype.delete=qe,J.prototype.get=ke,J.prototype.has=tn,J.prototype.set=en;function Y(t){var e=this.__data__=new M(t);this.size=e.size}function nn(){this.__data__=new M,this.size=0}function rn(t){var e=this.__data__,n=e.delete(t);return this.size=e.size,n}function on(t){return this.__data__.get(t)}function an(t){return this.__data__.has(t)}function sn(t,e){var n=this.__data__;if(n instanceof M){var r=n.__data__;if(!qt||r.length<y-1)return r.push([t,e]),this.size=++n.size,this;n=this.__data__=new J(r)}return n.set(t,e),this.size=n.size,this}Y.prototype.clear=nn,Y.prototype.delete=rn,Y.prototype.get=on,Y.prototype.has=an,Y.prototype.set=sn;function un(t,e){var n=At(t),r=!n&&It(t),f=!n&&!r&&re(t),h=!n&&!r&&!f&&ie(t),_=n||r||f||h,c=_?Ee(t.length,String):[],b=c.length;for(var C in t)(e||F.call(t,C))&&!(_&&(C=="length"||f&&(C=="offset"||C=="parent")||h&&(C=="buffer"||C=="byteLength"||C=="byteOffset")||ee(C,b)))&&c.push(C);return c}function Ot(t,e,n){(n!==void 0&&!yt(t[e],n)||n===void 0&&!(e in t))&&Ct(t,e,n)}function cn(t,e,n){var r=t[e];(!(F.call(t,e)&&yt(r,n))||n===void 0&&!(e in t))&&Ct(t,e,n)}function _t(t,e){for(var n=t.length;n--;)if(yt(t[n][0],e))return n;return-1}function Ct(t,e,n){e=="__proto__"&&gt?gt(t,e,{configurable:!0,enumerable:!0,value:n,writable:!0}):t[e]=n}var fn=wn();function bt(t){return t==null?t===void 0?N:z:K&&K in Object(t)?xn(t):An(t)}function kt(t){return tt(t)&&bt(t)==P}function ln(t){if(!Z(t)||En(t))return!1;var e=Pt(t)?ze:xe;return e.test(Ln(t))}function dn(t){return tt(t)&&oe(t.length)&&!!g[bt(t)]}function pn(t){if(!Z(t))return In(t);var e=ne(t),n=[];for(var r in t)r=="constructor"&&(e||!F.call(t,r))||n.push(r);return n}function te(t,e,n,r,f){t!==e&&fn(e,function(h,_){if(f||(f=new Y),Z(h))hn(t,e,_,n,te,r,f);else{var c=r?r(Et(t,_),h,_+"",t,e,f):void 0;c===void 0&&(c=h),Ot(t,_,c)}},ae)}function hn(t,e,n,r,f,h,_){var c=Et(t,n),b=Et(e,n),C=_.get(b);if(C){Ot(t,n,C);return}var O=h?h(c,b,n+"",t,e,_):void 0,et=O===void 0;if(et){var Rt=At(b),Lt=!Rt&&re(b),ue=!Rt&&!Lt&&ie(b);O=b,Rt||Lt||ue?At(c)?O=c:zn(c)?O=mn(c):Lt?(et=!1,O=bn(b,!0)):ue?(et=!1,O=yn(b,!0)):O=[]:Fn(b)||It(b)?(O=c,It(c)?O=Mn(c):(!Z(c)||Pt(c))&&(O=On(b))):et=!1}et&&(_.set(b,O),f(O,b,r,h,_),_.delete(b)),Ot(t,n,O)}function gn(t,e){return Pn(Nn(t,e,se),t+"")}var _n=gt?function(t,e){return gt(t,"toString",{configurable:!0,enumerable:!1,value:Un(e),writable:!0})}:se;function bn(t,e){if(e)return t.slice();var n=t.length,r=Jt?Jt(n):new t.constructor(n);return t.copy(r),r}function vn(t){var e=new t.constructor(t.byteLength);return new Zt(e).set(new Zt(t)),e}function yn(t,e){var n=e?vn(t.buffer):t.buffer;return new t.constructor(n,t.byteOffset,t.length)}function mn(t,e){var n=-1,r=t.length;for(e||(e=Array(r));++n<r;)e[n]=t[n];return e}function Tn(t,e,n,r){var f=!n;n||(n={});for(var h=-1,_=e.length;++h<_;){var c=e[h],b=r?r(n[c],t[c],c,n,t):void 0;b===void 0&&(b=t[c]),f?Ct(n,c,b):cn(n,c,b)}return n}function Sn(t){return gn(function(e,n){var r=-1,f=n.length,h=f>1?n[f-1]:void 0,_=f>2?n[2]:void 0;for(h=t.length>3&&typeof h=="function"?(f--,h):void 0,_&&Cn(n[0],n[1],_)&&(h=f<3?void 0:h,f=1),e=Object(e);++r<f;){var c=n[r];c&&t(e,c,r,h)}return e})}function wn(t){return function(e,n,r){for(var f=-1,h=Object(e),_=r(e),c=_.length;c--;){var b=_[t?c:++f];if(n(h[b],b,h)===!1)break}return e}}function vt(t,e){var n=t.__data__;return jn(e)?n[typeof e=="string"?"string":"hash"]:n.map}function jt(t,e){var n=Ae(t,e);return ln(n)?n:void 0}function xn(t){var e=F.call(t,K),n=t[K];try{t[K]=void 0;var r=!0}catch{}var f=Kt.call(t);return r&&(e?t[K]=n:delete t[K]),f}function On(t){return typeof t.constructor=="function"&&!ne(t)?De(Yt(t)):{}}function ee(t,e){var n=typeof t;return e=e==null?T:e,!!e&&(n=="number"||n!="symbol"&&Oe.test(t))&&t>-1&&t%1==0&&t<e}function Cn(t,e,n){if(!Z(n))return!1;var r=typeof e;return(r=="number"?Nt(n)&&ee(e,n.length):r=="string"&&e in n)?yt(n[e],t):!1}function jn(t){var e=typeof t;return e=="string"||e=="number"||e=="symbol"||e=="boolean"?t!=="__proto__":t===null}function En(t){return!!Wt&&Wt in t}function ne(t){var e=t&&t.constructor,n=typeof e=="function"&&e.prototype||dt;return t===n}function In(t){var e=[];if(t!=null)for(var n in Object(t))e.push(n);return e}function An(t){return Kt.call(t)}function Nn(t,e,n){return e=$t(e===void 0?t.length-1:e,0),function(){for(var r=arguments,f=-1,h=$t(r.length-e,0),_=Array(h);++f<h;)_[f]=r[e+f];f=-1;for(var c=Array(e+1);++f<e;)c[f]=r[f];return c[e]=n(_),je(t,this,c)}}function Et(t,e){if(!(e==="constructor"&&typeof t[e]=="function")&&e!="__proto__")return t[e]}var Pn=Rn(_n);function Rn(t){var e=0,n=0;return function(){var r=Ue(),f=s-(r-n);if(n=r,f>0){if(++e>=l)return arguments[0]}else e=0;return t.apply(void 0,arguments)}}function Ln(t){if(t!=null){try{return pt.call(t)}catch{}try{return t+""}catch{}}return""}function yt(t,e){return t===e||t!==t&&e!==e}var It=kt(function(){return arguments}())?kt:function(t){return tt(t)&&F.call(t,"callee")&&!Fe.call(t,"callee")},At=Array.isArray;function Nt(t){return t!=null&&oe(t.length)&&!Pt(t)}function zn(t){return tt(t)&&Nt(t)}var re=Be||Dn;function Pt(t){if(!Z(t))return!1;var e=bt(t);return e==j||e==I||e==U||e==o}function oe(t){return typeof t=="number"&&t>-1&&t%1==0&&t<=T}function Z(t){var e=typeof t;return t!=null&&(e=="object"||e=="function")}function tt(t){return t!=null&&typeof t=="object"}function Fn(t){if(!tt(t)||bt(t)!=S)return!1;var e=Yt(t);if(e===null)return!0;var n=F.call(e,"constructor")&&e.constructor;return typeof n=="function"&&n instanceof n&&pt.call(n)==Le}var ie=Vt?Ie(Vt):dn;function Mn(t){return Tn(t,ae(t))}function ae(t){return Nt(t)?un(t,!0):pn(t)}var Bn=Sn(function(t,e,n){te(t,e,n)});function Un(t){return function(){return t}}function se(t){return t}function Dn(){return!1}a.exports=Bn})(Tt,Tt.exports);var Ft=Tt.exports,St={exports:{}},ot={};/**
  * @license React
@@ -9,2 +19,2 @@ * react-jsx-runtime.production.min.js
  * LICENSE file in the root directory of this source tree.
- */var re=te.default,ie=Symbol.for("react.element"),ae=Symbol.for("react.fragment"),oe=Object.prototype.hasOwnProperty,se=re.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,ue={key:!0,ref:!0,__self:!0,__source:!0};function Ct(i,_,b){var c,u={},a=null,m=null;b!==void 0&&(a=""+b),_.key!==void 0&&(a=""+_.key),_.ref!==void 0&&(m=_.ref);for(c in _)oe.call(_,c)&&!ue.hasOwnProperty(c)&&(u[c]=_[c]);if(i&&i.defaultProps)for(c in _=i.defaultProps,_)u[c]===void 0&&(u[c]=_[c]);return{$$typeof:ie,type:i,key:a,ref:m,props:u,_owner:se.current}}k.Fragment=ae,k.jsx=Ct,k.jsxs=Ct,lt.exports=k;const S=lt.exports.jsx,$=lt.exports.jsxs;function jt({children:i}){var F,V,M,R;const{path:_,updatePath:b}=ne(),[c,u]=l.useState(!1),a=l.useContext(Ot),m=l.useRef(null),{setTargetElementClassName:j,unsetTargetElementClassName:N}=ee();l.useEffect(()=>(z(),()=>{P()}),[]),l.useLayoutEffect(()=>{!c||B()},[c]);const E=()=>{P(),a.nextStep()},L=()=>{P(),a.previousStep()},z=async()=>{var p,y,v,C,U;await((v=(y=(p=a.step)==null?void 0:p.on)==null?void 0:y.beforeStep)==null?void 0:v.call(y)),!(!ct((U=(C=a.step)==null?void 0:C.attachTo)==null?void 0:U.element)||!m.current)&&u(!0)},B=()=>{var y,v,C,U,tt;const T=ct((v=(y=a.step)==null?void 0:y.attachTo)==null?void 0:v.element);if(!T||!m.current)return;const p=xt({},a.options,(C=a.step)==null?void 0:C.options);kt.createPopper(T,m.current,p.popper),(U=p==null?void 0:p.scrollToStep)!=null&&U.enabled&&T.scrollIntoView((tt=p==null?void 0:p.scrollToStep)==null?void 0:tt.options),p!=null&&p.disableOverlay||b(T),j(T)},P=()=>{var T,p,y,v,C;(y=(p=(T=a.step)==null?void 0:T.on)==null?void 0:p.afterStep)==null||y.call(p),N(ct((v=a==null?void 0:a.step)==null?void 0:v.attachTo.element),(C=a==null?void 0:a.step)==null?void 0:C.attachTo.classList)};return $("div",{className:c?"":"hidden",children:[S("svg",{style:{width:"100%",height:"100%",position:"fixed",top:0,left:0,opacity:"0.5",zIndex:"var(--r-onboarding-overlay-z, 10)",pointerEvents:"none"},children:S("path",{d:_})}),S("div",{style:{position:"relative",zIndex:"var(--r-onboarding-step-z, 20)"},children:S("div",{ref:m,children:a.step?i||$("div",{className:"r-onboarding-item",children:[$("div",{className:"r-onboarding-item__header",children:[((V=(F=a==null?void 0:a.step)==null?void 0:F.content)==null?void 0:V.title)&&S("span",{className:"r-onboarding-item__header-title",children:a.step.content.title}),S("button",{onClick:()=>a.exit(),className:"r-onboarding-item__header-close",children:S("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-4 w-4",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:S("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"2",d:"M6 18L18 6M6 6l12 12"})})})]}),((R=(M=a==null?void 0:a.step)==null?void 0:M.content)==null?void 0:R.description)&&S("p",{className:"r-onboarding-item__description",children:a.step.content.description}),$("div",{className:"r-onboarding-item__actions",children:[!a.isFirstStep&&S("button",{type:"button",onClick:L,className:"r-onboarding-btn-secondary",children:"Previous"}),S("button",{onClick:E,type:"button",className:"r-onboarding-btn-primary",children:a.isLastStep?"Finish":"Next"})]})]}):null})})]})}const ce={popper:{},disableOverlay:!1,scrollToStep:{enabled:!0,options:{behavior:"smooth",block:"center",inline:"center"}}},fe=l.forwardRef(({steps:i,options:_,children:b},c)=>{l.useImperativeHandle(c,()=>({start:T,finish:p,goToStep:y}));const[u,a]=l.useState(-1),[m,j]=l.useState(null),[N,E]=l.useState(!1),[L,z]=l.useState({}),[B,P]=l.useState(!1),[F,V]=l.useState(!1);l.useEffect(()=>{E(u>=i.length||u<0),P(u===0),V(u===i.length-1)},[u]);const M=()=>{const v=u-1;y(v)},R=()=>{const v=u+1;y(v)},T=()=>{y(0)},p=()=>{y(-1)},y=v=>{a(v),j(i==null?void 0:i[v])};return l.useEffect(()=>{z(xt({},ce,_))},[]),N?null:S(Ot.Provider,{value:{options:L,step:m,nextStep:R,previousStep:M,exit:p,isFirstStep:B,isLastStep:F,index:u},children:b?S(l.Fragment,{children:b({step:m,next:R,previous:M,exit:p,isFirst:B,isLast:F,index:u})},u):S(jt,{},u)})});function le(i){return{start:()=>{var u;return(u=i==null?void 0:i.current)==null?void 0:u.start()},finish:()=>{var u;return(u=i==null?void 0:i.current)==null?void 0:u.finish()},goToStep:u=>{var a;return(a=i==null?void 0:i.current)==null?void 0:a.goToStep(u)}}}var Gn="";x.ROnboardingStep=jt,x.ROnboardingWrapper=fe,x.useROnboarding=le,Object.defineProperties(x,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+ */var he=le.default,ge=Symbol.for("react.element"),_e=Symbol.for("react.fragment"),be=Object.prototype.hasOwnProperty,ve=he.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,ye={key:!0,ref:!0,__self:!0,__source:!0};function Mt(a,v,y){var d,l={},s=null,T=null;y!==void 0&&(s=""+y),v.key!==void 0&&(s=""+v.key),v.ref!==void 0&&(T=v.ref);for(d in v)be.call(v,d)&&!ye.hasOwnProperty(d)&&(l[d]=v[d]);if(a&&a.defaultProps)for(d in v=a.defaultProps,v)l[d]===void 0&&(l[d]=v[d]);return{$$typeof:ge,type:a,key:s,ref:T,props:l,_owner:ve.current}}ot.Fragment=_e,ot.jsx=Mt,ot.jsxs=Mt,St.exports=ot;const w=St.exports.jsx,X=St.exports.jsxs;function Bt({children:a}){var I,L,A,z;const{path:v,updatePath:y}=pe(),[d,l]=p.useState(!1),s=p.useContext(zt),T=p.useRef(null),{setTargetElementClassName:P,unsetTargetElementClassName:B}=de();p.useEffect(()=>(R(),()=>{j()}),[]),p.useLayoutEffect(()=>{!d||m()},[d]);const U=()=>{j(),s.nextStep()},D=()=>{j(),s.previousStep()},R=async()=>{var o,i,u,x,N;await((u=(i=(o=s.step)==null?void 0:o.on)==null?void 0:i.beforeStep)==null?void 0:u.call(i)),!(!mt((N=(x=s.step)==null?void 0:x.attachTo)==null?void 0:N.element)||!T.current)&&l(!0)},m=()=>{var i,u,x,N,H,G,V,W;const S=mt((u=(i=s.step)==null?void 0:i.attachTo)==null?void 0:u.element);if(!S||!T.current)return;const o=Ft({},s.options,(x=s.step)==null?void 0:x.options);ce.createPopper(S,T.current,o.popper),(N=o==null?void 0:o.scrollToStep)!=null&&N.enabled&&S.scrollIntoView((H=o==null?void 0:o.scrollToStep)==null?void 0:H.options),(G=o==null?void 0:o.overlay)!=null&&G.enabled&&y(S,{padding:(V=o==null?void 0:o.overlay)==null?void 0:V.padding,borderRadius:(W=o==null?void 0:o.overlay)==null?void 0:W.borderRadius}),P(S)},j=()=>{var S,o,i,u,x;(i=(o=(S=s.step)==null?void 0:S.on)==null?void 0:o.afterStep)==null||i.call(o),B(mt((u=s==null?void 0:s.step)==null?void 0:u.attachTo.element),(x=s==null?void 0:s.step)==null?void 0:x.attachTo.classList)};return X("div",{className:d?"":"hidden",children:[w("svg",{style:{width:"100%",height:"100%",position:"fixed",top:0,left:0,opacity:"0.5",zIndex:"var(--r-onboarding-overlay-z, 10)",pointerEvents:"none"},children:w("path",{d:v})}),w("div",{style:{position:"relative",zIndex:"var(--r-onboarding-step-z, 20)"},children:X("div",{ref:T,children:[s.step?a||X("div",{className:"r-onboarding-item",children:[X("div",{className:"r-onboarding-item__header",children:[((L=(I=s==null?void 0:s.step)==null?void 0:I.content)==null?void 0:L.title)&&w("span",{className:"r-onboarding-item__header-title",children:s.step.content.title}),w("button",{onClick:()=>s.exit(),className:"r-onboarding-item__header-close",children:w("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-4 w-4",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:w("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:"2",d:"M6 18L18 6M6 6l12 12"})})})]}),((z=(A=s==null?void 0:s.step)==null?void 0:A.content)==null?void 0:z.description)&&w("p",{className:"r-onboarding-item__description",children:s.step.content.description}),X("div",{className:"r-onboarding-item__actions",children:[!s.isFirstStep&&w("button",{type:"button",onClick:D,className:"r-onboarding-btn-secondary",children:"Previous"}),w("button",{onClick:U,type:"button",className:"r-onboarding-btn-primary",children:s.isLastStep?"Finish":"Next"})]})]}):null,w("div",{"data-popper-arrow":!0})]})})]})}const me=p.forwardRef(({steps:a,options:v,children:y},d)=>{p.useImperativeHandle(d,()=>({start:S,finish:o,goToStep:i}));const[l,s]=p.useState(-1),[T,P]=p.useState(null),[B,U]=p.useState(!1),[D,R]=p.useState({}),[m,j]=p.useState(!1),[I,L]=p.useState(!1);p.useEffect(()=>{U(l>=a.length||l<0),j(l===0),L(l===a.length-1)},[l]);const A=()=>{const u=l-1;i(u)},z=()=>{const u=l+1;i(u)},S=()=>{i(0)},o=()=>{i(-1)},i=u=>{s(u),P(a==null?void 0:a[u])};return p.useEffect(()=>{R(Ft({},nt,v))},[]),B?null:w("div",{"data-r-onboarding-wrapper":!0,children:w(zt.Provider,{value:{options:D,step:T,nextStep:z,previousStep:A,exit:o,isFirstStep:m,isLastStep:I,index:l},children:y?w(p.Fragment,{children:y({step:T,next:z,previous:A,exit:o,isFirst:m,isLast:I,index:l})},l):w(Bt,{},l)})})});function Te(a){return{start:()=>{var l;return(l=a==null?void 0:a.current)==null?void 0:l.start()},finish:()=>{var l;return(l=a==null?void 0:a.current)==null?void 0:l.finish()},goToStep:l=>{var s;return(s=a==null?void 0:a.current)==null?void 0:s.goToStep(l)}}}var Hn="";E.ROnboardingStep=Bt,E.ROnboardingWrapper=me,E.useROnboarding=Te,Object.defineProperties(E,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});

package.json

 {
   "name": "r-onboarding",
-  "version": "1.0.1",
+  "version": "2.0.0",
   "description": "r-onboarding is a super-slim, fully-typed onboarding component for React",
@@ -47,3 +47,5 @@ "repository": {
     "semantic-release": "semantic-release --branches main",
-    "commit": "git-cz"
+    "commit": "git-cz",
+    "test": "vitest",
+    "coverage": "vitest run --coverage"
   },
@@ -54,9 +56,13 @@ "dependencies": {
   "devDependencies": {
+    "@testing-library/react": "^13.3.0",
     "@types/lodash.merge": "^4.6.6",
     "@types/node": "^17.0.23",
-    "@types/react": "^17.0.33",
-    "@types/react-dom": "^17.0.10",
+    "@types/react": "^18.0.15",
+    "@types/react-dom": "^18.0.6",
     "@vitejs/plugin-react": "^1.0.7",
+    "@vitest/ui": "^0.20.2",
     "autoprefixer": "^10.4.4",
+    "c8": "^7.12.0",
     "cz-conventional-changelog": "3.3.0",
+    "happy-dom": "^6.0.4",
     "lodash.merge": "^4.6.2",
@@ -70,3 +76,4 @@ "postcss": "^8.4.12",
     "typescript": "^4.5.4",
-    "vite": "^2.9.0"
+    "vite": "^2.9.0",
+    "vitest": "^0.20.1"
   },
@@ -73,0 +80,0 @@ "peerDependencies": {

src/types/ROnboardingWrapper.ts

 import type { createPopper } from "@popperjs/core/lib/createPopper";
 import { StepEntity } from "./StepEntity";
 
+export interface SvgOverlayOptions {
+  enabled?: boolean
+  padding?: number | {
+    top?: number;
+    right?: number;
+    bottom?: number;
+    left?: number;
+  }
+  borderRadius?: number | {
+    leftTop?: number;
+    rightTop?: number;
+    rightBottom?: number;
+    leftBottom?: number;
+  }
+}
+
 export interface ROnboardingWrapperOptions {
   popper?: Parameters<typeof createPopper>[2]
-  disableOverlay?: boolean
+  overlay?: SvgOverlayOptions,
   scrollToStep?: {
@@ -15,3 +31,7 @@ enabled?: boolean
   popper: {},
-  disableOverlay: false,
+  overlay: {
+    enabled: true,
+    padding: 0,
+    borderRadius: 0,
+  },
   scrollToStep: {
@@ -18,0 +38,0 @@ enabled: true,

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

63732

increased by10.37%

Lines of code

1240

increased by8.01%

Worsened metrics

Dev dependency count

21

increased by31.25%

No dependency changes