@korsolutions/guidon 1.0.16 → 1.0.18

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (85) hide show
  1. package/README.md +72 -167
  2. package/dist/commonjs/components/GuidonOverlay.js +9 -20
  3. package/dist/commonjs/components/GuidonOverlay.js.map +1 -1
  4. package/dist/commonjs/components/GuidonProvider.js +11 -77
  5. package/dist/commonjs/components/GuidonProvider.js.map +1 -1
  6. package/dist/commonjs/components/GuidonTooltip.js +48 -55
  7. package/dist/commonjs/components/GuidonTooltip.js.map +1 -1
  8. package/dist/commonjs/components/index.js +2 -2
  9. package/dist/commonjs/components/index.js.map +1 -1
  10. package/dist/commonjs/hooks/useGuidonRef.js +38 -7
  11. package/dist/commonjs/hooks/useGuidonRef.js.map +1 -1
  12. package/dist/commonjs/index.js.map +1 -1
  13. package/dist/commonjs/store.js +27 -70
  14. package/dist/commonjs/store.js.map +1 -1
  15. package/dist/module/components/GuidonOverlay.js +14 -25
  16. package/dist/module/components/GuidonOverlay.js.map +1 -1
  17. package/dist/module/components/GuidonProvider.js +12 -78
  18. package/dist/module/components/GuidonProvider.js.map +1 -1
  19. package/dist/module/components/GuidonTooltip.js +53 -60
  20. package/dist/module/components/GuidonTooltip.js.map +1 -1
  21. package/dist/module/components/index.js +2 -2
  22. package/dist/module/components/index.js.map +1 -1
  23. package/dist/module/hooks/useGuidonRef.js +38 -7
  24. package/dist/module/hooks/useGuidonRef.js.map +1 -1
  25. package/dist/module/index.js.map +1 -1
  26. package/dist/module/store.js +27 -70
  27. package/dist/module/store.js.map +1 -1
  28. package/dist/typescript/commonjs/components/GuidonOverlay.d.ts +2 -2
  29. package/dist/typescript/commonjs/components/GuidonOverlay.d.ts.map +1 -1
  30. package/dist/typescript/commonjs/components/GuidonProvider.d.ts +4 -4
  31. package/dist/typescript/commonjs/components/GuidonProvider.d.ts.map +1 -1
  32. package/dist/typescript/commonjs/components/GuidonTarget.d.ts +1 -1
  33. package/dist/typescript/commonjs/components/GuidonTarget.d.ts.map +1 -1
  34. package/dist/typescript/commonjs/components/GuidonTooltip.d.ts +2 -2
  35. package/dist/typescript/commonjs/components/GuidonTooltip.d.ts.map +1 -1
  36. package/dist/typescript/commonjs/components/index.d.ts +4 -4
  37. package/dist/typescript/commonjs/components/index.d.ts.map +1 -1
  38. package/dist/typescript/commonjs/hooks/useGuidonRef.d.ts +1 -0
  39. package/dist/typescript/commonjs/hooks/useGuidonRef.d.ts.map +1 -1
  40. package/dist/typescript/commonjs/index.d.ts +1 -1
  41. package/dist/typescript/commonjs/index.d.ts.map +1 -1
  42. package/dist/typescript/commonjs/store.d.ts +11 -23
  43. package/dist/typescript/commonjs/store.d.ts.map +1 -1
  44. package/dist/typescript/commonjs/types.d.ts +29 -14
  45. package/dist/typescript/commonjs/types.d.ts.map +1 -1
  46. package/dist/typescript/module/components/GuidonOverlay.d.ts +2 -2
  47. package/dist/typescript/module/components/GuidonOverlay.d.ts.map +1 -1
  48. package/dist/typescript/module/components/GuidonProvider.d.ts +4 -4
  49. package/dist/typescript/module/components/GuidonProvider.d.ts.map +1 -1
  50. package/dist/typescript/module/components/GuidonTarget.d.ts +1 -1
  51. package/dist/typescript/module/components/GuidonTarget.d.ts.map +1 -1
  52. package/dist/typescript/module/components/GuidonTooltip.d.ts +2 -2
  53. package/dist/typescript/module/components/GuidonTooltip.d.ts.map +1 -1
  54. package/dist/typescript/module/components/index.d.ts +4 -4
  55. package/dist/typescript/module/components/index.d.ts.map +1 -1
  56. package/dist/typescript/module/hooks/useGuidonRef.d.ts +1 -0
  57. package/dist/typescript/module/hooks/useGuidonRef.d.ts.map +1 -1
  58. package/dist/typescript/module/index.d.ts +1 -1
  59. package/dist/typescript/module/index.d.ts.map +1 -1
  60. package/dist/typescript/module/store.d.ts +11 -23
  61. package/dist/typescript/module/store.d.ts.map +1 -1
  62. package/dist/typescript/module/types.d.ts +29 -14
  63. package/dist/typescript/module/types.d.ts.map +1 -1
  64. package/package.json +1 -1
  65. package/src/components/GuidonOverlay.tsx +28 -29
  66. package/src/components/GuidonProvider.tsx +46 -111
  67. package/src/components/GuidonTooltip.tsx +125 -91
  68. package/src/components/index.ts +4 -4
  69. package/src/hooks/useGuidonRef.ts +67 -9
  70. package/src/index.ts +1 -0
  71. package/src/store.ts +44 -75
  72. package/src/types.ts +30 -14
  73. package/dist/commonjs/babel.config.js +0 -15
  74. package/dist/commonjs/babel.config.js.map +0 -1
  75. package/dist/commonjs/bob.config.js +0 -11
  76. package/dist/commonjs/bob.config.js.map +0 -1
  77. package/dist/commonjs/tsconfig.json +0 -32
  78. package/dist/module/babel.config.js +0 -15
  79. package/dist/module/babel.config.js.map +0 -1
  80. package/dist/module/bob.config.js +0 -11
  81. package/dist/module/bob.config.js.map +0 -1
  82. package/dist/module/tsconfig.json +0 -32
  83. package/src/babel.config.js +0 -18
  84. package/src/bob.config.js +0 -14
  85. package/src/tsconfig.json +0 -32
