@eventop/sdk 1.0.6 → 1.0.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +5 -5
- package/dist/index.d.ts +4 -4
- package/dist/index.js +5 -5
- package/dist/react/index.cjs +5 -5
- package/dist/react/index.d.ts +33 -33
- package/dist/react/index.js +5 -5
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -30,16 +30,16 @@ function useFeatureScope() {
|
|
|
30
30
|
*
|
|
31
31
|
* The live map of everything currently mounted in the React tree.
|
|
32
32
|
*
|
|
33
|
-
* Features — registered by
|
|
34
|
-
* Flow steps — registered by
|
|
33
|
+
* Features — registered by EventopTarget
|
|
34
|
+
* Flow steps — registered by EventopStep, attached to a feature by id
|
|
35
35
|
*
|
|
36
36
|
* Both features and steps can live anywhere in the component tree.
|
|
37
|
-
* They don't need to be co-located.
|
|
37
|
+
* They don't need to be co-located. An EventopStep just needs to know
|
|
38
38
|
* which feature id it belongs to.
|
|
39
39
|
*
|
|
40
40
|
* Nested steps:
|
|
41
41
|
* Steps can themselves have children steps (sub-steps) by passing
|
|
42
|
-
* a parentStep prop to
|
|
42
|
+
* a parentStep prop to EventopStep. This lets you model flows like:
|
|
43
43
|
*
|
|
44
44
|
* Feature: "Create styled text"
|
|
45
45
|
* Step 0: Click Add Text
|
|
@@ -466,7 +466,7 @@ function useEventopTour() {
|
|
|
466
466
|
};
|
|
467
467
|
}
|
|
468
468
|
|
|
469
|
-
exports.
|
|
469
|
+
exports.EventopAIProvider = EventopProvider;
|
|
470
470
|
exports.EventopStep = EventopStep;
|
|
471
471
|
exports.EventopTarget = EventopTarget;
|
|
472
472
|
exports.useEventop = useEventop;
|
package/dist/index.d.ts
CHANGED
|
@@ -233,7 +233,7 @@ export interface EventopSDK {
|
|
|
233
233
|
*
|
|
234
234
|
* @example
|
|
235
235
|
* const ok = await validateEmail(email);
|
|
236
|
-
* if (ok)
|
|
236
|
+
* if (ok) EventopAI.stepComplete();
|
|
237
237
|
*/
|
|
238
238
|
stepComplete(): void;
|
|
239
239
|
|
|
@@ -241,7 +241,7 @@ export interface EventopSDK {
|
|
|
241
241
|
* Block tour advancement and show an inline error in the current step tooltip.
|
|
242
242
|
*
|
|
243
243
|
* @example
|
|
244
|
-
*
|
|
244
|
+
* EventopAI.stepFail('Please enter a valid email address.');
|
|
245
245
|
*/
|
|
246
246
|
stepFail(message: string): void;
|
|
247
247
|
|
|
@@ -255,5 +255,5 @@ export interface EventopSDK {
|
|
|
255
255
|
_updateConfig(partial: Partial<Config>): void;
|
|
256
256
|
}
|
|
257
257
|
|
|
258
|
-
declare const
|
|
259
|
-
export default
|
|
258
|
+
declare const EventopAI: EventopSDK;
|
|
259
|
+
export default EventopAI;
|
package/dist/index.js
CHANGED
|
@@ -28,16 +28,16 @@ function useFeatureScope() {
|
|
|
28
28
|
*
|
|
29
29
|
* The live map of everything currently mounted in the React tree.
|
|
30
30
|
*
|
|
31
|
-
* Features — registered by
|
|
32
|
-
* Flow steps — registered by
|
|
31
|
+
* Features — registered by EventopTarget
|
|
32
|
+
* Flow steps — registered by EventopStep, attached to a feature by id
|
|
33
33
|
*
|
|
34
34
|
* Both features and steps can live anywhere in the component tree.
|
|
35
|
-
* They don't need to be co-located.
|
|
35
|
+
* They don't need to be co-located. An EventopStep just needs to know
|
|
36
36
|
* which feature id it belongs to.
|
|
37
37
|
*
|
|
38
38
|
* Nested steps:
|
|
39
39
|
* Steps can themselves have children steps (sub-steps) by passing
|
|
40
|
-
* a parentStep prop to
|
|
40
|
+
* a parentStep prop to EventopStep. This lets you model flows like:
|
|
41
41
|
*
|
|
42
42
|
* Feature: "Create styled text"
|
|
43
43
|
* Step 0: Click Add Text
|
|
@@ -464,4 +464,4 @@ function useEventopTour() {
|
|
|
464
464
|
};
|
|
465
465
|
}
|
|
466
466
|
|
|
467
|
-
export { EventopProvider, EventopStep, EventopTarget, useEventop, useEventopTour };
|
|
467
|
+
export { EventopProvider as EventopAIProvider, EventopStep, EventopTarget, useEventop, useEventopTour };
|
package/dist/react/index.cjs
CHANGED
|
@@ -30,16 +30,16 @@ function useFeatureScope() {
|
|
|
30
30
|
*
|
|
31
31
|
* The live map of everything currently mounted in the React tree.
|
|
32
32
|
*
|
|
33
|
-
* Features — registered by
|
|
34
|
-
* Flow steps — registered by
|
|
33
|
+
* Features — registered by EventopTarget
|
|
34
|
+
* Flow steps — registered by EventopStep, attached to a feature by id
|
|
35
35
|
*
|
|
36
36
|
* Both features and steps can live anywhere in the component tree.
|
|
37
|
-
* They don't need to be co-located.
|
|
37
|
+
* They don't need to be co-located. An EventopStep just needs to know
|
|
38
38
|
* which feature id it belongs to.
|
|
39
39
|
*
|
|
40
40
|
* Nested steps:
|
|
41
41
|
* Steps can themselves have children steps (sub-steps) by passing
|
|
42
|
-
* a parentStep prop to
|
|
42
|
+
* a parentStep prop to EventopStep. This lets you model flows like:
|
|
43
43
|
*
|
|
44
44
|
* Feature: "Create styled text"
|
|
45
45
|
* Step 0: Click Add Text
|
|
@@ -466,7 +466,7 @@ function useEventopTour() {
|
|
|
466
466
|
};
|
|
467
467
|
}
|
|
468
468
|
|
|
469
|
-
exports.
|
|
469
|
+
exports.EventopAIProvider = EventopProvider;
|
|
470
470
|
exports.EventopStep = EventopStep;
|
|
471
471
|
exports.EventopTarget = EventopTarget;
|
|
472
472
|
exports.useEventop = useEventop;
|
package/dist/react/index.d.ts
CHANGED
|
@@ -3,7 +3,7 @@ import { ProviderFn, Theme, Position, AdvanceOn } from '../index.js';
|
|
|
3
3
|
|
|
4
4
|
// ─── Provider ────────────────────────────────────────────────────────────────
|
|
5
5
|
|
|
6
|
-
export interface
|
|
6
|
+
export interface EventopAIProviderProps {
|
|
7
7
|
children: ReactNode;
|
|
8
8
|
/** AI provider function. Use providers.custom() in production. */
|
|
9
9
|
provider: ProviderFn;
|
|
@@ -19,23 +19,23 @@ export interface ShepherdAIProviderProps {
|
|
|
19
19
|
|
|
20
20
|
/**
|
|
21
21
|
* Root provider. Drop this once at the top of your app.
|
|
22
|
-
* All
|
|
22
|
+
* All EventopTarget and EventopStep components anywhere in the tree
|
|
23
23
|
* register with this provider automatically.
|
|
24
24
|
*
|
|
25
25
|
* @example
|
|
26
|
-
* <
|
|
26
|
+
* <EventopAIProvider
|
|
27
27
|
* provider={myServerFetcher}
|
|
28
28
|
* appName="My App"
|
|
29
29
|
* theme={{ mode: 'auto', tokens: { accent: '#6366f1' } }}
|
|
30
30
|
* >
|
|
31
31
|
* <App />
|
|
32
|
-
* </
|
|
32
|
+
* </EventopAIProvider>
|
|
33
33
|
*/
|
|
34
|
-
export const
|
|
34
|
+
export const EventopAIProvider: FC<EventopAIProviderProps>;
|
|
35
35
|
|
|
36
|
-
// ───
|
|
36
|
+
// ─── EventopTarget ───────────────────────────────────────────────────────────
|
|
37
37
|
|
|
38
|
-
export interface
|
|
38
|
+
export interface EventopTargetProps {
|
|
39
39
|
/** The component to wrap. Must be a single React element. */
|
|
40
40
|
children: ReactNode;
|
|
41
41
|
/** Unique feature id */
|
|
@@ -61,32 +61,32 @@ export interface ShepherdTargetProps {
|
|
|
61
61
|
}
|
|
62
62
|
|
|
63
63
|
/**
|
|
64
|
-
* Wraps any component and registers it as a
|
|
64
|
+
* Wraps any component and registers it as a EventopAI feature.
|
|
65
65
|
* Registration happens at the CALL SITE — the wrapped component is unchanged.
|
|
66
66
|
*
|
|
67
67
|
* Works with any component: your own, shadcn, MUI, Radix, anything.
|
|
68
|
-
* The wrapped component does not need to accept refs or know about
|
|
68
|
+
* The wrapped component does not need to accept refs or know about EventopAI.
|
|
69
69
|
*
|
|
70
70
|
* @example
|
|
71
71
|
* // Same Button, different features in different parts of the app
|
|
72
|
-
* <
|
|
72
|
+
* <EventopTarget id="export" name="Export Design" description="Download as PNG or SVG">
|
|
73
73
|
* <Button onClick={handleExport}>Export</Button>
|
|
74
|
-
* </
|
|
74
|
+
* </EventopTarget>
|
|
75
75
|
*
|
|
76
|
-
* <
|
|
76
|
+
* <EventopTarget id="share" name="Share Document" description="Share with teammates">
|
|
77
77
|
* <Button onClick={handleShare}>Share</Button>
|
|
78
|
-
* </
|
|
78
|
+
* </EventopTarget>
|
|
79
79
|
*/
|
|
80
|
-
export const
|
|
80
|
+
export const EventopTarget: FC<EventopTargetProps>;
|
|
81
81
|
|
|
82
|
-
// ───
|
|
82
|
+
// ─── EventopStep ─────────────────────────────────────────────────────────────
|
|
83
83
|
|
|
84
|
-
export interface
|
|
84
|
+
export interface EventopStepProps {
|
|
85
85
|
/** The component to wrap. Must be a single React element. */
|
|
86
86
|
children: ReactNode;
|
|
87
87
|
/**
|
|
88
88
|
* Feature id this step belongs to.
|
|
89
|
-
* Optional if inside a <
|
|
89
|
+
* Optional if inside a <EventopTarget> — inferred from scope context.
|
|
90
90
|
*/
|
|
91
91
|
feature?: string;
|
|
92
92
|
/** Position in the flow sequence. 0-based. Required. */
|
|
@@ -97,11 +97,11 @@ export interface ShepherdStepProps {
|
|
|
97
97
|
*
|
|
98
98
|
* @example
|
|
99
99
|
* // Step 1: open font picker
|
|
100
|
-
* <
|
|
100
|
+
* <EventopStep feature="style-text" index={1}><FontPickerBtn /></EventopStep>
|
|
101
101
|
*
|
|
102
102
|
* // Sub-steps of step 1
|
|
103
|
-
* <
|
|
104
|
-
* <
|
|
103
|
+
* <EventopStep feature="style-text" index={0} parentStep={1}><FontFamily /></EventopStep>
|
|
104
|
+
* <EventopStep feature="style-text" index={1} parentStep={1}><FontWeight /></EventopStep>
|
|
105
105
|
*/
|
|
106
106
|
parentStep?: number;
|
|
107
107
|
/** CSS selector to wait for before showing this step */
|
|
@@ -119,25 +119,25 @@ export interface ShepherdStepProps {
|
|
|
119
119
|
*
|
|
120
120
|
* The parent feature id comes from either:
|
|
121
121
|
* 1. The `feature` prop (explicit — works anywhere in the tree)
|
|
122
|
-
* 2. The nearest <
|
|
122
|
+
* 2. The nearest <EventopTarget> ancestor (implicit — via context)
|
|
123
123
|
*
|
|
124
124
|
* @example
|
|
125
125
|
* // In CanvasStage.jsx
|
|
126
|
-
* <
|
|
126
|
+
* <EventopStep feature="drop-shadow" index={0}
|
|
127
127
|
* advanceOn={{ selector: '.canvas-el', event: 'click', delay: 300 }}>
|
|
128
128
|
* <div className="canvas-stage">...</div>
|
|
129
|
-
* </
|
|
129
|
+
* </EventopStep>
|
|
130
130
|
*
|
|
131
131
|
* // In Toolbar.jsx — completely separate component
|
|
132
|
-
* <
|
|
132
|
+
* <EventopStep feature="drop-shadow" index={1} waitFor=".canvas-el.selected">
|
|
133
133
|
* <button id="btn-effects">Effects</button>
|
|
134
|
-
* </
|
|
134
|
+
* </EventopStep>
|
|
135
135
|
*/
|
|
136
|
-
export const
|
|
136
|
+
export const EventopStep: FC<EventopStepProps>;
|
|
137
137
|
|
|
138
138
|
// ─── Hooks ───────────────────────────────────────────────────────────────────
|
|
139
139
|
|
|
140
|
-
export interface
|
|
140
|
+
export interface EventopAIHook {
|
|
141
141
|
open(): void;
|
|
142
142
|
close(): void;
|
|
143
143
|
cancelTour(): void;
|
|
@@ -149,7 +149,7 @@ export interface ShepherdAIHook {
|
|
|
149
149
|
* Call after async validation succeeds.
|
|
150
150
|
*
|
|
151
151
|
* @example
|
|
152
|
-
* const { stepComplete, stepFail } =
|
|
152
|
+
* const { stepComplete, stepFail } = useEventopAI();
|
|
153
153
|
* const ok = await validateEmail(email);
|
|
154
154
|
* if (ok) stepComplete();
|
|
155
155
|
* else stepFail('Please enter a valid email address.');
|
|
@@ -165,7 +165,7 @@ export interface ShepherdAIHook {
|
|
|
165
165
|
*
|
|
166
166
|
* @example
|
|
167
167
|
* function CheckoutStep() {
|
|
168
|
-
* const { stepComplete, stepFail } =
|
|
168
|
+
* const { stepComplete, stepFail } = useEventopAI();
|
|
169
169
|
* async function handleContinue() {
|
|
170
170
|
* const ok = await validateCard(number);
|
|
171
171
|
* if (ok) stepComplete();
|
|
@@ -174,9 +174,9 @@ export interface ShepherdAIHook {
|
|
|
174
174
|
* return <button onClick={handleContinue}>Continue</button>;
|
|
175
175
|
* }
|
|
176
176
|
*/
|
|
177
|
-
export function
|
|
177
|
+
export function useEventopAI(): EventopAIHook;
|
|
178
178
|
|
|
179
|
-
export interface
|
|
179
|
+
export interface EventopTourState {
|
|
180
180
|
/** True if a tour is currently running */
|
|
181
181
|
isActive: boolean;
|
|
182
182
|
/** True if a tour is paused (cancelled but resumable) */
|
|
@@ -195,7 +195,7 @@ export interface ShepherdTourState {
|
|
|
195
195
|
*
|
|
196
196
|
* @example
|
|
197
197
|
* function TourBar() {
|
|
198
|
-
* const { isActive, isPaused, resume, cancel } =
|
|
198
|
+
* const { isActive, isPaused, resume, cancel } = useEventopTour();
|
|
199
199
|
* if (!isActive && !isPaused) return null;
|
|
200
200
|
* return (
|
|
201
201
|
* <div>
|
|
@@ -205,4 +205,4 @@ export interface ShepherdTourState {
|
|
|
205
205
|
* );
|
|
206
206
|
* }
|
|
207
207
|
*/
|
|
208
|
-
export function
|
|
208
|
+
export function useEventopTour(): EventopTourState;
|
package/dist/react/index.js
CHANGED
|
@@ -28,16 +28,16 @@ function useFeatureScope() {
|
|
|
28
28
|
*
|
|
29
29
|
* The live map of everything currently mounted in the React tree.
|
|
30
30
|
*
|
|
31
|
-
* Features — registered by
|
|
32
|
-
* Flow steps — registered by
|
|
31
|
+
* Features — registered by EventopTarget
|
|
32
|
+
* Flow steps — registered by EventopStep, attached to a feature by id
|
|
33
33
|
*
|
|
34
34
|
* Both features and steps can live anywhere in the component tree.
|
|
35
|
-
* They don't need to be co-located.
|
|
35
|
+
* They don't need to be co-located. An EventopStep just needs to know
|
|
36
36
|
* which feature id it belongs to.
|
|
37
37
|
*
|
|
38
38
|
* Nested steps:
|
|
39
39
|
* Steps can themselves have children steps (sub-steps) by passing
|
|
40
|
-
* a parentStep prop to
|
|
40
|
+
* a parentStep prop to EventopStep. This lets you model flows like:
|
|
41
41
|
*
|
|
42
42
|
* Feature: "Create styled text"
|
|
43
43
|
* Step 0: Click Add Text
|
|
@@ -464,4 +464,4 @@ function useEventopTour() {
|
|
|
464
464
|
};
|
|
465
465
|
}
|
|
466
466
|
|
|
467
|
-
export { EventopProvider, EventopStep, EventopTarget, useEventop, useEventopTour };
|
|
467
|
+
export { EventopProvider as EventopAIProvider, EventopStep, EventopTarget, useEventop, useEventopTour };
|