onboard-engine 1.2.2 → 1.4.1

package/README.md

@@ -24,12 +24,16 @@ npm install onboard-engine
 yarn add onboard-engine
 # or
 pnpm add onboard-engine
+# or
+bun add onboard-engine
 ```
 
 ## Getting Started
 
 ### 1. Import Styles
 
+> **Important:** You must import the CSS for the overlay and tooltip to render correctly.
+
 Import the necessary CSS in your global stylesheet or root component (e.g., `_app.tsx` or `layout.tsx`).
 
 ```tsx
@@ -46,8 +50,9 @@ import { OnboardingConfig } from 'onboard-engine';
 const onboardingConfig: OnboardingConfig = {
   metadata: {
     name: 'user-onboarding',
-    draggable: true, // Allow users to drag the tooltip
-    inOrder: true, // Default true. If false, steps can be activated out of order based on URL match.
+    draggable: true,
+    inOrder: true,
+    simulateClicksOnNavigate: true, // Re-activates parent clicks (like opening a modal) on page refresh
   },
   steps: [
     {
@@ -55,13 +60,15 @@ const onboardingConfig: OnboardingConfig = {
       description: 'Let us show you around the dashboard.',
       attribute: 'welcome-header',
       urlMatch: '/',
+      navigate: '/home',
     },
     {
       title: 'Create Project',
       description: 'Click here to start a new project.',
       attribute: 'create-btn',
-      navigate: '/dashboard', // Navigate to this page when clicking next
-      urlMatch: '/home', // This step is active when on /home
+      navigate: '/dashboard',
+      urlMatch: '/home',
+      click: true, // Clicks the button automatically when moving to the next step
       subSteps: [
         {
           title: 'Project Name',
@@ -73,7 +80,7 @@ const onboardingConfig: OnboardingConfig = {
   ],
   onOnboardingComplete: () => {
     console.log('Onboarding finished!');
-  }
+  },
 };
 ```
 
@@ -86,7 +93,10 @@ import { OnboardingProvider } from 'onboard-engine';
 
 export default function App({ children }) {
   return (
-    <OnboardingProvider config={onboardingConfig}>
+    <OnboardingProvider
+      config={onboardingConfig}
+      onNavigate={(url) => console.log('Navigating to', url)}
+    >
       {children}
     </OnboardingProvider>
   );
@@ -103,83 +113,37 @@ Add the `data-onboarding-id` attribute to the elements you want to highlight. Th
 <input data-onboarding-id="project-name-input" type="text" />
 ```
 
-## Advanced Configuration
-
-### Custom Styling
-
-You can customize the appearance of the overlay and tooltip through the `style` property in the config. This accepts standard React CSS properties for each element.
-
-```tsx
-const config: OnboardingConfig = {
-  // ...
-  style: {
-    // The mask overlaying the page
-    background: { backgroundColor: 'rgba(0, 0, 0, 0.85)' },
-    
-    // The main tooltip container
-    container: { 
-      borderRadius: '16px', 
-      boxShadow: '0 10px 15px -3px rgba(0, 0, 0, 0.1)' 
-    },
-    
-    // Buttons
-    next: { backgroundColor: '#4F46E5', color: 'white' },
-    prev: { color: '#6B7280' },
-    finish: { backgroundColor: '#10B981' },
-    start: { backgroundColor: '#4F46E5' }, // Used for the "Next" button on the first step
-
-    // Layout
-    padding: 10, // Add 10px padding around the highlighted element
-  },
-  // ...
-};
-```
-
 ## API Reference
 
-### `OnboardingConfig`
+### `OnboardingProvider` Props
 
-| Property | Type | Description |
-| :--- | :--- | :--- |
-| `metadata` | `OnboardingMetadata` | General settings for the onboarding instance. |
-| `steps` | `OnboardingStep[]` | Array of steps defining the flow. |
-| `style` | `OnboardingStyle` | Optional. Visual styling configuration. |
-| `onOnboardingComplete` | `() => void` | Optional. Callback fired when onboarding finishes. |
+| Property     | Type                    | Description                                                                         |
+| :----------- | :---------------------- | :---------------------------------------------------------------------------------- |
+| `config`     | `OnboardingConfig`      | **Required**. The configuration object for the onboarding flow.                     |
+| `ssr`        | `boolean`               | Optional. Set to `true` if using Server-Side Rendering.                             |
+| `onNavigate` | `(url: string) => void` | Optional. Custom navigation handler (e.g. for `next/navigation` or `react-router`). |
 
 ### `OnboardingMetadata`
 
-| Property | Type | Default | Description |
-| :--- | :--- | :--- | :--- |
-| `name` | `string` | **Required** | Unique name for the onboarding flow. |
-| `nextRouter` | `boolean` | `false` | Enable if using Next.js router. |
-| `draggable` | `boolean` | `false` | Allow the tooltip to be dragged. |
-| `inOrder` | `boolean` | `true` | If `true`, strict step order is enforced. If `false`, matching `urlMatch` activates the step. |
+| Property                   | Type      | Default  | Description                                                                                   |
+| :------------------------- | :-------- | :------- | :-------------------------------------------------------------------------------------------- |
+| `name`                     | `string`  | Required | Unique name for the onboarding flow.                                                          |
+| `nextRouter`               | `boolean` | `false`  | Enable if using Next.js router.                                                               |
+| `draggable`                | `boolean` | `false`  | Allow the tooltip to be dragged.                                                              |
+| `inOrder`                  | `boolean` | `true`   | If `true`, strict step order is enforced. If `false`, matching `urlMatch` activates the step. |
+| `simulateClicksOnNavigate` | `boolean` | `false`  | If `true`, re-triggers the parent step's `click` when resuming in a sub-step after a refresh. |
 
 ### `OnboardingStep`
 
-| Property | Type | Description |
-| :--- | :--- | :--- |
-| `title` | `string` | Title displayed in the tooltip. |
-| `description` | `string` | Description text in the tooltip. |
-| `attribute` | `string` | The `data-onboarding-id` value to target. |
-| `urlMatch` | `string` \| `RegExp` | **Required**. Checks if current URL matches to active this step. Supports `*` wildcards in strings (e.g., `"/user/*"`). <br/>**Note:** `RegExp` objects cannot be passed from Server Components in Next.js. Use string wildcards or define config in a Client Component. |
-| `navigate` | `string` | URL to navigate to when this step is completed (next button clicked). |
-| `click` | `boolean` | If `true`, clicks the element when the step activates. |
-| `subSteps` | `OnboardingSubStep[]` | Nested steps for complex workflows. |
-
-### `OnboardingStyle`
-
-All properties (except `padding`) accept `React.CSSProperties` objects.
-
-| Property | Type | Description |
-| :--- | :--- | :--- |
-| `background` | `CSSProperties` | Styles for the overlay mask. |
-| `container` | `CSSProperties` | Styles for the tooltip box. |
-| `next` | `CSSProperties` | Styles for the "Next" button. |
-| `prev` | `CSSProperties` | Styles for the "Prev" button. |
-| `finish` | `CSSProperties` | Styles for the "Finish" button. |
-| `start` | `CSSProperties` | Styles for the "Start" button (Step 1 "Next" button). |
-| `padding` | `number` | Padding (in px) around the highlighted element. |
+| Property      | Type                  | Description                                                                                                                                                                                                                                                              |
+| :------------ | :-------------------- | :----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `title`       | `string`              | Title displayed in the tooltip.                                                                                                                                                                                                                                          |
+| `description` | `string`              | Description text in the tooltip.                                                                                                                                                                                                                                         |
+| `attribute`   | `string`              | The `data-onboarding-id` value to target.                                                                                                                                                                                                                                |
+| `urlMatch`    | `string` \| `RegExp`  | **Required**. Checks if current URL matches to active this step. Supports `*` wildcards in strings (e.g., `"/user/*"`). <br/>**Note:** `RegExp` objects cannot be passed from Server Components in Next.js. Use string wildcards or define config in a Client Component. |
+| `navigate`    | `string`              | URL to navigate to when this step is completed (next button clicked).                                                                                                                                                                                                    |
+| `click`       | `boolean`             | If `true`, clicks the element when the step activates.                                                                                                                                                                                                                   |
+| `subSteps`    | `OnboardingSubStep[]` | Nested steps for complex workflows.                                                                                                                                                                                                                                      |
 
 ## Hooks
 
@@ -191,26 +155,19 @@ Access the onboarding state and controls from any component within the provider.
 import { useOnboarding } from 'onboard-engine';
 
 const MyComponent = () => {
-  const { 
-    // Actions
-    nextStep,   // Go to the next step
-    prevStep,   // Go to the previous step
-    finish,     // End the onboarding flow
-    goToStep,   // Jump to a specific step (index, subStepIndex?)
-
-    // State
-    state,      // The full internal state object
-    currentStep,// The current OnboardingStep or OnboardingSubStep object
-    isFirstStep,// Boolean: true if on the first step
-    isLastStep, // Boolean: true if on the last step
-    
-    // Configuration
-    config      // The full configuration object
+  const {
+    nextStep,
+    prevStep,
+    finish,
+    goToStep,
+    state,
+    currentStep,
+    isFirstStep,
+    isLastStep,
+    config,
   } = useOnboarding();
 
-  return (
-    <button onClick={nextStep}>Next</button>
-  );
+  return <button onClick={nextStep}>Next</button>;
 };
 ```
 

package/dist/index.css

@@ -1,2 +1,2 @@
-.onboard-overlay-mask{position:absolute;background-color:#000000b3;pointer-events:auto;transition:all .3s cubic-bezier(.25,.1,.25,1)}.onboard-tooltip{position:absolute;width:300px;background-color:#fff;border-radius:12px;box-shadow:0 25px 50px -12px #00000040;pointer-events:auto;padding:20px;border:1px solid #f3f4f6;z-index:10000;transition:top .3s cubic-bezier(.25,.1,.25,1),left .3s cubic-bezier(.25,.1,.25,1)}.onboard-button-primary{background-color:#000;color:#fff;padding:8px 16px;border-radius:8px;font-weight:600;font-size:14px;transition:all .2s;display:flex;align-items:center;gap:4px}.onboard-button-primary:hover{background-color:#1f2937}.onboard-button-primary:active{transform:scale(.95)}.onboard-button-ghost{color:#4b5563;font-weight:500;font-size:14px;transition:color .2s;display:flex;align-items:center;gap:4px}.onboard-button-ghost:hover{color:#111827}.onboard-button-ghost:disabled{color:#d1d5db;cursor:not-allowed}
+.onboard-overlay-container{position:fixed;inset:0;z-index:999999;pointer-events:none}.onboard-overlay-mask{position:absolute;background-color:#000000b3;pointer-events:auto;transition:all .3s cubic-bezier(.25,.1,.25,1)}.onboard-mask-top{top:0;left:0;width:100%}.onboard-mask-bottom{left:0;width:100%}.onboard-mask-left{left:0}.onboard-tooltip{position:absolute;width:300px;background-color:#fff;border-radius:12px;box-shadow:0 25px 50px -12px #00000040;pointer-events:auto;padding:20px;border:1px solid #f3f4f6;z-index:10000;transition:top .3s cubic-bezier(.25,.1,.25,1),left .3s cubic-bezier(.25,.1,.25,1)}.onboard-tooltip-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:8px}.onboard-tooltip-title{margin:0;font-weight:700;color:#111827;font-size:18px;line-height:1.2}.onboard-close-button{background:none;border:none;cursor:pointer;padding:4px;color:#9ca3af;display:flex;align-items:center;justify-content:center}.onboard-close-button:hover{color:#6b7280}.onboard-tooltip-description{margin:0 0 24px;color:#4b5563;font-size:14px;line-height:1.5}.onboard-tooltip-footer{display:flex;align-items:center;justify-content:space-between}.onboard-button-primary{background-color:#000;color:#fff;padding:8px 16px;border-radius:8px;font-weight:600;font-size:14px;transition:all .2s;display:flex;align-items:center;gap:4px}.onboard-button-primary:hover{background-color:#1f2937}.onboard-button-primary:active{transform:scale(.95)}.onboard-button-ghost{color:#4b5563;font-weight:500;font-size:14px;transition:color .2s;display:flex;align-items:center;gap:4px}.onboard-button-ghost:hover{color:#111827}.onboard-button-ghost:disabled{color:#d1d5db;cursor:not-allowed}
 /*# sourceMappingURL=index.css.map */

package/dist/index.css.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/styles.css"],"sourcesContent":[".onboard-overlay-mask {\n  position: absolute;\n  background-color: rgba(0, 0, 0, 0.7);\n  pointer-events: auto;\n  transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);\n}\n\n.onboard-tooltip {\n  position: absolute;\n  width: 300px;\n  background-color: white;\n  border-radius: 12px;\n  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);\n  pointer-events: auto;\n  padding: 20px;\n  border: 1px solid #f3f4f6;\n  z-index: 10000;\n  transition: top 0.3s cubic-bezier(0.25, 0.1, 0.25, 1), left 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);\n}\n\n.onboard-button-primary {\n  background-color: black;\n  color: white;\n  padding: 8px 16px;\n  border-radius: 8px;\n  font-weight: 600;\n  font-size: 14px;\n  transition: all 0.2s;\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.onboard-button-primary:hover {\n  background-color: #1f2937;\n}\n\n.onboard-button-primary:active {\n  transform: scale(0.95);\n}\n\n.onboard-button-ghost {\n  color: #4b5563;\n  font-weight: 500;\n  font-size: 14px;\n  transition: color 0.2s;\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.onboard-button-ghost:hover {\n  color: #111827;\n}\n\n.onboard-button-ghost:disabled {\n  color: #d1d5db;\n  cursor: not-allowed;\n}\n"],"mappings":"AAAA,CAAC,qBACC,SAAU,SACV,iBAAkB,UAClB,eAAgB,KAChB,WAAY,IAAI,IAAK,aAAa,GAAI,CAAE,EAAG,CAAE,GAAI,CAAE,EACrD,CAEA,CAAC,gBACC,SAAU,SACV,MAAO,MACP,iBAAkB,KAVpB,cAWiB,KACf,WAAY,EAAE,KAAK,KAAK,MAAM,UAC9B,eAAgB,KAblB,QAcW,KACT,OAAQ,IAAI,MAAM,QAClB,QAAS,MACT,WAAY,IAAI,IAAK,aAAa,GAAI,CAAE,EAAG,CAAE,GAAI,CAAE,EAAE,CAAE,KAAK,IAAK,aAAa,GAAI,CAAE,EAAG,CAAE,GAAI,CAAE,EACjG,CAEA,CAAC,uBACC,iBAAkB,KAClB,MAAO,KAtBT,QAuBW,IAAI,KAvBf,cAwBiB,IACf,YAAa,IACb,UAAW,KACX,WAAY,IAAI,IAChB,QAAS,KACT,YAAa,OACb,IAAK,GACP,CAEA,CAbC,sBAasB,OACrB,iBAAkB,OACpB,CAEA,CAjBC,sBAiBsB,QACrB,UAAW,MAAM,IACnB,CAEA,CAAC,qBACC,MAAO,QACP,YAAa,IACb,UAAW,KACX,WAAY,MAAM,IAClB,QAAS,KACT,YAAa,OACb,IAAK,GACP,CAEA,CAVC,oBAUoB,OACnB,MAAO,OACT,CAEA,CAdC,oBAcoB,UACnB,MAAO,QACP,OAAQ,WACV","names":[]}
+{"version":3,"sources":["../src/styles.css"],"sourcesContent":[".onboard-overlay-container {\n  position: fixed;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: 999999;\n  pointer-events: none;\n}\n\n.onboard-overlay-mask {\n  position: absolute;\n  background-color: rgba(0, 0, 0, 0.7);\n  pointer-events: auto;\n  transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);\n}\n\n.onboard-mask-top {\n  top: 0;\n  left: 0;\n  width: 100%;\n}\n\n.onboard-mask-bottom {\n  left: 0;\n  width: 100%;\n}\n\n.onboard-mask-left {\n  left: 0;\n}\n\n.onboard-tooltip {\n  position: absolute;\n  width: 300px;\n  background-color: white;\n  border-radius: 12px;\n  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);\n  pointer-events: auto;\n  padding: 20px;\n  border: 1px solid #f3f4f6;\n  z-index: 10000;\n  transition:\n    top 0.3s cubic-bezier(0.25, 0.1, 0.25, 1),\n    left 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);\n}\n\n.onboard-tooltip-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n  margin-bottom: 8px;\n}\n\n.onboard-tooltip-title {\n  margin: 0;\n  font-weight: bold;\n  color: #111827;\n  font-size: 18px;\n  line-height: 1.2;\n}\n\n.onboard-close-button {\n  background: none;\n  border: none;\n  cursor: pointer;\n  padding: 4px;\n  color: #9ca3af;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.onboard-close-button:hover {\n  color: #6b7280;\n}\n\n.onboard-tooltip-description {\n  margin: 0;\n  color: #4b5563;\n  font-size: 14px;\n  margin-bottom: 24px;\n  line-height: 1.5;\n}\n\n.onboard-tooltip-footer {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n}\n\n.onboard-button-primary {\n  background-color: black;\n  color: white;\n  padding: 8px 16px;\n  border-radius: 8px;\n  font-weight: 600;\n  font-size: 14px;\n  transition: all 0.2s;\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.onboard-button-primary:hover {\n  background-color: #1f2937;\n}\n\n.onboard-button-primary:active {\n  transform: scale(0.95);\n}\n\n.onboard-button-ghost {\n  color: #4b5563;\n  font-weight: 500;\n  font-size: 14px;\n  transition: color 0.2s;\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.onboard-button-ghost:hover {\n  color: #111827;\n}\n\n.onboard-button-ghost:disabled {\n  color: #d1d5db;\n  cursor: not-allowed;\n}\n"],"mappings":"AAAA,CAAC,0BACC,SAAU,MACV,MAAK,EAIL,QAAS,OACT,eAAgB,IAClB,CAEA,CAAC,qBACC,SAAU,SACV,iBAAkB,UAClB,eAAgB,KAChB,WAAY,IAAI,IAAK,aAAa,GAAI,CAAE,EAAG,CAAE,GAAI,CAAE,EACrD,CAEA,CAAC,iBACC,IAAK,EACL,KAAM,EACN,MAAO,IACT,CAEA,CAAC,oBACC,KAAM,EACN,MAAO,IACT,CAEA,CAAC,kBACC,KAAM,CACR,CAEA,CAAC,gBACC,SAAU,SACV,MAAO,MACP,iBAAkB,KAnCpB,cAoCiB,KACf,WAAY,EAAE,KAAK,KAAK,MAAM,UAC9B,eAAgB,KAtClB,QAuCW,KACT,OAAQ,IAAI,MAAM,QAClB,QAAS,MACT,WACE,IAAI,IAAK,aAAa,GAAI,CAAE,EAAG,CAAE,GAAI,CAAE,EAAE,CACzC,KAAK,IAAK,aAAa,GAAI,CAAE,EAAG,CAAE,GAAI,CAAE,EAC5C,CAEA,CAAC,uBACC,QAAS,KACT,gBAAiB,cACjB,YAAa,WACb,cAAe,GACjB,CAEA,CAAC,sBAtDD,OAuDU,EACR,YAAa,IACb,MAAO,QACP,UAAW,KACX,YAAa,GACf,CAEA,CAAC,qBACC,WAAY,KACZ,OAAQ,KACR,OAAQ,QAjEV,QAkEW,IACT,MAAO,QACP,QAAS,KACT,YAAa,OACb,gBAAiB,MACnB,CAEA,CAXC,oBAWoB,OACnB,MAAO,OACT,CAEA,CAAC,4BA7ED,OA8EU,IAGO,KAFf,MAAO,QACP,UAAW,KAEX,YAAa,GACf,CAEA,CAAC,uBACC,QAAS,KACT,YAAa,OACb,gBAAiB,aACnB,CAEA,CAAC,uBACC,iBAAkB,KAClB,MAAO,KA7FT,QA8FW,IAAI,KA9Ff,cA+FiB,IACf,YAAa,IACb,UAAW,KACX,WAAY,IAAI,IAChB,QAAS,KACT,YAAa,OACb,IAAK,GACP,CAEA,CAbC,sBAasB,OACrB,iBAAkB,OACpB,CAEA,CAjBC,sBAiBsB,QACrB,UAAW,MAAM,IACnB,CAEA,CAAC,qBACC,MAAO,QACP,YAAa,IACb,UAAW,KACX,WAAY,MAAM,IAClB,QAAS,KACT,YAAa,OACb,IAAK,GACP,CAEA,CAVC,oBAUoB,OACnB,MAAO,OACT,CAEA,CAdC,oBAcoB,UACnB,MAAO,QACP,OAAQ,WACV","names":[]}

package/dist/index.d.mts

@@ -21,6 +21,7 @@ interface OnboardingMetadata {
     nextRouter?: boolean;
     draggable?: boolean;
     inOrder?: boolean;
+    simulateClicksOnNavigate?: boolean;
 }
 interface OnboardingStyle {
     padding?: number;
@@ -57,6 +58,7 @@ interface OnboardingContextType {
 declare const OnboardingProvider: React.FC<{
     config: OnboardingConfig;
     ssr?: boolean;
+    onNavigate?: (url: string) => void;
     children: React.ReactNode;
 }>;
 declare const useOnboarding: () => OnboardingContextType;

package/dist/index.d.ts

@@ -21,6 +21,7 @@ interface OnboardingMetadata {
     nextRouter?: boolean;
     draggable?: boolean;
     inOrder?: boolean;
+    simulateClicksOnNavigate?: boolean;
 }
 interface OnboardingStyle {
     padding?: number;
@@ -57,6 +58,7 @@ interface OnboardingContextType {
 declare const OnboardingProvider: React.FC<{
     config: OnboardingConfig;
     ssr?: boolean;
+    onNavigate?: (url: string) => void;
     children: React.ReactNode;
 }>;
 declare const useOnboarding: () => OnboardingContextType;

package/dist/index.js

@@ -1,3 +1,3 @@
 "use client";
-"use strict";"use client";var Q=Object.create;var W=Object.defineProperty;var V=Object.getOwnPropertyDescriptor;var Z=Object.getOwnPropertyNames;var tt=Object.getPrototypeOf,et=Object.prototype.hasOwnProperty;var nt=(e,s)=>{for(var f in s)W(e,f,{get:s[f],enumerable:!0})},F=(e,s,f,y)=>{if(s&&typeof s=="object"||typeof s=="function")for(let m of Z(s))!et.call(e,m)&&m!==f&&W(e,m,{get:()=>s[m],enumerable:!(y=V(s,m))||y.enumerable});return e};var T=(e,s,f)=>(f=e!=null?Q(tt(e)):{},F(s||!e||!e.__esModule?W(f,"default",{value:e,enumerable:!0}):f,e)),ot=e=>F(W({},"__esModule",{value:!0}),e);var it={};nt(it,{OnboardingProvider:()=>rt,useOnboarding:()=>$});module.exports=ot(it);var l=T(require("react")),B=T(require("js-cookie"));var b=require("react"),X=require("react-dom");var a=require("react/jsx-runtime"),j=()=>{let{config:e,currentStep:s,nextStep:f,prevStep:y,finish:m,isFirstStep:n,isLastStep:p}=$(),[d,v]=(0,b.useState)(null),[H,D]=(0,b.useState)({top:0,left:0}),[C,A]=(0,b.useState)({x:0,y:0}),E=(0,b.useRef)(!1),R=(0,b.useRef)({x:0,y:0}),w=(0,b.useRef)(null);(0,b.useEffect)(()=>{A({x:0,y:0})},[s]);let N=r=>{e.metadata.draggable&&(r.stopPropagation(),r.preventDefault(),E.current=!0,R.current={x:r.clientX-C.x,y:r.clientY-C.y},w.current&&(w.current.style.transition="none",w.current.style.cursor="grabbing"),window.addEventListener("pointermove",I),window.addEventListener("pointerup",t))},I=(0,b.useCallback)(r=>{if(!E.current)return;let g=r.clientX-R.current.x,S=r.clientY-R.current.y;A({x:g,y:S})},[]),t=(0,b.useCallback)(()=>{E.current=!1,w.current&&(w.current.style.transition="top 0.3s cubic-bezier(0.25, 0.1, 0.25, 1), left 0.3s cubic-bezier(0.25, 0.1, 0.25, 1)",w.current.style.cursor=e.metadata.draggable?"grab":"auto"),window.removeEventListener("pointermove",I),window.removeEventListener("pointerup",t)},[e.metadata.draggable,I]);(0,b.useEffect)(()=>()=>{window.removeEventListener("pointermove",I),window.removeEventListener("pointerup",t)},[I,t]);let c=(0,b.useCallback)(r=>{let z=r.top,x=window.innerHeight-r.bottom,U=r.left,G=window.innerWidth-r.right,P=0,L=0;return x>232?(P=r.bottom+12,L=Math.max(20,Math.min(window.innerWidth-300-20,r.left+r.width/2-300/2))):z>232?(P=r.top-200-12,L=Math.max(20,Math.min(window.innerWidth-300-20,r.left+r.width/2-300/2))):G>332?(P=Math.max(20,Math.min(window.innerHeight-200-20,r.top+r.height/2-200/2)),L=r.right+12):U>332?(P=Math.max(20,Math.min(window.innerHeight-200-20,r.top+r.height/2-200/2)),L=r.left-300-12):(P=window.innerHeight/2-200/2,L=window.innerWidth/2-300/2),{top:P+window.scrollY,left:L+window.scrollX}},[]),i=(0,b.useCallback)(()=>{if(!s)return;let r=document.querySelector(`[data-onboarding-id="${s.attribute}"]`);if(r){let g=r.getBoundingClientRect(),S=e.style?.padding||0,k={top:g.top-S,bottom:g.bottom+S,left:g.left-S,right:g.right+S,width:g.width+S*2,height:g.height+S*2},M={top:k.top+window.scrollY,left:k.left+window.scrollX,width:k.width,height:k.height},z=c(k);v(x=>x&&x.top===M.top&&x.left===M.left&&x.width===M.width&&x.height===M.height?x:M),D(x=>x.top===z.top&&x.left===z.left?x:z)}else v(null)},[s,c,e.style]);if((0,b.useEffect)(()=>{i(),window.addEventListener("resize",i),window.addEventListener("scroll",i);let r=new MutationObserver(i);r.observe(document.body,{childList:!0,subtree:!0,attributes:!0});let g=null;if(typeof ResizeObserver<"u"){g=new ResizeObserver(i),g.observe(document.body);let S=s?.attribute?document.querySelector(`[data-onboarding-id="${s.attribute}"]`):null;S&&g.observe(S)}return()=>{window.removeEventListener("resize",i),window.removeEventListener("scroll",i),r.disconnect(),g&&g.disconnect()}},[i,s?.attribute]),!s||!d)return null;let u={...e.style?.background,transition:"all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1)"},o=r=>{r.stopPropagation()},h=()=>(0,a.jsx)("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:(0,a.jsx)("path",{d:"M15 18l-6-6 6-6"})}),J=()=>(0,a.jsx)("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:(0,a.jsx)("path",{d:"M9 18l6-6-6-6"})}),_=()=>(0,a.jsxs)("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[(0,a.jsx)("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),(0,a.jsx)("line",{x1:"6",y1:"6",x2:"18",y2:"18"})]}),K=(0,a.jsxs)("div",{className:"fixed inset-0 z-[999999] pointer-events-none",children:[(0,a.jsx)("div",{style:{height:d.top,...u},className:"onboard-overlay-mask top-0 left-0 w-full pointer-events-auto",onPointerDown:o,onMouseDown:o,onClick:o}),(0,a.jsx)("div",{style:{top:d.top+d.height,height:`calc(100vh - ${d.top+d.height}px)`,...u},className:"onboard-overlay-mask left-0 w-full pointer-events-auto",onPointerDown:o,onMouseDown:o,onClick:o}),(0,a.jsx)("div",{style:{top:d.top,height:d.height,width:d.left,...u},className:"onboard-overlay-mask left-0 pointer-events-auto",onPointerDown:o,onMouseDown:o,onClick:o}),(0,a.jsx)("div",{style:{top:d.top,height:d.height,left:d.left+d.width,width:`calc(100% - ${d.left+d.width}px)`,...u},className:"onboard-overlay-mask pointer-events-auto",onPointerDown:o,onMouseDown:o,onClick:o}),(0,a.jsxs)("div",{ref:w,className:"onboard-tooltip pointer-events-auto",onPointerDown:N,style:{zIndex:1e6,...e.style?.container,top:H.top+C.y,left:H.left+C.x,transition:"top 0.3s cubic-bezier(0.25, 0.1, 0.25, 1), left 0.3s cubic-bezier(0.25, 0.1, 0.25, 1)",cursor:e.metadata.draggable?"grab":"auto",touchAction:"none"},onMouseDown:o,onClick:o,children:[(0,a.jsxs)("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"flex-start",marginBottom:"8px"},children:[(0,a.jsx)("h3",{style:{margin:0,fontWeight:"bold",color:"#111827",fontSize:"18px",lineHeight:1.2},children:s.title}),(0,a.jsx)("button",{onClick:r=>{r.stopPropagation(),m()},style:{background:"none",border:"none",cursor:"pointer",padding:"4px",color:"#9ca3af"},children:(0,a.jsx)(_,{})})]}),(0,a.jsx)("p",{style:{margin:0,color:"#4b5563",fontSize:"14px",marginBottom:"24px",lineHeight:1.5},children:s.description}),(0,a.jsxs)("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between"},children:[(0,a.jsxs)("button",{onClick:r=>{r.stopPropagation(),y()},disabled:n,className:"onboard-button-ghost",style:{background:"none",border:"none",cursor:n?"not-allowed":"pointer",...e.style?.prev},children:[(0,a.jsx)(h,{}),"Prev"]}),p?(0,a.jsx)("button",{onClick:r=>{r.stopPropagation(),m()},className:"onboard-button-primary",style:{border:"none",cursor:"pointer",...e.style?.finish},children:"Finish"}):(0,a.jsxs)("button",{onClick:r=>{r.stopPropagation(),f()},className:"onboard-button-primary",style:{border:"none",cursor:"pointer",...n?e.style?.start:{},...n?{}:e.style?.next},children:[n&&e.style?.start?"Start":"Next",!(n&&e.style?.start)&&(0,a.jsx)(J,{})]})]})]})]});return typeof document<"u"?(0,X.createPortal)(K,document.body):null};var O=require("react/jsx-runtime"),q=(0,l.createContext)(void 0),Y="onboarding_state",rt=({config:e,ssr:s=!1,children:f})=>{let[y,m]=(0,l.useState)(!s),[n,p]=(0,l.useState)({currentStepIndex:0,currentSubStepIndex:null,isActive:!0}),d=l.default.useRef(e);(0,l.useEffect)(()=>{d.current=e},[e]);let v=(0,l.useCallback)(t=>{t&&(d.current.metadata.nextRouter,window.location.href=t)},[]);(0,l.useEffect)(()=>{s&&m(!0)},[s]);let H=(t,c)=>{if(t.urlMatch instanceof RegExp)return t.urlMatch.test(c);if(typeof t.urlMatch=="string"&&t.urlMatch.includes("*")){let i=t.urlMatch.replace(/[.+?^${}()|[\]\\]/g,"\\$&").replace(/\*/g,".*");return new RegExp(`^${i}$`).test(c)}return c===t.urlMatch};(0,l.useEffect)(()=>{let t=d.current,c=window.location.pathname,i=-1;t.metadata.inOrder===!1&&(i=t.steps.findIndex(o=>H(o,c)));let u=B.default.get(Y);if(u)try{let o=JSON.parse(u);if(t.metadata.inOrder===!1)i!==-1?o.currentStepIndex===i?p(o):p(h=>({...h,currentStepIndex:i,currentSubStepIndex:null,isActive:!0})):p(h=>({...o,isActive:!1}));else if(p(o),t.metadata.inOrder!==!1){let h=t.steps[o.currentStepIndex];h&&o.isActive&&typeof h.urlMatch=="string"&&window.location.pathname!==h.urlMatch&&v(h.urlMatch)}}catch(o){console.error("Failed to parse onboarding state from cookie",o),i!==-1&&p(h=>({...h,currentStepIndex:i,currentSubStepIndex:null,isActive:!0}))}else if(i!==-1)p(o=>({...o,currentStepIndex:i,currentSubStepIndex:null,isActive:!0}));else if(t.metadata.inOrder===!1)p(o=>({...o,isActive:!1}));else{let o=t.steps[0];o&&typeof o.urlMatch=="string"&&window.location.pathname!==o.urlMatch&&v(o.urlMatch)}},[v]),(0,l.useEffect)(()=>{y&&B.default.set(Y,JSON.stringify(n),{expires:365})},[n,y]);let D=(0,l.useMemo)(()=>{let t=e.steps[n.currentStepIndex];return t?n.currentSubStepIndex!==null&&t.subSteps&&t.subSteps[n.currentSubStepIndex]||t:null},[e.steps,n.currentStepIndex,n.currentSubStepIndex]),C=n.currentStepIndex===0&&n.currentSubStepIndex===null,A=(0,l.useMemo)(()=>{let t=e.steps.length,c=n.currentStepIndex===t-1,i=e.steps[n.currentStepIndex],u=i?.subSteps&&i.subSteps.length>0;return c?u?n.currentSubStepIndex===i.subSteps.length-1:!0:!1},[e.steps,n.currentStepIndex,n.currentSubStepIndex]),E=(0,l.useCallback)(()=>{let t=d.current,c=t.steps[n.currentStepIndex],i=n.currentSubStepIndex!==null&&c.subSteps?c.subSteps[n.currentSubStepIndex]:c;if(i.click){let u=document.querySelector(`[data-onboarding-id="${i.attribute}"]`);u&&u.click()}if(c.subSteps&&(n.currentSubStepIndex===null||n.currentSubStepIndex<c.subSteps.length-1)){let u=n.currentSubStepIndex===null?0:n.currentSubStepIndex+1,o=c.subSteps[u];p(h=>({...h,currentSubStepIndex:u})),o.navigate&&v(o.navigate);return}if(n.currentStepIndex<t.steps.length-1){let u=n.currentStepIndex+1,o=t.steps[u];p({currentStepIndex:u,currentSubStepIndex:null,isActive:!0}),o.navigate&&v(o.navigate)}else p(u=>({...u,isActive:!1})),t.onOnboardingComplete&&t.onOnboardingComplete()},[n.currentStepIndex,n.currentSubStepIndex,v]),R=(0,l.useCallback)(()=>{let t=d.current,c=t.steps[n.currentStepIndex];if(n.currentSubStepIndex!==null&&n.currentSubStepIndex>0){p(i=>({...i,currentSubStepIndex:i.currentSubStepIndex-1}));return}if(n.currentSubStepIndex===0){p(i=>({...i,currentSubStepIndex:null}));return}if(n.currentStepIndex>0){let i=n.currentStepIndex-1,u=t.steps[i],o=u.subSteps?u.subSteps.length-1:null;p({currentStepIndex:i,currentSubStepIndex:o,isActive:!0})}},[n.currentStepIndex,n.currentSubStepIndex]),w=(0,l.useCallback)(()=>{p(t=>({...t,isActive:!1})),d.current.onOnboardingComplete&&d.current.onOnboardingComplete()},[]),N=(0,l.useCallback)((t,c=null)=>{p({currentStepIndex:t,currentSubStepIndex:c,isActive:!0})},[]),I={config:e,state:n,nextStep:E,prevStep:R,finish:w,goToStep:N,currentStep:D,isFirstStep:C,isLastStep:A};return y?(0,O.jsxs)(q.Provider,{value:I,children:[f,n.isActive&&(0,O.jsx)(j,{})]}):(0,O.jsx)(O.Fragment,{children:f})},$=()=>{let e=(0,l.useContext)(q);if(e===void 0)throw new Error("useOnboarding must be used within an OnboardingProvider");return e};0&&(module.exports={OnboardingProvider,useOnboarding});
+"use strict";"use client";var Q=Object.create;var T=Object.defineProperty;var V=Object.getOwnPropertyDescriptor;var Z=Object.getOwnPropertyNames;var tt=Object.getPrototypeOf,et=Object.prototype.hasOwnProperty;var nt=(n,d)=>{for(var g in d)T(n,g,{get:d[g],enumerable:!0})},X=(n,d,g,I)=>{if(d&&typeof d=="object"||typeof d=="function")for(let f of Z(d))!et.call(n,f)&&f!==g&&T(n,f,{get:()=>d[f],enumerable:!(I=V(d,f))||I.enumerable});return n};var Y=(n,d,g)=>(g=n!=null?Q(tt(n)):{},X(d||!n||!n.__esModule?T(g,"default",{value:n,enumerable:!0}):g,n)),ot=n=>X(T({},"__esModule",{value:!0}),n);var it={};nt(it,{OnboardingProvider:()=>rt,useOnboarding:()=>F});module.exports=ot(it);var a=Y(require("react")),B=Y(require("js-cookie"));var b=require("react"),q=require("react-dom");var l=require("react/jsx-runtime"),J=()=>{let{config:n,currentStep:d,nextStep:g,prevStep:I,finish:f,isFirstStep:y,isLastStep:r}=F(),[i,x]=(0,b.useState)(null),[M,O]=(0,b.useState)({top:0,left:0}),[P,D]=(0,b.useState)({x:0,y:0}),A=(0,b.useRef)(!1),H=(0,b.useRef)({x:0,y:0}),v=(0,b.useRef)(null);(0,b.useEffect)(()=>{D({x:0,y:0})},[d]);let k=(0,b.useCallback)(t=>{if(!A.current)return;let c=t.clientX-H.current.x,h=t.clientY-H.current.y;D({x:c,y:h})},[]),E=(0,b.useCallback)(()=>{A.current=!1,v.current&&(v.current.style.transition="top 0.3s cubic-bezier(0.25, 0.1, 0.25, 1), left 0.3s cubic-bezier(0.25, 0.1, 0.25, 1)",v.current.style.cursor=n.metadata.draggable?"grab":"auto"),window.removeEventListener("pointermove",k),window.removeEventListener("pointerup",E)},[n.metadata.draggable,k]),j=t=>{n.metadata.draggable&&(t.stopPropagation(),t.preventDefault(),A.current=!0,H.current={x:t.clientX-P.x,y:t.clientY-P.y},v.current&&(v.current.style.transition="none",v.current.style.cursor="grabbing"),window.addEventListener("pointermove",k),window.addEventListener("pointerup",E))};(0,b.useEffect)(()=>()=>{window.removeEventListener("pointermove",k),window.removeEventListener("pointerup",E)},[k,E]);let $=(0,b.useCallback)(t=>{let W=t.top,S=window.innerHeight-t.bottom,K=t.left,G=window.innerWidth-t.right,z=0,N=0;return S>232?(z=t.bottom+12,N=Math.max(20,Math.min(window.innerWidth-300-20,t.left+t.width/2-300/2))):W>232?(z=t.top-200-12,N=Math.max(20,Math.min(window.innerWidth-300-20,t.left+t.width/2-300/2))):G>332?(z=Math.max(20,Math.min(window.innerHeight-200-20,t.top+t.height/2-200/2)),N=t.right+12):K>332?(z=Math.max(20,Math.min(window.innerHeight-200-20,t.top+t.height/2-200/2)),N=t.left-300-12):(z=window.innerHeight/2-200/2,N=window.innerWidth/2-300/2),{top:z+window.scrollY,left:N+window.scrollX}},[]),m=(0,b.useCallback)(()=>{if(!d)return;let t=document.querySelector(`[data-onboarding-id="${d.attribute}"]`);if(t){let c=t.getBoundingClientRect(),h=n.style?.padding||0,L={top:c.top-h,bottom:c.bottom+h,left:c.left-h,right:c.right+h,width:c.width+h*2,height:c.height+h*2},R={top:L.top+window.scrollY,left:L.left+window.scrollX,width:L.width,height:L.height},W=$(L);x(S=>S&&S.top===R.top&&S.left===R.left&&S.width===R.width&&S.height===R.height?S:R),O(S=>S.top===W.top&&S.left===W.left?S:W)}else x(null)},[d,$,n.style]);if((0,b.useEffect)(()=>{m(),window.addEventListener("resize",m),window.addEventListener("scroll",m);let t=new MutationObserver(m);t.observe(document.body,{childList:!0,subtree:!0,attributes:!0});let c=null;if(typeof ResizeObserver<"u"){c=new ResizeObserver(m),c.observe(document.body);let h=d?.attribute?document.querySelector(`[data-onboarding-id="${d.attribute}"]`):null;h&&c.observe(h)}return()=>{window.removeEventListener("resize",m),window.removeEventListener("scroll",m),t.disconnect(),c&&c.disconnect()}},[m,d?.attribute]),!d||!i)return null;let e={...n.style?.background,transition:"all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1)"},o=t=>{t.stopPropagation()},u=()=>(0,l.jsx)("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:(0,l.jsx)("path",{d:"M15 18l-6-6 6-6"})}),p=()=>(0,l.jsx)("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:(0,l.jsx)("path",{d:"M9 18l6-6-6-6"})}),s=()=>(0,l.jsxs)("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[(0,l.jsx)("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),(0,l.jsx)("line",{x1:"6",y1:"6",x2:"18",y2:"18"})]}),w=(0,l.jsxs)("div",{className:"onboard-overlay-container",children:[(0,l.jsx)("div",{style:{height:i.top,...e},className:"onboard-overlay-mask onboard-mask-top",onPointerDown:o,onMouseDown:o,onClick:o}),(0,l.jsx)("div",{style:{top:i.top+i.height,height:`calc(100vh - ${i.top+i.height}px)`,...e},className:"onboard-overlay-mask onboard-mask-bottom",onPointerDown:o,onMouseDown:o,onClick:o}),(0,l.jsx)("div",{style:{top:i.top,height:i.height,width:i.left,...e},className:"onboard-overlay-mask onboard-mask-left",onPointerDown:o,onMouseDown:o,onClick:o}),(0,l.jsx)("div",{style:{top:i.top,height:i.height,left:i.left+i.width,width:`calc(100% - ${i.left+i.width}px)`,...e},className:"onboard-overlay-mask",onPointerDown:o,onMouseDown:o,onClick:o}),(0,l.jsxs)("div",{ref:v,className:"onboard-tooltip",onPointerDown:j,style:{zIndex:1e6,...n.style?.container,top:M.top+P.y,left:M.left+P.x,transition:"top 0.3s cubic-bezier(0.25, 0.1, 0.25, 1), left 0.3s cubic-bezier(0.25, 0.1, 0.25, 1)",cursor:n.metadata.draggable?"grab":"auto",touchAction:"none"},onMouseDown:o,onClick:o,children:[(0,l.jsxs)("div",{className:"onboard-tooltip-header",children:[(0,l.jsx)("h3",{className:"onboard-tooltip-title",children:d.title}),(0,l.jsx)("button",{onClick:t=>{t.stopPropagation(),f()},className:"onboard-close-button",children:(0,l.jsx)(s,{})})]}),(0,l.jsx)("p",{className:"onboard-tooltip-description",children:d.description}),(0,l.jsxs)("div",{className:"onboard-tooltip-footer",children:[(0,l.jsxs)("button",{onClick:t=>{t.stopPropagation(),I()},disabled:y,className:"onboard-button-ghost",style:{background:"none",border:"none",cursor:y?"not-allowed":"pointer",...n.style?.prev},children:[(0,l.jsx)(u,{}),"Prev"]}),r?(0,l.jsx)("button",{onClick:t=>{t.stopPropagation(),f()},className:"onboard-button-primary",style:{border:"none",cursor:"pointer",...n.style?.finish},children:"Finish"}):(0,l.jsxs)("button",{onClick:t=>{t.stopPropagation(),g()},className:"onboard-button-primary",style:{border:"none",cursor:"pointer",...y?n.style?.start:{},...y?{}:n.style?.next},children:[y&&n.style?.start?"Start":"Next",!(y&&n.style?.start)&&(0,l.jsx)(p,{})]})]})]})]});return typeof document<"u"?(0,q.createPortal)(w,document.body):null};var C=require("react/jsx-runtime"),_=(0,a.createContext)(void 0),U="onboarding_state",rt=({config:n,ssr:d=!1,onNavigate:g,children:I})=>{let[f,y]=(0,a.useState)(!d),[r,i]=(0,a.useState)({currentStepIndex:0,currentSubStepIndex:null,isActive:!0}),x=a.default.useRef(n);(0,a.useEffect)(()=>{x.current=n},[n]);let M=a.default.useRef(g);(0,a.useEffect)(()=>{M.current=g},[g]);let O=(0,a.useCallback)(e=>{e&&(M.current?M.current(e):(n.metadata.nextRouter,window.location.href=e))},[n.metadata.nextRouter]);(0,a.useEffect)(()=>{d&&y(!0)},[d]);let P=(e,o)=>{if(e.urlMatch instanceof RegExp)return e.urlMatch.test(o);if(typeof e.urlMatch=="string"&&e.urlMatch.includes("*")){let u=e.urlMatch.replace(/[.+?^${}()|[\\]/g,"\\$&").replace(/\*/g,".*");return new RegExp(`^${u}$`).test(o)}return o===e.urlMatch},D=(0,a.useEffectEvent)(()=>{let e=x.current,o=window.location.pathname,u=-1;e.metadata.inOrder===!1&&(u=e.steps.findIndex(s=>P(s,o)));let p=B.default.get(U);if(p)try{let s=JSON.parse(p);if(e.metadata.inOrder===!1)u!==-1?s.currentStepIndex===u?i(s):i({currentStepIndex:u,currentSubStepIndex:null,isActive:!0}):i({...s,isActive:!1});else if(i(s),e.metadata.inOrder!==!1){let w=e.steps[s.currentStepIndex];if(w&&s.isActive){let t;if(s.currentStepIndex>0){let c=e.steps[s.currentStepIndex-1];c.navigate&&(t=c.navigate)}!t&&typeof w.urlMatch=="string"&&(t=w.urlMatch),t&&window.location.pathname!==t&&O(t),e.metadata.simulateClicksOnNavigate&&s.currentSubStepIndex!==null&&w.click&&setTimeout(()=>{let c=document.querySelector(`[data-onboarding-id="${w.attribute}"]`);c&&c.click()},500)}}}catch(s){console.error("Failed to parse onboarding state from cookie",s),u!==-1&&i({currentStepIndex:u,currentSubStepIndex:null,isActive:!0})}else if(u!==-1)i({currentStepIndex:u,currentSubStepIndex:null,isActive:!0});else if(e.metadata.inOrder===!1)i(s=>({...s,isActive:!1}));else{let s=e.steps[0];s&&typeof s.urlMatch=="string"&&window.location.pathname!==s.urlMatch&&O(s.urlMatch)}});(0,a.useEffect)(()=>{D()},[]),(0,a.useEffect)(()=>{f&&B.default.set(U,JSON.stringify(r),{expires:365})},[r,f]);let A=(0,a.useMemo)(()=>{let e=n.steps[r.currentStepIndex];return e?r.currentSubStepIndex!==null&&e.subSteps&&e.subSteps[r.currentSubStepIndex]||e:null},[n.steps,r.currentStepIndex,r.currentSubStepIndex]),H=r.currentStepIndex===0&&r.currentSubStepIndex===null,v=(0,a.useMemo)(()=>{let e=n.steps.length,o=r.currentStepIndex===e-1,u=n.steps[r.currentStepIndex],p=u?.subSteps&&u.subSteps.length>0;return o?p?r.currentSubStepIndex===u.subSteps.length-1:!0:!1},[n.steps,r.currentStepIndex,r.currentSubStepIndex]),k=(0,a.useCallback)(()=>{let e=x.current,o=e.steps[r.currentStepIndex],u=r.currentSubStepIndex!==null&&o.subSteps?o.subSteps[r.currentSubStepIndex]:o;if(u.click){let p=document.querySelector(`[data-onboarding-id="${u.attribute}"]`);p&&p.click()}if(o.subSteps&&(r.currentSubStepIndex===null||r.currentSubStepIndex<o.subSteps.length-1)){let p=r.currentSubStepIndex===null?0:r.currentSubStepIndex+1,s=o.subSteps[p];i(w=>({...w,currentSubStepIndex:p})),s.navigate&&O(s.navigate);return}if(r.currentStepIndex<e.steps.length-1){let p=r.currentStepIndex+1,s=e.steps[p];i({currentStepIndex:p,currentSubStepIndex:null,isActive:!0}),s.navigate&&O(s.navigate)}else i(p=>({...p,isActive:!1})),e.onOnboardingComplete&&e.onOnboardingComplete()},[r.currentStepIndex,r.currentSubStepIndex,O]),E=(0,a.useCallback)(()=>{let e=x.current;if(r.currentSubStepIndex!==null&&r.currentSubStepIndex>0){i(o=>({...o,currentSubStepIndex:o.currentSubStepIndex-1}));return}if(r.currentStepIndex>0&&r.currentSubStepIndex===0){i(o=>({...o,currentSubStepIndex:null}));return}if(r.currentStepIndex>0){let o=r.currentStepIndex-1,u=e.steps[o],p=u.subSteps?u.subSteps.length-1:null;i({currentStepIndex:o,currentSubStepIndex:p,isActive:!0})}},[r.currentStepIndex,r.currentSubStepIndex]),j=(0,a.useCallback)(()=>{i(e=>({...e,isActive:!1})),x.current.onOnboardingComplete&&x.current.onOnboardingComplete()},[]),$=(0,a.useCallback)((e,o=null)=>{i({currentStepIndex:e,currentSubStepIndex:o,isActive:!0})},[]),m={config:n,state:r,nextStep:k,prevStep:E,finish:j,goToStep:$,currentStep:A,isFirstStep:H,isLastStep:v};return f?(0,C.jsxs)(_.Provider,{value:m,children:[I,r.isActive&&(0,C.jsx)(J,{})]}):(0,C.jsx)(C.Fragment,{children:I})},F=()=>{let n=(0,a.useContext)(_);if(n===void 0)throw new Error("useOnboarding must be used within an OnboardingProvider");return n};0&&(module.exports={OnboardingProvider,useOnboarding});
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts","../src/components/OnboardingProvider.tsx","../src/components/OnboardingOverlay.tsx"],"sourcesContent":["\"use client\";\n\nimport './styles.css';\nexport * from './components/OnboardingProvider';\nexport * from './types';\n","\"use client\";\n\nimport React, { createContext, useContext, useEffect, useState, useCallback, useMemo } from 'react';\nimport Cookies from 'js-cookie';\nimport { OnboardingConfig, OnboardingState, OnboardingStep, OnboardingSubStep } from '../types';\nimport { OnboardingOverlay } from './OnboardingOverlay';\n\ninterface OnboardingContextType {\n  config: OnboardingConfig;\n  state: OnboardingState;\n  nextStep: () => void;\n  prevStep: () => void;\n  finish: () => void;\n  goToStep: (stepIndex: number, subStepIndex?: number | null) => void;\n  currentStep: OnboardingStep | OnboardingSubStep | null;\n  isFirstStep: boolean;\n  isLastStep: boolean;\n}\n\nconst OnboardingContext = createContext<OnboardingContextType | undefined>(undefined);\n\nconst COOKIE_NAME = 'onboarding_state';\n\nexport const OnboardingProvider: React.FC<{\n  config: OnboardingConfig;\n  ssr?: boolean;\n  children: React.ReactNode;\n}> = ({ config, ssr = false, children }) => {\n  const [isMounted, setIsMounted] = useState(!ssr);\n  const [state, setState] = useState<OnboardingState>({\n    currentStepIndex: 0,\n    currentSubStepIndex: null,\n    isActive: true,\n  });\n\n  // Stabilize config to prevent infinite loops if the user passes a new object on every render\n  const configRef = React.useRef(config);\n  useEffect(() => {\n    configRef.current = config;\n  }, [config]);\n\n  const handleNavigation = useCallback((link?: string) => {\n    if (!link) return;\n    \n    if (configRef.current.metadata.nextRouter) {\n      window.location.href = link;\n    } else {\n      window.location.href = link;\n    }\n  }, []);\n\n  useEffect(() => {\n    if (ssr) {\n      setIsMounted(true);\n    }\n  }, [ssr]);\n\n  const isMatch = (step: OnboardingStep, path: string) => {\n    if (step.urlMatch instanceof RegExp) return step.urlMatch.test(path);\n    \n    if (typeof step.urlMatch === 'string' && step.urlMatch.includes('*')) {\n      // Escape regex special characters but keep '*' as '.*'\n      const pattern = step.urlMatch\n        .replace(/[.+?^${}()|[\\]\\\\]/g, '\\\\$&') // Escape regex chars\n        .replace(/\\*/g, '.*');                 // Convert * to .*\n      return new RegExp(`^${pattern}$`).test(path);\n    }\n\n    return path === step.urlMatch;\n  };\n\n  useEffect(() => {\n    const currentConfig = configRef.current;\n    const currentPath = window.location.pathname;\n    let matchedStepIndex = -1;\n    \n    // Check if inOrder is explicitly false to find matching step from URL\n    if ((currentConfig.metadata.inOrder as boolean | undefined) === false) {\n      matchedStepIndex = currentConfig.steps.findIndex(step => isMatch(step, currentPath));\n    }\n\n    const savedState = Cookies.get(COOKIE_NAME);\n    if (savedState) {\n      try {\n        const parsed: OnboardingState = JSON.parse(savedState);\n        \n        // If inOrder is false\n        if ((currentConfig.metadata.inOrder as boolean | undefined) === false) {\n          if (matchedStepIndex !== -1) {\n            // We found a matching step for this URL\n            if (parsed.currentStepIndex === matchedStepIndex) {\n              // If it matches the saved step, restore state (keep substeps)\n              setState(parsed);\n            } else {\n              // Different step, switch to it\n              setState(prev => ({\n                ...prev,\n                currentStepIndex: matchedStepIndex,\n                currentSubStepIndex: null,\n                isActive: true\n              }));\n            }\n          } else {\n            // inOrder is false, and NO step matches this URL.\n            // We should hide the onboarding, essentially \"pausing\" it until we return to a valid page.\n            setState(prev => ({ ...parsed, isActive: false }));\n          }\n        } else {\n          // Standard behavior (inOrder: true OR no match found) - restore saved state\n          setState(parsed);\n\n          // Only enforce navigation if inOrder is true (or default)\n          if ((currentConfig.metadata.inOrder as boolean | undefined) !== false) {\n            const step = currentConfig.steps[parsed.currentStepIndex];\n            if (step && parsed.isActive) {\n              // Always enforce location based on the main step's urlMatch\n              if (typeof step.urlMatch === 'string' && window.location.pathname !== step.urlMatch) {\n                handleNavigation(step.urlMatch);\n              }\n            }\n          }\n        }\n      } catch (e) {\n        console.error('Failed to parse onboarding state from cookie', e);\n        // Fallback if cookie fails but we have a match\n        if (matchedStepIndex !== -1) {\n          setState(prev => ({\n            ...prev,\n            currentStepIndex: matchedStepIndex,\n            currentSubStepIndex: null,\n            isActive: true\n          }));\n        }\n      }\n    } else if (matchedStepIndex !== -1) {\n      // No cookie, but we have a URL match\n      setState(prev => ({\n        ...prev,\n        currentStepIndex: matchedStepIndex,\n        currentSubStepIndex: null,\n        isActive: true\n      }));\n    } else if ((currentConfig.metadata.inOrder as boolean | undefined) === false) {\n      // No cookie, no match, and inOrder is false.\n      // We are on a page that doesn't trigger any onboarding step.\n      setState(prev => ({ ...prev, isActive: false }));\n    } else {\n      // No cookie, no match, inOrder is true (default).\n      // Enforce navigation for the default first step if needed.\n      const step = currentConfig.steps[0];\n      if (step && typeof step.urlMatch === 'string' && window.location.pathname !== step.urlMatch) {\n         handleNavigation(step.urlMatch);\n      }\n    }\n  }, [handleNavigation]); // Removed config.steps dependency\n\n  useEffect(() => {\n    if (isMounted) {\n      Cookies.set(COOKIE_NAME, JSON.stringify(state), { expires: 365 });\n    }\n  }, [state, isMounted]);\n\n  const currentStep = useMemo(() => {\n    const step = config.steps[state.currentStepIndex];\n    if (!step) return null;\n    if (state.currentSubStepIndex !== null && step.subSteps) {\n      return step.subSteps[state.currentSubStepIndex] || step;\n    }\n    return step;\n  }, [config.steps, state.currentStepIndex, state.currentSubStepIndex]);\n\n  const isFirstStep = state.currentStepIndex === 0 && state.currentSubStepIndex === null;\n  const isLastStep = useMemo(() => {\n    const totalSteps = config.steps.length;\n    const isLastMainStep = state.currentStepIndex === totalSteps - 1;\n    const step = config.steps[state.currentStepIndex];\n    const hasSubSteps = step?.subSteps && step.subSteps.length > 0;\n    \n    if (isLastMainStep) {\n      if (hasSubSteps) {\n        return state.currentSubStepIndex === (step.subSteps!.length - 1);\n      }\n      return true;\n    }\n    return false;\n  }, [config.steps, state.currentStepIndex, state.currentSubStepIndex]);\n\n  const nextStep = useCallback(() => {\n    const currentConfig = configRef.current;\n    const step = currentConfig.steps[state.currentStepIndex];\n    const currentActiveStep = state.currentSubStepIndex !== null && step.subSteps \n      ? step.subSteps[state.currentSubStepIndex] \n      : step;\n\n    // Perform click if requested for the current step before moving to the next\n    if (currentActiveStep.click) {\n      const element = document.querySelector(`[data-onboarding-id=\"${currentActiveStep.attribute}\"]`) as HTMLElement;\n      if (element) {\n        element.click();\n      }\n    }\n    \n    // Check for subSteps\n    if (step.subSteps && (state.currentSubStepIndex === null || state.currentSubStepIndex < step.subSteps.length - 1)) {\n      const nextSubIndex = state.currentSubStepIndex === null ? 0 : state.currentSubStepIndex + 1;\n      const nextSubStep = step.subSteps[nextSubIndex];\n      setState(prev => ({ ...prev, currentSubStepIndex: nextSubIndex }));\n      \n      if (nextSubStep.navigate) handleNavigation(nextSubStep.navigate);\n      return;\n    }\n\n    // Move to next main step\n    if (state.currentStepIndex < currentConfig.steps.length - 1) {\n      const nextIndex = state.currentStepIndex + 1;\n      const nextStepObj = currentConfig.steps[nextIndex];\n      setState({\n        currentStepIndex: nextIndex,\n        currentSubStepIndex: null,\n        isActive: true,\n      });\n      \n      if (nextStepObj.navigate) handleNavigation(nextStepObj.navigate);\n    } else {\n      setState(prev => ({ ...prev, isActive: false }));\n      if (currentConfig.onOnboardingComplete) {\n        currentConfig.onOnboardingComplete();\n      }\n    }\n  }, [state.currentStepIndex, state.currentSubStepIndex, handleNavigation]);\n\n  const prevStep = useCallback(() => {\n    const currentConfig = configRef.current;\n    const step = currentConfig.steps[state.currentStepIndex];\n\n    if (state.currentSubStepIndex !== null && state.currentSubStepIndex > 0) {\n      setState(prev => ({ ...prev, currentSubStepIndex: prev.currentSubStepIndex! - 1 }));\n      return;\n    }\n\n    if (state.currentSubStepIndex === 0) {\n      setState(prev => ({ ...prev, currentSubStepIndex: null }));\n      return;\n    }\n\n    if (state.currentStepIndex > 0) {\n      const prevIndex = state.currentStepIndex - 1;\n      const prevStepObj = currentConfig.steps[prevIndex];\n      const prevSubStepIndex = prevStepObj.subSteps ? prevStepObj.subSteps.length - 1 : null;\n      \n      setState({\n        currentStepIndex: prevIndex,\n        currentSubStepIndex: prevSubStepIndex,\n        isActive: true,\n      });\n    }\n  }, [state.currentStepIndex, state.currentSubStepIndex]);\n\n  const finish = useCallback(() => {\n    setState(prev => ({ ...prev, isActive: false }));\n    if (configRef.current.onOnboardingComplete) {\n      configRef.current.onOnboardingComplete();\n    }\n  }, []);\n\n  const goToStep = useCallback((stepIndex: number, subStepIndex: number | null = null) => {\n    setState({\n      currentStepIndex: stepIndex,\n      currentSubStepIndex: subStepIndex,\n      isActive: true,\n    });\n  }, []);\n\n  const value = {\n    config,\n    state,\n    nextStep,\n    prevStep,\n    finish,\n    goToStep,\n    currentStep,\n    isFirstStep,\n    isLastStep,\n  };\n\n  if (!isMounted) return <>{children}</>;\n\n  return (\n    <OnboardingContext.Provider value={value}>\n      {children}\n      {state.isActive && <OnboardingOverlay />}\n    </OnboardingContext.Provider>\n  );\n};\n\nexport const useOnboarding = () => {\n  const context = useContext(OnboardingContext);\n  if (context === undefined) {\n    throw new Error('useOnboarding must be used within an OnboardingProvider');\n  }\n  return context;\n};","\"use client\";\n\nimport React, { useState, useEffect, useCallback, useRef } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useOnboarding } from './OnboardingProvider';\n\nexport const OnboardingOverlay: React.FC = () => {\n  const { config, currentStep, nextStep, prevStep, finish, isFirstStep, isLastStep } = useOnboarding();\n  const [coords, setCoords] = useState<{ top: number; left: number; width: number; height: number } | null>(null);\n  const [position, setPosition] = useState<{ top: number; left: number }>({ top: 0, left: 0 });\n  const [dragOffset, setDragOffset] = useState<{ x: number; y: number }>({ x: 0, y: 0 });\n  const isDragging = useRef(false);\n  const dragStart = useRef<{ x: number; y: number }>({ x: 0, y: 0 });\n  const tooltipRef = useRef<HTMLDivElement>(null);\n\n  // Reset drag offset when step changes\n  useEffect(() => {\n    setDragOffset({ x: 0, y: 0 });\n  }, [currentStep]);\n\n  const handlePointerDown = (e: React.PointerEvent) => {\n    if (!config.metadata.draggable) return;\n    e.stopPropagation(); // Prevent click-through\n    e.preventDefault(); // Prevent text selection\n    isDragging.current = true;\n    dragStart.current = { x: e.clientX - dragOffset.x, y: e.clientY - dragOffset.y };\n    \n    // Disable transition during drag for responsiveness\n    if (tooltipRef.current) {\n      tooltipRef.current.style.transition = 'none';\n      tooltipRef.current.style.cursor = 'grabbing';\n    }\n\n    window.addEventListener('pointermove', handlePointerMove);\n    window.addEventListener('pointerup', handlePointerUp);\n  };\n\n  const handlePointerMove = useCallback((e: PointerEvent) => {\n    if (!isDragging.current) return;\n    \n    const newX = e.clientX - dragStart.current.x;\n    const newY = e.clientY - dragStart.current.y;\n    \n    setDragOffset({ x: newX, y: newY });\n  }, []);\n\n  const handlePointerUp = useCallback(() => {\n    isDragging.current = false;\n    \n    // Re-enable transition\n    if (tooltipRef.current) {\n      tooltipRef.current.style.transition = 'top 0.3s cubic-bezier(0.25, 0.1, 0.25, 1), left 0.3s cubic-bezier(0.25, 0.1, 0.25, 1)';\n      tooltipRef.current.style.cursor = config.metadata.draggable ? 'grab' : 'auto';\n    }\n\n    window.removeEventListener('pointermove', handlePointerMove);\n    window.removeEventListener('pointerup', handlePointerUp);\n  }, [config.metadata.draggable, handlePointerMove]);\n\n  // Clean up listeners on unmount\n  useEffect(() => {\n    return () => {\n      window.removeEventListener('pointermove', handlePointerMove);\n      window.removeEventListener('pointerup', handlePointerUp);\n    };\n  }, [handlePointerMove, handlePointerUp]);\n\n  const calculateBestPosition = useCallback((rect: { top: number; bottom: number; left: number; right: number; width: number; height: number }) => {\n    const tooltipWidth = 300;\n    const tooltipHeight = 200;\n    const gap = 12;\n    const padding = 20;\n\n    const spaceAbove = rect.top;\n    const spaceBelow = window.innerHeight - rect.bottom;\n    const spaceLeft = rect.left;\n    const spaceRight = window.innerWidth - rect.right;\n\n    let top = 0;\n    let left = 0;\n\n    if (spaceBelow > tooltipHeight + gap + padding) {\n      top = rect.bottom + gap;\n      left = Math.max(padding, Math.min(window.innerWidth - tooltipWidth - padding, rect.left + rect.width / 2 - tooltipWidth / 2));\n    } else if (spaceAbove > tooltipHeight + gap + padding) {\n      top = rect.top - tooltipHeight - gap;\n      left = Math.max(padding, Math.min(window.innerWidth - tooltipWidth - padding, rect.left + rect.width / 2 - tooltipWidth / 2));\n    } else if (spaceRight > tooltipWidth + gap + padding) {\n      top = Math.max(padding, Math.min(window.innerHeight - tooltipHeight - padding, rect.top + rect.height / 2 - tooltipHeight / 2));\n      left = rect.right + gap;\n    } else if (spaceLeft > tooltipWidth + gap + padding) {\n      top = Math.max(padding, Math.min(window.innerHeight - tooltipHeight - padding, rect.top + rect.height / 2 - tooltipHeight / 2));\n      left = rect.left - tooltipWidth - gap;\n    } else {\n      top = window.innerHeight / 2 - tooltipHeight / 2;\n      left = window.innerWidth / 2 - tooltipWidth / 2;\n    }\n\n    return { top: top + window.scrollY, left: left + window.scrollX };\n  }, []);\n\n  const updateCoords = useCallback(() => {\n    if (!currentStep) return;\n\n    const element = document.querySelector(`[data-onboarding-id=\"${currentStep.attribute}\"]`) as HTMLElement;\n    if (element) {\n      const rect = element.getBoundingClientRect();\n      const padding = config.style?.padding || 0;\n      \n      const paddedRect = {\n        top: rect.top - padding,\n        bottom: rect.bottom + padding,\n        left: rect.left - padding,\n        right: rect.right + padding,\n        width: rect.width + (padding * 2),\n        height: rect.height + (padding * 2),\n      };\n\n      const newCoords = {\n        top: paddedRect.top + window.scrollY,\n        left: paddedRect.left + window.scrollX,\n        width: paddedRect.width,\n        height: paddedRect.height,\n      };\n\n      const newPosition = calculateBestPosition(paddedRect);\n\n      // Prevent infinite loops by only updating if values actually changed\n      setCoords(prev => {\n        if (prev && \n            prev.top === newCoords.top && \n            prev.left === newCoords.left && \n            prev.width === newCoords.width && \n            prev.height === newCoords.height) {\n          return prev;\n        }\n        return newCoords;\n      });\n\n      setPosition(prev => {\n        if (prev.top === newPosition.top && prev.left === newPosition.left) {\n          return prev;\n        }\n        return newPosition;\n      });\n    } else {\n      setCoords(null);\n    }\n  }, [currentStep, calculateBestPosition, config.style]);\n\n  useEffect(() => {\n    updateCoords();\n    window.addEventListener('resize', updateCoords);\n    window.addEventListener('scroll', updateCoords);\n\n    const observer = new MutationObserver(updateCoords);\n    observer.observe(document.body, { childList: true, subtree: true, attributes: true });\n\n    let resizeObserver: ResizeObserver | null = null;\n    if (typeof ResizeObserver !== 'undefined') {\n      resizeObserver = new ResizeObserver(updateCoords);\n      resizeObserver.observe(document.body);\n      \n      const element = currentStep?.attribute \n        ? document.querySelector(`[data-onboarding-id=\"${currentStep.attribute}\"]`) \n        : null;\n      if (element) {\n        resizeObserver.observe(element);\n      }\n    }\n\n    return () => {\n      window.removeEventListener('resize', updateCoords);\n      window.removeEventListener('scroll', updateCoords);\n      observer.disconnect();\n      if (resizeObserver) resizeObserver.disconnect();\n    };\n  }, [updateCoords, currentStep?.attribute]);\n\n  if (!currentStep || !coords) return null;\n\n  const maskStyle = {\n    ...config.style?.background,\n    transition: 'all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1)',\n  };\n\n  const stopPropagation = (e: React.PointerEvent | React.MouseEvent) => {\n    e.stopPropagation();\n  };\n\n  const ChevronLeftIcon = () => (\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n      <path d=\"M15 18l-6-6 6-6\" />\n    </svg>\n  );\n\n  const ChevronRightIcon = () => (\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n      <path d=\"M9 18l6-6-6-6\" />\n    </svg>\n  );\n\n  const XIcon = () => (\n    <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n      <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\" />\n      <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\" />\n    </svg>\n  );\n\n  const overlayContent = (\n    <div className=\"fixed inset-0 z-[999999] pointer-events-none\">\n      {/* Top Mask */}\n      <div\n        style={{ height: coords.top, ...maskStyle }}\n        className=\"onboard-overlay-mask top-0 left-0 w-full pointer-events-auto\"\n        onPointerDown={stopPropagation}\n        onMouseDown={stopPropagation}\n        onClick={stopPropagation}\n      />\n      {/* Bottom Mask */}\n      <div\n        style={{ top: coords.top + coords.height, height: `calc(100vh - ${coords.top + coords.height}px)`, ...maskStyle }}\n        className=\"onboard-overlay-mask left-0 w-full pointer-events-auto\"\n        onPointerDown={stopPropagation}\n        onMouseDown={stopPropagation}\n        onClick={stopPropagation}\n      />\n      {/* Left Mask */}\n      <div\n        style={{ top: coords.top, height: coords.height, width: coords.left, ...maskStyle }}\n        className=\"onboard-overlay-mask left-0 pointer-events-auto\"\n        onPointerDown={stopPropagation}\n        onMouseDown={stopPropagation}\n        onClick={stopPropagation}\n      />\n      {/* Right Mask */}\n      <div\n        style={{ \n          top: coords.top, \n          height: coords.height, \n          left: coords.left + coords.width, \n          width: `calc(100% - ${coords.left + coords.width}px)`, \n          ...maskStyle \n        }}\n        className=\"onboard-overlay-mask pointer-events-auto\"\n        onPointerDown={stopPropagation}\n        onMouseDown={stopPropagation}\n        onClick={stopPropagation}\n      />\n\n      {/* Tooltip */}\n      <div\n        ref={tooltipRef}\n        className=\"onboard-tooltip pointer-events-auto\"\n        onPointerDown={handlePointerDown}\n        style={{ \n          zIndex: 1000000, \n          ...config.style?.container,\n          top: position.top + dragOffset.y,\n          left: position.left + dragOffset.x,\n          transition: 'top 0.3s cubic-bezier(0.25, 0.1, 0.25, 1), left 0.3s cubic-bezier(0.25, 0.1, 0.25, 1)',\n          cursor: config.metadata.draggable ? 'grab' : 'auto',\n          touchAction: 'none' // Prevent scrolling on touch devices while dragging\n        }}\n        onMouseDown={stopPropagation}\n        onClick={stopPropagation}\n      >\n        <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'flex-start', marginBottom: '8px' }}>\n          <h3 style={{ margin: 0, fontWeight: 'bold', color: '#111827', fontSize: '18px', lineHeight: 1.2 }}>{currentStep.title}</h3>\n          <button \n            onClick={(e) => { e.stopPropagation(); finish(); }}\n            style={{ background: 'none', border: 'none', cursor: 'pointer', padding: '4px', color: '#9ca3af' }}\n          >\n            <XIcon />\n          </button>\n        </div>\n        <p style={{ margin: 0, color: '#4b5563', fontSize: '14px', marginBottom: '24px', lineHeight: 1.5 }}>\n          {currentStep.description}\n        </p>\n        \n        <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>\n          <button\n            onClick={(e) => { e.stopPropagation(); prevStep(); }}\n            disabled={isFirstStep}\n            className=\"onboard-button-ghost\"\n            style={{ \n              background: 'none', \n              border: 'none', \n              cursor: isFirstStep ? 'not-allowed' : 'pointer',\n              ...config.style?.prev \n            }}\n          >\n            <ChevronLeftIcon />\n            Prev\n          </button>\n          \n          {isLastStep ? (\n            <button\n              onClick={(e) => { e.stopPropagation(); finish(); }}\n              className=\"onboard-button-primary\"\n              style={{ border: 'none', cursor: 'pointer', ...config.style?.finish }}\n            >\n              Finish\n            </button>\n          ) : (\n            <button\n              onClick={(e) => { e.stopPropagation(); nextStep(); }}\n              className=\"onboard-button-primary\"\n              style={{ \n                border: 'none', \n                cursor: 'pointer',\n                ...(isFirstStep ? config.style?.start : {}),\n                ...(!isFirstStep ? config.style?.next : {})\n              }}\n            >\n              {isFirstStep && config.style?.start ? 'Start' : 'Next'}\n              {!(isFirstStep && config.style?.start) && <ChevronRightIcon />}\n            </button>\n          )}\n        </div>\n      </div>\n    </div>\n  );\n\n  return typeof document !== 'undefined' \n    ? createPortal(overlayContent, document.body) \n    : null;\n};\n"],"mappings":"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","names":["index_exports","__export","OnboardingProvider","useOnboarding","__toCommonJS","import_react","import_js_cookie","import_react","import_react_dom","import_jsx_runtime","OnboardingOverlay","config","currentStep","nextStep","prevStep","finish","isFirstStep","isLastStep","useOnboarding","coords","setCoords","position","setPosition","dragOffset","setDragOffset","isDragging","dragStart","tooltipRef","handlePointerDown","e","handlePointerMove","handlePointerUp","newX","newY","calculateBestPosition","rect","spaceAbove","spaceBelow","spaceLeft","spaceRight","top","left","updateCoords","element","padding","paddedRect","newCoords","newPosition","prev","observer","resizeObserver","maskStyle","stopPropagation","ChevronLeftIcon","ChevronRightIcon","XIcon","overlayContent","import_jsx_runtime","OnboardingContext","COOKIE_NAME","OnboardingProvider","config","ssr","children","isMounted","setIsMounted","state","setState","configRef","React","handleNavigation","link","isMatch","step","path","pattern","currentConfig","currentPath","matchedStepIndex","savedState","Cookies","parsed","prev","e","currentStep","isFirstStep","isLastStep","totalSteps","isLastMainStep","hasSubSteps","nextStep","currentActiveStep","element","nextSubIndex","nextSubStep","nextIndex","nextStepObj","prevStep","prevIndex","prevStepObj","prevSubStepIndex","finish","goToStep","stepIndex","subStepIndex","value","OnboardingOverlay","useOnboarding","context"]}
+{"version":3,"sources":["../src/index.ts","../src/components/OnboardingProvider.tsx","../src/components/OnboardingOverlay.tsx"],"sourcesContent":["'use client';\n\nimport './styles.css';\nexport * from './components/OnboardingProvider';\nexport * from './types';\n","'use client';\n\nimport React, {\n  createContext,\n  useContext,\n  useEffect,\n  useState,\n  useCallback,\n  useMemo,\n  useEffectEvent,\n} from 'react';\nimport Cookies from 'js-cookie';\nimport { OnboardingConfig, OnboardingState, OnboardingStep, OnboardingSubStep } from '../types';\nimport { OnboardingOverlay } from './OnboardingOverlay';\n\ninterface OnboardingContextType {\n  config: OnboardingConfig;\n  state: OnboardingState;\n  nextStep: () => void;\n  prevStep: () => void;\n  finish: () => void;\n  goToStep: (stepIndex: number, subStepIndex?: number | null) => void;\n  currentStep: OnboardingStep | OnboardingSubStep | null;\n  isFirstStep: boolean;\n  isLastStep: boolean;\n}\n\nconst OnboardingContext = createContext<OnboardingContextType | undefined>(undefined);\n\nconst COOKIE_NAME = 'onboarding_state';\n\nexport const OnboardingProvider: React.FC<{\n  config: OnboardingConfig;\n  ssr?: boolean;\n  onNavigate?: (url: string) => void;\n  children: React.ReactNode;\n}> = ({ config, ssr = false, onNavigate, children }) => {\n  const [isMounted, setIsMounted] = useState(!ssr);\n  const [state, setState] = useState<OnboardingState>({\n    currentStepIndex: 0,\n    currentSubStepIndex: null,\n    isActive: true,\n  });\n\n  const configRef = React.useRef(config);\n  useEffect(() => {\n    configRef.current = config;\n  }, [config]);\n\n  const onNavigateRef = React.useRef(onNavigate);\n  useEffect(() => {\n    onNavigateRef.current = onNavigate;\n  }, [onNavigate]);\n\n  const handleNavigation = useCallback(\n    (link?: string) => {\n      if (!link) return;\n\n      if (onNavigateRef.current) {\n        onNavigateRef.current(link);\n      } else if (config.metadata.nextRouter) {\n        window.location.href = link;\n      } else {\n        window.location.href = link;\n      }\n    },\n    [config.metadata.nextRouter],\n  );\n\n  useEffect(() => {\n    if (ssr) {\n      // eslint-disable-next-line react-hooks/set-state-in-effect\n      setIsMounted(true);\n    }\n  }, [ssr]);\n\n  const isMatch = (step: OnboardingStep, path: string) => {\n    if (step.urlMatch instanceof RegExp) return step.urlMatch.test(path);\n\n    if (typeof step.urlMatch === 'string' && step.urlMatch.includes('*')) {\n      const pattern = step.urlMatch.replace(/[.+?^${}()|[\\\\]/g, '\\\\$&').replace(/\\*/g, '.*');\n      return new RegExp(`^${pattern}$`).test(path);\n    }\n\n    return path === step.urlMatch;\n  };\n\n  const onRestoreState = useEffectEvent(() => {\n    const currentConfig = configRef.current;\n    const currentPath = window.location.pathname;\n    let matchedStepIndex = -1;\n\n    if ((currentConfig.metadata.inOrder as boolean | undefined) === false) {\n      matchedStepIndex = currentConfig.steps.findIndex((step) => isMatch(step, currentPath));\n    }\n\n    const savedState = Cookies.get(COOKIE_NAME);\n    if (savedState) {\n      try {\n        const parsed: OnboardingState = JSON.parse(savedState);\n\n        if ((currentConfig.metadata.inOrder as boolean | undefined) === false) {\n          if (matchedStepIndex !== -1) {\n            if (parsed.currentStepIndex === matchedStepIndex) {\n              setState(parsed);\n            } else {\n              setState({\n                currentStepIndex: matchedStepIndex,\n                currentSubStepIndex: null,\n                isActive: true,\n              });\n            }\n          } else {\n            setState({ ...parsed, isActive: false });\n          }\n        } else {\n          setState(parsed);\n\n          if ((currentConfig.metadata.inOrder as boolean | undefined) !== false) {\n            const step = currentConfig.steps[parsed.currentStepIndex];\n            if (step && parsed.isActive) {\n              let targetUrl: string | undefined;\n\n              if (parsed.currentStepIndex > 0) {\n                const prevStep = currentConfig.steps[parsed.currentStepIndex - 1];\n                if (prevStep.navigate) {\n                  targetUrl = prevStep.navigate;\n                }\n              }\n\n              if (!targetUrl && typeof step.urlMatch === 'string') {\n                targetUrl = step.urlMatch;\n              }\n\n              if (targetUrl && window.location.pathname !== targetUrl) {\n                handleNavigation(targetUrl);\n              }\n\n              if (currentConfig.metadata.simulateClicksOnNavigate) {\n                if (parsed.currentSubStepIndex !== null && step.click) {\n                  setTimeout(() => {\n                    const element = document.querySelector(\n                      `[data-onboarding-id=\"${step.attribute}\"]`,\n                    ) as HTMLElement;\n                    if (element) {\n                      element.click();\n                    }\n                  }, 500);\n                }\n              }\n            }\n          }\n        }\n      } catch (e) {\n        console.error('Failed to parse onboarding state from cookie', e);\n        if (matchedStepIndex !== -1) {\n          setState({\n            currentStepIndex: matchedStepIndex,\n            currentSubStepIndex: null,\n            isActive: true,\n          });\n        }\n      }\n    } else if (matchedStepIndex !== -1) {\n      setState({\n        currentStepIndex: matchedStepIndex,\n        currentSubStepIndex: null,\n        isActive: true,\n      });\n    } else if ((currentConfig.metadata.inOrder as boolean | undefined) === false) {\n      setState((prev) => ({ ...prev, isActive: false }));\n    } else {\n      const step = currentConfig.steps[0];\n      if (step && typeof step.urlMatch === 'string' && window.location.pathname !== step.urlMatch) {\n        handleNavigation(step.urlMatch);\n      }\n    }\n  });\n\n  useEffect(() => {\n    onRestoreState();\n  }, []);\n\n  useEffect(() => {\n    if (isMounted) {\n      Cookies.set(COOKIE_NAME, JSON.stringify(state), { expires: 365 });\n    }\n  }, [state, isMounted]);\n\n  const currentStep = useMemo(() => {\n    const step = config.steps[state.currentStepIndex];\n    if (!step) return null;\n    if (state.currentSubStepIndex !== null && step.subSteps) {\n      return step.subSteps[state.currentSubStepIndex] || step;\n    }\n    return step;\n  }, [config.steps, state.currentStepIndex, state.currentSubStepIndex]);\n\n  const isFirstStep = state.currentStepIndex === 0 && state.currentSubStepIndex === null;\n  const isLastStep = useMemo(() => {\n    const totalSteps = config.steps.length;\n    const isLastMainStep = state.currentStepIndex === totalSteps - 1;\n    const step = config.steps[state.currentStepIndex];\n    const hasSubSteps = step?.subSteps && step.subSteps.length > 0;\n\n    if (isLastMainStep) {\n      if (hasSubSteps) {\n        return state.currentSubStepIndex === step.subSteps!.length - 1;\n      }\n      return true;\n    }\n    return false;\n  }, [config.steps, state.currentStepIndex, state.currentSubStepIndex]);\n\n  const nextStep = useCallback(() => {\n    const currentConfig = configRef.current;\n    const stepObj = currentConfig.steps[state.currentStepIndex];\n    const currentActiveStep =\n      state.currentSubStepIndex !== null && stepObj.subSteps\n        ? stepObj.subSteps[state.currentSubStepIndex]\n        : stepObj;\n\n    if (currentActiveStep.click) {\n      const element = document.querySelector(\n        `[data-onboarding-id=\"${currentActiveStep.attribute}\"]`,\n      ) as HTMLElement;\n      if (element) {\n        element.click();\n      }\n    }\n\n    if (\n      stepObj.subSteps &&\n      (state.currentSubStepIndex === null ||\n        state.currentSubStepIndex < stepObj.subSteps.length - 1)\n    ) {\n      const nextSubIndex = state.currentSubStepIndex === null ? 0 : state.currentSubStepIndex + 1;\n      const nextSubStep = stepObj.subSteps[nextSubIndex];\n      setState((prev) => ({ ...prev, currentSubStepIndex: nextSubIndex }));\n\n      if (nextSubStep.navigate) handleNavigation(nextSubStep.navigate);\n      return;\n    }\n\n    if (state.currentStepIndex < currentConfig.steps.length - 1) {\n      const nextIndex = state.currentStepIndex + 1;\n      const nextStepObj = currentConfig.steps[nextIndex];\n      setState({\n        currentStepIndex: nextIndex,\n        currentSubStepIndex: null,\n        isActive: true,\n      });\n\n      if (nextStepObj.navigate) handleNavigation(nextStepObj.navigate);\n    } else {\n      setState((prev) => ({ ...prev, isActive: false }));\n      if (currentConfig.onOnboardingComplete) {\n        currentConfig.onOnboardingComplete();\n      }\n    }\n  }, [state.currentStepIndex, state.currentSubStepIndex, handleNavigation]);\n\n  const prevStep = useCallback(() => {\n    const currentConfig = configRef.current;\n\n    if (state.currentSubStepIndex !== null && state.currentSubStepIndex > 0) {\n      setState((prev) => ({ ...prev, currentSubStepIndex: prev.currentSubStepIndex! - 1 }));\n      return;\n    }\n\n    if (state.currentStepIndex > 0 && state.currentSubStepIndex === 0) {\n      setState((prev) => ({ ...prev, currentSubStepIndex: null }));\n      return;\n    }\n\n    if (state.currentStepIndex > 0) {\n      const prevIndex = state.currentStepIndex - 1;\n      const prevStepObj = currentConfig.steps[prevIndex];\n      const prevSubStepIndex = prevStepObj.subSteps ? prevStepObj.subSteps.length - 1 : null;\n\n      setState({\n        currentStepIndex: prevIndex,\n        currentSubStepIndex: prevSubStepIndex,\n        isActive: true,\n      });\n    }\n  }, [state.currentStepIndex, state.currentSubStepIndex]);\n\n  const finish = useCallback(() => {\n    setState((prev) => ({ ...prev, isActive: false }));\n    if (configRef.current.onOnboardingComplete) {\n      configRef.current.onOnboardingComplete();\n    }\n  }, []);\n\n  const goToStep = useCallback((stepIndex: number, subStepIndex: number | null = null) => {\n    setState({\n      currentStepIndex: stepIndex,\n      currentSubStepIndex: subStepIndex,\n      isActive: true,\n    });\n  }, []);\n\n  const value = {\n    config,\n    state,\n    nextStep,\n    prevStep,\n    finish,\n    goToStep,\n    currentStep,\n    isFirstStep,\n    isLastStep,\n  };\n\n  if (!isMounted) return <>{children}</>;\n\n  return (\n    <OnboardingContext.Provider value={value}>\n      {children}\n      {state.isActive && <OnboardingOverlay />}\n    </OnboardingContext.Provider>\n  );\n};\n\nexport const useOnboarding = () => {\n  const context = useContext(OnboardingContext);\n  if (context === undefined) {\n    throw new Error('useOnboarding must be used within an OnboardingProvider');\n  }\n  return context;\n};\n","'use client';\n\nimport React, { useState, useEffect, useCallback, useRef } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useOnboarding } from './OnboardingProvider';\n\nexport const OnboardingOverlay: React.FC = () => {\n  const { config, currentStep, nextStep, prevStep, finish, isFirstStep, isLastStep } =\n    useOnboarding();\n  const [coords, setCoords] = useState<{\n    top: number;\n    left: number;\n    width: number;\n    height: number;\n  } | null>(null);\n  const [position, setPosition] = useState<{ top: number; left: number }>({ top: 0, left: 0 });\n  const [dragOffset, setDragOffset] = useState<{ x: number; y: number }>({ x: 0, y: 0 });\n  const isDragging = useRef(false);\n  const dragStart = useRef<{ x: number; y: number }>({ x: 0, y: 0 });\n  const tooltipRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    setDragOffset({ x: 0, y: 0 });\n  }, [currentStep]);\n\n  const handlePointerMove = useCallback((e: PointerEvent) => {\n    if (!isDragging.current) return;\n\n    const newX = e.clientX - dragStart.current.x;\n    const newY = e.clientY - dragStart.current.y;\n\n    setDragOffset({ x: newX, y: newY });\n  }, []);\n\n  const handlePointerUp = useCallback(() => {\n    isDragging.current = false;\n\n    if (tooltipRef.current) {\n      tooltipRef.current.style.transition =\n        'top 0.3s cubic-bezier(0.25, 0.1, 0.25, 1), left 0.3s cubic-bezier(0.25, 0.1, 0.25, 1)';\n      tooltipRef.current.style.cursor = config.metadata.draggable ? 'grab' : 'auto';\n    }\n\n    window.removeEventListener('pointermove', handlePointerMove);\n    // eslint-disable-next-line react-hooks/immutability\n    window.removeEventListener('pointerup', handlePointerUp);\n  }, [config.metadata.draggable, handlePointerMove]);\n\n  const handlePointerDown = (e: React.PointerEvent) => {\n    if (!config.metadata.draggable) return;\n    e.stopPropagation();\n    e.preventDefault();\n    isDragging.current = true;\n    dragStart.current = { x: e.clientX - dragOffset.x, y: e.clientY - dragOffset.y };\n\n    if (tooltipRef.current) {\n      tooltipRef.current.style.transition = 'none';\n      tooltipRef.current.style.cursor = 'grabbing';\n    }\n\n    window.addEventListener('pointermove', handlePointerMove);\n    window.addEventListener('pointerup', handlePointerUp);\n  };\n\n  useEffect(() => {\n    return () => {\n      window.removeEventListener('pointermove', handlePointerMove);\n      window.removeEventListener('pointerup', handlePointerUp);\n    };\n  }, [handlePointerMove, handlePointerUp]);\n\n  const calculateBestPosition = useCallback(\n    (rect: {\n      top: number;\n      bottom: number;\n      left: number;\n      right: number;\n      width: number;\n      height: number;\n    }) => {\n      const tooltipWidth = 300;\n      const tooltipHeight = 200;\n      const gap = 12;\n      const padding = 20;\n\n      const spaceAbove = rect.top;\n      const spaceBelow = window.innerHeight - rect.bottom;\n      const spaceLeft = rect.left;\n      const spaceRight = window.innerWidth - rect.right;\n\n      let top = 0;\n      let left = 0;\n\n      if (spaceBelow > tooltipHeight + gap + padding) {\n        top = rect.bottom + gap;\n        left = Math.max(\n          padding,\n          Math.min(\n            window.innerWidth - tooltipWidth - padding,\n            rect.left + rect.width / 2 - tooltipWidth / 2,\n          ),\n        );\n      } else if (spaceAbove > tooltipHeight + gap + padding) {\n        top = rect.top - tooltipHeight - gap;\n        left = Math.max(\n          padding,\n          Math.min(\n            window.innerWidth - tooltipWidth - padding,\n            rect.left + rect.width / 2 - tooltipWidth / 2,\n          ),\n        );\n      } else if (spaceRight > tooltipWidth + gap + padding) {\n        top = Math.max(\n          padding,\n          Math.min(\n            window.innerHeight - tooltipHeight - padding,\n            rect.top + rect.height / 2 - tooltipHeight / 2,\n          ),\n        );\n        left = rect.right + gap;\n      } else if (spaceLeft > tooltipWidth + gap + padding) {\n        top = Math.max(\n          padding,\n          Math.min(\n            window.innerHeight - tooltipHeight - padding,\n            rect.top + rect.height / 2 - tooltipHeight / 2,\n          ),\n        );\n        left = rect.left - tooltipWidth - gap;\n      } else {\n        top = window.innerHeight / 2 - tooltipHeight / 2;\n        left = window.innerWidth / 2 - tooltipWidth / 2;\n      }\n\n      return { top: top + window.scrollY, left: left + window.scrollX };\n    },\n    [],\n  );\n\n  const updateCoords = useCallback(() => {\n    if (!currentStep) return;\n\n    const element = document.querySelector(\n      `[data-onboarding-id=\"${currentStep.attribute}\"]`,\n    ) as HTMLElement;\n    if (element) {\n      const rect = element.getBoundingClientRect();\n      const padding = config.style?.padding || 0;\n\n      const paddedRect = {\n        top: rect.top - padding,\n        bottom: rect.bottom + padding,\n        left: rect.left - padding,\n        right: rect.right + padding,\n        width: rect.width + padding * 2,\n        height: rect.height + padding * 2,\n      };\n\n      const newCoords = {\n        top: paddedRect.top + window.scrollY,\n        left: paddedRect.left + window.scrollX,\n        width: paddedRect.width,\n        height: paddedRect.height,\n      };\n\n      const newPosition = calculateBestPosition(paddedRect);\n\n      setCoords((prev) => {\n        if (\n          prev &&\n          prev.top === newCoords.top &&\n          prev.left === newCoords.left &&\n          prev.width === newCoords.width &&\n          prev.height === newCoords.height\n        ) {\n          return prev;\n        }\n        return newCoords;\n      });\n\n      setPosition((prev) => {\n        if (prev.top === newPosition.top && prev.left === newPosition.left) {\n          return prev;\n        }\n        return newPosition;\n      });\n    } else {\n      setCoords(null);\n    }\n  }, [currentStep, calculateBestPosition, config.style]);\n\n  useEffect(() => {\n    updateCoords();\n    window.addEventListener('resize', updateCoords);\n    window.addEventListener('scroll', updateCoords);\n\n    const observer = new MutationObserver(updateCoords);\n    observer.observe(document.body, { childList: true, subtree: true, attributes: true });\n\n    let resizeObserver: ResizeObserver | null = null;\n    if (typeof ResizeObserver !== 'undefined') {\n      resizeObserver = new ResizeObserver(updateCoords);\n      resizeObserver.observe(document.body);\n\n      const element = currentStep?.attribute\n        ? document.querySelector(`[data-onboarding-id=\"${currentStep.attribute}\"]`)\n        : null;\n      if (element) {\n        resizeObserver.observe(element);\n      }\n    }\n\n    return () => {\n      window.removeEventListener('resize', updateCoords);\n      window.removeEventListener('scroll', updateCoords);\n      observer.disconnect();\n      if (resizeObserver) resizeObserver.disconnect();\n    };\n  }, [updateCoords, currentStep?.attribute]);\n\n  if (!currentStep || !coords) return null;\n\n  const maskStyle = {\n    ...config.style?.background,\n    transition: 'all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1)',\n  };\n\n  const stopPropagation = (e: React.PointerEvent | React.MouseEvent) => {\n    e.stopPropagation();\n  };\n\n  const ChevronLeftIcon = () => (\n    <svg\n      width=\"16\"\n      height=\"16\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    >\n      <path d=\"M15 18l-6-6 6-6\" />\n    </svg>\n  );\n\n  const ChevronRightIcon = () => (\n    <svg\n      width=\"16\"\n      height=\"16\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    >\n      <path d=\"M9 18l6-6-6-6\" />\n    </svg>\n  );\n\n  const XIcon = () => (\n    <svg\n      width=\"18\"\n      height=\"18\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    >\n      <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\" />\n      <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\" />\n    </svg>\n  );\n\n  const overlayContent = (\n    <div className=\"onboard-overlay-container\">\n      <div\n        style={{ height: coords.top, ...maskStyle }}\n        className=\"onboard-overlay-mask onboard-mask-top\"\n        onPointerDown={stopPropagation}\n        onMouseDown={stopPropagation}\n        onClick={stopPropagation}\n      />\n      <div\n        style={{\n          top: coords.top + coords.height,\n          height: `calc(100vh - ${coords.top + coords.height}px)`,\n          ...maskStyle,\n        }}\n        className=\"onboard-overlay-mask onboard-mask-bottom\"\n        onPointerDown={stopPropagation}\n        onMouseDown={stopPropagation}\n        onClick={stopPropagation}\n      />\n      <div\n        style={{ top: coords.top, height: coords.height, width: coords.left, ...maskStyle }}\n        className=\"onboard-overlay-mask onboard-mask-left\"\n        onPointerDown={stopPropagation}\n        onMouseDown={stopPropagation}\n        onClick={stopPropagation}\n      />\n      <div\n        style={{\n          top: coords.top,\n          height: coords.height,\n          left: coords.left + coords.width,\n          width: `calc(100% - ${coords.left + coords.width}px)`,\n          ...maskStyle,\n        }}\n        className=\"onboard-overlay-mask\"\n        onPointerDown={stopPropagation}\n        onMouseDown={stopPropagation}\n        onClick={stopPropagation}\n      />\n\n      <div\n        ref={tooltipRef}\n        className=\"onboard-tooltip\"\n        onPointerDown={handlePointerDown}\n        style={{\n          zIndex: 1000000,\n          ...config.style?.container,\n          top: position.top + dragOffset.y,\n          left: position.left + dragOffset.x,\n          transition:\n            'top 0.3s cubic-bezier(0.25, 0.1, 0.25, 1), left 0.3s cubic-bezier(0.25, 0.1, 0.25, 1)',\n          cursor: config.metadata.draggable ? 'grab' : 'auto',\n          touchAction: 'none',\n        }}\n        onMouseDown={stopPropagation}\n        onClick={stopPropagation}\n      >\n        <div className=\"onboard-tooltip-header\">\n          <h3 className=\"onboard-tooltip-title\">{currentStep.title}</h3>\n          <button\n            onClick={(e) => {\n              e.stopPropagation();\n              finish();\n            }}\n            className=\"onboard-close-button\"\n          >\n            <XIcon />\n          </button>\n        </div>\n        <p className=\"onboard-tooltip-description\">{currentStep.description}</p>\n\n        <div className=\"onboard-tooltip-footer\">\n          <button\n            onClick={(e) => {\n              e.stopPropagation();\n              prevStep();\n            }}\n            disabled={isFirstStep}\n            className=\"onboard-button-ghost\"\n            style={{\n              background: 'none',\n              border: 'none',\n              cursor: isFirstStep ? 'not-allowed' : 'pointer',\n              ...config.style?.prev,\n            }}\n          >\n            <ChevronLeftIcon />\n            Prev\n          </button>\n\n          {isLastStep ? (\n            <button\n              onClick={(e) => {\n                e.stopPropagation();\n                finish();\n              }}\n              className=\"onboard-button-primary\"\n              style={{ border: 'none', cursor: 'pointer', ...config.style?.finish }}\n            >\n              Finish\n            </button>\n          ) : (\n            <button\n              onClick={(e) => {\n                e.stopPropagation();\n                nextStep();\n              }}\n              className=\"onboard-button-primary\"\n              style={{\n                border: 'none',\n                cursor: 'pointer',\n                ...(isFirstStep ? config.style?.start : {}),\n                ...(!isFirstStep ? config.style?.next : {}),\n              }}\n            >\n              {isFirstStep && config.style?.start ? 'Start' : 'Next'}\n              {!(isFirstStep && config.style?.start) && <ChevronRightIcon />}\n            </button>\n          )}\n        </div>\n      </div>\n    </div>\n  );\n\n  return typeof document !== 'undefined' ? createPortal(overlayContent, document.body) : null;\n};\n"],"mappings":"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","names":["index_exports","__export","OnboardingProvider","useOnboarding","__toCommonJS","import_react","import_js_cookie","import_react","import_react_dom","import_jsx_runtime","OnboardingOverlay","config","currentStep","nextStep","prevStep","finish","isFirstStep","isLastStep","useOnboarding","coords","setCoords","position","setPosition","dragOffset","setDragOffset","isDragging","dragStart","tooltipRef","handlePointerMove","e","newX","newY","handlePointerUp","handlePointerDown","calculateBestPosition","rect","spaceAbove","spaceBelow","spaceLeft","spaceRight","top","left","updateCoords","element","padding","paddedRect","newCoords","newPosition","prev","observer","resizeObserver","maskStyle","stopPropagation","ChevronLeftIcon","ChevronRightIcon","XIcon","overlayContent","import_jsx_runtime","OnboardingContext","COOKIE_NAME","OnboardingProvider","config","ssr","onNavigate","children","isMounted","setIsMounted","state","setState","configRef","React","onNavigateRef","handleNavigation","link","isMatch","step","path","pattern","onRestoreState","currentConfig","currentPath","matchedStepIndex","savedState","Cookies","parsed","targetUrl","prevStep","element","e","prev","currentStep","isFirstStep","isLastStep","totalSteps","isLastMainStep","hasSubSteps","nextStep","stepObj","currentActiveStep","nextSubIndex","nextSubStep","nextIndex","nextStepObj","prevIndex","prevStepObj","prevSubStepIndex","finish","goToStep","stepIndex","subStepIndex","value","OnboardingOverlay","useOnboarding","context"]}

package/dist/index.mjs

@@ -1,3 +1,3 @@
 "use client";
-"use client";import et,{createContext as nt,useContext as ot,useEffect as W,useState as j,useCallback as L,useMemo as Y}from"react";import q from"js-cookie";import{useState as $,useEffect as B,useCallback as A,useRef as F}from"react";import{createPortal as tt}from"react-dom";import{jsx as l,jsxs as m}from"react/jsx-runtime";var T=()=>{let{config:i,currentStep:p,nextStep:E,prevStep:C,finish:R,isFirstStep:e,isLastStep:u}=X(),[s,h]=$(null),[z,D]=$({top:0,left:0}),[v,H]=$({x:0,y:0}),k=F(!1),M=F({x:0,y:0}),S=F(null);B(()=>{H({x:0,y:0})},[p]);let N=o=>{i.metadata.draggable&&(o.stopPropagation(),o.preventDefault(),k.current=!0,M.current={x:o.clientX-v.x,y:o.clientY-v.y},S.current&&(S.current.style.transition="none",S.current.style.cursor="grabbing"),window.addEventListener("pointermove",x),window.addEventListener("pointerup",t))},x=A(o=>{if(!k.current)return;let c=o.clientX-M.current.x,g=o.clientY-M.current.y;H({x:c,y:g})},[]),t=A(()=>{k.current=!1,S.current&&(S.current.style.transition="top 0.3s cubic-bezier(0.25, 0.1, 0.25, 1), left 0.3s cubic-bezier(0.25, 0.1, 0.25, 1)",S.current.style.cursor=i.metadata.draggable?"grab":"auto"),window.removeEventListener("pointermove",x),window.removeEventListener("pointerup",t)},[i.metadata.draggable,x]);B(()=>()=>{window.removeEventListener("pointermove",x),window.removeEventListener("pointerup",t)},[x,t]);let d=A(o=>{let P=o.top,f=window.innerHeight-o.bottom,V=o.left,Z=window.innerWidth-o.right,I=0,O=0;return f>232?(I=o.bottom+12,O=Math.max(20,Math.min(window.innerWidth-300-20,o.left+o.width/2-300/2))):P>232?(I=o.top-200-12,O=Math.max(20,Math.min(window.innerWidth-300-20,o.left+o.width/2-300/2))):Z>332?(I=Math.max(20,Math.min(window.innerHeight-200-20,o.top+o.height/2-200/2)),O=o.right+12):V>332?(I=Math.max(20,Math.min(window.innerHeight-200-20,o.top+o.height/2-200/2)),O=o.left-300-12):(I=window.innerHeight/2-200/2,O=window.innerWidth/2-300/2),{top:I+window.scrollY,left:O+window.scrollX}},[]),r=A(()=>{if(!p)return;let o=document.querySelector(`[data-onboarding-id="${p.attribute}"]`);if(o){let c=o.getBoundingClientRect(),g=i.style?.padding||0,w={top:c.top-g,bottom:c.bottom+g,left:c.left-g,right:c.right+g,width:c.width+g*2,height:c.height+g*2},y={top:w.top+window.scrollY,left:w.left+window.scrollX,width:w.width,height:w.height},P=d(w);h(f=>f&&f.top===y.top&&f.left===y.left&&f.width===y.width&&f.height===y.height?f:y),D(f=>f.top===P.top&&f.left===P.left?f:P)}else h(null)},[p,d,i.style]);if(B(()=>{r(),window.addEventListener("resize",r),window.addEventListener("scroll",r);let o=new MutationObserver(r);o.observe(document.body,{childList:!0,subtree:!0,attributes:!0});let c=null;if(typeof ResizeObserver<"u"){c=new ResizeObserver(r),c.observe(document.body);let g=p?.attribute?document.querySelector(`[data-onboarding-id="${p.attribute}"]`):null;g&&c.observe(g)}return()=>{window.removeEventListener("resize",r),window.removeEventListener("scroll",r),o.disconnect(),c&&c.disconnect()}},[r,p?.attribute]),!p||!s)return null;let a={...i.style?.background,transition:"all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1)"},n=o=>{o.stopPropagation()},b=()=>l("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:l("path",{d:"M15 18l-6-6 6-6"})}),U=()=>l("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:l("path",{d:"M9 18l6-6-6-6"})}),G=()=>m("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[l("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),l("line",{x1:"6",y1:"6",x2:"18",y2:"18"})]}),Q=m("div",{className:"fixed inset-0 z-[999999] pointer-events-none",children:[l("div",{style:{height:s.top,...a},className:"onboard-overlay-mask top-0 left-0 w-full pointer-events-auto",onPointerDown:n,onMouseDown:n,onClick:n}),l("div",{style:{top:s.top+s.height,height:`calc(100vh - ${s.top+s.height}px)`,...a},className:"onboard-overlay-mask left-0 w-full pointer-events-auto",onPointerDown:n,onMouseDown:n,onClick:n}),l("div",{style:{top:s.top,height:s.height,width:s.left,...a},className:"onboard-overlay-mask left-0 pointer-events-auto",onPointerDown:n,onMouseDown:n,onClick:n}),l("div",{style:{top:s.top,height:s.height,left:s.left+s.width,width:`calc(100% - ${s.left+s.width}px)`,...a},className:"onboard-overlay-mask pointer-events-auto",onPointerDown:n,onMouseDown:n,onClick:n}),m("div",{ref:S,className:"onboard-tooltip pointer-events-auto",onPointerDown:N,style:{zIndex:1e6,...i.style?.container,top:z.top+v.y,left:z.left+v.x,transition:"top 0.3s cubic-bezier(0.25, 0.1, 0.25, 1), left 0.3s cubic-bezier(0.25, 0.1, 0.25, 1)",cursor:i.metadata.draggable?"grab":"auto",touchAction:"none"},onMouseDown:n,onClick:n,children:[m("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"flex-start",marginBottom:"8px"},children:[l("h3",{style:{margin:0,fontWeight:"bold",color:"#111827",fontSize:"18px",lineHeight:1.2},children:p.title}),l("button",{onClick:o=>{o.stopPropagation(),R()},style:{background:"none",border:"none",cursor:"pointer",padding:"4px",color:"#9ca3af"},children:l(G,{})})]}),l("p",{style:{margin:0,color:"#4b5563",fontSize:"14px",marginBottom:"24px",lineHeight:1.5},children:p.description}),m("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between"},children:[m("button",{onClick:o=>{o.stopPropagation(),C()},disabled:e,className:"onboard-button-ghost",style:{background:"none",border:"none",cursor:e?"not-allowed":"pointer",...i.style?.prev},children:[l(b,{}),"Prev"]}),u?l("button",{onClick:o=>{o.stopPropagation(),R()},className:"onboard-button-primary",style:{border:"none",cursor:"pointer",...i.style?.finish},children:"Finish"}):m("button",{onClick:o=>{o.stopPropagation(),E()},className:"onboard-button-primary",style:{border:"none",cursor:"pointer",...e?i.style?.start:{},...e?{}:i.style?.next},children:[e&&i.style?.start?"Start":"Next",!(e&&i.style?.start)&&l(U,{})]})]})]})]});return typeof document<"u"?tt(Q,document.body):null};import{Fragment as rt,jsx as _,jsxs as it}from"react/jsx-runtime";var K=nt(void 0),J="onboarding_state",St=({config:i,ssr:p=!1,children:E})=>{let[C,R]=j(!p),[e,u]=j({currentStepIndex:0,currentSubStepIndex:null,isActive:!0}),s=et.useRef(i);W(()=>{s.current=i},[i]);let h=L(t=>{t&&(s.current.metadata.nextRouter,window.location.href=t)},[]);W(()=>{p&&R(!0)},[p]);let z=(t,d)=>{if(t.urlMatch instanceof RegExp)return t.urlMatch.test(d);if(typeof t.urlMatch=="string"&&t.urlMatch.includes("*")){let r=t.urlMatch.replace(/[.+?^${}()|[\]\\]/g,"\\$&").replace(/\*/g,".*");return new RegExp(`^${r}$`).test(d)}return d===t.urlMatch};W(()=>{let t=s.current,d=window.location.pathname,r=-1;t.metadata.inOrder===!1&&(r=t.steps.findIndex(n=>z(n,d)));let a=q.get(J);if(a)try{let n=JSON.parse(a);if(t.metadata.inOrder===!1)r!==-1?n.currentStepIndex===r?u(n):u(b=>({...b,currentStepIndex:r,currentSubStepIndex:null,isActive:!0})):u(b=>({...n,isActive:!1}));else if(u(n),t.metadata.inOrder!==!1){let b=t.steps[n.currentStepIndex];b&&n.isActive&&typeof b.urlMatch=="string"&&window.location.pathname!==b.urlMatch&&h(b.urlMatch)}}catch(n){console.error("Failed to parse onboarding state from cookie",n),r!==-1&&u(b=>({...b,currentStepIndex:r,currentSubStepIndex:null,isActive:!0}))}else if(r!==-1)u(n=>({...n,currentStepIndex:r,currentSubStepIndex:null,isActive:!0}));else if(t.metadata.inOrder===!1)u(n=>({...n,isActive:!1}));else{let n=t.steps[0];n&&typeof n.urlMatch=="string"&&window.location.pathname!==n.urlMatch&&h(n.urlMatch)}},[h]),W(()=>{C&&q.set(J,JSON.stringify(e),{expires:365})},[e,C]);let D=Y(()=>{let t=i.steps[e.currentStepIndex];return t?e.currentSubStepIndex!==null&&t.subSteps&&t.subSteps[e.currentSubStepIndex]||t:null},[i.steps,e.currentStepIndex,e.currentSubStepIndex]),v=e.currentStepIndex===0&&e.currentSubStepIndex===null,H=Y(()=>{let t=i.steps.length,d=e.currentStepIndex===t-1,r=i.steps[e.currentStepIndex],a=r?.subSteps&&r.subSteps.length>0;return d?a?e.currentSubStepIndex===r.subSteps.length-1:!0:!1},[i.steps,e.currentStepIndex,e.currentSubStepIndex]),k=L(()=>{let t=s.current,d=t.steps[e.currentStepIndex],r=e.currentSubStepIndex!==null&&d.subSteps?d.subSteps[e.currentSubStepIndex]:d;if(r.click){let a=document.querySelector(`[data-onboarding-id="${r.attribute}"]`);a&&a.click()}if(d.subSteps&&(e.currentSubStepIndex===null||e.currentSubStepIndex<d.subSteps.length-1)){let a=e.currentSubStepIndex===null?0:e.currentSubStepIndex+1,n=d.subSteps[a];u(b=>({...b,currentSubStepIndex:a})),n.navigate&&h(n.navigate);return}if(e.currentStepIndex<t.steps.length-1){let a=e.currentStepIndex+1,n=t.steps[a];u({currentStepIndex:a,currentSubStepIndex:null,isActive:!0}),n.navigate&&h(n.navigate)}else u(a=>({...a,isActive:!1})),t.onOnboardingComplete&&t.onOnboardingComplete()},[e.currentStepIndex,e.currentSubStepIndex,h]),M=L(()=>{let t=s.current,d=t.steps[e.currentStepIndex];if(e.currentSubStepIndex!==null&&e.currentSubStepIndex>0){u(r=>({...r,currentSubStepIndex:r.currentSubStepIndex-1}));return}if(e.currentSubStepIndex===0){u(r=>({...r,currentSubStepIndex:null}));return}if(e.currentStepIndex>0){let r=e.currentStepIndex-1,a=t.steps[r],n=a.subSteps?a.subSteps.length-1:null;u({currentStepIndex:r,currentSubStepIndex:n,isActive:!0})}},[e.currentStepIndex,e.currentSubStepIndex]),S=L(()=>{u(t=>({...t,isActive:!1})),s.current.onOnboardingComplete&&s.current.onOnboardingComplete()},[]),N=L((t,d=null)=>{u({currentStepIndex:t,currentSubStepIndex:d,isActive:!0})},[]),x={config:i,state:e,nextStep:k,prevStep:M,finish:S,goToStep:N,currentStep:D,isFirstStep:v,isLastStep:H};return C?it(K.Provider,{value:x,children:[E,e.isActive&&_(T,{})]}):_(rt,{children:E})},X=()=>{let i=ot(K);if(i===void 0)throw new Error("useOnboarding must be used within an OnboardingProvider");return i};export{St as OnboardingProvider,X as useOnboarding};
+"use client";import J,{createContext as nt,useContext as ot,useEffect as A,useState as U,useCallback as H,useMemo as _,useEffectEvent as rt}from"react";import K from"js-cookie";import{useState as F,useEffect as B,useCallback as T,useRef as X}from"react";import{createPortal as et}from"react-dom";import{jsx as u,jsxs as w}from"react/jsx-runtime";var Y=()=>{let{config:i,currentStep:c,nextStep:L,prevStep:W,finish:y,isFirstStep:m,isLastStep:o}=q(),[r,f]=F(null),[I,x]=F({top:0,left:0}),[O,D]=F({x:0,y:0}),R=X(!1),z=X({x:0,y:0}),h=X(null);B(()=>{D({x:0,y:0})},[c]);let v=T(t=>{if(!R.current)return;let d=t.clientX-z.current.x,p=t.clientY-z.current.y;D({x:d,y:p})},[]),k=T(()=>{R.current=!1,h.current&&(h.current.style.transition="top 0.3s cubic-bezier(0.25, 0.1, 0.25, 1), left 0.3s cubic-bezier(0.25, 0.1, 0.25, 1)",h.current.style.cursor=i.metadata.draggable?"grab":"auto"),window.removeEventListener("pointermove",v),window.removeEventListener("pointerup",k)},[i.metadata.draggable,v]),j=t=>{i.metadata.draggable&&(t.stopPropagation(),t.preventDefault(),R.current=!0,z.current={x:t.clientX-O.x,y:t.clientY-O.y},h.current&&(h.current.style.transition="none",h.current.style.cursor="grabbing"),window.addEventListener("pointermove",v),window.addEventListener("pointerup",k))};B(()=>()=>{window.removeEventListener("pointermove",v),window.removeEventListener("pointerup",k)},[v,k]);let $=T(t=>{let N=t.top,b=window.innerHeight-t.bottom,Z=t.left,tt=window.innerWidth-t.right,P=0,E=0;return b>232?(P=t.bottom+12,E=Math.max(20,Math.min(window.innerWidth-300-20,t.left+t.width/2-300/2))):N>232?(P=t.top-200-12,E=Math.max(20,Math.min(window.innerWidth-300-20,t.left+t.width/2-300/2))):tt>332?(P=Math.max(20,Math.min(window.innerHeight-200-20,t.top+t.height/2-200/2)),E=t.right+12):Z>332?(P=Math.max(20,Math.min(window.innerHeight-200-20,t.top+t.height/2-200/2)),E=t.left-300-12):(P=window.innerHeight/2-200/2,E=window.innerWidth/2-300/2),{top:P+window.scrollY,left:E+window.scrollX}},[]),g=T(()=>{if(!c)return;let t=document.querySelector(`[data-onboarding-id="${c.attribute}"]`);if(t){let d=t.getBoundingClientRect(),p=i.style?.padding||0,C={top:d.top-p,bottom:d.bottom+p,left:d.left-p,right:d.right+p,width:d.width+p*2,height:d.height+p*2},M={top:C.top+window.scrollY,left:C.left+window.scrollX,width:C.width,height:C.height},N=$(C);f(b=>b&&b.top===M.top&&b.left===M.left&&b.width===M.width&&b.height===M.height?b:M),x(b=>b.top===N.top&&b.left===N.left?b:N)}else f(null)},[c,$,i.style]);if(B(()=>{g(),window.addEventListener("resize",g),window.addEventListener("scroll",g);let t=new MutationObserver(g);t.observe(document.body,{childList:!0,subtree:!0,attributes:!0});let d=null;if(typeof ResizeObserver<"u"){d=new ResizeObserver(g),d.observe(document.body);let p=c?.attribute?document.querySelector(`[data-onboarding-id="${c.attribute}"]`):null;p&&d.observe(p)}return()=>{window.removeEventListener("resize",g),window.removeEventListener("scroll",g),t.disconnect(),d&&d.disconnect()}},[g,c?.attribute]),!c||!r)return null;let e={...i.style?.background,transition:"all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1)"},n=t=>{t.stopPropagation()},a=()=>u("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:u("path",{d:"M15 18l-6-6 6-6"})}),l=()=>u("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:u("path",{d:"M9 18l6-6-6-6"})}),s=()=>w("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[u("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),u("line",{x1:"6",y1:"6",x2:"18",y2:"18"})]}),S=w("div",{className:"onboard-overlay-container",children:[u("div",{style:{height:r.top,...e},className:"onboard-overlay-mask onboard-mask-top",onPointerDown:n,onMouseDown:n,onClick:n}),u("div",{style:{top:r.top+r.height,height:`calc(100vh - ${r.top+r.height}px)`,...e},className:"onboard-overlay-mask onboard-mask-bottom",onPointerDown:n,onMouseDown:n,onClick:n}),u("div",{style:{top:r.top,height:r.height,width:r.left,...e},className:"onboard-overlay-mask onboard-mask-left",onPointerDown:n,onMouseDown:n,onClick:n}),u("div",{style:{top:r.top,height:r.height,left:r.left+r.width,width:`calc(100% - ${r.left+r.width}px)`,...e},className:"onboard-overlay-mask",onPointerDown:n,onMouseDown:n,onClick:n}),w("div",{ref:h,className:"onboard-tooltip",onPointerDown:j,style:{zIndex:1e6,...i.style?.container,top:I.top+O.y,left:I.left+O.x,transition:"top 0.3s cubic-bezier(0.25, 0.1, 0.25, 1), left 0.3s cubic-bezier(0.25, 0.1, 0.25, 1)",cursor:i.metadata.draggable?"grab":"auto",touchAction:"none"},onMouseDown:n,onClick:n,children:[w("div",{className:"onboard-tooltip-header",children:[u("h3",{className:"onboard-tooltip-title",children:c.title}),u("button",{onClick:t=>{t.stopPropagation(),y()},className:"onboard-close-button",children:u(s,{})})]}),u("p",{className:"onboard-tooltip-description",children:c.description}),w("div",{className:"onboard-tooltip-footer",children:[w("button",{onClick:t=>{t.stopPropagation(),W()},disabled:m,className:"onboard-button-ghost",style:{background:"none",border:"none",cursor:m?"not-allowed":"pointer",...i.style?.prev},children:[u(a,{}),"Prev"]}),o?u("button",{onClick:t=>{t.stopPropagation(),y()},className:"onboard-button-primary",style:{border:"none",cursor:"pointer",...i.style?.finish},children:"Finish"}):w("button",{onClick:t=>{t.stopPropagation(),L()},className:"onboard-button-primary",style:{border:"none",cursor:"pointer",...m?i.style?.start:{},...m?{}:i.style?.next},children:[m&&i.style?.start?"Start":"Next",!(m&&i.style?.start)&&u(l,{})]})]})]})]});return typeof document<"u"?et(S,document.body):null};import{Fragment as it,jsx as Q,jsxs as st}from"react/jsx-runtime";var V=nt(void 0),G="onboarding_state",mt=({config:i,ssr:c=!1,onNavigate:L,children:W})=>{let[y,m]=U(!c),[o,r]=U({currentStepIndex:0,currentSubStepIndex:null,isActive:!0}),f=J.useRef(i);A(()=>{f.current=i},[i]);let I=J.useRef(L);A(()=>{I.current=L},[L]);let x=H(e=>{e&&(I.current?I.current(e):(i.metadata.nextRouter,window.location.href=e))},[i.metadata.nextRouter]);A(()=>{c&&m(!0)},[c]);let O=(e,n)=>{if(e.urlMatch instanceof RegExp)return e.urlMatch.test(n);if(typeof e.urlMatch=="string"&&e.urlMatch.includes("*")){let a=e.urlMatch.replace(/[.+?^${}()|[\\]/g,"\\$&").replace(/\*/g,".*");return new RegExp(`^${a}$`).test(n)}return n===e.urlMatch},D=rt(()=>{let e=f.current,n=window.location.pathname,a=-1;e.metadata.inOrder===!1&&(a=e.steps.findIndex(s=>O(s,n)));let l=K.get(G);if(l)try{let s=JSON.parse(l);if(e.metadata.inOrder===!1)a!==-1?s.currentStepIndex===a?r(s):r({currentStepIndex:a,currentSubStepIndex:null,isActive:!0}):r({...s,isActive:!1});else if(r(s),e.metadata.inOrder!==!1){let S=e.steps[s.currentStepIndex];if(S&&s.isActive){let t;if(s.currentStepIndex>0){let d=e.steps[s.currentStepIndex-1];d.navigate&&(t=d.navigate)}!t&&typeof S.urlMatch=="string"&&(t=S.urlMatch),t&&window.location.pathname!==t&&x(t),e.metadata.simulateClicksOnNavigate&&s.currentSubStepIndex!==null&&S.click&&setTimeout(()=>{let d=document.querySelector(`[data-onboarding-id="${S.attribute}"]`);d&&d.click()},500)}}}catch(s){console.error("Failed to parse onboarding state from cookie",s),a!==-1&&r({currentStepIndex:a,currentSubStepIndex:null,isActive:!0})}else if(a!==-1)r({currentStepIndex:a,currentSubStepIndex:null,isActive:!0});else if(e.metadata.inOrder===!1)r(s=>({...s,isActive:!1}));else{let s=e.steps[0];s&&typeof s.urlMatch=="string"&&window.location.pathname!==s.urlMatch&&x(s.urlMatch)}});A(()=>{D()},[]),A(()=>{y&&K.set(G,JSON.stringify(o),{expires:365})},[o,y]);let R=_(()=>{let e=i.steps[o.currentStepIndex];return e?o.currentSubStepIndex!==null&&e.subSteps&&e.subSteps[o.currentSubStepIndex]||e:null},[i.steps,o.currentStepIndex,o.currentSubStepIndex]),z=o.currentStepIndex===0&&o.currentSubStepIndex===null,h=_(()=>{let e=i.steps.length,n=o.currentStepIndex===e-1,a=i.steps[o.currentStepIndex],l=a?.subSteps&&a.subSteps.length>0;return n?l?o.currentSubStepIndex===a.subSteps.length-1:!0:!1},[i.steps,o.currentStepIndex,o.currentSubStepIndex]),v=H(()=>{let e=f.current,n=e.steps[o.currentStepIndex],a=o.currentSubStepIndex!==null&&n.subSteps?n.subSteps[o.currentSubStepIndex]:n;if(a.click){let l=document.querySelector(`[data-onboarding-id="${a.attribute}"]`);l&&l.click()}if(n.subSteps&&(o.currentSubStepIndex===null||o.currentSubStepIndex<n.subSteps.length-1)){let l=o.currentSubStepIndex===null?0:o.currentSubStepIndex+1,s=n.subSteps[l];r(S=>({...S,currentSubStepIndex:l})),s.navigate&&x(s.navigate);return}if(o.currentStepIndex<e.steps.length-1){let l=o.currentStepIndex+1,s=e.steps[l];r({currentStepIndex:l,currentSubStepIndex:null,isActive:!0}),s.navigate&&x(s.navigate)}else r(l=>({...l,isActive:!1})),e.onOnboardingComplete&&e.onOnboardingComplete()},[o.currentStepIndex,o.currentSubStepIndex,x]),k=H(()=>{let e=f.current;if(o.currentSubStepIndex!==null&&o.currentSubStepIndex>0){r(n=>({...n,currentSubStepIndex:n.currentSubStepIndex-1}));return}if(o.currentStepIndex>0&&o.currentSubStepIndex===0){r(n=>({...n,currentSubStepIndex:null}));return}if(o.currentStepIndex>0){let n=o.currentStepIndex-1,a=e.steps[n],l=a.subSteps?a.subSteps.length-1:null;r({currentStepIndex:n,currentSubStepIndex:l,isActive:!0})}},[o.currentStepIndex,o.currentSubStepIndex]),j=H(()=>{r(e=>({...e,isActive:!1})),f.current.onOnboardingComplete&&f.current.onOnboardingComplete()},[]),$=H((e,n=null)=>{r({currentStepIndex:e,currentSubStepIndex:n,isActive:!0})},[]),g={config:i,state:o,nextStep:v,prevStep:k,finish:j,goToStep:$,currentStep:R,isFirstStep:z,isLastStep:h};return y?st(V.Provider,{value:g,children:[W,o.isActive&&Q(Y,{})]}):Q(it,{children:W})},q=()=>{let i=ot(V);if(i===void 0)throw new Error("useOnboarding must be used within an OnboardingProvider");return i};export{mt as OnboardingProvider,q as useOnboarding};
 //# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/OnboardingProvider.tsx","../src/components/OnboardingOverlay.tsx"],"sourcesContent":["\"use client\";\n\nimport React, { createContext, useContext, useEffect, useState, useCallback, useMemo } from 'react';\nimport Cookies from 'js-cookie';\nimport { OnboardingConfig, OnboardingState, OnboardingStep, OnboardingSubStep } from '../types';\nimport { OnboardingOverlay } from './OnboardingOverlay';\n\ninterface OnboardingContextType {\n  config: OnboardingConfig;\n  state: OnboardingState;\n  nextStep: () => void;\n  prevStep: () => void;\n  finish: () => void;\n  goToStep: (stepIndex: number, subStepIndex?: number | null) => void;\n  currentStep: OnboardingStep | OnboardingSubStep | null;\n  isFirstStep: boolean;\n  isLastStep: boolean;\n}\n\nconst OnboardingContext = createContext<OnboardingContextType | undefined>(undefined);\n\nconst COOKIE_NAME = 'onboarding_state';\n\nexport const OnboardingProvider: React.FC<{\n  config: OnboardingConfig;\n  ssr?: boolean;\n  children: React.ReactNode;\n}> = ({ config, ssr = false, children }) => {\n  const [isMounted, setIsMounted] = useState(!ssr);\n  const [state, setState] = useState<OnboardingState>({\n    currentStepIndex: 0,\n    currentSubStepIndex: null,\n    isActive: true,\n  });\n\n  // Stabilize config to prevent infinite loops if the user passes a new object on every render\n  const configRef = React.useRef(config);\n  useEffect(() => {\n    configRef.current = config;\n  }, [config]);\n\n  const handleNavigation = useCallback((link?: string) => {\n    if (!link) return;\n    \n    if (configRef.current.metadata.nextRouter) {\n      window.location.href = link;\n    } else {\n      window.location.href = link;\n    }\n  }, []);\n\n  useEffect(() => {\n    if (ssr) {\n      setIsMounted(true);\n    }\n  }, [ssr]);\n\n  const isMatch = (step: OnboardingStep, path: string) => {\n    if (step.urlMatch instanceof RegExp) return step.urlMatch.test(path);\n    \n    if (typeof step.urlMatch === 'string' && step.urlMatch.includes('*')) {\n      // Escape regex special characters but keep '*' as '.*'\n      const pattern = step.urlMatch\n        .replace(/[.+?^${}()|[\\]\\\\]/g, '\\\\$&') // Escape regex chars\n        .replace(/\\*/g, '.*');                 // Convert * to .*\n      return new RegExp(`^${pattern}$`).test(path);\n    }\n\n    return path === step.urlMatch;\n  };\n\n  useEffect(() => {\n    const currentConfig = configRef.current;\n    const currentPath = window.location.pathname;\n    let matchedStepIndex = -1;\n    \n    // Check if inOrder is explicitly false to find matching step from URL\n    if ((currentConfig.metadata.inOrder as boolean | undefined) === false) {\n      matchedStepIndex = currentConfig.steps.findIndex(step => isMatch(step, currentPath));\n    }\n\n    const savedState = Cookies.get(COOKIE_NAME);\n    if (savedState) {\n      try {\n        const parsed: OnboardingState = JSON.parse(savedState);\n        \n        // If inOrder is false\n        if ((currentConfig.metadata.inOrder as boolean | undefined) === false) {\n          if (matchedStepIndex !== -1) {\n            // We found a matching step for this URL\n            if (parsed.currentStepIndex === matchedStepIndex) {\n              // If it matches the saved step, restore state (keep substeps)\n              setState(parsed);\n            } else {\n              // Different step, switch to it\n              setState(prev => ({\n                ...prev,\n                currentStepIndex: matchedStepIndex,\n                currentSubStepIndex: null,\n                isActive: true\n              }));\n            }\n          } else {\n            // inOrder is false, and NO step matches this URL.\n            // We should hide the onboarding, essentially \"pausing\" it until we return to a valid page.\n            setState(prev => ({ ...parsed, isActive: false }));\n          }\n        } else {\n          // Standard behavior (inOrder: true OR no match found) - restore saved state\n          setState(parsed);\n\n          // Only enforce navigation if inOrder is true (or default)\n          if ((currentConfig.metadata.inOrder as boolean | undefined) !== false) {\n            const step = currentConfig.steps[parsed.currentStepIndex];\n            if (step && parsed.isActive) {\n              // Always enforce location based on the main step's urlMatch\n              if (typeof step.urlMatch === 'string' && window.location.pathname !== step.urlMatch) {\n                handleNavigation(step.urlMatch);\n              }\n            }\n          }\n        }\n      } catch (e) {\n        console.error('Failed to parse onboarding state from cookie', e);\n        // Fallback if cookie fails but we have a match\n        if (matchedStepIndex !== -1) {\n          setState(prev => ({\n            ...prev,\n            currentStepIndex: matchedStepIndex,\n            currentSubStepIndex: null,\n            isActive: true\n          }));\n        }\n      }\n    } else if (matchedStepIndex !== -1) {\n      // No cookie, but we have a URL match\n      setState(prev => ({\n        ...prev,\n        currentStepIndex: matchedStepIndex,\n        currentSubStepIndex: null,\n        isActive: true\n      }));\n    } else if ((currentConfig.metadata.inOrder as boolean | undefined) === false) {\n      // No cookie, no match, and inOrder is false.\n      // We are on a page that doesn't trigger any onboarding step.\n      setState(prev => ({ ...prev, isActive: false }));\n    } else {\n      // No cookie, no match, inOrder is true (default).\n      // Enforce navigation for the default first step if needed.\n      const step = currentConfig.steps[0];\n      if (step && typeof step.urlMatch === 'string' && window.location.pathname !== step.urlMatch) {\n         handleNavigation(step.urlMatch);\n      }\n    }\n  }, [handleNavigation]); // Removed config.steps dependency\n\n  useEffect(() => {\n    if (isMounted) {\n      Cookies.set(COOKIE_NAME, JSON.stringify(state), { expires: 365 });\n    }\n  }, [state, isMounted]);\n\n  const currentStep = useMemo(() => {\n    const step = config.steps[state.currentStepIndex];\n    if (!step) return null;\n    if (state.currentSubStepIndex !== null && step.subSteps) {\n      return step.subSteps[state.currentSubStepIndex] || step;\n    }\n    return step;\n  }, [config.steps, state.currentStepIndex, state.currentSubStepIndex]);\n\n  const isFirstStep = state.currentStepIndex === 0 && state.currentSubStepIndex === null;\n  const isLastStep = useMemo(() => {\n    const totalSteps = config.steps.length;\n    const isLastMainStep = state.currentStepIndex === totalSteps - 1;\n    const step = config.steps[state.currentStepIndex];\n    const hasSubSteps = step?.subSteps && step.subSteps.length > 0;\n    \n    if (isLastMainStep) {\n      if (hasSubSteps) {\n        return state.currentSubStepIndex === (step.subSteps!.length - 1);\n      }\n      return true;\n    }\n    return false;\n  }, [config.steps, state.currentStepIndex, state.currentSubStepIndex]);\n\n  const nextStep = useCallback(() => {\n    const currentConfig = configRef.current;\n    const step = currentConfig.steps[state.currentStepIndex];\n    const currentActiveStep = state.currentSubStepIndex !== null && step.subSteps \n      ? step.subSteps[state.currentSubStepIndex] \n      : step;\n\n    // Perform click if requested for the current step before moving to the next\n    if (currentActiveStep.click) {\n      const element = document.querySelector(`[data-onboarding-id=\"${currentActiveStep.attribute}\"]`) as HTMLElement;\n      if (element) {\n        element.click();\n      }\n    }\n    \n    // Check for subSteps\n    if (step.subSteps && (state.currentSubStepIndex === null || state.currentSubStepIndex < step.subSteps.length - 1)) {\n      const nextSubIndex = state.currentSubStepIndex === null ? 0 : state.currentSubStepIndex + 1;\n      const nextSubStep = step.subSteps[nextSubIndex];\n      setState(prev => ({ ...prev, currentSubStepIndex: nextSubIndex }));\n      \n      if (nextSubStep.navigate) handleNavigation(nextSubStep.navigate);\n      return;\n    }\n\n    // Move to next main step\n    if (state.currentStepIndex < currentConfig.steps.length - 1) {\n      const nextIndex = state.currentStepIndex + 1;\n      const nextStepObj = currentConfig.steps[nextIndex];\n      setState({\n        currentStepIndex: nextIndex,\n        currentSubStepIndex: null,\n        isActive: true,\n      });\n      \n      if (nextStepObj.navigate) handleNavigation(nextStepObj.navigate);\n    } else {\n      setState(prev => ({ ...prev, isActive: false }));\n      if (currentConfig.onOnboardingComplete) {\n        currentConfig.onOnboardingComplete();\n      }\n    }\n  }, [state.currentStepIndex, state.currentSubStepIndex, handleNavigation]);\n\n  const prevStep = useCallback(() => {\n    const currentConfig = configRef.current;\n    const step = currentConfig.steps[state.currentStepIndex];\n\n    if (state.currentSubStepIndex !== null && state.currentSubStepIndex > 0) {\n      setState(prev => ({ ...prev, currentSubStepIndex: prev.currentSubStepIndex! - 1 }));\n      return;\n    }\n\n    if (state.currentSubStepIndex === 0) {\n      setState(prev => ({ ...prev, currentSubStepIndex: null }));\n      return;\n    }\n\n    if (state.currentStepIndex > 0) {\n      const prevIndex = state.currentStepIndex - 1;\n      const prevStepObj = currentConfig.steps[prevIndex];\n      const prevSubStepIndex = prevStepObj.subSteps ? prevStepObj.subSteps.length - 1 : null;\n      \n      setState({\n        currentStepIndex: prevIndex,\n        currentSubStepIndex: prevSubStepIndex,\n        isActive: true,\n      });\n    }\n  }, [state.currentStepIndex, state.currentSubStepIndex]);\n\n  const finish = useCallback(() => {\n    setState(prev => ({ ...prev, isActive: false }));\n    if (configRef.current.onOnboardingComplete) {\n      configRef.current.onOnboardingComplete();\n    }\n  }, []);\n\n  const goToStep = useCallback((stepIndex: number, subStepIndex: number | null = null) => {\n    setState({\n      currentStepIndex: stepIndex,\n      currentSubStepIndex: subStepIndex,\n      isActive: true,\n    });\n  }, []);\n\n  const value = {\n    config,\n    state,\n    nextStep,\n    prevStep,\n    finish,\n    goToStep,\n    currentStep,\n    isFirstStep,\n    isLastStep,\n  };\n\n  if (!isMounted) return <>{children}</>;\n\n  return (\n    <OnboardingContext.Provider value={value}>\n      {children}\n      {state.isActive && <OnboardingOverlay />}\n    </OnboardingContext.Provider>\n  );\n};\n\nexport const useOnboarding = () => {\n  const context = useContext(OnboardingContext);\n  if (context === undefined) {\n    throw new Error('useOnboarding must be used within an OnboardingProvider');\n  }\n  return context;\n};","\"use client\";\n\nimport React, { useState, useEffect, useCallback, useRef } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useOnboarding } from './OnboardingProvider';\n\nexport const OnboardingOverlay: React.FC = () => {\n  const { config, currentStep, nextStep, prevStep, finish, isFirstStep, isLastStep } = useOnboarding();\n  const [coords, setCoords] = useState<{ top: number; left: number; width: number; height: number } | null>(null);\n  const [position, setPosition] = useState<{ top: number; left: number }>({ top: 0, left: 0 });\n  const [dragOffset, setDragOffset] = useState<{ x: number; y: number }>({ x: 0, y: 0 });\n  const isDragging = useRef(false);\n  const dragStart = useRef<{ x: number; y: number }>({ x: 0, y: 0 });\n  const tooltipRef = useRef<HTMLDivElement>(null);\n\n  // Reset drag offset when step changes\n  useEffect(() => {\n    setDragOffset({ x: 0, y: 0 });\n  }, [currentStep]);\n\n  const handlePointerDown = (e: React.PointerEvent) => {\n    if (!config.metadata.draggable) return;\n    e.stopPropagation(); // Prevent click-through\n    e.preventDefault(); // Prevent text selection\n    isDragging.current = true;\n    dragStart.current = { x: e.clientX - dragOffset.x, y: e.clientY - dragOffset.y };\n    \n    // Disable transition during drag for responsiveness\n    if (tooltipRef.current) {\n      tooltipRef.current.style.transition = 'none';\n      tooltipRef.current.style.cursor = 'grabbing';\n    }\n\n    window.addEventListener('pointermove', handlePointerMove);\n    window.addEventListener('pointerup', handlePointerUp);\n  };\n\n  const handlePointerMove = useCallback((e: PointerEvent) => {\n    if (!isDragging.current) return;\n    \n    const newX = e.clientX - dragStart.current.x;\n    const newY = e.clientY - dragStart.current.y;\n    \n    setDragOffset({ x: newX, y: newY });\n  }, []);\n\n  const handlePointerUp = useCallback(() => {\n    isDragging.current = false;\n    \n    // Re-enable transition\n    if (tooltipRef.current) {\n      tooltipRef.current.style.transition = 'top 0.3s cubic-bezier(0.25, 0.1, 0.25, 1), left 0.3s cubic-bezier(0.25, 0.1, 0.25, 1)';\n      tooltipRef.current.style.cursor = config.metadata.draggable ? 'grab' : 'auto';\n    }\n\n    window.removeEventListener('pointermove', handlePointerMove);\n    window.removeEventListener('pointerup', handlePointerUp);\n  }, [config.metadata.draggable, handlePointerMove]);\n\n  // Clean up listeners on unmount\n  useEffect(() => {\n    return () => {\n      window.removeEventListener('pointermove', handlePointerMove);\n      window.removeEventListener('pointerup', handlePointerUp);\n    };\n  }, [handlePointerMove, handlePointerUp]);\n\n  const calculateBestPosition = useCallback((rect: { top: number; bottom: number; left: number; right: number; width: number; height: number }) => {\n    const tooltipWidth = 300;\n    const tooltipHeight = 200;\n    const gap = 12;\n    const padding = 20;\n\n    const spaceAbove = rect.top;\n    const spaceBelow = window.innerHeight - rect.bottom;\n    const spaceLeft = rect.left;\n    const spaceRight = window.innerWidth - rect.right;\n\n    let top = 0;\n    let left = 0;\n\n    if (spaceBelow > tooltipHeight + gap + padding) {\n      top = rect.bottom + gap;\n      left = Math.max(padding, Math.min(window.innerWidth - tooltipWidth - padding, rect.left + rect.width / 2 - tooltipWidth / 2));\n    } else if (spaceAbove > tooltipHeight + gap + padding) {\n      top = rect.top - tooltipHeight - gap;\n      left = Math.max(padding, Math.min(window.innerWidth - tooltipWidth - padding, rect.left + rect.width / 2 - tooltipWidth / 2));\n    } else if (spaceRight > tooltipWidth + gap + padding) {\n      top = Math.max(padding, Math.min(window.innerHeight - tooltipHeight - padding, rect.top + rect.height / 2 - tooltipHeight / 2));\n      left = rect.right + gap;\n    } else if (spaceLeft > tooltipWidth + gap + padding) {\n      top = Math.max(padding, Math.min(window.innerHeight - tooltipHeight - padding, rect.top + rect.height / 2 - tooltipHeight / 2));\n      left = rect.left - tooltipWidth - gap;\n    } else {\n      top = window.innerHeight / 2 - tooltipHeight / 2;\n      left = window.innerWidth / 2 - tooltipWidth / 2;\n    }\n\n    return { top: top + window.scrollY, left: left + window.scrollX };\n  }, []);\n\n  const updateCoords = useCallback(() => {\n    if (!currentStep) return;\n\n    const element = document.querySelector(`[data-onboarding-id=\"${currentStep.attribute}\"]`) as HTMLElement;\n    if (element) {\n      const rect = element.getBoundingClientRect();\n      const padding = config.style?.padding || 0;\n      \n      const paddedRect = {\n        top: rect.top - padding,\n        bottom: rect.bottom + padding,\n        left: rect.left - padding,\n        right: rect.right + padding,\n        width: rect.width + (padding * 2),\n        height: rect.height + (padding * 2),\n      };\n\n      const newCoords = {\n        top: paddedRect.top + window.scrollY,\n        left: paddedRect.left + window.scrollX,\n        width: paddedRect.width,\n        height: paddedRect.height,\n      };\n\n      const newPosition = calculateBestPosition(paddedRect);\n\n      // Prevent infinite loops by only updating if values actually changed\n      setCoords(prev => {\n        if (prev && \n            prev.top === newCoords.top && \n            prev.left === newCoords.left && \n            prev.width === newCoords.width && \n            prev.height === newCoords.height) {\n          return prev;\n        }\n        return newCoords;\n      });\n\n      setPosition(prev => {\n        if (prev.top === newPosition.top && prev.left === newPosition.left) {\n          return prev;\n        }\n        return newPosition;\n      });\n    } else {\n      setCoords(null);\n    }\n  }, [currentStep, calculateBestPosition, config.style]);\n\n  useEffect(() => {\n    updateCoords();\n    window.addEventListener('resize', updateCoords);\n    window.addEventListener('scroll', updateCoords);\n\n    const observer = new MutationObserver(updateCoords);\n    observer.observe(document.body, { childList: true, subtree: true, attributes: true });\n\n    let resizeObserver: ResizeObserver | null = null;\n    if (typeof ResizeObserver !== 'undefined') {\n      resizeObserver = new ResizeObserver(updateCoords);\n      resizeObserver.observe(document.body);\n      \n      const element = currentStep?.attribute \n        ? document.querySelector(`[data-onboarding-id=\"${currentStep.attribute}\"]`) \n        : null;\n      if (element) {\n        resizeObserver.observe(element);\n      }\n    }\n\n    return () => {\n      window.removeEventListener('resize', updateCoords);\n      window.removeEventListener('scroll', updateCoords);\n      observer.disconnect();\n      if (resizeObserver) resizeObserver.disconnect();\n    };\n  }, [updateCoords, currentStep?.attribute]);\n\n  if (!currentStep || !coords) return null;\n\n  const maskStyle = {\n    ...config.style?.background,\n    transition: 'all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1)',\n  };\n\n  const stopPropagation = (e: React.PointerEvent | React.MouseEvent) => {\n    e.stopPropagation();\n  };\n\n  const ChevronLeftIcon = () => (\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n      <path d=\"M15 18l-6-6 6-6\" />\n    </svg>\n  );\n\n  const ChevronRightIcon = () => (\n    <svg width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n      <path d=\"M9 18l6-6-6-6\" />\n    </svg>\n  );\n\n  const XIcon = () => (\n    <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n      <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\" />\n      <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\" />\n    </svg>\n  );\n\n  const overlayContent = (\n    <div className=\"fixed inset-0 z-[999999] pointer-events-none\">\n      {/* Top Mask */}\n      <div\n        style={{ height: coords.top, ...maskStyle }}\n        className=\"onboard-overlay-mask top-0 left-0 w-full pointer-events-auto\"\n        onPointerDown={stopPropagation}\n        onMouseDown={stopPropagation}\n        onClick={stopPropagation}\n      />\n      {/* Bottom Mask */}\n      <div\n        style={{ top: coords.top + coords.height, height: `calc(100vh - ${coords.top + coords.height}px)`, ...maskStyle }}\n        className=\"onboard-overlay-mask left-0 w-full pointer-events-auto\"\n        onPointerDown={stopPropagation}\n        onMouseDown={stopPropagation}\n        onClick={stopPropagation}\n      />\n      {/* Left Mask */}\n      <div\n        style={{ top: coords.top, height: coords.height, width: coords.left, ...maskStyle }}\n        className=\"onboard-overlay-mask left-0 pointer-events-auto\"\n        onPointerDown={stopPropagation}\n        onMouseDown={stopPropagation}\n        onClick={stopPropagation}\n      />\n      {/* Right Mask */}\n      <div\n        style={{ \n          top: coords.top, \n          height: coords.height, \n          left: coords.left + coords.width, \n          width: `calc(100% - ${coords.left + coords.width}px)`, \n          ...maskStyle \n        }}\n        className=\"onboard-overlay-mask pointer-events-auto\"\n        onPointerDown={stopPropagation}\n        onMouseDown={stopPropagation}\n        onClick={stopPropagation}\n      />\n\n      {/* Tooltip */}\n      <div\n        ref={tooltipRef}\n        className=\"onboard-tooltip pointer-events-auto\"\n        onPointerDown={handlePointerDown}\n        style={{ \n          zIndex: 1000000, \n          ...config.style?.container,\n          top: position.top + dragOffset.y,\n          left: position.left + dragOffset.x,\n          transition: 'top 0.3s cubic-bezier(0.25, 0.1, 0.25, 1), left 0.3s cubic-bezier(0.25, 0.1, 0.25, 1)',\n          cursor: config.metadata.draggable ? 'grab' : 'auto',\n          touchAction: 'none' // Prevent scrolling on touch devices while dragging\n        }}\n        onMouseDown={stopPropagation}\n        onClick={stopPropagation}\n      >\n        <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'flex-start', marginBottom: '8px' }}>\n          <h3 style={{ margin: 0, fontWeight: 'bold', color: '#111827', fontSize: '18px', lineHeight: 1.2 }}>{currentStep.title}</h3>\n          <button \n            onClick={(e) => { e.stopPropagation(); finish(); }}\n            style={{ background: 'none', border: 'none', cursor: 'pointer', padding: '4px', color: '#9ca3af' }}\n          >\n            <XIcon />\n          </button>\n        </div>\n        <p style={{ margin: 0, color: '#4b5563', fontSize: '14px', marginBottom: '24px', lineHeight: 1.5 }}>\n          {currentStep.description}\n        </p>\n        \n        <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>\n          <button\n            onClick={(e) => { e.stopPropagation(); prevStep(); }}\n            disabled={isFirstStep}\n            className=\"onboard-button-ghost\"\n            style={{ \n              background: 'none', \n              border: 'none', \n              cursor: isFirstStep ? 'not-allowed' : 'pointer',\n              ...config.style?.prev \n            }}\n          >\n            <ChevronLeftIcon />\n            Prev\n          </button>\n          \n          {isLastStep ? (\n            <button\n              onClick={(e) => { e.stopPropagation(); finish(); }}\n              className=\"onboard-button-primary\"\n              style={{ border: 'none', cursor: 'pointer', ...config.style?.finish }}\n            >\n              Finish\n            </button>\n          ) : (\n            <button\n              onClick={(e) => { e.stopPropagation(); nextStep(); }}\n              className=\"onboard-button-primary\"\n              style={{ \n                border: 'none', \n                cursor: 'pointer',\n                ...(isFirstStep ? config.style?.start : {}),\n                ...(!isFirstStep ? config.style?.next : {})\n              }}\n            >\n              {isFirstStep && config.style?.start ? 'Start' : 'Next'}\n              {!(isFirstStep && config.style?.start) && <ChevronRightIcon />}\n            </button>\n          )}\n        </div>\n      </div>\n    </div>\n  );\n\n  return typeof document !== 'undefined' \n    ? createPortal(overlayContent, document.body) \n    : null;\n};\n"],"mappings":"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","names":["React","createContext","useContext","useEffect","useState","useCallback","useMemo","Cookies","useState","useEffect","useCallback","useRef","createPortal","jsx","jsxs","OnboardingOverlay","config","currentStep","nextStep","prevStep","finish","isFirstStep","isLastStep","useOnboarding","coords","setCoords","useState","position","setPosition","dragOffset","setDragOffset","isDragging","useRef","dragStart","tooltipRef","useEffect","handlePointerDown","e","handlePointerMove","handlePointerUp","useCallback","newX","newY","calculateBestPosition","rect","spaceAbove","spaceBelow","spaceLeft","spaceRight","top","left","updateCoords","element","padding","paddedRect","newCoords","newPosition","prev","observer","resizeObserver","maskStyle","stopPropagation","ChevronLeftIcon","ChevronRightIcon","XIcon","overlayContent","createPortal","Fragment","jsx","jsxs","OnboardingContext","createContext","COOKIE_NAME","OnboardingProvider","config","ssr","children","isMounted","setIsMounted","useState","state","setState","configRef","React","useEffect","handleNavigation","useCallback","link","isMatch","step","path","pattern","currentConfig","currentPath","matchedStepIndex","savedState","Cookies","parsed","prev","e","currentStep","useMemo","isFirstStep","isLastStep","totalSteps","isLastMainStep","hasSubSteps","nextStep","currentActiveStep","element","nextSubIndex","nextSubStep","nextIndex","nextStepObj","prevStep","prevIndex","prevStepObj","prevSubStepIndex","finish","goToStep","stepIndex","subStepIndex","value","OnboardingOverlay","useOnboarding","context","useContext"]}
+{"version":3,"sources":["../src/components/OnboardingProvider.tsx","../src/components/OnboardingOverlay.tsx"],"sourcesContent":["'use client';\n\nimport React, {\n  createContext,\n  useContext,\n  useEffect,\n  useState,\n  useCallback,\n  useMemo,\n  useEffectEvent,\n} from 'react';\nimport Cookies from 'js-cookie';\nimport { OnboardingConfig, OnboardingState, OnboardingStep, OnboardingSubStep } from '../types';\nimport { OnboardingOverlay } from './OnboardingOverlay';\n\ninterface OnboardingContextType {\n  config: OnboardingConfig;\n  state: OnboardingState;\n  nextStep: () => void;\n  prevStep: () => void;\n  finish: () => void;\n  goToStep: (stepIndex: number, subStepIndex?: number | null) => void;\n  currentStep: OnboardingStep | OnboardingSubStep | null;\n  isFirstStep: boolean;\n  isLastStep: boolean;\n}\n\nconst OnboardingContext = createContext<OnboardingContextType | undefined>(undefined);\n\nconst COOKIE_NAME = 'onboarding_state';\n\nexport const OnboardingProvider: React.FC<{\n  config: OnboardingConfig;\n  ssr?: boolean;\n  onNavigate?: (url: string) => void;\n  children: React.ReactNode;\n}> = ({ config, ssr = false, onNavigate, children }) => {\n  const [isMounted, setIsMounted] = useState(!ssr);\n  const [state, setState] = useState<OnboardingState>({\n    currentStepIndex: 0,\n    currentSubStepIndex: null,\n    isActive: true,\n  });\n\n  const configRef = React.useRef(config);\n  useEffect(() => {\n    configRef.current = config;\n  }, [config]);\n\n  const onNavigateRef = React.useRef(onNavigate);\n  useEffect(() => {\n    onNavigateRef.current = onNavigate;\n  }, [onNavigate]);\n\n  const handleNavigation = useCallback(\n    (link?: string) => {\n      if (!link) return;\n\n      if (onNavigateRef.current) {\n        onNavigateRef.current(link);\n      } else if (config.metadata.nextRouter) {\n        window.location.href = link;\n      } else {\n        window.location.href = link;\n      }\n    },\n    [config.metadata.nextRouter],\n  );\n\n  useEffect(() => {\n    if (ssr) {\n      // eslint-disable-next-line react-hooks/set-state-in-effect\n      setIsMounted(true);\n    }\n  }, [ssr]);\n\n  const isMatch = (step: OnboardingStep, path: string) => {\n    if (step.urlMatch instanceof RegExp) return step.urlMatch.test(path);\n\n    if (typeof step.urlMatch === 'string' && step.urlMatch.includes('*')) {\n      const pattern = step.urlMatch.replace(/[.+?^${}()|[\\\\]/g, '\\\\$&').replace(/\\*/g, '.*');\n      return new RegExp(`^${pattern}$`).test(path);\n    }\n\n    return path === step.urlMatch;\n  };\n\n  const onRestoreState = useEffectEvent(() => {\n    const currentConfig = configRef.current;\n    const currentPath = window.location.pathname;\n    let matchedStepIndex = -1;\n\n    if ((currentConfig.metadata.inOrder as boolean | undefined) === false) {\n      matchedStepIndex = currentConfig.steps.findIndex((step) => isMatch(step, currentPath));\n    }\n\n    const savedState = Cookies.get(COOKIE_NAME);\n    if (savedState) {\n      try {\n        const parsed: OnboardingState = JSON.parse(savedState);\n\n        if ((currentConfig.metadata.inOrder as boolean | undefined) === false) {\n          if (matchedStepIndex !== -1) {\n            if (parsed.currentStepIndex === matchedStepIndex) {\n              setState(parsed);\n            } else {\n              setState({\n                currentStepIndex: matchedStepIndex,\n                currentSubStepIndex: null,\n                isActive: true,\n              });\n            }\n          } else {\n            setState({ ...parsed, isActive: false });\n          }\n        } else {\n          setState(parsed);\n\n          if ((currentConfig.metadata.inOrder as boolean | undefined) !== false) {\n            const step = currentConfig.steps[parsed.currentStepIndex];\n            if (step && parsed.isActive) {\n              let targetUrl: string | undefined;\n\n              if (parsed.currentStepIndex > 0) {\n                const prevStep = currentConfig.steps[parsed.currentStepIndex - 1];\n                if (prevStep.navigate) {\n                  targetUrl = prevStep.navigate;\n                }\n              }\n\n              if (!targetUrl && typeof step.urlMatch === 'string') {\n                targetUrl = step.urlMatch;\n              }\n\n              if (targetUrl && window.location.pathname !== targetUrl) {\n                handleNavigation(targetUrl);\n              }\n\n              if (currentConfig.metadata.simulateClicksOnNavigate) {\n                if (parsed.currentSubStepIndex !== null && step.click) {\n                  setTimeout(() => {\n                    const element = document.querySelector(\n                      `[data-onboarding-id=\"${step.attribute}\"]`,\n                    ) as HTMLElement;\n                    if (element) {\n                      element.click();\n                    }\n                  }, 500);\n                }\n              }\n            }\n          }\n        }\n      } catch (e) {\n        console.error('Failed to parse onboarding state from cookie', e);\n        if (matchedStepIndex !== -1) {\n          setState({\n            currentStepIndex: matchedStepIndex,\n            currentSubStepIndex: null,\n            isActive: true,\n          });\n        }\n      }\n    } else if (matchedStepIndex !== -1) {\n      setState({\n        currentStepIndex: matchedStepIndex,\n        currentSubStepIndex: null,\n        isActive: true,\n      });\n    } else if ((currentConfig.metadata.inOrder as boolean | undefined) === false) {\n      setState((prev) => ({ ...prev, isActive: false }));\n    } else {\n      const step = currentConfig.steps[0];\n      if (step && typeof step.urlMatch === 'string' && window.location.pathname !== step.urlMatch) {\n        handleNavigation(step.urlMatch);\n      }\n    }\n  });\n\n  useEffect(() => {\n    onRestoreState();\n  }, []);\n\n  useEffect(() => {\n    if (isMounted) {\n      Cookies.set(COOKIE_NAME, JSON.stringify(state), { expires: 365 });\n    }\n  }, [state, isMounted]);\n\n  const currentStep = useMemo(() => {\n    const step = config.steps[state.currentStepIndex];\n    if (!step) return null;\n    if (state.currentSubStepIndex !== null && step.subSteps) {\n      return step.subSteps[state.currentSubStepIndex] || step;\n    }\n    return step;\n  }, [config.steps, state.currentStepIndex, state.currentSubStepIndex]);\n\n  const isFirstStep = state.currentStepIndex === 0 && state.currentSubStepIndex === null;\n  const isLastStep = useMemo(() => {\n    const totalSteps = config.steps.length;\n    const isLastMainStep = state.currentStepIndex === totalSteps - 1;\n    const step = config.steps[state.currentStepIndex];\n    const hasSubSteps = step?.subSteps && step.subSteps.length > 0;\n\n    if (isLastMainStep) {\n      if (hasSubSteps) {\n        return state.currentSubStepIndex === step.subSteps!.length - 1;\n      }\n      return true;\n    }\n    return false;\n  }, [config.steps, state.currentStepIndex, state.currentSubStepIndex]);\n\n  const nextStep = useCallback(() => {\n    const currentConfig = configRef.current;\n    const stepObj = currentConfig.steps[state.currentStepIndex];\n    const currentActiveStep =\n      state.currentSubStepIndex !== null && stepObj.subSteps\n        ? stepObj.subSteps[state.currentSubStepIndex]\n        : stepObj;\n\n    if (currentActiveStep.click) {\n      const element = document.querySelector(\n        `[data-onboarding-id=\"${currentActiveStep.attribute}\"]`,\n      ) as HTMLElement;\n      if (element) {\n        element.click();\n      }\n    }\n\n    if (\n      stepObj.subSteps &&\n      (state.currentSubStepIndex === null ||\n        state.currentSubStepIndex < stepObj.subSteps.length - 1)\n    ) {\n      const nextSubIndex = state.currentSubStepIndex === null ? 0 : state.currentSubStepIndex + 1;\n      const nextSubStep = stepObj.subSteps[nextSubIndex];\n      setState((prev) => ({ ...prev, currentSubStepIndex: nextSubIndex }));\n\n      if (nextSubStep.navigate) handleNavigation(nextSubStep.navigate);\n      return;\n    }\n\n    if (state.currentStepIndex < currentConfig.steps.length - 1) {\n      const nextIndex = state.currentStepIndex + 1;\n      const nextStepObj = currentConfig.steps[nextIndex];\n      setState({\n        currentStepIndex: nextIndex,\n        currentSubStepIndex: null,\n        isActive: true,\n      });\n\n      if (nextStepObj.navigate) handleNavigation(nextStepObj.navigate);\n    } else {\n      setState((prev) => ({ ...prev, isActive: false }));\n      if (currentConfig.onOnboardingComplete) {\n        currentConfig.onOnboardingComplete();\n      }\n    }\n  }, [state.currentStepIndex, state.currentSubStepIndex, handleNavigation]);\n\n  const prevStep = useCallback(() => {\n    const currentConfig = configRef.current;\n\n    if (state.currentSubStepIndex !== null && state.currentSubStepIndex > 0) {\n      setState((prev) => ({ ...prev, currentSubStepIndex: prev.currentSubStepIndex! - 1 }));\n      return;\n    }\n\n    if (state.currentStepIndex > 0 && state.currentSubStepIndex === 0) {\n      setState((prev) => ({ ...prev, currentSubStepIndex: null }));\n      return;\n    }\n\n    if (state.currentStepIndex > 0) {\n      const prevIndex = state.currentStepIndex - 1;\n      const prevStepObj = currentConfig.steps[prevIndex];\n      const prevSubStepIndex = prevStepObj.subSteps ? prevStepObj.subSteps.length - 1 : null;\n\n      setState({\n        currentStepIndex: prevIndex,\n        currentSubStepIndex: prevSubStepIndex,\n        isActive: true,\n      });\n    }\n  }, [state.currentStepIndex, state.currentSubStepIndex]);\n\n  const finish = useCallback(() => {\n    setState((prev) => ({ ...prev, isActive: false }));\n    if (configRef.current.onOnboardingComplete) {\n      configRef.current.onOnboardingComplete();\n    }\n  }, []);\n\n  const goToStep = useCallback((stepIndex: number, subStepIndex: number | null = null) => {\n    setState({\n      currentStepIndex: stepIndex,\n      currentSubStepIndex: subStepIndex,\n      isActive: true,\n    });\n  }, []);\n\n  const value = {\n    config,\n    state,\n    nextStep,\n    prevStep,\n    finish,\n    goToStep,\n    currentStep,\n    isFirstStep,\n    isLastStep,\n  };\n\n  if (!isMounted) return <>{children}</>;\n\n  return (\n    <OnboardingContext.Provider value={value}>\n      {children}\n      {state.isActive && <OnboardingOverlay />}\n    </OnboardingContext.Provider>\n  );\n};\n\nexport const useOnboarding = () => {\n  const context = useContext(OnboardingContext);\n  if (context === undefined) {\n    throw new Error('useOnboarding must be used within an OnboardingProvider');\n  }\n  return context;\n};\n","'use client';\n\nimport React, { useState, useEffect, useCallback, useRef } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useOnboarding } from './OnboardingProvider';\n\nexport const OnboardingOverlay: React.FC = () => {\n  const { config, currentStep, nextStep, prevStep, finish, isFirstStep, isLastStep } =\n    useOnboarding();\n  const [coords, setCoords] = useState<{\n    top: number;\n    left: number;\n    width: number;\n    height: number;\n  } | null>(null);\n  const [position, setPosition] = useState<{ top: number; left: number }>({ top: 0, left: 0 });\n  const [dragOffset, setDragOffset] = useState<{ x: number; y: number }>({ x: 0, y: 0 });\n  const isDragging = useRef(false);\n  const dragStart = useRef<{ x: number; y: number }>({ x: 0, y: 0 });\n  const tooltipRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    setDragOffset({ x: 0, y: 0 });\n  }, [currentStep]);\n\n  const handlePointerMove = useCallback((e: PointerEvent) => {\n    if (!isDragging.current) return;\n\n    const newX = e.clientX - dragStart.current.x;\n    const newY = e.clientY - dragStart.current.y;\n\n    setDragOffset({ x: newX, y: newY });\n  }, []);\n\n  const handlePointerUp = useCallback(() => {\n    isDragging.current = false;\n\n    if (tooltipRef.current) {\n      tooltipRef.current.style.transition =\n        'top 0.3s cubic-bezier(0.25, 0.1, 0.25, 1), left 0.3s cubic-bezier(0.25, 0.1, 0.25, 1)';\n      tooltipRef.current.style.cursor = config.metadata.draggable ? 'grab' : 'auto';\n    }\n\n    window.removeEventListener('pointermove', handlePointerMove);\n    // eslint-disable-next-line react-hooks/immutability\n    window.removeEventListener('pointerup', handlePointerUp);\n  }, [config.metadata.draggable, handlePointerMove]);\n\n  const handlePointerDown = (e: React.PointerEvent) => {\n    if (!config.metadata.draggable) return;\n    e.stopPropagation();\n    e.preventDefault();\n    isDragging.current = true;\n    dragStart.current = { x: e.clientX - dragOffset.x, y: e.clientY - dragOffset.y };\n\n    if (tooltipRef.current) {\n      tooltipRef.current.style.transition = 'none';\n      tooltipRef.current.style.cursor = 'grabbing';\n    }\n\n    window.addEventListener('pointermove', handlePointerMove);\n    window.addEventListener('pointerup', handlePointerUp);\n  };\n\n  useEffect(() => {\n    return () => {\n      window.removeEventListener('pointermove', handlePointerMove);\n      window.removeEventListener('pointerup', handlePointerUp);\n    };\n  }, [handlePointerMove, handlePointerUp]);\n\n  const calculateBestPosition = useCallback(\n    (rect: {\n      top: number;\n      bottom: number;\n      left: number;\n      right: number;\n      width: number;\n      height: number;\n    }) => {\n      const tooltipWidth = 300;\n      const tooltipHeight = 200;\n      const gap = 12;\n      const padding = 20;\n\n      const spaceAbove = rect.top;\n      const spaceBelow = window.innerHeight - rect.bottom;\n      const spaceLeft = rect.left;\n      const spaceRight = window.innerWidth - rect.right;\n\n      let top = 0;\n      let left = 0;\n\n      if (spaceBelow > tooltipHeight + gap + padding) {\n        top = rect.bottom + gap;\n        left = Math.max(\n          padding,\n          Math.min(\n            window.innerWidth - tooltipWidth - padding,\n            rect.left + rect.width / 2 - tooltipWidth / 2,\n          ),\n        );\n      } else if (spaceAbove > tooltipHeight + gap + padding) {\n        top = rect.top - tooltipHeight - gap;\n        left = Math.max(\n          padding,\n          Math.min(\n            window.innerWidth - tooltipWidth - padding,\n            rect.left + rect.width / 2 - tooltipWidth / 2,\n          ),\n        );\n      } else if (spaceRight > tooltipWidth + gap + padding) {\n        top = Math.max(\n          padding,\n          Math.min(\n            window.innerHeight - tooltipHeight - padding,\n            rect.top + rect.height / 2 - tooltipHeight / 2,\n          ),\n        );\n        left = rect.right + gap;\n      } else if (spaceLeft > tooltipWidth + gap + padding) {\n        top = Math.max(\n          padding,\n          Math.min(\n            window.innerHeight - tooltipHeight - padding,\n            rect.top + rect.height / 2 - tooltipHeight / 2,\n          ),\n        );\n        left = rect.left - tooltipWidth - gap;\n      } else {\n        top = window.innerHeight / 2 - tooltipHeight / 2;\n        left = window.innerWidth / 2 - tooltipWidth / 2;\n      }\n\n      return { top: top + window.scrollY, left: left + window.scrollX };\n    },\n    [],\n  );\n\n  const updateCoords = useCallback(() => {\n    if (!currentStep) return;\n\n    const element = document.querySelector(\n      `[data-onboarding-id=\"${currentStep.attribute}\"]`,\n    ) as HTMLElement;\n    if (element) {\n      const rect = element.getBoundingClientRect();\n      const padding = config.style?.padding || 0;\n\n      const paddedRect = {\n        top: rect.top - padding,\n        bottom: rect.bottom + padding,\n        left: rect.left - padding,\n        right: rect.right + padding,\n        width: rect.width + padding * 2,\n        height: rect.height + padding * 2,\n      };\n\n      const newCoords = {\n        top: paddedRect.top + window.scrollY,\n        left: paddedRect.left + window.scrollX,\n        width: paddedRect.width,\n        height: paddedRect.height,\n      };\n\n      const newPosition = calculateBestPosition(paddedRect);\n\n      setCoords((prev) => {\n        if (\n          prev &&\n          prev.top === newCoords.top &&\n          prev.left === newCoords.left &&\n          prev.width === newCoords.width &&\n          prev.height === newCoords.height\n        ) {\n          return prev;\n        }\n        return newCoords;\n      });\n\n      setPosition((prev) => {\n        if (prev.top === newPosition.top && prev.left === newPosition.left) {\n          return prev;\n        }\n        return newPosition;\n      });\n    } else {\n      setCoords(null);\n    }\n  }, [currentStep, calculateBestPosition, config.style]);\n\n  useEffect(() => {\n    updateCoords();\n    window.addEventListener('resize', updateCoords);\n    window.addEventListener('scroll', updateCoords);\n\n    const observer = new MutationObserver(updateCoords);\n    observer.observe(document.body, { childList: true, subtree: true, attributes: true });\n\n    let resizeObserver: ResizeObserver | null = null;\n    if (typeof ResizeObserver !== 'undefined') {\n      resizeObserver = new ResizeObserver(updateCoords);\n      resizeObserver.observe(document.body);\n\n      const element = currentStep?.attribute\n        ? document.querySelector(`[data-onboarding-id=\"${currentStep.attribute}\"]`)\n        : null;\n      if (element) {\n        resizeObserver.observe(element);\n      }\n    }\n\n    return () => {\n      window.removeEventListener('resize', updateCoords);\n      window.removeEventListener('scroll', updateCoords);\n      observer.disconnect();\n      if (resizeObserver) resizeObserver.disconnect();\n    };\n  }, [updateCoords, currentStep?.attribute]);\n\n  if (!currentStep || !coords) return null;\n\n  const maskStyle = {\n    ...config.style?.background,\n    transition: 'all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1)',\n  };\n\n  const stopPropagation = (e: React.PointerEvent | React.MouseEvent) => {\n    e.stopPropagation();\n  };\n\n  const ChevronLeftIcon = () => (\n    <svg\n      width=\"16\"\n      height=\"16\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    >\n      <path d=\"M15 18l-6-6 6-6\" />\n    </svg>\n  );\n\n  const ChevronRightIcon = () => (\n    <svg\n      width=\"16\"\n      height=\"16\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    >\n      <path d=\"M9 18l6-6-6-6\" />\n    </svg>\n  );\n\n  const XIcon = () => (\n    <svg\n      width=\"18\"\n      height=\"18\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    >\n      <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\" />\n      <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\" />\n    </svg>\n  );\n\n  const overlayContent = (\n    <div className=\"onboard-overlay-container\">\n      <div\n        style={{ height: coords.top, ...maskStyle }}\n        className=\"onboard-overlay-mask onboard-mask-top\"\n        onPointerDown={stopPropagation}\n        onMouseDown={stopPropagation}\n        onClick={stopPropagation}\n      />\n      <div\n        style={{\n          top: coords.top + coords.height,\n          height: `calc(100vh - ${coords.top + coords.height}px)`,\n          ...maskStyle,\n        }}\n        className=\"onboard-overlay-mask onboard-mask-bottom\"\n        onPointerDown={stopPropagation}\n        onMouseDown={stopPropagation}\n        onClick={stopPropagation}\n      />\n      <div\n        style={{ top: coords.top, height: coords.height, width: coords.left, ...maskStyle }}\n        className=\"onboard-overlay-mask onboard-mask-left\"\n        onPointerDown={stopPropagation}\n        onMouseDown={stopPropagation}\n        onClick={stopPropagation}\n      />\n      <div\n        style={{\n          top: coords.top,\n          height: coords.height,\n          left: coords.left + coords.width,\n          width: `calc(100% - ${coords.left + coords.width}px)`,\n          ...maskStyle,\n        }}\n        className=\"onboard-overlay-mask\"\n        onPointerDown={stopPropagation}\n        onMouseDown={stopPropagation}\n        onClick={stopPropagation}\n      />\n\n      <div\n        ref={tooltipRef}\n        className=\"onboard-tooltip\"\n        onPointerDown={handlePointerDown}\n        style={{\n          zIndex: 1000000,\n          ...config.style?.container,\n          top: position.top + dragOffset.y,\n          left: position.left + dragOffset.x,\n          transition:\n            'top 0.3s cubic-bezier(0.25, 0.1, 0.25, 1), left 0.3s cubic-bezier(0.25, 0.1, 0.25, 1)',\n          cursor: config.metadata.draggable ? 'grab' : 'auto',\n          touchAction: 'none',\n        }}\n        onMouseDown={stopPropagation}\n        onClick={stopPropagation}\n      >\n        <div className=\"onboard-tooltip-header\">\n          <h3 className=\"onboard-tooltip-title\">{currentStep.title}</h3>\n          <button\n            onClick={(e) => {\n              e.stopPropagation();\n              finish();\n            }}\n            className=\"onboard-close-button\"\n          >\n            <XIcon />\n          </button>\n        </div>\n        <p className=\"onboard-tooltip-description\">{currentStep.description}</p>\n\n        <div className=\"onboard-tooltip-footer\">\n          <button\n            onClick={(e) => {\n              e.stopPropagation();\n              prevStep();\n            }}\n            disabled={isFirstStep}\n            className=\"onboard-button-ghost\"\n            style={{\n              background: 'none',\n              border: 'none',\n              cursor: isFirstStep ? 'not-allowed' : 'pointer',\n              ...config.style?.prev,\n            }}\n          >\n            <ChevronLeftIcon />\n            Prev\n          </button>\n\n          {isLastStep ? (\n            <button\n              onClick={(e) => {\n                e.stopPropagation();\n                finish();\n              }}\n              className=\"onboard-button-primary\"\n              style={{ border: 'none', cursor: 'pointer', ...config.style?.finish }}\n            >\n              Finish\n            </button>\n          ) : (\n            <button\n              onClick={(e) => {\n                e.stopPropagation();\n                nextStep();\n              }}\n              className=\"onboard-button-primary\"\n              style={{\n                border: 'none',\n                cursor: 'pointer',\n                ...(isFirstStep ? config.style?.start : {}),\n                ...(!isFirstStep ? config.style?.next : {}),\n              }}\n            >\n              {isFirstStep && config.style?.start ? 'Start' : 'Next'}\n              {!(isFirstStep && config.style?.start) && <ChevronRightIcon />}\n            </button>\n          )}\n        </div>\n      </div>\n    </div>\n  );\n\n  return typeof document !== 'undefined' ? createPortal(overlayContent, document.body) : null;\n};\n"],"mappings":"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","names":["React","createContext","useContext","useEffect","useState","useCallback","useMemo","useEffectEvent","Cookies","useState","useEffect","useCallback","useRef","createPortal","jsx","jsxs","OnboardingOverlay","config","currentStep","nextStep","prevStep","finish","isFirstStep","isLastStep","useOnboarding","coords","setCoords","useState","position","setPosition","dragOffset","setDragOffset","isDragging","useRef","dragStart","tooltipRef","useEffect","handlePointerMove","useCallback","e","newX","newY","handlePointerUp","handlePointerDown","calculateBestPosition","rect","spaceAbove","spaceBelow","spaceLeft","spaceRight","top","left","updateCoords","element","padding","paddedRect","newCoords","newPosition","prev","observer","resizeObserver","maskStyle","stopPropagation","ChevronLeftIcon","ChevronRightIcon","XIcon","overlayContent","createPortal","Fragment","jsx","jsxs","OnboardingContext","createContext","COOKIE_NAME","OnboardingProvider","config","ssr","onNavigate","children","isMounted","setIsMounted","useState","state","setState","configRef","React","useEffect","onNavigateRef","handleNavigation","useCallback","link","isMatch","step","path","pattern","onRestoreState","useEffectEvent","currentConfig","currentPath","matchedStepIndex","savedState","Cookies","parsed","targetUrl","prevStep","element","e","prev","currentStep","useMemo","isFirstStep","isLastStep","totalSteps","isLastMainStep","hasSubSteps","nextStep","stepObj","currentActiveStep","nextSubIndex","nextSubStep","nextIndex","nextStepObj","prevIndex","prevStepObj","prevSubStepIndex","finish","goToStep","stepIndex","subStepIndex","value","OnboardingOverlay","useOnboarding","context","useContext"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "onboard-engine",
-  "version": "1.2.2",
+  "version": "1.4.1",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "types": "./dist/index.d.ts",
@@ -22,6 +22,9 @@
     "test": "vitest run",
     "test:watch": "vitest",
     "lint": "tsc --noEmit",
+    "lint:eslint": "eslint . --ext .ts,.tsx",
+    "format": "prettier --write .",
+    "check-format": "prettier --check .",
     "prepublishOnly": "npm run build"
   },
   "private": false,
@@ -48,15 +51,19 @@
     "@types/node": "^22.10.6",
     "@types/react": "^19.0.7",
     "@types/react-dom": "^19.0.3",
+    "@typescript-eslint/eslint-plugin": "^8.53.0",
+    "@typescript-eslint/parser": "^8.53.0",
     "@vitejs/plugin-react": "^4.3.4",
+    "eslint": "^8.57.1",
+    "eslint-plugin-react": "^7.37.5",
+    "eslint-plugin-react-hooks": "^7.0.1",
     "jsdom": "^26.0.0",
+    "prettier": "^3.8.0",
     "tsup": "^8.3.5",
     "typescript": "^5.7.3",
     "vitest": "^4.0.17"
   },
   "dependencies": {
-    "clsx": "^2.1.1",
-    "js-cookie": "^3.0.5",
-    "tailwind-merge": "^2.6.0"
+    "js-cookie": "^3.0.5"
   }
 }