@@ -1,4 +1,4 @@
1
- import type { GuidonTheme, GuidonStep } from '../types';
1
+ import type { GuidonStep, GuidonTheme } from "../types";
2
2
  interface GuidonTooltipProps {
3
3
  theme?: GuidonTheme;
4
4
  animationDuration?: number;
@@ -19,6 +19,6 @@ interface GuidonTooltipProps {
19
19
  waitingDefault?: string;
20
20
  };
21
21
  }
22
- export declare function GuidonTooltip({ theme, animationDuration, renderCustomTooltip, labels, }: GuidonTooltipProps): import("react/jsx-runtime").JSX.Element | null;
22
+ export declare function GuidonTooltip({ theme, animationDuration, renderCustomTooltip, labels, }: GuidonTooltipProps): import("react").JSX.Element | null;
23
23
  export {};
24
24
  //# sourceMappingURL=GuidonTooltip.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"GuidonTooltip.d.ts","sourceRoot":"","sources":["../../../../src/components/GuidonTooltip.tsx"],"names":[],"mappings":"AAkBA,OAAO,KAAK,EAAE,WAAW,EAAoD,UAAU,EAAoB,MAAM,UAAU,CAAC;AAyF5H,UAAU,kBAAkB;IAC1B,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,mBAAmB,CAAC,EAAE,CAAC,KAAK,EAAE;QAC5B,IAAI,EAAE,UAAU,CAAC;QACjB,YAAY,EAAE,MAAM,CAAC;QACrB,UAAU,EAAE,MAAM,CAAC;QACnB,MAAM,EAAE,MAAM,IAAI,CAAC;QACnB,UAAU,EAAE,MAAM,IAAI,CAAC;QACvB,MAAM,EAAE,MAAM,IAAI,CAAC;KACpB,KAAK,KAAK,CAAC,SAAS,CAAC;IACtB,MAAM,CAAC,EAAE;QACP,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,MAAM,CAAC,EAAE,MAAM,CAAC;QAChB,MAAM,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;QACpD,cAAc,CAAC,EAAE,MAAM,CAAC;KACzB,CAAC;CACH;AAED,wBAAgB,aAAa,CAAC,EAC5B,KAAU,EACV,iBAAuB,EACvB,mBAAmB,EACnB,MAAW,GACZ,EAAE,kBAAkB,kDAuRpB"}
1
+ {"version":3,"file":"GuidonTooltip.d.ts","sourceRoot":"","sources":["../../../../src/components/GuidonTooltip.tsx"],"names":[],"mappings":"AAkBA,OAAO,KAAK,EAEV,UAAU,EAEV,WAAW,EAGZ,MAAM,UAAU,CAAC;AAyFlB,UAAU,kBAAkB;IAC1B,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,mBAAmB,CAAC,EAAE,CAAC,KAAK,EAAE;QAC5B,IAAI,EAAE,UAAU,CAAC;QACjB,YAAY,EAAE,MAAM,CAAC;QACrB,UAAU,EAAE,MAAM,CAAC;QACnB,MAAM,EAAE,MAAM,IAAI,CAAC;QACnB,UAAU,EAAE,MAAM,IAAI,CAAC;QACvB,MAAM,EAAE,MAAM,IAAI,CAAC;KACpB,KAAK,KAAK,CAAC,SAAS,CAAC;IACtB,MAAM,CAAC,EAAE;QACP,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,MAAM,CAAC,EAAE,MAAM,CAAC;QAChB,MAAM,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;QACpD,cAAc,CAAC,EAAE,MAAM,CAAC;KACzB,CAAC;CACH;AAED,wBAAgB,aAAa,CAAC,EAC5B,KAAU,EACV,iBAAuB,EACvB,mBAAmB,EACnB,MAAW,GACZ,EAAE,kBAAkB,sCAkTpB"}
@@ -1,5 +1,5 @@
1
- export { GuidonTarget } from './GuidonTarget';
2
- export { GuidonOverlay } from './GuidonOverlay';
3
- export { GuidonTooltip } from './GuidonTooltip';
4
- export { GuidonProvider, useGuidonContext } from './GuidonProvider';
1
+ export { GuidonOverlay } from "./GuidonOverlay";
2
+ export { GuidonProvider, useGuidonContext } from "./GuidonProvider";
3
+ export { GuidonTarget } from "./GuidonTarget";
4
+ export { GuidonTooltip } from "./GuidonTooltip";
5
5
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AACpE,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC"}
@@ -5,6 +5,7 @@
5
5
  type MeasurableElement = {
6
6
  getBoundingClientRect?: () => DOMRect;
7
7
  measureInWindow?: (callback: (x: number, y: number, width: number, height: number) => void) => void;
8
+ scrollIntoView?: (options?: ScrollIntoViewOptions) => void;
8
9
  };
