@repere/react 0.1.1 → 0.2.0
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/components/RepereProvider.d.ts.map +1 -1
- package/dist/hooks/useBeaconPosition.d.ts +2 -1
- package/dist/hooks/useBeaconPosition.d.ts.map +1 -1
- package/dist/index.js +177 -160
- package/dist/utils/resolveBeaconConfig.d.ts +1 -0
- package/dist/utils/resolveBeaconConfig.d.ts.map +1 -1
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RepereProvider.d.ts","sourceRoot":"","sources":["../../src/components/RepereProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAUhD,OAAO,KAAK,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAO/D,UAAU,mBAAmB;IAC3B,MAAM,EAAE,WAAW,CAAC;IACpB,MAAM,EAAE,iBAAiB,CAAC;IAC1B,KAAK,EAAE,WAAW,CAAC;IACnB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,wBAAgB,cAAc,CAAC,EAC7B,MAAM,EACN,MAAM,EACN,KAAK,EACL,SAAS,EACT,KAAK,GACN,EAAE,mBAAmB,
|
|
1
|
+
{"version":3,"file":"RepereProvider.d.ts","sourceRoot":"","sources":["../../src/components/RepereProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAUhD,OAAO,KAAK,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAO/D,UAAU,mBAAmB;IAC3B,MAAM,EAAE,WAAW,CAAC;IACpB,MAAM,EAAE,iBAAiB,CAAC;IAC1B,KAAK,EAAE,WAAW,CAAC;IACnB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,wBAAgB,cAAc,CAAC,EAC7B,MAAM,EACN,MAAM,EACN,KAAK,EACL,SAAS,EACT,KAAK,GACN,EAAE,mBAAmB,kDAqHrB"}
|
|
@@ -4,10 +4,11 @@ interface UseBeaconPositionParams {
|
|
|
4
4
|
position: Position;
|
|
5
5
|
offset?: Offset;
|
|
6
6
|
zIndex?: number;
|
|
7
|
+
delay?: number;
|
|
7
8
|
enabled?: boolean;
|
|
8
9
|
debug?: boolean;
|
|
9
10
|
}
|
|
10
|
-
export declare function useBeaconPosition({ targetSelector, position, offset, zIndex, enabled, debug, }: UseBeaconPositionParams): {
|
|
11
|
+
export declare function useBeaconPosition({ targetSelector, position, offset, zIndex, delay, enabled, debug, }: UseBeaconPositionParams): {
|
|
11
12
|
calculatedPosition: CalculatedBeaconPosition | null;
|
|
12
13
|
targetElement: HTMLElement | null;
|
|
13
14
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useBeaconPosition.d.ts","sourceRoot":"","sources":["../../src/hooks/useBeaconPosition.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAI/E,UAAU,uBAAuB;IAC/B,cAAc,EAAE,MAAM,CAAC;IACvB,QAAQ,EAAE,QAAQ,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,wBAAgB,iBAAiB,CAAC,EAChC,cAAc,EACd,QAAQ,EACR,MAAM,EACN,MAAa,EACb,OAAc,EACd,KAAa,GACd,EAAE,uBAAuB;;;EAkCzB"}
|
|
1
|
+
{"version":3,"file":"useBeaconPosition.d.ts","sourceRoot":"","sources":["../../src/hooks/useBeaconPosition.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAI/E,UAAU,uBAAuB;IAC/B,cAAc,EAAE,MAAM,CAAC;IACvB,QAAQ,EAAE,QAAQ,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,wBAAgB,iBAAiB,CAAC,EAChC,cAAc,EACd,QAAQ,EACR,MAAM,EACN,MAAa,EACb,KAAK,EACL,OAAc,EACd,KAAa,GACd,EAAE,uBAAuB;;;EAkCzB"}
|
package/dist/index.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import { jsx as g, jsxs as
|
|
2
|
-
import { createContext as
|
|
3
|
-
import { createPortal as
|
|
1
|
+
import { jsx as g, jsxs as K } from "react/jsx-runtime";
|
|
2
|
+
import { createContext as Q, useContext as W, useMemo as w, useState as C, useEffect as L, useCallback as A, isValidElement as N, cloneElement as Z, useId as ee, forwardRef as b } from "react";
|
|
3
|
+
import { createPortal as te } from "react-dom";
|
|
4
4
|
import { motion as M } from "motion/react";
|
|
5
5
|
var m = /* @__PURE__ */ ((e) => (e.TopLeft = "top-left", e.TopCenter = "top-center", e.TopRight = "top-right", e.RightCenter = "right-center", e.BottomRight = "bottom-right", e.BottomCenter = "bottom-center", e.BottomLeft = "bottom-left", e.LeftCenter = "left-center", e))(m || {});
|
|
6
|
-
const
|
|
7
|
-
class
|
|
6
|
+
const oe = m.TopRight;
|
|
7
|
+
class ne {
|
|
8
8
|
state = /* @__PURE__ */ new Map();
|
|
9
9
|
isDismissed(t) {
|
|
10
10
|
return this.state.get(t)?.isDismissed ?? !1;
|
|
@@ -26,7 +26,7 @@ class oe {
|
|
|
26
26
|
}
|
|
27
27
|
}
|
|
28
28
|
var v = /* @__PURE__ */ ((e) => (e.Fade = "fade", e.Scale = "scale", e.Grow = "grow", e.Shrink = "shrink", e.SlideUp = "slide-up", e.SlideDown = "slide-down", e.SlideLeft = "slide-left", e.SlideRight = "slide-right", e.None = "none", e))(v || {});
|
|
29
|
-
const
|
|
29
|
+
const ie = {
|
|
30
30
|
[v.SlideDown]: {
|
|
31
31
|
initial: { y: -20, opacity: 0 },
|
|
32
32
|
animate: { y: 0, opacity: 1 },
|
|
@@ -73,11 +73,11 @@ const ne = {
|
|
|
73
73
|
exit: {}
|
|
74
74
|
}
|
|
75
75
|
};
|
|
76
|
-
function
|
|
76
|
+
function B(e) {
|
|
77
77
|
return e ? typeof e == "string" ? { variant: e } : e : null;
|
|
78
78
|
}
|
|
79
|
-
function
|
|
80
|
-
const o =
|
|
79
|
+
function T(e, t) {
|
|
80
|
+
const o = B(e), i = B(t);
|
|
81
81
|
return !o && !i ? null : o ? i ? {
|
|
82
82
|
variant: i.variant ?? o.variant,
|
|
83
83
|
duration: i.duration ?? o.duration,
|
|
@@ -85,10 +85,10 @@ function L(e, t) {
|
|
|
85
85
|
ease: i.ease ?? o.ease
|
|
86
86
|
} : o : i;
|
|
87
87
|
}
|
|
88
|
-
function
|
|
89
|
-
const t =
|
|
88
|
+
function $(e) {
|
|
89
|
+
const t = B(e);
|
|
90
90
|
if (!t) return null;
|
|
91
|
-
const o =
|
|
91
|
+
const o = ie[t.variant];
|
|
92
92
|
return o ? {
|
|
93
93
|
variants: o,
|
|
94
94
|
transition: {
|
|
@@ -100,7 +100,7 @@ function B(e) {
|
|
|
100
100
|
}
|
|
101
101
|
} : (console.warn(`[Repere] Unknown animation variant: ${t.variant}`), null);
|
|
102
102
|
}
|
|
103
|
-
function
|
|
103
|
+
function se(e, t) {
|
|
104
104
|
const o = (n) => {
|
|
105
105
|
const a = n.match(/(-?\d+)%/);
|
|
106
106
|
return a ? parseFloat(a[1]) : 0;
|
|
@@ -120,7 +120,7 @@ function ie(e, t) {
|
|
|
120
120
|
}
|
|
121
121
|
};
|
|
122
122
|
}
|
|
123
|
-
function
|
|
123
|
+
function re(e, t) {
|
|
124
124
|
if (!e && !t) return {};
|
|
125
125
|
const o = e?.variants, i = e?.transition, r = t?.variants, s = t?.transition, n = s?.ease ?? i?.ease ?? [0.4, 0, 0.2, 1], a = Array.isArray(n) ? `cubic-bezier(${n.join(", ")})` : n;
|
|
126
126
|
return {
|
|
@@ -144,14 +144,14 @@ function se(e, t) {
|
|
|
144
144
|
"--repere-transition-timing": a
|
|
145
145
|
};
|
|
146
146
|
}
|
|
147
|
-
function
|
|
147
|
+
function ae(e, t) {
|
|
148
148
|
const o = e?.transition.duration ?? 0, i = t?.transition.duration ?? 0;
|
|
149
149
|
return Math.max(o, i) * 1e3;
|
|
150
150
|
}
|
|
151
|
-
function
|
|
151
|
+
function le(e) {
|
|
152
152
|
return new Promise((t) => setTimeout(t, e));
|
|
153
153
|
}
|
|
154
|
-
function
|
|
154
|
+
function ce(e, t) {
|
|
155
155
|
if (t instanceof RegExp)
|
|
156
156
|
return t.test(e);
|
|
157
157
|
if (t === e)
|
|
@@ -162,7 +162,7 @@ function le(e, t) {
|
|
|
162
162
|
}
|
|
163
163
|
return !1;
|
|
164
164
|
}
|
|
165
|
-
class
|
|
165
|
+
class pe {
|
|
166
166
|
store;
|
|
167
167
|
debug;
|
|
168
168
|
constructor(t, o = {}) {
|
|
@@ -173,7 +173,7 @@ class ce {
|
|
|
173
173
|
* This supports wildcards - e.g., path="*" will match all pages
|
|
174
174
|
*/
|
|
175
175
|
findMatchingPages(t, o) {
|
|
176
|
-
const i = t.filter((r) => typeof r.path == "function" ? r.path(o) :
|
|
176
|
+
const i = t.filter((r) => typeof r.path == "function" ? r.path(o) : ce(o, r.path));
|
|
177
177
|
return this.debug && console.log(
|
|
178
178
|
"[BeaconManager] Path:",
|
|
179
179
|
o,
|
|
@@ -220,7 +220,7 @@ class ce {
|
|
|
220
220
|
return this.store;
|
|
221
221
|
}
|
|
222
222
|
}
|
|
223
|
-
function
|
|
223
|
+
function de(e, t = m.TopRight, o = { x: 0, y: 0 }) {
|
|
224
224
|
const { x: i = 0, y: r = 0 } = o;
|
|
225
225
|
let s = 0, n = 0, a = "0", l = "0";
|
|
226
226
|
switch (t) {
|
|
@@ -259,7 +259,7 @@ function pe(e, t = m.TopRight, o = { x: 0, y: 0 }) {
|
|
|
259
259
|
translate: { x: a, y: l }
|
|
260
260
|
};
|
|
261
261
|
}
|
|
262
|
-
class
|
|
262
|
+
class ue {
|
|
263
263
|
tracked = /* @__PURE__ */ new Map();
|
|
264
264
|
scrollListener = null;
|
|
265
265
|
resizeListener = null;
|
|
@@ -279,13 +279,25 @@ class de {
|
|
|
279
279
|
position: o,
|
|
280
280
|
offset: r.offset,
|
|
281
281
|
zIndex: r.zIndex ?? 9999,
|
|
282
|
+
delay: r.delay,
|
|
282
283
|
callbacks: /* @__PURE__ */ new Set(),
|
|
283
|
-
element: null
|
|
284
|
-
|
|
284
|
+
element: null,
|
|
285
|
+
hasInitialUpdate: !1
|
|
286
|
+
}), this.tracked.get(s)?.callbacks.add(i), this.tracked.size === 1 && this.startListening(), this.scheduleInitialUpdate(s), () => {
|
|
285
287
|
const n = this.tracked.get(s);
|
|
286
|
-
n && (n.callbacks.delete(i), n.callbacks.size === 0 && (this.tracked.delete(s), this.tracked.size === 0 && this.stopListening()));
|
|
288
|
+
n && (n.callbacks.delete(i), n.callbacks.size === 0 && (n.delayTimeoutId !== void 0 && (clearTimeout(n.delayTimeoutId), n.delayTimeoutId = void 0), this.tracked.delete(s), this.tracked.size === 0 && this.stopListening()));
|
|
287
289
|
};
|
|
288
290
|
}
|
|
291
|
+
scheduleInitialUpdate(t) {
|
|
292
|
+
const o = this.tracked.get(t);
|
|
293
|
+
o && (!o.hasInitialUpdate && o.delay && o.delay > 0 ? (o.hasInitialUpdate = !0, this.debug && console.log(
|
|
294
|
+
`[PositionTracker] Delaying initial position calculation for ${t} by ${o.delay}ms`
|
|
295
|
+
), o.delayTimeoutId = setTimeout(() => {
|
|
296
|
+
this.debug && console.log(
|
|
297
|
+
`[PositionTracker] Calculating position for ${t} after delay`
|
|
298
|
+
), o.delayTimeoutId !== void 0 && (o.delayTimeoutId = void 0), this.updatePosition(t);
|
|
299
|
+
}, o.delay)) : (o.hasInitialUpdate || (o.hasInitialUpdate = !0), this.updatePosition(t)));
|
|
300
|
+
}
|
|
289
301
|
updatePosition(t) {
|
|
290
302
|
const o = this.tracked.get(t);
|
|
291
303
|
if (!o) return;
|
|
@@ -298,7 +310,7 @@ class de {
|
|
|
298
310
|
}
|
|
299
311
|
o.element = i;
|
|
300
312
|
const r = i.getBoundingClientRect(), s = {
|
|
301
|
-
...
|
|
313
|
+
...de(
|
|
302
314
|
r,
|
|
303
315
|
o.position,
|
|
304
316
|
o.offset
|
|
@@ -332,32 +344,34 @@ class de {
|
|
|
332
344
|
* Clean up all listeners and subscriptions
|
|
333
345
|
*/
|
|
334
346
|
destroy() {
|
|
347
|
+
for (const [, t] of this.tracked)
|
|
348
|
+
t.delayTimeoutId !== void 0 && (clearTimeout(t.delayTimeoutId), t.delayTimeoutId = void 0);
|
|
335
349
|
this.stopListening(), this.tracked.clear();
|
|
336
350
|
}
|
|
337
351
|
}
|
|
338
|
-
const
|
|
339
|
-
function
|
|
340
|
-
const e =
|
|
352
|
+
const U = Q(null);
|
|
353
|
+
function I() {
|
|
354
|
+
const e = W(U);
|
|
341
355
|
if (!e)
|
|
342
356
|
throw new Error("useRepereContext must be used within a Repere provider.");
|
|
343
357
|
return e;
|
|
344
358
|
}
|
|
345
|
-
function
|
|
346
|
-
const o =
|
|
359
|
+
function me(e, t) {
|
|
360
|
+
const o = w(() => {
|
|
347
361
|
const n = t.trigger?.animations?.onRender, a = e.trigger?.animations?.onRender;
|
|
348
|
-
return
|
|
349
|
-
}, [t.trigger?.animations, e.trigger?.animations]), i =
|
|
362
|
+
return $(T(n, a));
|
|
363
|
+
}, [t.trigger?.animations, e.trigger?.animations]), i = w(() => {
|
|
350
364
|
const n = t.trigger?.animations?.onDismiss, a = e.trigger?.animations?.onDismiss;
|
|
351
|
-
return
|
|
365
|
+
return $(T(n, a));
|
|
352
366
|
}, [
|
|
353
367
|
t.trigger?.animations?.onDismiss,
|
|
354
368
|
e.trigger?.animations?.onDismiss
|
|
355
|
-
]), r =
|
|
369
|
+
]), r = w(() => {
|
|
356
370
|
const n = t.popover?.animations?.onOpen, a = e.popover?.animations?.onOpen;
|
|
357
|
-
return
|
|
358
|
-
}, [t.popover?.animations?.onOpen, e.popover?.animations?.onOpen]), s =
|
|
371
|
+
return $(T(n, a));
|
|
372
|
+
}, [t.popover?.animations?.onOpen, e.popover?.animations?.onOpen]), s = w(() => {
|
|
359
373
|
const n = t.popover?.animations?.onClose, a = e.popover?.animations?.onClose;
|
|
360
|
-
return
|
|
374
|
+
return $(T(n, a));
|
|
361
375
|
}, [
|
|
362
376
|
t.popover?.animations?.onClose,
|
|
363
377
|
e.popover?.animations?.onClose
|
|
@@ -369,32 +383,33 @@ function ue(e, t) {
|
|
|
369
383
|
popoverCloseAnimation: s
|
|
370
384
|
};
|
|
371
385
|
}
|
|
372
|
-
function
|
|
386
|
+
function ge({
|
|
373
387
|
targetSelector: e,
|
|
374
388
|
position: t,
|
|
375
389
|
offset: o,
|
|
376
390
|
zIndex: i = 9999,
|
|
377
|
-
|
|
378
|
-
|
|
391
|
+
delay: r,
|
|
392
|
+
enabled: s = !0,
|
|
393
|
+
debug: n = !1
|
|
379
394
|
}) {
|
|
380
|
-
const [
|
|
381
|
-
return
|
|
382
|
-
if (!
|
|
383
|
-
|
|
395
|
+
const [a, l] = C(null), c = w(() => new ue(n), [n]);
|
|
396
|
+
return L(() => {
|
|
397
|
+
if (!s) {
|
|
398
|
+
l(null);
|
|
384
399
|
return;
|
|
385
400
|
}
|
|
386
|
-
return
|
|
401
|
+
return c.subscribe(
|
|
387
402
|
e,
|
|
388
403
|
t,
|
|
389
|
-
|
|
390
|
-
{ offset: o, zIndex: i }
|
|
404
|
+
l,
|
|
405
|
+
{ offset: o, zIndex: i, delay: r }
|
|
391
406
|
);
|
|
392
|
-
}, [
|
|
393
|
-
calculatedPosition:
|
|
394
|
-
targetElement:
|
|
407
|
+
}, [c, e, t, o, i, r, s]), L(() => () => c.destroy(), [c]), {
|
|
408
|
+
calculatedPosition: a,
|
|
409
|
+
targetElement: a ? document.querySelector(e) : null
|
|
395
410
|
};
|
|
396
411
|
}
|
|
397
|
-
function
|
|
412
|
+
function ve() {
|
|
398
413
|
const [e, t] = C(!1), [o, i] = C(
|
|
399
414
|
null
|
|
400
415
|
), r = A((l) => {
|
|
@@ -409,7 +424,7 @@ function ge() {
|
|
|
409
424
|
() => o?.hidePopover(),
|
|
410
425
|
[o]
|
|
411
426
|
);
|
|
412
|
-
return
|
|
427
|
+
return L(() => {
|
|
413
428
|
if (!o) return;
|
|
414
429
|
const l = (c) => {
|
|
415
430
|
t(c.newState === "open");
|
|
@@ -424,7 +439,7 @@ function ge() {
|
|
|
424
439
|
hidePopover: a
|
|
425
440
|
};
|
|
426
441
|
}
|
|
427
|
-
function
|
|
442
|
+
function he(e, t) {
|
|
428
443
|
return e ? N(e) ? e : /* @__PURE__ */ g(
|
|
429
444
|
e,
|
|
430
445
|
{
|
|
@@ -436,7 +451,7 @@ function ve(e, t) {
|
|
|
436
451
|
}
|
|
437
452
|
) : null;
|
|
438
453
|
}
|
|
439
|
-
function
|
|
454
|
+
function fe(e, t) {
|
|
440
455
|
let o;
|
|
441
456
|
return N(e) ? o = e : o = /* @__PURE__ */ g(
|
|
442
457
|
e,
|
|
@@ -446,21 +461,22 @@ function he(e, t) {
|
|
|
446
461
|
onDismiss: t.handleDismiss,
|
|
447
462
|
onClose: t.hidePopover
|
|
448
463
|
}
|
|
449
|
-
),
|
|
464
|
+
), Z(o, {
|
|
450
465
|
// @ts-expect-error - cloneElement ref typing doesn't handle callback refs properly
|
|
451
466
|
ref: t.handlePopoverRef,
|
|
452
467
|
id: t.popoverId,
|
|
453
468
|
popover: "auto"
|
|
454
469
|
});
|
|
455
470
|
}
|
|
456
|
-
function
|
|
457
|
-
const o = e.trigger?.position || t.trigger?.position ||
|
|
471
|
+
function ye(e, t) {
|
|
472
|
+
const o = e.trigger?.position || t.trigger?.position || oe, i = e.trigger?.zIndex || t.trigger?.zIndex || 9999, r = e.trigger?.offset, s = e.trigger?.delay ?? t.trigger?.delay, n = e.popover?.position || t.popover?.position || o, a = e.popover?.offset || t.popover?.offset || { x: 0, y: 0 };
|
|
458
473
|
return {
|
|
459
474
|
position: o,
|
|
460
475
|
zIndex: i,
|
|
461
476
|
offset: r,
|
|
462
|
-
|
|
463
|
-
|
|
477
|
+
delay: s,
|
|
478
|
+
popoverPosition: n,
|
|
479
|
+
popoverOffset: a
|
|
464
480
|
};
|
|
465
481
|
}
|
|
466
482
|
function we({
|
|
@@ -470,66 +486,67 @@ function we({
|
|
|
470
486
|
onDismiss: i,
|
|
471
487
|
debug: r
|
|
472
488
|
}) {
|
|
473
|
-
const s =
|
|
489
|
+
const s = ee(), [n, a] = C(!1), { position: l, zIndex: c, offset: d, delay: f, popoverPosition: p, popoverOffset: h } = ye(e, t), { calculatedPosition: u, targetElement: x } = ge({
|
|
474
490
|
targetSelector: e.selector,
|
|
475
491
|
position: l,
|
|
476
492
|
offset: d,
|
|
477
493
|
zIndex: c,
|
|
494
|
+
delay: f,
|
|
478
495
|
enabled: !0,
|
|
479
496
|
debug: r
|
|
480
497
|
}), {
|
|
481
|
-
isOpen:
|
|
482
|
-
popoverElement:
|
|
483
|
-
handlePopoverRef:
|
|
484
|
-
togglePopover:
|
|
485
|
-
showPopover:
|
|
486
|
-
hidePopover:
|
|
487
|
-
} =
|
|
488
|
-
triggerAnimation:
|
|
489
|
-
triggerDismissAnimation:
|
|
490
|
-
popoverOpenAnimation:
|
|
491
|
-
popoverCloseAnimation:
|
|
492
|
-
} =
|
|
493
|
-
a(!0),
|
|
494
|
-
const
|
|
495
|
-
|
|
496
|
-
|
|
498
|
+
isOpen: k,
|
|
499
|
+
popoverElement: P,
|
|
500
|
+
handlePopoverRef: y,
|
|
501
|
+
togglePopover: R,
|
|
502
|
+
showPopover: _,
|
|
503
|
+
hidePopover: O
|
|
504
|
+
} = ve(), {
|
|
505
|
+
triggerAnimation: G,
|
|
506
|
+
triggerDismissAnimation: z,
|
|
507
|
+
popoverOpenAnimation: V,
|
|
508
|
+
popoverCloseAnimation: D
|
|
509
|
+
} = me(e, t), E = async () => {
|
|
510
|
+
a(!0), P?.hidePopover();
|
|
511
|
+
const J = ae(
|
|
512
|
+
z,
|
|
513
|
+
D
|
|
497
514
|
);
|
|
498
|
-
await
|
|
499
|
-
},
|
|
515
|
+
await le(J), await Promise.resolve(o.dismiss(e.id)), i();
|
|
516
|
+
}, q = {
|
|
500
517
|
beaconId: e.id,
|
|
501
518
|
position: l,
|
|
502
|
-
popoverPosition:
|
|
503
|
-
popoverOffset:
|
|
519
|
+
popoverPosition: p,
|
|
520
|
+
popoverOffset: h,
|
|
504
521
|
calculatedPosition: u,
|
|
505
|
-
isOpen:
|
|
522
|
+
isOpen: k,
|
|
506
523
|
isDismissing: n,
|
|
507
|
-
toggle:
|
|
508
|
-
open:
|
|
509
|
-
close:
|
|
524
|
+
toggle: R,
|
|
525
|
+
open: _,
|
|
526
|
+
close: O,
|
|
510
527
|
dismiss: E,
|
|
511
|
-
triggerAnimation:
|
|
512
|
-
triggerDismissAnimation:
|
|
513
|
-
popoverOpenAnimation:
|
|
514
|
-
popoverCloseAnimation:
|
|
528
|
+
triggerAnimation: G,
|
|
529
|
+
triggerDismissAnimation: z,
|
|
530
|
+
popoverOpenAnimation: V,
|
|
531
|
+
popoverCloseAnimation: D,
|
|
515
532
|
popoverId: s
|
|
516
|
-
},
|
|
517
|
-
return !u || !
|
|
518
|
-
`[Repere] ${e.id} waiting for target element: position=${!!u}, element=${!!
|
|
519
|
-
), null) : S ? /* @__PURE__ */
|
|
520
|
-
|
|
533
|
+
}, H = e.trigger?.component || t.trigger?.component, S = e.popover.component || t.popover?.component;
|
|
534
|
+
return !u || !x ? (r && console.warn(
|
|
535
|
+
`[Repere] ${e.id} waiting for target element: position=${!!u}, element=${!!x}`
|
|
536
|
+
), null) : S ? /* @__PURE__ */ K(U.Provider, { value: q, children: [
|
|
537
|
+
he(H, {
|
|
521
538
|
beacon: e,
|
|
522
539
|
calculatedPosition: u,
|
|
523
540
|
position: l,
|
|
524
|
-
isOpen:
|
|
525
|
-
togglePopover:
|
|
541
|
+
isOpen: k,
|
|
542
|
+
togglePopover: R
|
|
526
543
|
}),
|
|
527
|
-
|
|
544
|
+
fe(S, {
|
|
528
545
|
beacon: e,
|
|
529
546
|
position: l,
|
|
530
547
|
handleDismiss: E,
|
|
531
|
-
hidePopover:
|
|
532
|
-
handlePopoverRef:
|
|
548
|
+
hidePopover: O,
|
|
549
|
+
handlePopoverRef: y,
|
|
533
550
|
popoverId: s
|
|
534
551
|
})
|
|
535
552
|
] }) : (r && console.warn(
|
|
@@ -537,41 +554,41 @@ function we({
|
|
|
537
554
|
e.id
|
|
538
555
|
), null);
|
|
539
556
|
}
|
|
540
|
-
function
|
|
557
|
+
function $e({
|
|
541
558
|
config: e,
|
|
542
559
|
currentPath: t,
|
|
543
560
|
enabled: o = !0,
|
|
544
561
|
debug: i = !1
|
|
545
562
|
}) {
|
|
546
|
-
const r =
|
|
547
|
-
() => e.store || new
|
|
563
|
+
const r = w(
|
|
564
|
+
() => e.store || new ne(),
|
|
548
565
|
[e.store]
|
|
549
|
-
), s =
|
|
550
|
-
() => new
|
|
566
|
+
), s = w(
|
|
567
|
+
() => new pe(r, { debug: i }),
|
|
551
568
|
[r, i]
|
|
552
569
|
), [n, a] = C([]), [l, c] = C(
|
|
553
570
|
/* @__PURE__ */ new Set()
|
|
554
571
|
);
|
|
555
|
-
|
|
572
|
+
L(() => {
|
|
556
573
|
if (!o) {
|
|
557
574
|
a([]), c(/* @__PURE__ */ new Set());
|
|
558
575
|
return;
|
|
559
576
|
}
|
|
560
577
|
(async () => {
|
|
561
|
-
const
|
|
578
|
+
const h = await s.getActiveBeacons(
|
|
562
579
|
e.pages,
|
|
563
580
|
t
|
|
564
581
|
);
|
|
565
|
-
a(
|
|
582
|
+
a(h);
|
|
566
583
|
})();
|
|
567
584
|
}, [s, e.pages, t, o]);
|
|
568
585
|
const d = (p) => {
|
|
569
|
-
c((
|
|
570
|
-
},
|
|
586
|
+
c((h) => /* @__PURE__ */ new Set([...h, p]));
|
|
587
|
+
}, f = n.filter(
|
|
571
588
|
(p) => !l.has(p.id)
|
|
572
589
|
);
|
|
573
|
-
return
|
|
574
|
-
|
|
590
|
+
return f.length === 0 ? null : te(
|
|
591
|
+
f.map((p) => /* @__PURE__ */ g(
|
|
575
592
|
we,
|
|
576
593
|
{
|
|
577
594
|
beacon: p,
|
|
@@ -585,7 +602,7 @@ function Be({
|
|
|
585
602
|
document.body
|
|
586
603
|
);
|
|
587
604
|
}
|
|
588
|
-
const
|
|
605
|
+
const j = b(
|
|
589
606
|
({
|
|
590
607
|
children: e,
|
|
591
608
|
style: t,
|
|
@@ -600,22 +617,22 @@ const X = b(
|
|
|
600
617
|
}, c) => {
|
|
601
618
|
const {
|
|
602
619
|
beaconId: d,
|
|
603
|
-
popoverOpenAnimation:
|
|
620
|
+
popoverOpenAnimation: f,
|
|
604
621
|
popoverCloseAnimation: p,
|
|
605
|
-
popoverPosition:
|
|
606
|
-
popoverOffset:
|
|
607
|
-
} =
|
|
608
|
-
(
|
|
609
|
-
typeof c == "function" ? c(
|
|
622
|
+
popoverPosition: h,
|
|
623
|
+
popoverOffset: u
|
|
624
|
+
} = I(), x = A(
|
|
625
|
+
(y) => {
|
|
626
|
+
typeof c == "function" ? c(y) : c && (c.current = y);
|
|
610
627
|
},
|
|
611
628
|
[c]
|
|
612
629
|
), P = {
|
|
613
630
|
positionAnchor: d ? `--repere-trigger-${d}` : void 0,
|
|
614
|
-
...
|
|
615
|
-
marginLeft:
|
|
616
|
-
marginTop:
|
|
631
|
+
...u && {
|
|
632
|
+
marginLeft: u.x || 0,
|
|
633
|
+
marginTop: u.y || 0
|
|
617
634
|
},
|
|
618
|
-
...
|
|
635
|
+
...re(f, p),
|
|
619
636
|
...t
|
|
620
637
|
};
|
|
621
638
|
return /* @__PURE__ */ g(
|
|
@@ -625,7 +642,7 @@ const X = b(
|
|
|
625
642
|
role: "dialog",
|
|
626
643
|
"aria-labelledby": `repere-popover-${d}`,
|
|
627
644
|
"data-repere-popover": "",
|
|
628
|
-
"data-position":
|
|
645
|
+
"data-position": h,
|
|
629
646
|
popover: o,
|
|
630
647
|
...l,
|
|
631
648
|
style: P,
|
|
@@ -634,15 +651,15 @@ const X = b(
|
|
|
634
651
|
);
|
|
635
652
|
}
|
|
636
653
|
);
|
|
637
|
-
|
|
638
|
-
const
|
|
654
|
+
j.displayName = "ReperePopover";
|
|
655
|
+
const xe = b(
|
|
639
656
|
({
|
|
640
657
|
children: e = "Got it",
|
|
641
658
|
onClick: t,
|
|
642
659
|
as: o,
|
|
643
660
|
...i
|
|
644
661
|
}, r) => {
|
|
645
|
-
const s =
|
|
662
|
+
const s = I(), n = s?.dismiss || (() => {
|
|
646
663
|
}), a = s?.popoverId;
|
|
647
664
|
return /* @__PURE__ */ g(
|
|
648
665
|
o || "button",
|
|
@@ -658,10 +675,10 @@ const ye = b(
|
|
|
658
675
|
}
|
|
659
676
|
);
|
|
660
677
|
}
|
|
661
|
-
),
|
|
678
|
+
), be = Object.assign(xe, {
|
|
662
679
|
displayName: "ReperePopover.AcknowledgeButton"
|
|
663
|
-
}),
|
|
664
|
-
const r =
|
|
680
|
+
}), X = b(({ children: e = "×", ...t }, o) => {
|
|
681
|
+
const r = I()?.popoverId;
|
|
665
682
|
return /* @__PURE__ */ g(
|
|
666
683
|
"button",
|
|
667
684
|
{
|
|
@@ -674,29 +691,29 @@ const ye = b(
|
|
|
674
691
|
}
|
|
675
692
|
);
|
|
676
693
|
});
|
|
677
|
-
|
|
678
|
-
const
|
|
694
|
+
X.displayName = "ReperePopover.CloseButton";
|
|
695
|
+
const Y = b(
|
|
679
696
|
({ children: e, ...t }, o) => /* @__PURE__ */ g("div", { ref: o, ...t, children: e })
|
|
680
697
|
);
|
|
681
|
-
|
|
682
|
-
const
|
|
698
|
+
Y.displayName = "ReperePopover.Content";
|
|
699
|
+
const F = b(
|
|
683
700
|
({ children: e, ...t }, o) => /* @__PURE__ */ g("div", { ref: o, ...t, children: e })
|
|
684
701
|
);
|
|
685
|
-
|
|
686
|
-
const
|
|
702
|
+
F.displayName = "ReperePopover.Footer";
|
|
703
|
+
const Pe = b(
|
|
687
704
|
({ children: e, as: t, ...o }, i) => {
|
|
688
|
-
const s =
|
|
705
|
+
const s = I()?.beaconId || "unknown";
|
|
689
706
|
return /* @__PURE__ */ g(t || "h3", { ref: i, id: `repere-popover-${s}`, ...o, children: e });
|
|
690
707
|
}
|
|
691
|
-
),
|
|
708
|
+
), Ce = Object.assign(Pe, {
|
|
692
709
|
displayName: "ReperePopover.Title"
|
|
693
|
-
}),
|
|
694
|
-
Title:
|
|
695
|
-
Content:
|
|
696
|
-
Footer:
|
|
697
|
-
AcknowledgeButton:
|
|
698
|
-
CloseButton:
|
|
699
|
-
}),
|
|
710
|
+
}), Le = Object.assign(j, {
|
|
711
|
+
Title: Ce,
|
|
712
|
+
Content: Y,
|
|
713
|
+
Footer: F,
|
|
714
|
+
AcknowledgeButton: be,
|
|
715
|
+
CloseButton: X
|
|
716
|
+
}), ke = b(
|
|
700
717
|
({
|
|
701
718
|
children: e,
|
|
702
719
|
as: t,
|
|
@@ -710,10 +727,10 @@ const be = b(
|
|
|
710
727
|
triggerAnimation: l,
|
|
711
728
|
triggerDismissAnimation: c,
|
|
712
729
|
isDismissing: d,
|
|
713
|
-
popoverId:
|
|
714
|
-
} =
|
|
730
|
+
popoverId: f
|
|
731
|
+
} = I(), p = t || "button", h = w(() => !t || t === "button" ? M.button : M.create(p), [t, p]);
|
|
715
732
|
if (!n) return null;
|
|
716
|
-
const
|
|
733
|
+
const u = {
|
|
717
734
|
position: n.position,
|
|
718
735
|
top: n.top,
|
|
719
736
|
left: n.left,
|
|
@@ -721,27 +738,27 @@ const be = b(
|
|
|
721
738
|
pointerEvents: "auto",
|
|
722
739
|
cursor: "pointer",
|
|
723
740
|
anchorName: `--repere-trigger-${a}`
|
|
724
|
-
}, x = o ? { ...
|
|
741
|
+
}, x = o ? { ...u, ...o } : u, k = !i && (l || c), P = {
|
|
725
742
|
ref: s,
|
|
726
|
-
popovertarget:
|
|
743
|
+
popovertarget: f,
|
|
727
744
|
"aria-label": `Beacon trigger for ${a}`,
|
|
728
745
|
"data-repere-trigger": "",
|
|
729
746
|
...r
|
|
730
747
|
};
|
|
731
|
-
if (
|
|
732
|
-
const
|
|
733
|
-
if (!
|
|
734
|
-
const
|
|
748
|
+
if (k) {
|
|
749
|
+
const y = d && c ? c : l;
|
|
750
|
+
if (!y) return null;
|
|
751
|
+
const R = se(
|
|
735
752
|
n.translate,
|
|
736
|
-
|
|
753
|
+
y.variants
|
|
737
754
|
);
|
|
738
755
|
return /* @__PURE__ */ g(
|
|
739
|
-
|
|
756
|
+
h,
|
|
740
757
|
{
|
|
741
758
|
initial: "initial",
|
|
742
759
|
animate: d ? "exit" : "animate",
|
|
743
|
-
variants:
|
|
744
|
-
transition:
|
|
760
|
+
variants: R,
|
|
761
|
+
transition: y.transition,
|
|
745
762
|
...P,
|
|
746
763
|
style: x,
|
|
747
764
|
children: e
|
|
@@ -760,13 +777,13 @@ const be = b(
|
|
|
760
777
|
}
|
|
761
778
|
);
|
|
762
779
|
}
|
|
763
|
-
),
|
|
780
|
+
), Be = Object.assign(ke, {
|
|
764
781
|
displayName: "RepereTrigger"
|
|
765
782
|
});
|
|
766
783
|
export {
|
|
767
784
|
v as Animation,
|
|
768
|
-
|
|
785
|
+
$e as Beacons,
|
|
769
786
|
m as Position,
|
|
770
|
-
|
|
771
|
-
|
|
787
|
+
Le as ReperePopover,
|
|
788
|
+
Be as RepereTrigger
|
|
772
789
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"resolveBeaconConfig.d.ts","sourceRoot":"","sources":["../../src/utils/resolveBeaconConfig.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAE7D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAElD,wBAAgB,mBAAmB,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,iBAAiB
|
|
1
|
+
{"version":3,"file":"resolveBeaconConfig.d.ts","sourceRoot":"","sources":["../../src/utils/resolveBeaconConfig.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAE7D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAElD,wBAAgB,mBAAmB,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,iBAAiB;;;;;;;EAwB5E"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@repere/react",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.2.0",
|
|
4
4
|
"private": false,
|
|
5
5
|
"type": "module",
|
|
6
6
|
"exports": {
|
|
@@ -28,7 +28,7 @@
|
|
|
28
28
|
"react-dom": "^19.2.3",
|
|
29
29
|
"vite": "^7.3.0",
|
|
30
30
|
"vite-plugin-dts": "^4.5.4",
|
|
31
|
-
"@repere/core": "0.0
|
|
31
|
+
"@repere/core": "0.1.0"
|
|
32
32
|
},
|
|
33
33
|
"keywords": [
|
|
34
34
|
"react",
|