@frigade/react 2.0.0-alpha.2 → 2.0.0-alpha.21
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/README.md +543 -4
- package/dist/index.cjs +56 -2
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +304 -36
- package/dist/index.js +16 -2
- package/dist/index.js.map +1 -1
- package/package.json +9 -6
- package/dist/index.css +0 -2
- package/dist/index.css.map +0 -1
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,8 @@
|
|
|
1
|
+
import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
|
|
1
2
|
import * as React$1 from 'react';
|
|
2
|
-
import React__default from 'react';
|
|
3
|
-
import * as
|
|
3
|
+
import React__default, { MouseEvent } from 'react';
|
|
4
|
+
import * as _frigade_js from '@frigade/js';
|
|
5
|
+
import { Flow, FlowStep } from '@frigade/js';
|
|
4
6
|
import * as Popover from '@radix-ui/react-popover';
|
|
5
7
|
|
|
6
8
|
type BoxProps<T extends React$1.ElementType = React$1.ElementType> = {
|
|
@@ -14,47 +16,293 @@ interface ButtonProps extends BoxProps {
|
|
|
14
16
|
title?: string;
|
|
15
17
|
variant?: ButtonVariant;
|
|
16
18
|
}
|
|
17
|
-
declare function BaseButton({ as, children,
|
|
19
|
+
declare function BaseButton({ as, children, title, variant, ...props }: ButtonProps): _emotion_react_jsx_runtime.JSX.Element;
|
|
18
20
|
declare const Button: typeof BaseButton & {
|
|
19
21
|
[k: string]: {
|
|
20
|
-
({ part, ...props }: ButtonProps):
|
|
22
|
+
({ part, ...props }: ButtonProps): _emotion_react_jsx_runtime.JSX.Element;
|
|
21
23
|
displayName: string;
|
|
22
24
|
};
|
|
23
25
|
};
|
|
24
26
|
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
};
|
|
29
|
-
|
|
30
|
-
interface ProviderProps {
|
|
31
|
-
apiKey: string;
|
|
32
|
-
children?: React.ReactNode;
|
|
33
|
-
config?: ProviderConfig;
|
|
34
|
-
theme?: Record<any, any>;
|
|
35
|
-
}
|
|
36
|
-
interface ProviderConfig {
|
|
37
|
-
apiUrl?: string;
|
|
38
|
-
userId?: string;
|
|
27
|
+
interface MediaProps extends BoxProps {
|
|
28
|
+
src: string;
|
|
29
|
+
type?: 'image' | 'video';
|
|
39
30
|
}
|
|
40
|
-
declare function Provider({ apiKey, children, config, theme }: ProviderProps): react_jsx_runtime.JSX.Element;
|
|
41
31
|
|
|
42
32
|
type TextVariant = 'Display1' | 'Display2' | 'H1' | 'H2' | 'H3' | 'H4' | 'Body1' | 'Body2' | 'Caption';
|
|
43
33
|
interface TextProps extends BoxProps {
|
|
44
34
|
variant?: TextVariant;
|
|
45
35
|
}
|
|
46
|
-
declare function BaseText({ as, children,
|
|
36
|
+
declare function BaseText({ as, children, variant, ...props }: TextProps): _emotion_react_jsx_runtime.JSX.Element;
|
|
47
37
|
declare const Text: typeof BaseText & {
|
|
48
38
|
[k: string]: {
|
|
49
|
-
(props: TextProps):
|
|
39
|
+
(props: TextProps): _emotion_react_jsx_runtime.JSX.Element;
|
|
50
40
|
displayName: string;
|
|
51
41
|
};
|
|
52
42
|
};
|
|
53
43
|
|
|
54
|
-
interface
|
|
55
|
-
|
|
56
|
-
|
|
44
|
+
interface DialogProps extends BoxProps {
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
type FlowHandler = (flow: Flow, event?: MouseEvent<unknown>) => Promise<boolean | void> | (boolean | void);
|
|
48
|
+
interface StepHandlers$1 {
|
|
49
|
+
onComplete?: FlowHandler;
|
|
50
|
+
onDismiss?: FlowHandler;
|
|
51
|
+
}
|
|
52
|
+
declare function useFlowHandlers(flow: Flow, { onComplete, onDismiss }?: StepHandlers$1): {
|
|
53
|
+
handleDismiss: (e: MouseEvent<unknown>) => Promise<boolean>;
|
|
54
|
+
};
|
|
55
|
+
|
|
56
|
+
type StepHandler = (step: FlowStep, event?: MouseEvent<unknown>) => Promise<boolean | void> | (boolean | void);
|
|
57
|
+
interface StepHandlers {
|
|
58
|
+
onPrimary?: StepHandler;
|
|
59
|
+
onSecondary?: StepHandler;
|
|
60
|
+
}
|
|
61
|
+
declare function useStepHandlers(step: FlowStep, { onPrimary, onSecondary }?: StepHandlers): {
|
|
62
|
+
handlePrimary: (e: MouseEvent<unknown>) => Promise<boolean>;
|
|
63
|
+
handleSecondary: (e: MouseEvent<unknown>) => Promise<boolean>;
|
|
64
|
+
};
|
|
65
|
+
|
|
66
|
+
interface FlowComponentProps {
|
|
67
|
+
flowId: string;
|
|
68
|
+
onComplete?: FlowHandler;
|
|
69
|
+
onDismiss?: FlowHandler;
|
|
70
|
+
onPrimary?: StepHandler;
|
|
71
|
+
onSecondary?: StepHandler;
|
|
72
|
+
variables?: Record<string, any>;
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
interface AnncouncementProps extends DialogProps, FlowComponentProps {
|
|
76
|
+
}
|
|
77
|
+
declare function Announcement({ flowId, onComplete, onDismiss, onPrimary, onSecondary, variables, }: AnncouncementProps): _emotion_react_jsx_runtime.JSX.Element;
|
|
78
|
+
|
|
79
|
+
interface BannerProps extends BoxProps {
|
|
80
|
+
flowId: string;
|
|
81
|
+
onComplete?: FlowHandler;
|
|
82
|
+
onDismiss?: FlowHandler;
|
|
83
|
+
onPrimary?: StepHandler;
|
|
84
|
+
onSecondary?: StepHandler;
|
|
85
|
+
}
|
|
86
|
+
declare function Banner({ flowId, onComplete, onDismiss, onPrimary, onSecondary, ...props }: BannerProps): _emotion_react_jsx_runtime.JSX.Element;
|
|
87
|
+
|
|
88
|
+
declare const Card: React$1.ForwardRefExoticComponent<Omit<any, "ref"> & React$1.RefAttributes<unknown>>;
|
|
89
|
+
|
|
90
|
+
declare const Flex: {
|
|
91
|
+
Column: React$1.ForwardRefExoticComponent<Omit<any, "ref"> & React$1.RefAttributes<unknown>>;
|
|
92
|
+
Row: React$1.ForwardRefExoticComponent<Omit<any, "ref"> & React$1.RefAttributes<unknown>>;
|
|
93
|
+
};
|
|
94
|
+
|
|
95
|
+
declare const tokens: {
|
|
96
|
+
radii: {
|
|
97
|
+
md: string;
|
|
98
|
+
lg: string;
|
|
99
|
+
round: string;
|
|
100
|
+
};
|
|
101
|
+
shadows: {
|
|
102
|
+
md: string;
|
|
103
|
+
};
|
|
104
|
+
space: {
|
|
105
|
+
0: string;
|
|
106
|
+
4: string;
|
|
107
|
+
20: string;
|
|
108
|
+
[-20]: string;
|
|
109
|
+
19: string;
|
|
110
|
+
[-19]: string;
|
|
111
|
+
18: string;
|
|
112
|
+
[-18]: string;
|
|
113
|
+
17: string;
|
|
114
|
+
[-17]: string;
|
|
115
|
+
16: string;
|
|
116
|
+
[-16]: string;
|
|
117
|
+
15: string;
|
|
118
|
+
[-15]: string;
|
|
119
|
+
14: string;
|
|
120
|
+
[-14]: string;
|
|
121
|
+
13: string;
|
|
122
|
+
[-13]: string;
|
|
123
|
+
12: string;
|
|
124
|
+
[-12]: string;
|
|
125
|
+
11: string;
|
|
126
|
+
[-11]: string;
|
|
127
|
+
10: string;
|
|
128
|
+
[-10]: string;
|
|
129
|
+
9: string;
|
|
130
|
+
[-9]: string;
|
|
131
|
+
8: string;
|
|
132
|
+
[-8]: string;
|
|
133
|
+
7: string;
|
|
134
|
+
[-7]: string;
|
|
135
|
+
6: string;
|
|
136
|
+
[-6]: string;
|
|
137
|
+
5: string;
|
|
138
|
+
[-5]: string;
|
|
139
|
+
[-4]: string;
|
|
140
|
+
3: string;
|
|
141
|
+
[-3]: string;
|
|
142
|
+
2: string;
|
|
143
|
+
[-2]: string;
|
|
144
|
+
1: string;
|
|
145
|
+
[-1]: string;
|
|
146
|
+
0.5: string;
|
|
147
|
+
[-0.5]: string;
|
|
148
|
+
auto: string;
|
|
149
|
+
};
|
|
150
|
+
fontFamilies: {
|
|
151
|
+
default: string;
|
|
152
|
+
};
|
|
153
|
+
fontSizes: {
|
|
154
|
+
xs: string;
|
|
155
|
+
sm: string;
|
|
156
|
+
md: string;
|
|
157
|
+
lg: string;
|
|
158
|
+
xl: string;
|
|
159
|
+
'2xl': string;
|
|
160
|
+
'3xl': string;
|
|
161
|
+
'4xl': string;
|
|
162
|
+
'5xl': string;
|
|
163
|
+
};
|
|
164
|
+
fontWeights: {
|
|
165
|
+
thin: string;
|
|
166
|
+
extralight: string;
|
|
167
|
+
light: string;
|
|
168
|
+
regular: string;
|
|
169
|
+
medium: string;
|
|
170
|
+
demibold: string;
|
|
171
|
+
bold: string;
|
|
172
|
+
extrabold: string;
|
|
173
|
+
black: string;
|
|
174
|
+
};
|
|
175
|
+
letterSpacings: {
|
|
176
|
+
md: string;
|
|
177
|
+
};
|
|
178
|
+
lineHeights: {
|
|
179
|
+
xs: string;
|
|
180
|
+
sm: string;
|
|
181
|
+
md: string;
|
|
182
|
+
lg: string;
|
|
183
|
+
xl: string;
|
|
184
|
+
'2xl': string;
|
|
185
|
+
'3xl': string;
|
|
186
|
+
'4xl': string;
|
|
187
|
+
};
|
|
188
|
+
colors: {
|
|
189
|
+
neutral: {
|
|
190
|
+
background: string;
|
|
191
|
+
border: string;
|
|
192
|
+
foreground: string;
|
|
193
|
+
surface: string;
|
|
194
|
+
active: {
|
|
195
|
+
background: string;
|
|
196
|
+
border: string;
|
|
197
|
+
foreground: string;
|
|
198
|
+
surface: string;
|
|
199
|
+
};
|
|
200
|
+
focus: {
|
|
201
|
+
background: string;
|
|
202
|
+
border: string;
|
|
203
|
+
foreground: string;
|
|
204
|
+
surface: string;
|
|
205
|
+
};
|
|
206
|
+
hover: {
|
|
207
|
+
background: string;
|
|
208
|
+
border: string;
|
|
209
|
+
foreground: string;
|
|
210
|
+
surface: string;
|
|
211
|
+
};
|
|
212
|
+
};
|
|
213
|
+
primary: {
|
|
214
|
+
background: string;
|
|
215
|
+
border: string;
|
|
216
|
+
foreground: string;
|
|
217
|
+
surface: string;
|
|
218
|
+
active: {
|
|
219
|
+
background: string;
|
|
220
|
+
border: string;
|
|
221
|
+
foreground: string;
|
|
222
|
+
surface: string;
|
|
223
|
+
};
|
|
224
|
+
focus: {
|
|
225
|
+
background: string;
|
|
226
|
+
border: string;
|
|
227
|
+
foreground: string;
|
|
228
|
+
surface: string;
|
|
229
|
+
};
|
|
230
|
+
hover: {
|
|
231
|
+
background: string;
|
|
232
|
+
border: string;
|
|
233
|
+
foreground: string;
|
|
234
|
+
surface: string;
|
|
235
|
+
};
|
|
236
|
+
};
|
|
237
|
+
secondary: {
|
|
238
|
+
background: string;
|
|
239
|
+
border: string;
|
|
240
|
+
foreground: string;
|
|
241
|
+
surface: string;
|
|
242
|
+
active: {
|
|
243
|
+
background: string;
|
|
244
|
+
border: string;
|
|
245
|
+
foreground: string;
|
|
246
|
+
surface: string;
|
|
247
|
+
};
|
|
248
|
+
focus: {
|
|
249
|
+
background: string;
|
|
250
|
+
border: string;
|
|
251
|
+
foreground: string;
|
|
252
|
+
surface: string;
|
|
253
|
+
};
|
|
254
|
+
hover: {
|
|
255
|
+
background: string;
|
|
256
|
+
border: string;
|
|
257
|
+
foreground: string;
|
|
258
|
+
surface: string;
|
|
259
|
+
};
|
|
260
|
+
};
|
|
261
|
+
black: string;
|
|
262
|
+
gray100: string;
|
|
263
|
+
gray200: string;
|
|
264
|
+
gray300: string;
|
|
265
|
+
gray400: string;
|
|
266
|
+
gray500: string;
|
|
267
|
+
gray600: string;
|
|
268
|
+
gray700: string;
|
|
269
|
+
gray800: string;
|
|
270
|
+
gray900: string;
|
|
271
|
+
white: string;
|
|
272
|
+
blue400: string;
|
|
273
|
+
blue500: string;
|
|
274
|
+
blue800: string;
|
|
275
|
+
blue900: string;
|
|
276
|
+
green400: string;
|
|
277
|
+
green500: string;
|
|
278
|
+
green800: string;
|
|
279
|
+
transparent: string;
|
|
280
|
+
inherit: string;
|
|
281
|
+
red500: string;
|
|
282
|
+
};
|
|
283
|
+
borders: {
|
|
284
|
+
md: string;
|
|
285
|
+
};
|
|
286
|
+
borderWidths: {
|
|
287
|
+
0: string;
|
|
288
|
+
md: string;
|
|
289
|
+
};
|
|
290
|
+
};
|
|
291
|
+
type Tokens = typeof tokens;
|
|
292
|
+
|
|
293
|
+
type Theme = Partial<Tokens>;
|
|
294
|
+
|
|
295
|
+
type NavigateHandler = (url: string, target?: string) => void;
|
|
296
|
+
interface ProviderProps {
|
|
297
|
+
apiKey: string;
|
|
298
|
+
apiUrl?: string;
|
|
299
|
+
children?: React.ReactNode;
|
|
300
|
+
navigate?: NavigateHandler;
|
|
301
|
+
theme?: Theme;
|
|
302
|
+
userId?: string;
|
|
303
|
+
groupId?: string;
|
|
57
304
|
}
|
|
305
|
+
declare function Provider({ children, navigate, theme, ...props }: ProviderProps): _emotion_react_jsx_runtime.JSX.Element;
|
|
58
306
|
|
|
59
307
|
interface MergedRadixPopoverProps extends Pick<Popover.PopoverProps, 'defaultOpen' | 'modal' | 'onOpenChange' | 'open'>, Omit<Popover.PopoverContentProps, 'align' | 'asChild'> {
|
|
60
308
|
}
|
|
@@ -64,20 +312,40 @@ interface TooltipProps extends MergedRadixPopoverProps {
|
|
|
64
312
|
spotlight?: boolean;
|
|
65
313
|
style?: React__default.CSSProperties;
|
|
66
314
|
}
|
|
67
|
-
declare function Tooltip({ anchor, children,
|
|
315
|
+
declare function Tooltip({ anchor, children, className, spotlight, style, ...props }: TooltipProps): _emotion_react_jsx_runtime.JSX.Element;
|
|
68
316
|
declare namespace Tooltip {
|
|
69
|
-
var Close: (
|
|
70
|
-
var Media: ({ src, ...props }: MediaProps) =>
|
|
71
|
-
var Primary: ({ onClick, title, ...props }: ButtonProps) =>
|
|
72
|
-
var Progress: ({ children, ...props }: TextProps) =>
|
|
73
|
-
var Secondary: ({ onClick, title, ...props }: ButtonProps) =>
|
|
74
|
-
var Subtitle: ({ children, ...props }: TextProps) =>
|
|
75
|
-
var Title: ({ children, ...props }: TextProps) =>
|
|
317
|
+
var Close: (props: ButtonProps) => _emotion_react_jsx_runtime.JSX.Element;
|
|
318
|
+
var Media: ({ src, ...props }: MediaProps) => _emotion_react_jsx_runtime.JSX.Element;
|
|
319
|
+
var Primary: ({ onClick, title, ...props }: ButtonProps) => _emotion_react_jsx_runtime.JSX.Element;
|
|
320
|
+
var Progress: ({ children, ...props }: TextProps) => _emotion_react_jsx_runtime.JSX.Element;
|
|
321
|
+
var Secondary: ({ onClick, title, ...props }: ButtonProps) => _emotion_react_jsx_runtime.JSX.Element;
|
|
322
|
+
var Subtitle: ({ children, ...props }: TextProps) => _emotion_react_jsx_runtime.JSX.Element;
|
|
323
|
+
var Title: ({ children, ...props }: TextProps) => _emotion_react_jsx_runtime.JSX.Element;
|
|
76
324
|
}
|
|
77
325
|
|
|
78
|
-
interface TourProps extends TooltipProps {
|
|
79
|
-
|
|
326
|
+
interface TourProps extends TooltipProps, FlowComponentProps {
|
|
327
|
+
}
|
|
328
|
+
declare function Tour({ flowId, onComplete, variables, ...props }: TourProps): _emotion_react_jsx_runtime.JSX.Element;
|
|
329
|
+
|
|
330
|
+
declare function useBoundingClientRect(): {
|
|
331
|
+
node: any;
|
|
332
|
+
rect: DOMRect;
|
|
333
|
+
ref: (node: HTMLElement) => void;
|
|
334
|
+
};
|
|
335
|
+
|
|
336
|
+
interface FlowConfig {
|
|
337
|
+
variables?: Record<string, any>;
|
|
80
338
|
}
|
|
81
|
-
declare function
|
|
339
|
+
declare function useFlow(flowId: string, config?: FlowConfig): {
|
|
340
|
+
flow: Flow;
|
|
341
|
+
};
|
|
342
|
+
|
|
343
|
+
declare function useModal(flowId: string): {
|
|
344
|
+
isCurrentModal: boolean;
|
|
345
|
+
};
|
|
346
|
+
|
|
347
|
+
declare function useFrigade(): {
|
|
348
|
+
frigade: _frigade_js.Frigade;
|
|
349
|
+
};
|
|
82
350
|
|
|
83
|
-
export { Box, BoxProps, Button, ButtonProps, Flex, Provider, ProviderProps, Text, TextProps, Tooltip, TooltipProps, Tour, TourProps };
|
|
351
|
+
export { Announcement, Banner, Box, BoxProps, Button, ButtonProps, Card, Flex, FlowConfig, Provider, ProviderProps, Text, TextProps, Tooltip, TooltipProps, Tour, TourProps, useBoundingClientRect, useFlow, useFlowHandlers, useFrigade, useModal, useStepHandlers };
|
package/dist/index.js
CHANGED
|
@@ -1,3 +1,17 @@
|
|
|
1
|
-
|
|
2
|
-
var _=Object.defineProperty,Fr=Object.defineProperties;var Wr=Object.getOwnPropertyDescriptors;var A=Object.getOwnPropertySymbols;var rr=Object.prototype.hasOwnProperty,er=Object.prototype.propertyIsEnumerable;var Z=(r,e,o)=>e in r?_(r,e,{enumerable:!0,configurable:!0,writable:!0,value:o}):r[e]=o,l=(r,e)=>{for(var o in e||(e={}))rr.call(e,o)&&Z(r,o,e[o]);if(A)for(var o of A(e))er.call(e,o)&&Z(r,o,e[o]);return r},f=(r,e)=>Fr(r,Wr(e));var c=(r,e)=>{var o={};for(var t in r)rr.call(r,t)&&e.indexOf(t)<0&&(o[t]=r[t]);if(r!=null&&A)for(var t of A(r))e.indexOf(t)<0&&er.call(r,t)&&(o[t]=r[t]);return o};var or=(r,e)=>{for(var o in e)_(r,o,{get:e[o],enumerable:!0})};var R=(r,e,o)=>new Promise((t,n)=>{var a=d=>{try{s(o.next(d))}catch(v){n(v)}},i=d=>{try{s(o.throw(d))}catch(v){n(v)}},s=d=>d.done?t(d.value):Promise.resolve(d.value).then(a,i);s((o=o.apply(r,e)).next())});import*as sr from"react";import{clsx as Dr}from"clsx";var p={borders:{md:"var(--fr-borders-md)"},borderWidths:{0:"var(--fr-borderWidths-0)",md:"var(--fr-borderWidths-md)"},colors:{black:"var(--fr-colors-black)",gray100:"var(--fr-colors-gray100)",gray200:"var(--fr-colors-gray200)",gray300:"var(--fr-colors-gray300)",gray400:"var(--fr-colors-gray400)",gray500:"var(--fr-colors-gray500)",gray600:"var(--fr-colors-gray600)",gray700:"var(--fr-colors-gray700)",gray800:"var(--fr-colors-gray800)",gray900:"var(--fr-colors-gray900)",white:"var(--fr-colors-white)",blue400:"var(--fr-colors-blue400)",blue500:"var(--fr-colors-blue500)",blue800:"var(--fr-colors-blue800)",blue900:"var(--fr-colors-blue900)",green400:"var(--fr-colors-green400)",green500:"var(--fr-colors-green500)",green800:"var(--fr-colors-green800)",transparent:"var(--fr-colors-transparent)",red500:"var(--fr-colors-red500)",neutral:{background:"var(--fr-colors-neutral-background)",border:"var(--fr-colors-neutral-border)",foreground:"var(--fr-colors-neutral-foreground)",surface:"var(--fr-colors-neutral-surface)",active:{background:"var(--fr-colors-neutral-active-background)",border:"var(--fr-colors-neutral-active-border)",foreground:"var(--fr-colors-neutral-active-foreground)",surface:"var(--fr-colors-neutral-active-surface)"},focus:{background:"var(--fr-colors-neutral-focus-background)",border:"var(--fr-colors-neutral-focus-border)",foreground:"var(--fr-colors-neutral-focus-foreground)",surface:"var(--fr-colors-neutral-focus-surface)"},hover:{background:"var(--fr-colors-neutral-hover-background)",border:"var(--fr-colors-neutral-hover-border)",foreground:"var(--fr-colors-neutral-hover-foreground)",surface:"var(--fr-colors-neutral-hover-surface)"}},primary:{background:"var(--fr-colors-primary-background)",border:"var(--fr-colors-primary-border)",foreground:"var(--fr-colors-primary-foreground)",surface:"var(--fr-colors-primary-surface)",active:{background:"var(--fr-colors-primary-active-background)",border:"var(--fr-colors-primary-active-border)",foreground:"var(--fr-colors-primary-active-foreground)",surface:"var(--fr-colors-primary-active-surface)"},focus:{background:"var(--fr-colors-primary-focus-background)",border:"var(--fr-colors-primary-focus-border)",foreground:"var(--fr-colors-primary-focus-foreground)",surface:"var(--fr-colors-primary-focus-surface)"},hover:{background:"var(--fr-colors-primary-hover-background)",border:"var(--fr-colors-primary-hover-border)",foreground:"var(--fr-colors-primary-hover-foreground)",surface:"var(--fr-colors-primary-hover-surface)"}},secondary:{background:"var(--fr-colors-secondary-background)",border:"var(--fr-colors-secondary-border)",foreground:"var(--fr-colors-secondary-foreground)",surface:"var(--fr-colors-secondary-surface)",active:{background:"var(--fr-colors-secondary-active-background)",border:"var(--fr-colors-secondary-active-border)",foreground:"var(--fr-colors-secondary-active-foreground)",surface:"var(--fr-colors-secondary-active-surface)"},focus:{background:"var(--fr-colors-secondary-focus-background)",border:"var(--fr-colors-secondary-focus-border)",foreground:"var(--fr-colors-secondary-focus-foreground)",surface:"var(--fr-colors-secondary-focus-surface)"},hover:{background:"var(--fr-colors-secondary-hover-background)",border:"var(--fr-colors-secondary-hover-border)",foreground:"var(--fr-colors-secondary-hover-foreground)",surface:"var(--fr-colors-secondary-hover-surface)"}}},fontFamilies:{default:"var(--fr-fontFamilies-default)"},fontSizes:{xs:"var(--fr-fontSizes-xs)",sm:"var(--fr-fontSizes-sm)",md:"var(--fr-fontSizes-md)",lg:"var(--fr-fontSizes-lg)",xl:"var(--fr-fontSizes-xl)","2xl":"var(--fr-fontSizes-2xl)","3xl":"var(--fr-fontSizes-3xl)","4xl":"var(--fr-fontSizes-4xl)","5xl":"var(--fr-fontSizes-5xl)"},fontWeights:{regular:"var(--fr-fontWeights-regular)",demibold:"var(--fr-fontWeights-demibold)",bold:"var(--fr-fontWeights-bold)"},letterSpacings:{md:"var(--fr-letterSpacings-md)"},lineHeights:{xs:"var(--fr-lineHeights-xs)",sm:"var(--fr-lineHeights-sm)",md:"var(--fr-lineHeights-md)",lg:"var(--fr-lineHeights-lg)",xl:"var(--fr-lineHeights-xl)","2xl":"var(--fr-lineHeights-2xl)","3xl":"var(--fr-lineHeights-3xl)","4xl":"var(--fr-lineHeights-4xl)"},radii:{md:"var(--fr-radii-md)",lg:"var(--fr-radii-lg)",round:"var(--fr-radii-round)"},shadows:{md:"var(--fr-shadows-md)"},space:{0:"var(--fr-space-0)",1:"var(--fr-space-1)",2:"var(--fr-space-2)",3:"var(--fr-space-3)",4:"var(--fr-space-4)",5:"var(--fr-space-5)",6:"var(--fr-space-6)",7:"var(--fr-space-7)",8:"var(--fr-space-8)",9:"var(--fr-space-9)",10:"var(--fr-space-10)",11:"var(--fr-space-11)",12:"var(--fr-space-12)",13:"var(--fr-space-13)",14:"var(--fr-space-14)",15:"var(--fr-space-15)",16:"var(--fr-space-16)",17:"var(--fr-space-17)",18:"var(--fr-space-18)",19:"var(--fr-space-19)",20:"var(--fr-space-20)","-20":"var(--fr-space--20)","-19":"var(--fr-space--19)","-18":"var(--fr-space--18)","-17":"var(--fr-space--17)","-16":"var(--fr-space--16)","-15":"var(--fr-space--15)","-14":"var(--fr-space--14)","-13":"var(--fr-space--13)","-12":"var(--fr-space--12)","-11":"var(--fr-space--11)","-10":"var(--fr-space--10)","-9":"var(--fr-space--9)","-8":"var(--fr-space--8)","-7":"var(--fr-space--7)","-6":"var(--fr-space--6)","-5":"var(--fr-space--5)","-4":"var(--fr-space--4)","-3":"var(--fr-space--3)","-2":"var(--fr-space--2)","-1":"var(--fr-space--1)","-0.5":"var(--fr-space--0-5)","0.5":"var(--fr-space-0-5)",auto:"var(--fr-space-auto)"}};function M(r,e="",o="."){return Object.keys(r).reduce((t,n)=>{let i=`${e.length?`${e}${o}`:""}${n}`,s=r[n];return typeof s=="object"&&s!==null&&!Array.isArray(s)?Object.assign(t,M(s,i,o)):t[i]=s,t},{})}var D=M(p.colors),tr={color:D,backgroundColor:D,borderColor:D,border:p.borders,borderRadius:p.radii,borderWidth:p.borderWidths,fontFamily:p.fontFamilies,fontSize:p.fontSizes,fontWeight:p.fontWeights,gap:p.space,lineHeight:p.lineHeights,margin:p.space,marginTop:p.space,marginRight:p.space,marginBottom:p.space,marginLeft:p.space,padding:p.space,paddingTop:p.space,paddingRight:p.space,paddingBottom:p.space,paddingLeft:p.space,alignContent:["center","start","end","flex-start","flex-end","normal","baseline","first baseline","last baseline","space-between","space-around","space-evenly","stretch","safe center","unsafe center","inherit","initial","revert","revert-layer","unset"],alignItems:["normal","stretch","center","start","end","flex-start","flex-end","self-start","self-end","baseline","first baseline","last baseline","safe center","unsafe center","inherit","initial","revert","revert-layer","unset"],alignSelf:["auto","normal","center","start","end","self-start","self-end","flex-start","flex-end","baseline","first baseline","last baseline","stretch","safe center","unsafe center","inherit","initial","revert","revert-layer","unset"],flexDirection:["row","row-reverse","column","column-reverse","inherit","initial","revert","revert-layer","unset"],flexWrap:["nowrap","wrap","wrap-reverse","inherit","initial","revert","revert-layer","unset"],justifyContent:["center","start","end","flex-start","flex-end","left","right","normal","space-between","space-around","space-evenly","stretch","safe center","unsafe center","inherit","initial","revert","revert-layer","unset"],justifyItems:["normal","stretch","center","start","end","flex-start","flex-end","self-start","self-end","left","right","baseline","first baseline","last baseline","safe center","unsafe center","legacy right","legacy left","legacy center","inherit","initial","revert","revert-layer","unset"],boxSizing:["border-box","content-box","inherit","initial","revert","revert-layer","unset"],position:["static","relative","absolute","fixed","sticky","inherit","initial","revert","revert-layer","unset"],display:["block","block flex","block flow","block flow-root","block grid","contents","flex","flow-root","grid","inherit","initial","inline","inline flex","inline flow","inline flow-root","inline grid","inline-block","inline-flex","inline-grid","list-item","none","revert","revert-layer","table","table-row-group","table-header-group","table-footer-group","table-row","table-cell","table-column-group","table-column","table-caption","unset"]},nr={m:["margin"],mt:["marginTop"],mr:["marginRight"],mb:["marginBottom"],ml:["marginLeft"],mx:["marginLeft","marginRight"],my:["marginTop","marginBottom"],p:["padding"],pt:["paddingTop"],pr:["paddingRight"],pb:["paddingBottom"],pl:["paddingLeft"],px:["paddingLeft","paddingRight"],py:["paddingTop","paddingBottom"]};function Ar(r){if(Array.isArray(r))return new Map(r.map(e=>[e,e]));if(typeof r=="object"&&r!==null)return new Map(Object.entries(r));if(["string","number"].includes(typeof r))return new Map([r,r]);throw new Error("Invalid entry in styleProps")}var Vr=new Map(Object.entries(tr).map(([r,e])=>[r,Ar(e)])),Mr=new Map(Object.entries(nr).map(([r,e])=>[r,new Set(e)]));function ar(r){let e=Object.assign({},r),o={};return Object.entries(e).forEach(([t,n])=>{let a=Mr.get(t);a!=null&&(a.forEach(i=>{e[i]=n}),delete e[t])}),Object.entries(e).forEach(([t,n])=>{let a=Vr.get(t);if(a!=null)if(typeof n=="string"&&n.indexOf(" ")>-1){let i=n.split(" ");o[t]=i.map(s=>{var d;return(d=a.get(s.toString()))!=null?d:s}).join(" "),delete e[t]}else a.has(n.toString())&&(o[t]=a.get(n.toString()),delete e[t])}),{cssFromProps:o,unmatchedProps:e}}import{jsx as zr}from"@emotion/react/jsx-runtime";function ir(r){return r&&`fr-${r}`}function Er(r){return r&&(Array.isArray(r)?r.map(e=>ir(e)).join(" "):ir(r))}function jr(s,i){var d=s,{as:r,children:e,className:o,css:t,part:n}=d,a=c(d,["as","children","className","css","part"]);let v=r!=null?r:"div",{cssFromProps:h,unmatchedProps:b}=ar(a),P=Er(n),B=o||P?Dr(o,P):void 0;return zr(v,f(l({className:B,css:[l(l({boxSizing:"border-box"},h),t)]},b),{ref:i,children:e}))}var u=sr.forwardRef(jr);var E={};or(E,{Body1:()=>Ur,Body2:()=>Xr,Caption:()=>Jr,Display1:()=>Ir,Display2:()=>$r,H1:()=>Lr,H2:()=>Kr,H3:()=>Nr,H4:()=>qr,base:()=>x});var x=({fontFamilies:r})=>({fontFamily:r.default,margin:0}),Ir=({fontSizes:r,fontWeights:e,lineHeights:o})=>[x,{fontSize:r["5xl"],fontWeight:e.bold,lineHeight:o["4xl"]}],$r=({fontSizes:r,fontWeights:e,lineHeights:o})=>[x,{fontSize:r["4xl"],fontWeight:e.bold,lineHeight:o["3xl"]}],Lr=({fontSizes:r,fontWeights:e,lineHeights:o})=>[x,{fontSize:r["3xl"],fontWeight:e.bold,lineHeight:o["2xl"]}],Kr=({fontSizes:r,fontWeights:e,lineHeights:o})=>[x,{fontSize:r["2xl"],fontWeight:e.bold,lineHeight:o.xl}],Nr=({fontSizes:r,fontWeights:e,lineHeights:o})=>[x,{fontSize:r.xl,fontWeight:e.bold,lineHeight:o.lg}],qr=({fontSizes:r,fontWeights:e,lineHeights:o})=>[x,{fontSize:r.lg,fontWeight:e.bold,lineHeight:o.md}],Ur=({fontSizes:r,fontWeights:e,lineHeights:o})=>[x,{fontSize:r.md,fontWeight:e.regular,lineHeight:o.md}],Xr=({fontSizes:r,fontWeights:e,lineHeights:o})=>[x,{fontSize:r.sm,fontWeight:e.regular,lineHeight:o.md}],Jr=({fontSizes:r,fontWeights:e,lineHeights:o})=>[x,{fontSize:r.xs,fontWeight:e.regular,lineHeight:o.sm}];import{jsx as cr}from"@emotion/react/jsx-runtime";function lr(a){var i=a,{as:r="span",children:e,css:o,variant:t="Body1"}=i,n=c(i,["as","children","css","variant"]);return cr(u,f(l({as:r,css:[E[t],o]},n),{children:e}))}var Qr=["Display1","Display2","H1","H2","H3","H4","Body1","Body2","Caption"],Yr=Object.fromEntries(Qr.map(r=>{let e=["H1","H2","H3","H4"].includes(r)?r.toLowerCase():void 0,o=t=>cr(lr,f(l({as:e},t),{variant:r,children:t.children}));return o.displayName=`Text.${r}`,[r,o]})),w=Object.assign(lr,Yr);var j={};or(j,{Link:()=>_r,Plain:()=>re,Primary:()=>Gr,Secondary:()=>Zr,base:()=>k});var k=({radii:r,space:e})=>({borderWidth:0,borderRadius:r.md,padding:`${e[2]} ${e[4]}`}),Gr=({colors:r})=>[k,{backgroundColor:r.primary.surface,color:r.primary.foreground,"&:hover":{backgroundColor:r.primary.hover.surface}}],Zr=({colors:r})=>[k,{backgroundColor:r.secondary.surface,color:r.secondary.foreground,"&:hover":{backgroundColor:r.secondary.hover.surface}}],_r=({colors:r})=>[k,{backgroundColor:r.transparent,color:r.primary.surface,"&:hover":{color:r.primary.hover.surface}}],re=({colors:r})=>[k,{backgroundColor:r.transparent,color:r.neutral.foreground}];import{jsx as pr,jsxs as te}from"@emotion/react/jsx-runtime";function fr(i){var s=i,{as:r,children:e,css:o={},title:t,variant:n="Primary"}=s,a=c(s,["as","children","css","title","variant"]);return te(u,f(l({as:r!=null?r:"button",css:[j[n],o]},a),{children:[e,t&&pr(w.Body2,{fontWeight:"demibold",children:t})]}))}var ee=["Primary","Secondary","Link","Plain"],oe=Object.fromEntries(ee.map(r=>{let e=r.toLocaleLowerCase(),o=a=>{var i=a,{part:t}=i,n=c(i,["part"]);return pr(fr,f(l({part:[`button-${e}`,t]},n),{variant:r,children:n.children}))};return o.displayName=`Text.${r}`,[r,o]})),O=Object.assign(fr,oe);import*as z from"react";import{jsx as dr}from"@emotion/react/jsx-runtime";var ne=z.forwardRef((n,t)=>{var a=n,{children:r,css:e}=a,o=c(a,["children","css"]);return dr(u,f(l({css:[{display:"flex",flexDirection:"row"},e]},o),{ref:t,children:r}))}),ae=z.forwardRef((n,t)=>{var a=n,{children:r,css:e}=a,o=c(a,["children","css"]);return dr(u,f(l({css:[{display:"flex",flexDirection:"column"},e]},o),{ref:t,children:r}))}),S={Column:ae,Row:ne};import{createContext as se}from"react";import{ThemeProvider as le}from"@emotion/react";function ur(r){var e=r.match(/^var\((.*)\)$/);return e?e[1]:r}function gr(r,e){var o=r;for(var t of e){if(!(t in o))throw new Error("Path ".concat(e.join(" -> ")," does not exist in object"));o=o[t]}return o}function I(r,e){var o=arguments.length>2&&arguments[2]!==void 0?arguments[2]:[],t=r.constructor();for(var n in r){var a=r[n],i=[...o,n];typeof a=="string"||typeof a=="number"||a==null?t[n]=e(a,i):typeof a=="object"&&!Array.isArray(a)?t[n]=I(a,e,i):console.warn('Skipping invalid key "'.concat(i.join("."),'". Should be a string, number, null or object. Received: "').concat(Array.isArray(a)?"Array":typeof a,'"'))}return t}function mr(r,e,o){r.style.setProperty(ur(e),o)}function vr(r,e,o){if(typeof o=="object"){var t=e;I(o,(i,s)=>{mr(r,gr(t,s),String(i))})}else{var n=e;for(var a in n)mr(r,a,n[a])}}import{useEffect as ie}from"react";function $(r,e=p){return Object.keys(r).reduce((o,t)=>{let n=r[t];return typeof n=="object"&&n!==null&&!Array.isArray(n)&&t in r?Object.assign(o,$(n,e[t])):o[e[t]]=r[t],o},{})}function br(r={},e=":root"){ie(()=>{let o=$(r),t=document.querySelector(e);vr(t,o)},[r])}import{jsx as xr}from"@emotion/react/jsx-runtime";var L=se({apiKey:"",config:{}});function ce({apiKey:r,children:e,config:o={},theme:t}){return br(t),xr(L.Provider,{value:{apiKey:r,config:o},children:xr(le,{theme:p,children:e})})}import{useEffect as be,useRef as xe,useState as U}from"react";import{XMarkIcon as ye}from"@heroicons/react/24/solid";import*as y from"@radix-ui/react-popover";import{useCallback as fe,useLayoutEffect as pe,useState as yr}from"react";function hr(){let r="DOMRect"in globalThis?new DOMRect:{height:0,width:0,x:0,y:0,bottom:0,top:0,right:0,left:0,toJSON:()=>{}},[e,o]=yr(r),[t,n]=yr(null),a=fe(i=>{n(i)},[]);return pe(()=>{t&&o(t.getBoundingClientRect())},[t]),{node:t,rect:e,ref:a}}var Pr="_16td421";import{jsx as wr,jsxs as de}from"@emotion/react/jsx-runtime";function Tr(t){var n=t,{style:r={},part:e=""}=n,o=c(n,["style","part"]);return de(u,f(l({part:`dot-wrapper ${e}`,style:l({height:"48px",position:"absolute",width:"48px"},r)},o),{children:[wr(u,{backgroundColor:"primary.surface",className:Pr,part:"dot-pulse",style:{borderRadius:"24px",height:"48px",left:0,position:"absolute",top:0,transformOrigin:"center center",width:"48px"}}),wr(u,{backgroundColor:"primary.surface",part:"dot",style:{borderRadius:"12px",height:"24px",left:"12px",position:"absolute",top:"12px",width:"24px"}})]}))}import{jsx as ue}from"@emotion/react/jsx-runtime";function K(t){var n=t,{part:r,src:e}=n,o=c(n,["part","src"]);return ue(u,l({as:"img",part:["image",r],src:e},o))}import{jsx as me}from"@emotion/react/jsx-runtime";function ge(r){var e,o,t;if(r.includes("youtube"))return`https://www.youtube.com/embed/${(e=r.split("v=")[1])==null?void 0:e.split("&")[0]}`;if(r.includes("vimeo"))return`https://player.vimeo.com/video/${(o=r.split("vimeo.com/")[1])==null?void 0:o.split("&")[0]}`;if(r.includes("wistia"))return`https://fast.wistia.net/embed/iframe/${(t=r.split("wistia.com/medias/")[1])==null?void 0:t.split("&")[0]}`;throw new Error("Could not map videoUri to a known provider (Youtube, Vimeo, Wistia).")}function N(t){var n=t,{part:r,src:e}=n,o=c(n,["part","src"]);let a=ge(e);return me(u,l({allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",allowFullScreen:!0,as:"iframe",backgroundColor:"gray100",borderWidth:0,part:["video",r],src:a},o))}import{jsx as ve}from"@emotion/react/jsx-runtime";function q(t){var n=t,{src:r,type:e}=n,o=c(n,["src","type"]);return ve(e==="video"?N:K,l({src:r},o))}function Br({props:r,alignAttr:e,sideAttr:o}){let t=o!=null?o:"bottom",n={},a=(()=>{if(["after","before"].includes(r.align)){if(e=="start")return"before";if(e=="end")return"after"}return r.align})(),i="-24px",s={top:"bottom",right:"left",bottom:"top",left:"right"};return n[s[t]]=i,["before","end"].includes(a)?["top","bottom"].includes(t)?n.right=i:n.bottom=i:["after","start"].includes(a)?["top","bottom"].includes(t)?n.left=i:n.top=i:["top","bottom"].includes(t)?n.left=`calc(50% + ${i})`:n.top=`calc(50% + ${i})`,n}var Sr={content:["align","alignOffset","arrowPadding","avoidCollisions","collisionBoundary","collisionPadding","forceMount","hideWhenDetached","onCloseAutoFocus","onEscapeKeyDown","onFocusOutside","onInteractOutside","onOpenAutoFocus","onPointerDownOutside","side","sideOffset","sticky"],root:["defaultOpen","modal","onOpenChange","open"]};function Cr(r,e){var n,a,i;let o=Object.fromEntries(Sr.content.map(s=>[s,r[s]]).filter(s=>s[1]!==void 0)),t=Object.fromEntries(Sr.root.map(s=>[s,r[s]]).filter(s=>s[1]!==void 0));if(["before","after"].includes(o.align)){let s={after:"end",before:"start"},d=(H,V)=>["top","bottom"].includes(V)?H=="after"?"marginLeft":"marginRight":H=="after"?"marginTop":"marginBottom",v=(n=o.alignOffset)!=null?n:0,h=(a=o.style)!=null?a:{},b=(i=o.side)!=null?i:"bottom",P=o.align;o.style=f(l({},h),{[d(P,b)]:v});let B=["top","bottom"].includes(b)?e.width:e.height;o.alignOffset=(B+v)*-1,o.align=s[P]}return{contentProps:o,rootProps:t}}import{jsx as m,jsxs as X}from"@emotion/react/jsx-runtime";function g(i){var s=i,{anchor:r,children:e,css:o,spotlight:t=!1,style:n}=s,a=c(s,["anchor","children","css","spotlight","style"]);let{node:d,rect:v,ref:h}=hr(),[b,P]=U(a.align),[B,H]=U(a.side);if(d!==null){let C=d.getAttribute("data-align"),G=d.getAttribute("data-side");b!==C&&P(C),B!==G&&H(G)}let{contentProps:V,rootProps:kr}=Cr(a,v),Q=xe(null),[F,Or]=U(null);if(be(()=>{let C=document.querySelector(r);C!=null&&(Q.current=C,Or(Q))},[r]),F==null)return null;let W=F.current.getBoundingClientRect(),Y="0";typeof window!="undefined"&&(Y=window.getComputedStyle(F.current).borderRadius);let Hr=Br({props:a,alignAttr:b,sideAttr:B});return X(y.Root,f(l({defaultOpen:!0},kr),{children:[m(y.Anchor,{virtualRef:F}),m(y.Portal,{children:X("div",{css:o,children:[t&&m(u,{borderRadius:Y,part:"tooltip-spotlight",position:"absolute",css:{boxShadow:"0 0 0 2000px rgb(0 0 0 / 0.5)",height:W.height,left:W.left,top:W.top,width:W.width}}),m(y.Content,f(l({asChild:!0},V),{ref:h,children:X(S.Column,{backgroundColor:"white",borderRadius:"md",p:5,part:"tooltip-content",position:"relative",css:l({boxShadow:"0px 4px 20px rgba(0, 0, 0, 0.1)",width:"300px"},n),children:[m(Tr,{style:Hr}),e]})}))]})})]}))}g.Close=o=>{var t=o,{css:r}=t,e=c(t,["css"]);return m(y.Close,{"aria-label":"Close",asChild:!0,children:m(O.Plain,f(l({css:[{top:0,right:0},r],part:"tooltip-close",position:"absolute"},e),{children:m(ye,{height:"20",fill:"currentColor"})}))})};g.Media=o=>{var t=o,{src:r}=t,e=c(t,["src"]);return r==null?null:m(q,l({borderRadius:"md md 0 0",borderWidth:"0",css:{aspectRatio:"2"},margin:"-5 -5 5",src:r},e))};g.Primary=t=>{var n=t,{onClick:r,title:e}=n,o=c(n,["onClick","title"]);return e==null?null:m(O.Primary,l({title:e,onClick:r},o))};g.Progress=o=>{var t=o,{children:r}=t,e=c(t,["children"]);return r==null?null:m(w.Body2,f(l({fontWeight:"demibold",part:"progress"},e),{children:r}))};g.Secondary=t=>{var n=t,{onClick:r,title:e}=n,o=c(n,["onClick","title"]);return e==null?null:m(O.Secondary,l({title:e,onClick:r},o))};g.Subtitle=o=>{var t=o,{children:r}=t,e=c(t,["children"]);return r==null?null:m(w.Body2,f(l({part:"subtitle"},e),{children:r}))};g.Title=o=>{var t=o,{children:r}=t,e=c(t,["children"]);return r==null?null:m(w.Body1,f(l({fontWeight:"bold",mb:1,part:"title"},e),{children:r}))};import{Frigade as he}from"@frigade/js";import{useContext as Pe,useState as we}from"react";function Rr(r){let[e,o]=we(null),{apiKey:t,config:n}=Pe(L);function a(){return R(this,null,function*(){let s=yield(yield new he(t,{apiUrl:n.apiUrl,userId:n.userId})).getFlow(r);o(s)})}return e===null&&a(),{flow:e,fetchFlow:a}}import{jsx as T,jsxs as J}from"@emotion/react/jsx-runtime";function Te(o){var t=o,{flowId:r}=t,e=c(t,["flowId"]);var h;let{flow:n,fetchFlow:a}=Rr(r);if(n==null||n!=null&&n.isCompleted||n!=null&&n.isSkipped)return null;n.start();let i=n.getCurrentStep();i==null||i.start();function s(){return R(this,null,function*(){yield n.skip(),a()})}function d(){return R(this,null,function*(){yield i.complete(),a()})}let v=d;return J(g,f(l({align:"after",anchor:i.selector,onOpenAutoFocus:b=>b.preventDefault(),onPointerDownOutside:b=>b.preventDefault()},e),{children:[T(g.Close,{onClick:s}),T(g.Media,{src:(h=i.videoUri)!=null?h:i.imageUri,type:i.videoUri?"video":"image"}),T(g.Title,{children:i.title}),T(g.Subtitle,{children:i.subtitle}),J(S.Row,{pt:4,alignItems:"center",justifyContent:"space-between",children:[T(g.Progress,{children:`${n.getNumberOfCompletedSteps()}/${n.steps.size}`}),J(S.Row,{gap:3,children:[T(g.Secondary,{title:i.secondaryButtonTitle,onClick:v}),T(g.Primary,{title:i.primaryButtonTitle,onClick:d})]})]})]}))}export{u as Box,O as Button,S as Flex,ce as Provider,w as Text,g as Tooltip,Te as Tour};
|
|
1
|
+
'use client';
|
|
2
|
+
import * as b from '@radix-ui/react-dialog';
|
|
3
|
+
import { XMarkIcon } from '@heroicons/react/24/solid';
|
|
4
|
+
import * as N from 'react';
|
|
5
|
+
import { createContext, useState, useRef, useContext, useEffect, useCallback, useLayoutEffect } from 'react';
|
|
6
|
+
import { clsx } from 'clsx';
|
|
7
|
+
import qe from 'dompurify';
|
|
8
|
+
import { jsx, jsxs } from '@emotion/react/jsx-runtime';
|
|
9
|
+
import { keyframes, Global, ThemeProvider } from '@emotion/react';
|
|
10
|
+
import { Frigade } from '@frigade/js';
|
|
11
|
+
import * as w from '@radix-ui/react-popover';
|
|
12
|
+
|
|
13
|
+
var je=Object.defineProperty;var te=(e,t)=>{for(var r in t)je(e,r,{get:t[r],enumerable:!0});};var re={borders:{md:"1px solid"},borderWidths:{0:"0",md:"1px"}};var oe={black:"#000000",gray100:"#14161A",gray200:"#181B20",gray300:"#1F2329",gray400:"#2E343D",gray500:"#4C5766",gray600:"#5A6472",gray700:"#C5CBD3",gray800:"#E2E5E9",gray900:"#F1F2F4",white:"#ffffff",blue400:"#015AC6",blue500:"#0171F8",blue800:"#DBECFF",blue900:"#F5F9FF",green400:"#009E37",green500:"#00D149",green800:"#DBFFE8",transparent:"#FFFFFF00",inherit:"inherit",red500:"#c00000"};var ne={md:"10px",lg:"20px",round:"50%"};var a=e=>`var(--fr-colors-${e})`,ie={neutral:{background:a("white"),border:a("gray500"),foreground:a("black"),surface:a("gray700"),active:{background:a("white"),border:a("gray900"),foreground:a("black"),surface:a("gray700")},focus:{background:a("white"),border:a("gray900"),foreground:a("black"),surface:a("gray700")},hover:{background:a("white"),border:a("gray900"),foreground:a("black"),surface:a("gray700")}},primary:{background:a("blue500"),border:a("blue500"),foreground:a("white"),surface:a("blue500"),active:{background:a("blue400"),border:a("blue400"),foreground:a("white"),surface:a("blue400")},focus:{background:a("blue500"),border:a("blue500"),foreground:a("white"),surface:a("blue500")},hover:{background:a("blue400"),border:a("blue400"),foreground:a("white"),surface:a("blue400")}},secondary:{background:a("gray900"),border:a("gray900"),foreground:a("black"),surface:a("gray900"),active:{background:a("gray800"),border:a("gray800"),foreground:a("black"),surface:a("gray800")},focus:{background:a("gray900"),border:a("gray900"),foreground:a("black"),surface:a("gray900")},hover:{background:a("gray800"),border:a("gray800"),foreground:a("black"),surface:a("gray800")}}};var ae={md:"0px 4px 20px rgba(0, 0, 0, 0.1)"};var Ue="px",_e=e=>typeof e=="number"?`${4*e}${Ue}`:e,Ke=[-20,-19,-18,-17,-16,-15,-14,-13,-12,-11,-10,-9,-8,-7,-6,-5,-4,-3,-2,-1,-.5,0,.5,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,"auto"],se=Object.fromEntries(Ke.map(e=>[e,_e(e)]));var le={fontFamilies:{default:"TT Interphases Pro, sans-serif"},fontSizes:{xs:"12px",sm:"14px",md:"16px",lg:"18px",xl:"20px","2xl":"24px","3xl":"30px","4xl":"36px","5xl":"48px"},fontWeights:{thin:"100",extralight:"200",light:"300",regular:"400",medium:"500",demibold:"600",bold:"700",extrabold:"800",black:"900"},letterSpacings:{md:"0.02em"},lineHeights:{xs:"18px",sm:"22px",md:"24px",lg:"26px",xl:"30px","2xl":"38px","3xl":"46px","4xl":"60px"}};var z={...re,colors:{...oe,...ie},...le,radii:ne,shadows:ae,space:se};function A(e,t="",r="."){return Object.keys(e).reduce((o,n)=>{let i=`${t.length?`${t}${r}`:""}${n}`,l=e[n];return typeof l=="object"&&l!==null&&!Array.isArray(l)?Object.assign(o,A(l,i,r)):o[i]=l,o},{})}function j(e){return A(e,"--fr","-")}function pe(e,t="--fr"){let r={};return Object.keys(e).forEach(o=>{let n=e[o];typeof n=="object"&&n!==null&&!Array.isArray(n)?r[o]=pe(n,`${t}-${o}`):r[o]=`var(${t}-${o})`;}),r}var de=j(z),p=pe(z);var U=A(p.colors),ce={color:U,backgroundColor:U,borderColor:U,border:p.borders,borderRadius:p.radii,borderWidth:p.borderWidths,boxShadow:p.shadows,fontFamily:p.fontFamilies,fontSize:p.fontSizes,fontWeight:p.fontWeights,gap:p.space,lineHeight:p.lineHeights,margin:p.space,marginTop:p.space,marginRight:p.space,marginBottom:p.space,marginLeft:p.space,padding:p.space,paddingTop:p.space,paddingRight:p.space,paddingBottom:p.space,paddingLeft:p.space,alignContent:["center","start","end","flex-start","flex-end","normal","baseline","first baseline","last baseline","space-between","space-around","space-evenly","stretch","safe center","unsafe center","inherit","initial","revert","revert-layer","unset"],alignItems:["normal","stretch","center","start","end","flex-start","flex-end","self-start","self-end","baseline","first baseline","last baseline","safe center","unsafe center","inherit","initial","revert","revert-layer","unset"],alignSelf:["auto","normal","center","start","end","self-start","self-end","flex-start","flex-end","baseline","first baseline","last baseline","stretch","safe center","unsafe center","inherit","initial","revert","revert-layer","unset"],flexDirection:["row","row-reverse","column","column-reverse","inherit","initial","revert","revert-layer","unset"],flexWrap:["nowrap","wrap","wrap-reverse","inherit","initial","revert","revert-layer","unset"],justifyContent:["center","start","end","flex-start","flex-end","left","right","normal","space-between","space-around","space-evenly","stretch","safe center","unsafe center","inherit","initial","revert","revert-layer","unset"],justifyItems:["normal","stretch","center","start","end","flex-start","flex-end","self-start","self-end","left","right","baseline","first baseline","last baseline","safe center","unsafe center","legacy right","legacy left","legacy center","inherit","initial","revert","revert-layer","unset"],boxSizing:["border-box","content-box","inherit","initial","revert","revert-layer","unset"],position:["static","relative","absolute","fixed","sticky","inherit","initial","revert","revert-layer","unset"],display:["block","block flex","block flow","block flow-root","block grid","contents","flex","flow-root","grid","inherit","initial","inline","inline flex","inline flow","inline flow-root","inline grid","inline-block","inline-flex","inline-grid","list-item","none","revert","revert-layer","table","table-row-group","table-header-group","table-footer-group","table-row","table-cell","table-column-group","table-column","table-caption","unset"],textAlign:["center","end","start","right","left","justify","inherit","initial","revert","revert-layer","unset"]},ue={m:["margin"],mt:["marginTop"],mr:["marginRight"],mb:["marginBottom"],ml:["marginLeft"],mx:["marginLeft","marginRight"],my:["marginTop","marginBottom"],p:["padding"],pt:["paddingTop"],pr:["paddingRight"],pb:["paddingBottom"],pl:["paddingLeft"],px:["paddingLeft","paddingRight"],py:["paddingTop","paddingBottom"]};function Ne(e){if(Array.isArray(e))return new Map(e.map(t=>[t,t]));if(typeof e=="object"&&e!==null)return new Map(Object.entries(e));if(["string","number"].includes(typeof e))return new Map([e,e]);throw new Error("Invalid entry in styleProps")}var Xe=new Map(Object.entries(ce).map(([e,t])=>[e,Ne(t)])),Ge=new Map(Object.entries(ue).map(([e,t])=>[e,new Set(t)]));function fe(e){let t=Object.assign({},e),r={};return Object.entries(t).forEach(([o,n])=>{let s=Ge.get(o);s!=null&&(s.forEach(i=>{t[i]=n;}),delete t[o]);}),Object.entries(t).forEach(([o,n])=>{let s=Xe.get(o);if(s!=null)if(typeof n=="string"&&n.indexOf(" ")>-1){let i=n.split(" ");r[o]=i.map(l=>s.get(l.toString())??l).join(" "),delete t[o];}else s.has(n.toString())&&(r[o]=s.get(n.toString()),delete t[o]);}),{cssFromProps:r,unmatchedProps:t}}function me(e){return e?{__html:qe.sanitize(e,{ALLOWED_TAGS:["b","i","a","span","div","p","pre","u","br","img","code","li","ul","table","tbody","thead","tr","td","th","h1","h2","h3","h4","video"],ALLOWED_ATTR:["style","class","target","id","href","alt","src","controls","autoplay","loop","muted"]})}:{__html:""}}function ge(e){return e&&`fr-${e}`}function Qe(e){return e&&(Array.isArray(e)?e.map(t=>ge(t)).join(" "):ge(e))}function Ye({as:e,children:t,className:r,part:o,...n},s){let i=e??"div",{cssFromProps:l,unmatchedProps:d}=fe(n),u=Qe(o),m=r||u?clsx(r,u):void 0,S=[{boxSizing:"border-box"},l];return typeof t=="string"?jsx(i,{className:m,css:S,...d,ref:s,dangerouslySetInnerHTML:me(t)}):jsx(i,{className:m,css:S,...d,ref:s,children:t})}var c=N.forwardRef(Ye);var _={};te(_,{Body1:()=>it,Body2:()=>at,Caption:()=>st,Display1:()=>Ze,Display2:()=>et,H1:()=>tt,H2:()=>rt,H3:()=>ot,H4:()=>nt});var v={color:"neutral.foreground",fontFamily:"default",margin:0},Ze={...v,fontSize:"5xl",fontWeight:"bold",lineHeight:"4xl"},et={...v,fontSize:"4xl",fontWeight:"bold",lineHeight:"3xl"},tt={...v,fontSize:"3xl",fontWeight:"bold",lineHeight:"2xl"},rt={...v,fontSize:"2xl",fontWeight:"bold",lineHeight:"xl"},ot={...v,fontSize:"xl",fontWeight:"bold",lineHeight:"lg"},nt={...v,fontSize:"lg",fontWeight:"bold",lineHeight:"md"},it={...v,fontSize:"md",fontWeight:"regular",lineHeight:"md"},at={...v,fontSize:"sm",fontWeight:"regular",lineHeight:"md"},st={...v,fontSize:"xs",fontWeight:"regular",lineHeight:"sm"};function ye({as:e="span",children:t,variant:r="Body1",...o}){return jsx(c,{as:e,..._[r],...o,children:t})}var lt=["Display1","Display2","H1","H2","H3","H4","Body1","Body2","Caption"],pt=Object.fromEntries(lt.map(e=>{let t=["H1","H2","H3","H4"].includes(e)?e.toLowerCase():void 0,r=o=>jsx(ye,{as:t,...o,variant:e,children:o.children});return r.displayName=`Text.${e}`,[e,r]})),h=Object.assign(ye,pt);var K={};te(K,{Link:()=>ut,Plain:()=>ft,Primary:()=>dt,Secondary:()=>ct,base:()=>E});var E=({radii:e,space:t})=>({borderWidth:0,borderRadius:e.md,padding:`${t[2]} ${t[4]}`}),dt=({colors:e})=>[E,{backgroundColor:e.primary.surface,color:e.primary.foreground,"&:hover":{backgroundColor:e.primary.hover.surface}}],ct=({colors:e})=>[E,{backgroundColor:e.secondary.surface,color:e.secondary.foreground,"&:hover":{backgroundColor:e.secondary.hover.surface}}],ut=({colors:e})=>[E,{backgroundColor:e.transparent,color:e.primary.surface,"&:hover":{color:e.primary.hover.surface}}],ft=({colors:e})=>[E,{backgroundColor:e.transparent,color:e.neutral.foreground}];function Pe({as:e,children:t,title:r,variant:o="Primary",...n}){return jsxs(c,{as:e??"button",css:K[o],...n,children:[t,r&&jsx(h.Body2,{fontWeight:"demibold",color:"inherit",children:r})]})}var mt=["Primary","Secondary","Link","Plain"],gt=Object.fromEntries(mt.map(e=>{let t=e.toLocaleLowerCase(),r=({part:o,...n})=>jsx(Pe,{part:[`button-${t}`,o],...n,variant:e,children:n.children});return r.displayName=`Text.${e}`,[e,r]})),P=Object.assign(Pe,gt);var bt=N.forwardRef(({children:e,css:t,...r},o)=>jsx(c,{css:[{display:"flex",flexDirection:"row"},t],...r,ref:o,children:e})),yt=N.forwardRef(({children:e,css:t,...r},o)=>jsx(c,{css:[{display:"flex",flexDirection:"column"},t],...r,ref:o,children:e})),C={Column:yt,Row:bt};var R=N.forwardRef(({as:e,children:t,...r},o)=>{let n=e??C.Column;return jsx(n,{backgroundColor:"neutral.background",borderRadius:"md",p:5,...r,ref:o,children:t})});function Te({part:e,src:t,...r}){return jsx(c,{as:"img",part:["image",e],src:t,...r})}function Ct(e){var t,r,o;if(e.includes("youtube"))return `https://www.youtube.com/embed/${(t=e.split("v=")[1])==null?void 0:t.split("&")[0]}`;if(e.includes("vimeo"))return `https://player.vimeo.com/video/${(r=e.split("vimeo.com/")[1])==null?void 0:r.split("&")[0]}`;if(e.includes("wistia"))return `https://fast.wistia.net/embed/iframe/${(o=e.split("wistia.com/medias/")[1])==null?void 0:o.split("&")[0]}`;throw new Error("Could not map videoUri to a known provider (Youtube, Vimeo, Wistia).")}function Be({part:e,src:t,...r}){let o=Ct(t);return jsx(c,{allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",allowFullScreen:!0,as:"iframe",backgroundColor:"gray100",borderWidth:0,part:["video",e],src:o,...r})}function I({src:e,type:t,...r}){return jsx(t==="video"?Be:Te,{src:e,...r})}function x({children:e,...t}){return jsx(b.Root,{defaultOpen:!0,modal:!0,children:jsxs(b.Portal,{children:[jsx(b.Overlay,{style:{background:"rgb(0 0 0 / 0.5)",position:"fixed",inset:0}}),jsx(b.Content,{asChild:!0,onOpenAutoFocus:r=>r.preventDefault(),onPointerDownOutside:r=>r.preventDefault(),children:jsx(R,{boxShadow:"md",css:{left:"50%",maxWidth:430,position:"fixed",top:"50%",transform:"translate(-50%, -50%)"},p:8,position:"relative",textAlign:"center",...t,children:e})})]})})}x.Close=e=>jsx(b.Close,{"aria-label":"Close",asChild:!0,children:jsx(P.Plain,{css:{top:"4px",right:"-4px"},part:"close",position:"absolute",...e,children:jsx(XMarkIcon,{height:"24",fill:"currentColor"})})});x.Subtitle=({children:e,...t})=>jsx(b.Description,{asChild:!0,children:jsx(h.Body2,{part:"subtitle",mb:5,...t,children:e})});x.Media=({src:e,...t})=>e==null?null:jsx(I,{borderRadius:"md",src:e,...t});x.Primary=({onClick:e,title:t,...r})=>t==null?null:jsx(P.Primary,{title:t,onClick:e,...r});x.ProgressDots=({current:e,total:t})=>{let r=[...Array(t)].map((o,n)=>jsx("circle",{r:4,cx:4+16*n,cy:"4px",fill:e===n?p.colors.blue500:p.colors.blue800},n));return jsx(c,{as:"svg",width:16*t-8,height:"8px",viewBox:`0 0 ${16*t-8} 8`,margin:"5 auto",children:r})};x.Secondary=({onClick:e,title:t,...r})=>t==null?null:jsx(P.Secondary,{title:t,onClick:e,...r});x.Title=({children:e,...t})=>jsx(b.Title,{asChild:!0,children:jsx(h.H3,{mb:1,part:"title",...t,children:e})});var T=createContext({apiKey:"",modals:[],setModals:()=>{},navigate:()=>{}});function Ot({children:e,navigate:t,theme:r,...o}){let n=r?j(r):{},[s,i]=useState([]),l=useRef(new Frigade(o.apiKey,{apiKey:o.apiKey,apiUrl:o.apiUrl,userId:o.userId,groupId:o.groupId})),d=t??((u,m="_self")=>{window.open(u,m);});return jsxs(T.Provider,{value:{modals:s,setModals:i,navigate:d,...o,frigade:l.current},children:[jsx(Global,{styles:{":root":{...de,...n}}}),jsx(ThemeProvider,{theme:p,children:e})]})}function F(e,t){let[r,o]=useState(),[n,s]=useState(""),{frigade:i}=useContext(T),l=d=>{d.id===e&&(t!=null&&t.variables&&d.applyVariables(t.variables),o(d),s(Math.random().toString()));};return useEffect(()=>((async()=>{let d=await i.getFlow(e);t!=null&&t.variables&&d.applyVariables(t.variables),o(d);})(),i.onStateChange(l),()=>{i.removeStateChangeHandler(l);}),[]),{flow:r}}function B(e,{onComplete:t,onDismiss:r}={}){let o=useRef(null);return useEffect(()=>{e!=null&&(e.isCompleted&&o.current===!1&&(async()=>await(t==null?void 0:t(e)))(),o.current=e==null?void 0:e.isCompleted);},[e==null?void 0:e.isCompleted]),{handleDismiss:useCallback(async n=>{if(await(r==null?void 0:r(e,n))===!1)return n.preventDefault(),!1;await e.skip();},[e])}}function k(e,{onPrimary:t,onSecondary:r}={}){let{navigate:o}=useContext(T);return {handlePrimary:useCallback(async n=>{if(await(t==null?void 0:t(e,n))===!1)return n.preventDefault(),!1;await e.complete(),e.primaryButtonUri!=null&&o(e.primaryButtonUri,e.primaryButtonUriTarget);},[e]),handleSecondary:useCallback(async n=>{if(await(r==null?void 0:r(e,n))===!1)return n.preventDefault(),!1;await e.complete(),e.secondaryButtonUri!=null&&o(e.secondaryButtonUri,e.secondaryButtonUriTarget);},[e])}}function Lt({flowId:e,onComplete:t,onDismiss:r,onPrimary:o,onSecondary:n,variables:s}){let{flow:i}=F(e,{variables:s}),l=i==null?void 0:i.getCurrentStep(),{handleDismiss:d}=B(i,{onComplete:t,onDismiss:r}),{handlePrimary:u,handleSecondary:m}=k(l,{onPrimary:o,onSecondary:n});return i==null||i.isVisible===!1?null:(i.start(),l==null||l.start(),jsxs(x,{children:[jsx(x.Close,{onClick:d}),jsx(x.Title,{children:l.title}),jsx(x.Subtitle,{children:l.subtitle}),jsx(x.Media,{src:l.imageUri,css:{aspectRatio:"1.5",objectFit:"cover",width:"100%"}}),jsx(x.ProgressDots,{current:i.getNumberOfCompletedSteps(),total:i.getNumberOfAvailableSteps()}),jsxs(C.Row,{css:{"& > button":{flexGrow:1}},gap:3,children:[jsx(x.Secondary,{title:"Secondary",onClick:m}),jsx(x.Primary,{title:"Primary",onClick:u})]})]}))}function jt({flowId:e,onComplete:t,onDismiss:r,onPrimary:o,onSecondary:n,...s}){let{flow:i}=F(e),l=i==null?void 0:i.getCurrentStep(),{handleDismiss:d}=B(i,{onComplete:t,onDismiss:r}),{handlePrimary:u,handleSecondary:m}=k(l,{onPrimary:o,onSecondary:n});return i==null||i.isVisible===!1?null:(i.start(),l==null||l.start(),jsxs(R,{as:C.Row,border:"md",borderColor:"gray900",justifyContent:"space-between",...s,children:[jsxs(C.Row,{gap:3,children:[jsx("img",{src:l.imageUri,style:{height:40,width:40,alignSelf:"center"}}),jsxs(C.Column,{children:[jsx(h.H4,{mb:1,children:l.title}),jsx(h.Body2,{children:l.subtitle})]})]}),jsxs(C.Row,{alignItems:"center",gap:3,children:[jsx(P.Secondary,{title:l.secondaryButtonTitle,onClick:m}),jsx(P.Primary,{title:l.primaryButtonTitle,onClick:u}),jsx(P.Plain,{part:"banner-close",onClick:d,children:jsx(XMarkIcon,{height:"24",fill:"currentColor"})})]})]}))}function X(){let e="DOMRect"in globalThis?new DOMRect:{height:0,width:0,x:0,y:0,bottom:0,top:0,right:0,left:0,toJSON:()=>{}},[t,r]=useState(e),[o,n]=useState(null),s=useCallback(i=>{n(i);},[]);return useLayoutEffect(()=>{o&&r(o.getBoundingClientRect());},[o]),{node:o,rect:t,ref:s}}var Nt=keyframes({"0%":{opacity:.5,transform:"scale(0.5)"},"50%":{opacity:0,transform:"scale(1)"},"100%":{opacity:0,transform:"scale(1)"}});function Oe({style:e={},part:t="",...r}){return jsxs(c,{part:`dot-wrapper ${t}`,style:{height:"48px",position:"absolute",width:"48px",...e},...r,children:[jsx(c,{backgroundColor:"primary.surface",part:"dot-pulse",css:{animation:`2s ease-out infinite ${Nt}`,borderRadius:"24px",height:"48px",left:0,position:"absolute",top:0,transformOrigin:"center center",width:"48px"}}),jsx(c,{backgroundColor:"primary.surface",part:"dot",style:{borderRadius:"12px",height:"24px",left:"12px",position:"absolute",top:"12px",width:"24px"}})]})}function Me({props:e,alignAttr:t,sideAttr:r}){let o=r??"bottom",n={},s=()=>{if(["after","before"].includes(e.align)){if(t=="start")return "before";if(t=="end")return "after"}return e.align??"after"},i="-24px",l={top:"bottom",right:"left",bottom:"top",left:"right"};n[l[o]]=i;let d=s();return ["before","end"].includes(d)?["top","bottom"].includes(o)?n.right=i:n.bottom=i:["after","start"].includes(d)?["top","bottom"].includes(o)?n.left=i:n.top=i:["top","bottom"].includes(o)?n.left=`calc(50% + ${i})`:n.top=`calc(50% + ${i})`,n}var Ae={content:["align","alignOffset","arrowPadding","avoidCollisions","collisionBoundary","collisionPadding","forceMount","hideWhenDetached","onCloseAutoFocus","onEscapeKeyDown","onFocusOutside","onInteractOutside","onOpenAutoFocus","onPointerDownOutside","side","sideOffset","sticky"],root:["defaultOpen","modal","onOpenChange","open"]};function Ee(e,t){let r=Object.fromEntries(Ae.content.map(n=>[n,e[n]]).filter(n=>n[1]!==void 0)),o=Object.fromEntries(Ae.root.map(n=>[n,e[n]]).filter(n=>n[1]!==void 0));if(r.align=r.align??"after",r.side=r.side??"bottom",["before","after"].includes(r.align)){let n={after:"end",before:"start"},s=(S,L)=>["top","bottom"].includes(L)?S=="after"?"marginLeft":"marginRight":S=="after"?"marginTop":"marginBottom",i=r.alignOffset??0,l=r.style??{},d=r.side??"bottom",u=r.align;r.style={...l,[s(u,d)]:i};let m=["top","bottom"].includes(d)?t.width:t.height;r.alignOffset=(m+i)*-1,r.align=n[u];}return {contentProps:r,rootProps:o}}function f({anchor:e,children:t,className:r,spotlight:o=!1,style:n,...s}){let{node:i,rect:l,ref:d}=X(),{contentProps:u,rootProps:m}=Ee(s,l),[S,L]=useState(u.align),[Q,$e]=useState(u.side);if(i!==null){let M=i.getAttribute("data-align"),ee=i.getAttribute("data-side");S!==M&&L(M),Q!==ee&&$e(ee);}let Y=useRef(null),[V,Le]=useState(null);if(useEffect(()=>{let M=document.querySelector(e);M!=null&&(Y.current=M,Le(Y));},[e]),V==null)return null;let W=V.current.getBoundingClientRect(),Z="0";typeof window<"u"&&(Z=window.getComputedStyle(V.current).borderRadius);let ze=Me({props:s,alignAttr:S,sideAttr:Q});return jsxs(w.Root,{defaultOpen:!0,...m,children:[jsx(w.Anchor,{virtualRef:V}),jsx(w.Portal,{children:jsxs("div",{className:r,css:{bottom:0,left:0,position:"absolute",right:0,top:0,zIndex:9999},children:[o&&jsx(c,{part:"tooltip-spotlight",position:"absolute",css:{borderRadius:Z,boxShadow:"0 0 0 2000px rgb(0 0 0 / 0.5)",height:W.height,left:W.left,top:W.top,width:W.width}}),jsx(w.Content,{asChild:!0,...u,ref:d,children:jsxs(R,{boxShadow:"md",part:"tooltip-content",position:"relative",css:{maxWidth:"360px",...n},children:[jsx(Oe,{style:ze}),t]})})]})})]})}f.Close=e=>jsx(w.Close,{"aria-label":"Close",asChild:!0,children:jsx(P.Plain,{css:{top:"12px",right:"4px"},part:"close",position:"absolute",...e,children:jsx(XMarkIcon,{height:"24",fill:"currentColor"})})});f.Media=({src:e,...t})=>e==null?null:jsx(I,{borderRadius:"md md 0 0",borderWidth:"0",css:{aspectRatio:"2"},margin:"-5 -5 5",src:e,...t});f.Primary=({onClick:e,title:t,...r})=>t==null?null:jsx(P.Primary,{title:t,onClick:e,...r});f.Progress=({children:e,...t})=>e==null?null:jsx(h.Body2,{fontWeight:"demibold",part:"progress",...t,children:e});f.Secondary=({onClick:e,title:t,...r})=>t==null?null:jsx(P.Secondary,{title:t,onClick:e,...r});f.Subtitle=({children:e,...t})=>e==null?null:jsx(h.Body2,{part:"subtitle",...t,children:e});f.Title=({children:e,...t})=>e==null?null:jsx(h.Body1,{fontWeight:"bold",mb:1,part:"title",...t,children:e});function J(e){let{modals:t,setModals:r}=useContext(T),[o,n]=useState(!1);return useEffect(()=>(r([...t,e]),()=>r(t.filter(s=>s!==e))),[]),useEffect(()=>{let s=t[0]===e;s!==o&&n(s);},[t]),{isCurrentModal:o}}function We({step:e,flow:t,onDismiss:r,onPrimary:o,onSecondary:n,...s}){let{isCurrentModal:i}=J(`${t.id}-${e.id}`),{handleDismiss:l}=B(t,{onDismiss:r}),{handlePrimary:d,handleSecondary:u}=k(e,{onPrimary:o,onSecondary:n});return i?jsxs(f,{anchor:e.selector,onOpenAutoFocus:m=>m.preventDefault(),onPointerDownOutside:m=>m.preventDefault(),...s,children:[jsx(f.Close,{onClick:l}),jsx(f.Media,{src:e.videoUri??e.imageUri,type:e.videoUri?"video":"image"}),jsx(f.Title,{children:e.title}),jsx(f.Subtitle,{children:e.subtitle}),jsxs(C.Row,{alignItems:"center",gap:3,justifyContent:"flex-end",part:"tooltip-footer",pt:4,children:[jsx(f.Progress,{children:`${t.getNumberOfCompletedSteps()+1}/${t.getNumberOfAvailableSteps()}`}),jsx(f.Secondary,{marginLeft:"auto",title:e.secondaryButtonTitle,onClick:u}),jsx(f.Primary,{title:e.primaryButtonTitle,onClick:d})]})]},e.id):null}function Zt({flowId:e,onComplete:t,variables:r,...o}){let{flow:n}=F(e,{variables:r});if(B(n,{onComplete:t}),n==null||n.isVisible===!1)return null;n.start();let s=n.getCurrentStep();return s==null||s.start(),jsx(We,{step:s,flow:n,...o})}function rr(){let{frigade:e}=useContext(T);return {frigade:e}}
|
|
14
|
+
|
|
15
|
+
export { Lt as Announcement, jt as Banner, c as Box, P as Button, R as Card, C as Flex, Ot as Provider, h as Text, f as Tooltip, Zt as Tour, X as useBoundingClientRect, F as useFlow, B as useFlowHandlers, rr as useFrigade, J as useModal, k as useStepHandlers };
|
|
16
|
+
//# sourceMappingURL=out.js.map
|
|
3
17
|
//# sourceMappingURL=index.js.map
|