9
10
  /**
10
11
  * Hook that returns a function to attach to an element for guidon targeting.
@@ -1 +1 @@
1
- {"version":3,"file":"useGuidonRef.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useGuidonRef.ts"],"names":[],"mappings":"AAKA;;;GAGG;AACH,KAAK,iBAAiB,GAAG;IACvB,qBAAqB,CAAC,EAAE,MAAM,OAAO,CAAC;IACtC,eAAe,CAAC,EAAE,CAChB,QAAQ,EAAE,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,KACpE,IAAI,CAAC;CACX,CAAC;AAEF;;;;;;;;;;;;;;GAcG;AAEH,wBAAgB,SAAS;yBAuFV,MAAM,YACD,iBAAiB,GAAG,IAAI;EArF3C;AAED,wBAAgB,iBAAiB,eAkFlB,MAAM,YACD,iBAAiB,GAAG,IAAI,UAyD3C"}
1
+ {"version":3,"file":"useGuidonRef.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useGuidonRef.ts"],"names":[],"mappings":"AAKA;;;GAGG;AACH,KAAK,iBAAiB,GAAG;IACvB,qBAAqB,CAAC,EAAE,MAAM,OAAO,CAAC;IACtC,eAAe,CAAC,EAAE,CAChB,QAAQ,EAAE,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,KACpE,IAAI,CAAC;IACV,cAAc,CAAC,EAAE,CAAC,OAAO,CAAC,EAAE,qBAAqB,KAAK,IAAI,CAAC;CAC5D,CAAC;AA4BF;;;;;;;;;;;;;;GAcG;AAEH,wBAAgB,SAAS;yBAoGV,MAAM,YACD,iBAAiB,GAAG,IAAI;EAlG3C;AAED,wBAAgB,iBAAiB,eA+FlB,MAAM,YACD,iBAAiB,GAAG,IAAI,UA2E3C"}
@@ -1,7 +1,7 @@
1
1
  export { GuidonTarget, GuidonOverlay, GuidonTooltip, GuidonProvider, useGuidonContext, } from "./components";
2
2
  export { useGuidon } from "./hooks";
3
3
  export { useGuidonStore, Guidon, useGuidonActive, useGuidonStep, useGuidonProgress, useTargetMeasurements, useWaitingState, useIsFloatingStep, } from "./store";
4
- export type { GuidonStep, GuidonConfig, GuidonTours, GuidonToursConfig, GuidonTourDefinition, GuidonTheme, GuidonProgress, GuidonPersistenceAdapter, GuidonProviderProps, GuidonTargetProps, GuidonTooltipLabels, GuidonTooltipRenderProps, TooltipPosition, FloatingPosition, TargetMeasurements, GuidonState, GuidonActions, GuidonStore, } from "./types";
4
+ export type { GuidonStep, GuidonConfig, GuidonTours, GuidonToursConfig, GuidonTourDefinition, GuidonTheme, GuidonScrollOptions, GuidonProgress, GuidonPersistenceAdapter, GuidonProviderProps, GuidonTargetProps, GuidonTooltipLabels, GuidonTooltipRenderProps, TooltipPosition, FloatingPosition, TargetMeasurements, GuidonState, GuidonActions, GuidonStore, } from "./types";
5
5
  export { createNoopAdapter, createMemoryAdapter, createLocalStorageAdapter, createAsyncStorageAdapter, createApiAdapter, createCompositeAdapter, } from "./persistence/adapters";
6
6
  export { useGuidonPersistence, useShouldShowGuidon } from "./persistence/hooks";
7
7
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EACL,YAAY,EACZ,aAAa,EACb,aAAa,EACb,cAAc,EACd,gBAAgB,GACjB,MAAM,cAAc,CAAC;AAGtB,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAGpC,OAAO,EACL,cAAc,EACd,MAAM,EACN,eAAe,EACf,aAAa,EACb,iBAAiB,EACjB,qBAAqB,EACrB,eAAe,EACf,iBAAiB,GAClB,MAAM,SAAS,CAAC;AAGjB,YAAY,EACV,UAAU,EACV,YAAY,EACZ,WAAW,EACX,iBAAiB,EACjB,oBAAoB,EACpB,WAAW,EACX,cAAc,EACd,wBAAwB,EACxB,mBAAmB,EACnB,iBAAiB,EACjB,mBAAmB,EACnB,wBAAwB,EACxB,eAAe,EACf,gBAAgB,EAChB,kBAAkB,EAClB,WAAW,EACX,aAAa,EACb,WAAW,GACZ,MAAM,SAAS,CAAC;AAGjB,OAAO,EACL,iBAAiB,EACjB,mBAAmB,EACnB,yBAAyB,EACzB,yBAAyB,EACzB,gBAAgB,EAChB,sBAAsB,GACvB,MAAM,wBAAwB,CAAC;AAEhC,OAAO,EAAE,oBAAoB,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EACL,YAAY,EACZ,aAAa,EACb,aAAa,EACb,cAAc,EACd,gBAAgB,GACjB,MAAM,cAAc,CAAC;AAGtB,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAGpC,OAAO,EACL,cAAc,EACd,MAAM,EACN,eAAe,EACf,aAAa,EACb,iBAAiB,EACjB,qBAAqB,EACrB,eAAe,EACf,iBAAiB,GAClB,MAAM,SAAS,CAAC;AAGjB,YAAY,EACV,UAAU,EACV,YAAY,EACZ,WAAW,EACX,iBAAiB,EACjB,oBAAoB,EACpB,WAAW,EACX,mBAAmB,EACnB,cAAc,EACd,wBAAwB,EACxB,mBAAmB,EACnB,iBAAiB,EACjB,mBAAmB,EACnB,wBAAwB,EACxB,eAAe,EACf,gBAAgB,EAChB,kBAAkB,EAClB,WAAW,EACX,aAAa,EACb,WAAW,GACZ,MAAM,SAAS,CAAC;AAGjB,OAAO,EACL,iBAAiB,EACjB,mBAAmB,EACnB,yBAAyB,EACzB,yBAAyB,EACzB,gBAAgB,EAChB,sBAAsB,GACvB,MAAM,wBAAwB,CAAC;AAEhC,OAAO,EAAE,oBAAoB,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC"}
@@ -1,4 +1,4 @@
1
- import type { GuidonConfig, GuidonStore, GuidonTours, GuidonToursConfig, TargetMeasurements } from "./types";
1
+ import type { GuidonStore, GuidonTours, GuidonToursConfig, TargetMeasurements } from "./types";
2
2
  export declare const useGuidonStore: import("zustand").UseBoundStore<import("zustand").StoreApi<GuidonStore>>;
3
3
  /**
4
4
  * Guidon API for external control
@@ -6,14 +6,8 @@ export declare const useGuidonStore: import("zustand").UseBoundStore<import("zus
6
6
  */
7
7
  export declare const Guidon: {
8
8
  /**
9
- * Configure a single walkthrough (legacy API)
10
- */
11
- configure: (config: GuidonConfig) => void;
12
- /**
13
- * Configure multiple named tours.
14
- * Accepts either GuidonToursConfig (with global theme) or legacy GuidonTours format.
9
+ * Configure multiple named tours with optional global theme.
15
10
  * @example
16
- * // New format with global theme
17
11
  * Guidon.configureTours({
18
12
  * theme: { primaryColor: '#007AFF' },
19
13
  * tours: {
@@ -21,21 +15,14 @@ export declare const Guidon: {
21
15
  * profile: { id: 'profile', steps: [...] },
22
16
  * },
23
17
  * });
24
- *
25
- * // Legacy format (still supported)
26
- * Guidon.configureTours({
27
- * explore: { id: 'explore', steps: [...] },
28
- * profile: { id: 'profile', steps: [...] },
29
- * });
30
18
  */
31
- configureTours: (config: GuidonToursConfig | GuidonTours) => void;
19
+ configureTours: (config: GuidonToursConfig) => void;
32
20
  /**
33
- * Start a tour by ID, or the legacy single config if no ID provided
21
+ * Start a tour by ID
34
22
  * @example
35
23
  * Guidon.start('explore'); // Start the 'explore' tour
36
- * Guidon.start(); // Start legacy single config
37
24
  */
38
- start: (tourId?: string) => void;
25
+ start: (tourId: string) => void;
39
26
  /**
40
27
  * Stop the current tour without completing it
41
28
  */
@@ -73,7 +60,7 @@ export declare const Guidon: {
73
60
  */
74
61
  isCompleted: () => boolean;
75
62
  /**
76
- * Get the currently active tour ID (null if using legacy single config)
63
+ * Get the currently active tour ID
77
64
  */
78
65
  getActiveTourId: () => string | null;
79
66
  /**
@@ -101,15 +88,15 @@ export declare const Guidon: {
101
88
  * Hook selectors for common use cases
102
89
  */
103
90
  export declare const useGuidonActive: () => boolean;
104
- export declare const useGuidonStep: () => import("./types").GuidonStep | null;
91
+ export declare const useGuidonStep: () => import("./types").GuidonStep | null | undefined;
105
92
  export declare const useGuidonProgress: () => {
106
93
  currentStep: number;
107
94
  totalSteps: number;
108
95
  percentage: number;
109
96
  };
110
- export declare const useTargetMeasurements: (targetId: string) => TargetMeasurements;
97
+ export declare const useTargetMeasurements: (targetId: string) => TargetMeasurements | undefined;
111
98
  /**
112
- * Hook to check if the guidon is waiting for a target element to mount
99
+ * Hook to check if the Guidon is waiting for a target element to mount
113
100
  * Returns null if not active, not waiting, or if it's a floating step
114
101
  */
115
102
  export declare const useWaitingState: () => {
@@ -118,7 +105,8 @@ export declare const useWaitingState: () => {
118
105
  message: string | null;
119
106
  } | null;
120
107
  /**
121
- * Hook to check if the current step is a floating step (no target element)
108
+ * Hook to check if the current step is a floating step,
109
+ * i.e. has no targetId and is centered on device
122
110
  */
123
111
  export declare const useIsFloatingStep: () => boolean;
124
112
  //# sourceMappingURL=store.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"store.d.ts","sourceRoot":"","sources":["../../../src/store.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,WAAW,EAAE,WAAW,EAAE,iBAAiB,EAAe,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAkB1H,eAAO,MAAM,cAAc,0EAkPxB,CAAC;AAEJ;;;GAGG;AACH,eAAO,MAAM,MAAM;IACjB;;OAEG;wBACiB,YAAY;IAIhC;;;;;;;;;;;;;;;;;;OAkBG;6BACsB,iBAAiB,GAAG,WAAW;IAIxD;;;;;OAKG;qBACc,MAAM;IAIvB;;OAEG;;IAKH;;OAEG;;IAKH;;OAEG;;IAKH;;OAEG;sBACe,MAAM;IAIxB;;OAEG;;IAKH;;OAEG;;IAKH;;OAEG;;IAKH;;OAEG;;IAKH;;OAEG;;IAKH;;OAEG;;IAKH;;OAEG;;IAKH;;OAEG;;IAKH;;OAEG;;IAMH;;OAEG;;IAKH;;OAEG;;CAEJ,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,eAAe,eAC4B,CAAC;AAEzD,eAAO,MAAM,aAAa,2CAItB,CAAC;AAEL,eAAO,MAAM,iBAAiB;;;;CAS3B,CAAC;AAEJ,eAAO,MAAM,qBAAqB,GAAI,UAAU,MAAM,uBACsB,CAAC;AAE7E;;;GAGG;AACH,eAAO,MAAM,eAAe;;;;QAmBzB,CAAC;AAEJ;;GAEG;AACH,eAAO,MAAM,iBAAiB,eAI1B,CAAC"}
1
+ {"version":3,"file":"store.d.ts","sourceRoot":"","sources":["../../../src/store.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAEV,WAAW,EAEX,WAAW,EACX,iBAAiB,EACjB,kBAAkB,EACnB,MAAM,SAAS,CAAC;AAkBjB,eAAO,MAAM,cAAc,0EA2NxB,CAAC;AAEJ;;;GAGG;AACH,eAAO,MAAM,MAAM;IACjB;;;;;;;;;;OAUG;6BACsB,iBAAiB;IAI1C;;;;OAIG;oBACa,MAAM;IAItB;;OAEG;;IAKH;;OAEG;;IAKH;;OAEG;;IAKH;;OAEG;sBACe,MAAM;IAIxB;;OAEG;;IAKH;;OAEG;;IAKH;;OAEG;;IAKH;;OAEG;;IAKH;;OAEG;;IAKH;;OAEG;;IAKH;;OAEG;;IAKH;;OAEG;;IAKH;;OAEG;;IAMH;;OAEG;;IAKH;;OAEG;;CAEJ,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,eAAe,eAC4B,CAAC;AAEzD,eAAO,MAAM,aAAa,uDAItB,CAAC;AAEL,eAAO,MAAM,iBAAiB;;;;CAS3B,CAAC;AAEJ,eAAO,MAAM,qBAAqB,GAAI,UAAU,MAAM,mCACsB,CAAC;AAE7E;;;GAGG;AACH,eAAO,MAAM,eAAe;;;;QAmBzB,CAAC;AAEJ;;;GAGG;AACH,eAAO,MAAM,iBAAiB,eAI1B,CAAC"}
@@ -48,6 +48,26 @@ export interface GuidonStep {
48
48
  waitingMessage?: string;
49
49
  /** Timeout in ms before auto-skipping this step (0 = no timeout) */
50
50
  waitTimeout?: number;
51
+ /**
52
+ * Whether to scroll the target element into view when this step becomes active.
53
+ * On web: uses native scrollIntoView()
54
+ * On mobile: requires a registered scroll container
55
+ * @default true
56
+ */
57
+ scrollIntoView?: boolean;
58
+ }
59
+ /**
60
+ * Scroll behavior configuration
61
+ */
62
+ export interface GuidonScrollOptions {
63
+ /** Scroll behavior: 'smooth' for animated, 'instant' for immediate */
64
+ behavior?: 'smooth' | 'instant';
65
+ /** Vertical alignment of target in viewport */
66
+ block?: 'start' | 'center' | 'end' | 'nearest';
67
+ /** Horizontal alignment of target in viewport */
68
+ inline?: 'start' | 'center' | 'end' | 'nearest';
69
+ /** Extra padding when scrolling (ensures element isn't at edge) */
70
+ padding?: number;
51
71
  }
52
72
  /**
53
73
  * Theme configuration for guidon styling
@@ -75,6 +95,8 @@ export interface GuidonTheme {
75
95
  spotlightBorderRadius?: number;
76
96
  /** Padding around the highlighted element */
77
97
  spotlightPadding?: number;
98
+ /** Global scroll options when navigating to steps */
99
+ scrollOptions?: GuidonScrollOptions;
78
100
  }
79
101
  /**
80
102
  * State of a specific guidon tour
@@ -165,10 +187,8 @@ export interface GuidonTooltipRenderProps {
165
187
  */
166
188
  export interface GuidonProviderProps {
167
189
  children: ReactNode;
168
- /** Configuration for the guidon (optional when using configureTours) */
169
- config?: GuidonConfig;
170
- /** Whether to auto-start when the component mounts */
171
- autoStart?: boolean;
190
+ /** Tour ID to auto-start when the provider mounts */
191
+ autoStart?: string;
172
192
  /** Condition function to determine if guidon should start */
173
193
  shouldStart?: () => boolean | Promise<boolean>;
174
194
  /** Persistence adapter for saving/loading progress */
@@ -255,7 +275,7 @@ export interface GuidonState {
255
275
  globalAnimationDuration?: number;
256
276
  /** ID of the currently active tour */
257
277
  activeTourId: string | null;
258
- /** Currently active guidon config (derived from tours + activeTourId, or legacy single config) */
278
+ /** Currently active guidon config (derived from tours + activeTourId) */
259
279
  config: GuidonConfig | null;
260
280
  /** Whether the guidon is currently active */
261
281
  isActive: boolean;
@@ -278,15 +298,10 @@ export interface GuidonState {
278
298
  * Internal store actions
279
299
  */
280
300
  export interface GuidonActions {
281
- /** Configure a single guidon (legacy API, still supported) */
282
- configure: (config: GuidonConfig) => void;
283
- /**
284
- * Configure multiple named tours.
285
- * Accepts either GuidonToursConfig (with global theme) or legacy GuidonTours format.
286
- */
287
- configureTours: (config: GuidonToursConfig | GuidonTours) => void;
288
- /** Start a tour by ID, or the legacy single config if no ID provided */
289
- start: (tourId?: string) => void;
301
+ /** Configure multiple named tours with global theme support */
302
+ configureTours: (config: GuidonToursConfig) => void;
303
+ /** Start a tour by ID */
304
+ start: (tourId: string) => void;
290
305
  /** Stop the current tour without completing it */
291
306
  stop: () => void;
292
307
  /** Go to the next step */
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/types.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/types.ts"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@korsolutions/guidon",
3
- "version": "1.0.16",
3
+ "version": "1.0.18",
4
4
  "description": "A cross-platform walkthrough/onboarding component library for React Native with web support. Features spotlight effects, customizable tooltips, and flexible persistence options. ",
5
5
  "repository": "https://github.com/KorSoftwareSolutions/guidon.git",
6
6
  "author": "Christian Jimenez <christianjimenezfael@gmail.com>",
@@ -1,28 +1,31 @@
1
- import { useMemo } from 'react';
1
+ import { useMemo } from "react";
2
2
  import {
3
- StyleSheet,
4
3
  Dimensions,
5
- TouchableWithoutFeedback,
6
4
  Platform,
7
- } from 'react-native';
5
+ StyleSheet,
6
+ TouchableWithoutFeedback,
7
+ } from "react-native";
8
8
  import Animated, {
9
+ Easing,
9
10
  useAnimatedStyle,
10
11
  withTiming,
11
- Easing,
12
- } from 'react-native-reanimated';
13
- import Svg, { Defs, Mask, Rect, G } from 'react-native-svg';
14
- import { useGuidonStore, useWaitingState, useIsFloatingStep } from '../store';
15
- import type { TargetMeasurements, GuidonTheme, GuidonStore } from '../types';
12
+ } from "react-native-reanimated";
13
+ import Svg, { Defs, G, Mask, Rect } from "react-native-svg";
14
+ import { useGuidonStore, useIsFloatingStep, useWaitingState } from "../store";
15
+ import type { GuidonStore, GuidonTheme, TargetMeasurements } from "../types";
16
16
 
17
17
  const AnimatedSvg = Animated.createAnimatedComponent(Svg);
18
18
 
19
19
  const DEFAULT_THEME: Required<
20
20
  Pick<
21
21
  GuidonTheme,
22
- 'backdropColor' | 'backdropOpacity' | 'spotlightBorderRadius' | 'spotlightPadding'
22
+ | "backdropColor"
23
+ | "backdropOpacity"
24
+ | "spotlightBorderRadius"
25
+ | "spotlightPadding"
23
26
  >
24
27
  > = {
25
- backdropColor: '#000000',
28
+ backdropColor: "#000000",
26
29
  backdropOpacity: 0.7,
27
30
  spotlightBorderRadius: 8,
28
31
  spotlightPadding: 8,
@@ -41,16 +44,19 @@ export function GuidonOverlay({
41
44
  }: GuidonOverlayProps) {
42
45
  const isActive = useGuidonStore((state: GuidonStore) => state.isActive);
43
46
  const config = useGuidonStore((state: GuidonStore) => state.config);
44
- const currentStepIndex = useGuidonStore((state: GuidonStore) => state.currentStepIndex);
45
- const targetMeasurements = useGuidonStore((state: GuidonStore) => state.targetMeasurements);
47
+ const currentStepIndex = useGuidonStore(
48
+ (state: GuidonStore) => state.currentStepIndex,
49
+ );
50
+ const targetMeasurements = useGuidonStore(
51
+ (state: GuidonStore) => state.targetMeasurements,
52
+ );
46
53
 
47
- // Check for floating or waiting states
48
54
  const isFloatingStep = useIsFloatingStep();
49
55
  const waitingState = useWaitingState();
50
56
  const isWaiting = waitingState?.isWaiting ?? false;
51
57
 
52
58
  const mergedTheme = { ...DEFAULT_THEME, ...theme };
53
- const { width: screenWidth, height: screenHeight } = Dimensions.get('window');
59
+ const { width: screenWidth, height: screenHeight } = Dimensions.get("window");
54
60
 
55
61
  // Get current step's target measurements
56
62
  const currentStep = config?.steps[currentStepIndex];
@@ -59,10 +65,9 @@ export function GuidonOverlay({
59
65
  ? targetMeasurements[currentTargetId]
60
66
  : undefined;
61
67
 
62
- // Determine if we should show full backdrop (no spotlight cutout)
63
68
  const showFullBackdrop = isFloatingStep || isWaiting;
64
69
 
65
- // Calculate spotlight dimensions with padding
70
+ // Calculations for spotlight dimensions with padding
66
71
  const spotlight = useMemo(() => {
67
72
  if (!measurements) {
68
73
  return { x: 0, y: 0, width: 0, height: 0 };
@@ -75,8 +80,7 @@ export function GuidonOverlay({
75
80
  };
76
81
  }, [measurements, mergedTheme.spotlightPadding]);
77
82
 
78
- // Animated styles for fade in/out
79
- // Show backdrop for: normal steps with measurements, floating steps, or waiting states
83
+ //Stylized for fade in/out
80
84
  const shouldShow = isActive && (measurements || showFullBackdrop);
81
85
  const animatedStyle = useAnimatedStyle(() => {
82
86
  return {
@@ -91,15 +95,14 @@ export function GuidonOverlay({
91
95
  return null;
92
96
  }
93
97
 
94
- // Render full backdrop without spotlight for floating steps or waiting states
95
98
  if (showFullBackdrop) {
96
- if (Platform.OS === 'web') {
99
+ if (Platform.OS === "web") {
97
100
  return (
98
101
  <TouchableWithoutFeedback onPress={onBackdropPress}>
99
102
  <Animated.View style={[styles.container, animatedStyle]}>
100
103
  <div
101
104
  style={{
102
- position: 'absolute',
105
+ position: "absolute",
103
106
  inset: 0,
104
107
  backgroundColor: mergedTheme.backdropColor,
105
108
  opacity: mergedTheme.backdropOpacity,
@@ -132,19 +135,17 @@ export function GuidonOverlay({
132
135
  );
133
136
  }
134
137
 
135
- // If we have a target but no measurements yet, don't render anything
136
138
  if (!measurements) {
137
139
  return null;
138
140
  }
139
141
 
140
- // For web, use a different approach with CSS
141
- if (Platform.OS === 'web') {
142
+ if (Platform.OS === "web") {
142
143
  return (
143
144
  <TouchableWithoutFeedback onPress={onBackdropPress}>
144
145
  <Animated.View style={[styles.container, animatedStyle]}>
145
146
  <div
146
147
  style={{
147
- position: 'absolute',
148
+ position: "absolute",
148
149
  inset: 0,
149
150
  backgroundColor: mergedTheme.backdropColor,
150
151
  opacity: mergedTheme.backdropOpacity,
@@ -167,7 +168,7 @@ export function GuidonOverlay({
167
168
  );
168
169
  }
169
170
 
170
- // Native implementation using SVG mask
171
+ // Native implementation
171
172
  return (
172
173
  <TouchableWithoutFeedback onPress={onBackdropPress}>
173
174
  <AnimatedSvg
@@ -178,9 +179,7 @@ export function GuidonOverlay({
178
179
  >
179
180
  <Defs>
180
181
  <Mask id="spotlight-mask">
181
- {/* White background (visible) */}
182
182
  <Rect x="0" y="0" width="100%" height="100%" fill="white" />
183
- {/* Black cutout (transparent) */}
184
183
  <Rect
185
184
  x={spotlight.x}
186
185
  y={spotlight.y}
@@ -1,19 +1,15 @@
1
- import { useEffect, useCallback, useRef, createContext, useContext } from 'react';
2
- import { useGuidonStore, useWaitingState } from '../store';
3
- import { useGuidonPersistence } from '../persistence/hooks';
4
- import { GuidonOverlay } from './GuidonOverlay';
5
- import { GuidonTooltip } from './GuidonTooltip';
6
- import type {
7
- GuidonProviderProps,
8
- GuidonConfig,
9
- GuidonStore,
10
- } from '../types';
1
+ import { createContext, useCallback, useContext, useEffect } from "react";
2
+ import { useGuidonPersistence } from "../persistence/hooks";
3
+ import { useGuidonStore, useWaitingState } from "../store";
4
+ import type { GuidonProviderProps, GuidonStore } from "../types";
5
+ import { GuidonOverlay } from "./GuidonOverlay";
6
+ import { GuidonTooltip } from "./GuidonTooltip";
11
7
 
12
8
  interface GuidonContextValue {
13
- start: (tourId?: string) => void;
9
+ start: (tourId: string) => void;
14
10
  skip: () => void;
15
11
  reset: () => void;
16
- replay: () => Promise<void>;
12
+ replay: (tourId: string) => Promise<void>;
17
13
  isActive: boolean;
18
14
  isCompleted: boolean;
19
15
  isLoading: boolean;
@@ -24,28 +20,27 @@ const GuidonContext = createContext<GuidonContextValue | null>(null);
24
20
  export function useGuidonContext() {
25
21
  const context = useContext(GuidonContext);
26
22
  if (!context) {
27
- throw new Error('useGuidonContext must be used within a GuidonProvider');
23
+ throw new Error("useGuidonContext must be used within a GuidonProvider");
28
24
  }
29
25
  return context;
30
26
  }
31
27
 
32
28
  export function GuidonProvider({
33
29
  children,
34
- config,
35
- autoStart = true,
36
- shouldStart,
37
30
  persistenceAdapter,
38
31
  portalComponent: Portal,
39
32
  renderTooltip,
40
33
  tooltipLabels,
41
34
  onBackdropPress,
42
35
  }: GuidonProviderProps) {
43
- const hasInitialized = useRef(false);
44
36
  const isActive = useGuidonStore((state: GuidonStore) => state.isActive);
45
- const storeIsCompleted = useGuidonStore((state: GuidonStore) => state.isCompleted);
37
+ const storeIsCompleted = useGuidonStore(
38
+ (state: GuidonStore) => state.isCompleted,
39
+ );
46
40
  const storeConfig = useGuidonStore((state: GuidonStore) => state.config);
47
- const currentStepIndex = useGuidonStore((state: GuidonStore) => state.currentStepIndex);
48
- const configure = useGuidonStore((state: GuidonStore) => state.configure);
41
+ const currentStepIndex = useGuidonStore(
42
+ (state: GuidonStore) => state.currentStepIndex,
43
+ );
49
44
  const start = useGuidonStore((state: GuidonStore) => state.start);
50
45
  const next = useGuidonStore((state: GuidonStore) => state.next);
51
46
  const skip = useGuidonStore((state: GuidonStore) => state.skip);
@@ -54,89 +49,22 @@ export function GuidonProvider({
54
49
  // Check for waiting state (target element not mounted)
55
50
  const waitingState = useWaitingState();
56
51
 
57
- // Use config prop ID for persistence, or fall back to store config ID
58
- const persistenceId = config?.id ?? storeConfig?.id ?? '__guidon_default__';
52
+ // Use store config ID for persistence
53
+ const persistenceId = storeConfig?.id ?? "__guidon_default__";
59
54
 
60
55
  const {
61
56
  isLoading,
62
57
  isCompleted: persistedCompleted,
63
- markCompleted,
64
- markStepViewed,
65
58
  clearProgress,
66
59
  } = useGuidonPersistence(persistenceAdapter, persistenceId);
67
60
 
68
61
  const isCompleted = storeIsCompleted || persistedCompleted;
69
62
 
70
- // Track if we've already configured to prevent re-configuring during active tour
71
- const hasConfigured = useRef(false);
72
- const configRef = useRef(config);
73
- configRef.current = config;
74
-
75
- // Only configure if a config prop is provided (legacy single-config mode)
76
- // Don't reconfigure if a tour is already active
77
- useEffect(() => {
78
- if (!config) return;
79
- if (isActive) return; // Don't reconfigure while tour is running
80
- if (hasConfigured.current && configRef.current === config) return; // Same config, already configured
81
-
82
- hasConfigured.current = true;
83
-
84
- const enhancedConfig: GuidonConfig = {
85
- ...config,
86
- onComplete: async () => {
87
- config.onComplete?.();
88
- if (persistenceAdapter) {
89
- await markCompleted();
90
- }
91
- },
92
- onSkip: async () => {
93
- config.onSkip?.();
94
- if (persistenceAdapter) {
95
- // Get current step index from store at time of skip
96
- const currentIdx = useGuidonStore.getState().currentStepIndex;
97
- await markStepViewed(currentIdx);
98
- }
99
- },
100
- onStepChange: async (stepIndex, step) => {
101
- config.onStepChange?.(stepIndex, step);
102
- if (persistenceAdapter) {
103
- await markStepViewed(stepIndex);
104
- }
105
- },
106
- };
107
-
108
- configure(enhancedConfig);
109
- }, [config, configure, persistenceAdapter, markCompleted, markStepViewed, isActive]);
110
-
111
- // Auto-start only in legacy single-config mode
112
- useEffect(() => {
113
- if (!config || !autoStart || hasInitialized.current || isLoading) return;
114
-
115
- const checkAndStart = async () => {
116
- hasInitialized.current = true;
117
-
118
- if (persistedCompleted) return;
119
-
120
- if (shouldStart) {
121
- const should = await shouldStart();
122
- if (!should) return;
123
- }
124
-
125
- setTimeout(() => {
126
- start();
127
- }, 500);
128
- };
129
-
130
- checkAndStart();
131
- }, [config, autoStart, isLoading, persistedCompleted, shouldStart, start]);
132
-
133
63
  // Handle wait timeout - auto-skip to next step if waiting too long
134
- // Works for both legacy and multi-tour mode (reads from store)
135
64
  useEffect(() => {
136
- const activeConfig = storeConfig;
137
- if (!activeConfig) return;
65
+ if (!storeConfig) return;
138
66
 
139
- const currentStep = activeConfig.steps[currentStepIndex];
67
+ const currentStep = storeConfig.steps[currentStepIndex];
140
68
  const waitTimeout = currentStep?.waitTimeout;
141
69
 
142
70
  // Only set timeout if:
@@ -149,7 +77,9 @@ export function GuidonProvider({
149
77
 
150
78
  const timer = setTimeout(() => {
151
79
  // Check if we're still waiting when the timeout fires
152
- const stillWaiting = useGuidonStore.getState().targetMeasurements[currentStep.targetId!] === undefined;
80
+ const stillWaiting =
81
+ useGuidonStore.getState().targetMeasurements[currentStep.targetId!] ===
82
+ undefined;
153
83
  if (stillWaiting) {
154
84
  next(); // Skip to next step
155
85
  }
@@ -158,22 +88,27 @@ export function GuidonProvider({
158
88
  return () => clearTimeout(timer);
159
89
  }, [currentStepIndex, storeConfig, waitingState?.isWaiting, next]);
160
90
 
161
- const replay = useCallback(async () => {
162
- if (persistenceAdapter) {
163
- await clearProgress();
164
- }
165
- reset();
166
- hasInitialized.current = false;
167
- setTimeout(() => {
168
- start();
169
- }, 100);
170
- }, [persistenceAdapter, clearProgress, reset, start]);
171
-
172
- const manualStart = useCallback((tourId?: string) => {
173
- if (!isActive && !isLoading) {
174
- start(tourId);
175
- }
176
- }, [isActive, isLoading, start]);
91
+ const replay = useCallback(
92
+ async (tourId: string) => {
93
+ if (persistenceAdapter) {
94
+ await clearProgress();
95
+ }
96
+ reset();
97
+ setTimeout(() => {
98
+ start(tourId);
99
+ }, 100);
100
+ },
101
+ [persistenceAdapter, clearProgress, reset, start],
102
+ );
103
+
104
+ const manualStart = useCallback(
105
+ (tourId: string) => {
106
+ if (!isActive && !isLoading) {
107
+ start(tourId);
108
+ }
109
+ },
110
+ [isActive, isLoading, start],
111
+ );
177
112
 
178
113
  const contextValue: GuidonContextValue = {
179
114
  start: manualStart,
@@ -185,9 +120,9 @@ export function GuidonProvider({
185
120
  isLoading,
186
121
  };
187
122
 
188
- // Get theme from prop config or store config
189
- const activeTheme = config?.theme ?? storeConfig?.theme;
190
- const activeDuration = config?.animationDuration ?? storeConfig?.animationDuration;
123
+ // Get theme from store config
124
+ const activeTheme = storeConfig?.theme;
125
+ const activeDuration = storeConfig?.animationDuration;
191
126
 
192
127
  const overlayContent = (
193
128
  <>