UNPKG

24.3 kBTypeScriptView Raw
1/*! Tripetto Autoscroll Runner 9.0.0 - Copyright (C) 2024 Tripetto B.V. - All Rights Reserved */
2
3declare module "@tripetto/runner-autoscroll" {
4 import * as TripettoAutoscroll from "@tripetto/runner-autoscroll/module";
5 export * from "@tripetto/runner-autoscroll/module";
6 export { TripettoAutoscroll };
7 export default TripettoAutoscroll;
8}
9
10declare module "@tripetto/runner-autoscroll/es5" {
11 import * as TripettoAutoscroll from "@tripetto/runner-autoscroll/module";
12 export * from "@tripetto/runner-autoscroll/module";
13 export { TripettoAutoscroll };
14 export default TripettoAutoscroll;
15}
16
17declare module "@tripetto/runner-autoscroll/runner" {
18 import * as TripettoAutoscroll from "@tripetto/runner-autoscroll/module";
19 export * from "@tripetto/runner-autoscroll/module";
20 export { TripettoAutoscroll };
21 export default TripettoAutoscroll;
22}
23
24declare module "@tripetto/runner-autoscroll/runner/es5" {
25 import * as TripettoAutoscroll from "@tripetto/runner-autoscroll/module";
26 export * from "@tripetto/runner-autoscroll/module";
27 export { TripettoAutoscroll };
28 export default TripettoAutoscroll;
29}
30
31declare module "@tripetto/runner-autoscroll/react" {
32 import * as TripettoAutoscroll from "@tripetto/runner-autoscroll/module";
33 export * from "@tripetto/runner-autoscroll/module";
34 export { TripettoAutoscroll };
35 export default TripettoAutoscroll;
36}
37
38declare module "@tripetto/runner-autoscroll/module" {
39 import { Hooks, IDefinition, ISnapshot, Instance, L10n, NodeBlock, TL10n, TStyles } from "@tripetto/runner";
40 import { TOverlayContext } from "@tripetto/runner-fabric/overlay";
41 import { IRunnerAttachments, IRunnerProps, TRunnerPreviewData, TRunnerViews } from "@tripetto/runner-react-hook";
42 import { styled } from "styled-components";
43
44 import { CSSProperties, FocusEvent, MutableRefObject, ReactNode } from "react";
45
46 export interface IAutoscrollStyles extends TStyles {
47 readonly direction?: "horizontal" | "vertical";
48 readonly verticalAlignment?: "top" | "middle" | "bottom";
49 readonly hidePast?: boolean;
50 readonly hideUpcoming?: boolean;
51 readonly hideWhenFailed?: boolean;
52 readonly color?: string;
53 readonly autoFocus?: boolean;
54 readonly showSeparateSubmit?: boolean;
55 readonly showPreviousButton?: boolean;
56 readonly showNavigation?: "auto" | "always" | "never";
57 readonly showProgressbar?: boolean;
58 readonly showEnumerators?: boolean;
59 readonly hideRequiredIndicator?: boolean;
60 readonly showScrollbar?: boolean;
61 readonly disableScrolling?: boolean;
62 readonly noBranding?: boolean;
63 readonly font?: {
64 readonly family?: string;
65 readonly size?: number;
66 readonly sizeSmall?: number;
67 };
68 readonly background?: {
69 readonly color?: string;
70 readonly url?: string;
71 readonly opacity?: number;
72 readonly positioning?: "auto" | "100% auto" | "auto 100%" | "cover" | "contain" | "repeat";
73 };
74 readonly inputs?: {
75 readonly backgroundColor?: string;
76 readonly borderColor?: string;
77 readonly borderSize?: number;
78 readonly roundness?: number;
79 readonly textColor?: string;
80 readonly errorColor?: string;
81 readonly agreeColor?: string;
82 readonly declineColor?: string;
83 readonly selectionColor?: string;
84 };
85 readonly buttons?: {
86 readonly baseColor?: string;
87 readonly textColor?: string;
88 readonly roundness?: number;
89 readonly mode?: "fill" | "outline";
90 readonly finishColor?: string;
91 };
92 readonly navigation?: {
93 readonly backgroundColor?: string;
94 readonly textColor?: string;
95 readonly progressbarColor?: string;
96 };
97 }
98 export interface IRuntimeStyles extends IAutoscrollStyles {
99 readonly direction: "horizontal" | "vertical";
100 readonly verticalAlignment: "top" | "middle" | "bottom";
101 readonly font: {
102 readonly family: string;
103 readonly size: number;
104 readonly sizeSmall: number;
105 readonly color: string;
106 };
107 readonly background: {
108 readonly color: string;
109 readonly opacity: number;
110 readonly url?: string;
111 readonly positioning?: "auto" | "100% auto" | "auto 100%" | "cover" | "contain" | "repeat";
112 };
113 readonly inputs: {
114 readonly backgroundColor: string;
115 readonly borderColor: string;
116 readonly borderSize: number;
117 readonly roundness: number | undefined;
118 readonly textColor: string;
119 readonly errorColor: string;
120 readonly scale: number;
121 };
122 readonly checkboxes: {
123 readonly backgroundColor: string;
124 readonly borderColor: string;
125 readonly borderSize: number;
126 readonly roundness: number | undefined;
127 readonly textColor: string;
128 readonly errorColor: string;
129 readonly scale: number;
130 readonly hideRequiredIndicator: boolean;
131 };
132 readonly radiobuttons: {
133 readonly backgroundColor: string;
134 readonly borderColor: string;
135 readonly borderSize: number;
136 readonly textColor: string;
137 readonly scale: number;
138 };
139 readonly matrix: {
140 readonly backgroundColor: string;
141 readonly borderColor: string;
142 readonly borderSize: number;
143 readonly textColor: string;
144 readonly errorColor: string;
145 readonly scale: number;
146 readonly hideRequiredIndicator: boolean;
147 };
148 readonly yesNo: {
149 readonly yesColor: string;
150 readonly noColor: string;
151 readonly outlineSize: number;
152 readonly roundness: number | undefined;
153 readonly scale: number;
154 readonly margin: number;
155 readonly alignment: "horizontal" | "vertical";
156 };
157 readonly rating: {
158 readonly color: string;
159 readonly scale: number;
160 };
161 readonly scale: {
162 readonly color: string;
163 readonly outlineSize: number;
164 readonly roundness: number | undefined;
165 readonly scale: number;
166 readonly margin: number;
167 readonly labelColor: string;
168 };
169 readonly multipleChoice: {
170 readonly color: string;
171 readonly outlineSize: number;
172 readonly roundness: number | undefined;
173 readonly scale: number;
174 readonly margin: number;
175 };
176 readonly pictureChoice: {
177 readonly color: string;
178 readonly outlineSize: number;
179 readonly roundness: number | undefined;
180 readonly scale: number;
181 readonly margin: number;
182 };
183 readonly fileUpload: {
184 readonly backgroundColor: string;
185 readonly borderColor: string;
186 readonly borderSize: number;
187 readonly roundness: number | undefined;
188 readonly textColor: string;
189 readonly errorColor: string;
190 readonly scale: number;
191 };
192 readonly buttons: {
193 readonly baseColor: string;
194 readonly textColor: string | undefined;
195 readonly outlineSize: number;
196 readonly roundness: number | undefined;
197 readonly mode: "fill" | "outline";
198 readonly scale: number;
199 };
200 readonly finishButton: {
201 readonly baseColor: string;
202 readonly textColor: string | undefined;
203 readonly outlineSize: number;
204 readonly roundness: number | undefined;
205 readonly mode: "fill" | "outline";
206 readonly scale: number;
207 };
208 }
209 export interface IAutoscrollRenderProps {
210 readonly index: number;
211 readonly id: string;
212 readonly l10n: L10n.Namespace;
213 readonly styles: IRuntimeStyles;
214 readonly overlay: TOverlayContext;
215 readonly view: TRunnerViews;
216 readonly name: JSX.Element | undefined;
217 readonly description: JSX.Element | undefined;
218 readonly explanation: JSX.Element | undefined;
219 readonly label: JSX.Element | undefined;
220 readonly placeholder: string;
221 readonly tabIndex: number;
222 readonly isActivated: boolean;
223 readonly isFailed: boolean;
224 readonly isPage: boolean;
225 readonly ariaDescribedBy: string | undefined;
226 readonly ariaDescription: JSX.Element | undefined;
227 readonly focus: <T>(e: FocusEvent) => T;
228 readonly blur: <T>(e: FocusEvent) => T;
229 readonly autoFocus: (element: HTMLElement | null) => void;
230 readonly attachments: IRunnerAttachments | undefined;
231 readonly markdownifyToJSX: (md: string, lineBreaks?: boolean) => JSX.Element;
232 readonly markdownifyToURL: (md: string) => string;
233 readonly markdownifyToImage: (md: string) => string;
234 readonly markdownifyToString: (md: string) => string;
235 }
236 export interface IAutoscrollRendering extends NodeBlock {
237 readonly required?: boolean;
238 readonly hideRequiredIndicatorFromName?: boolean;
239 readonly hideAriaDescription?: boolean;
240 readonly hideButtons?: boolean;
241 readonly autoSubmit?: boolean;
242 readonly autoFocus?: boolean;
243 readonly render?: (props: IAutoscrollRenderProps, done?: () => void, cancel?: () => void) => ReactNode;
244 }
245 export interface IAutoscrollSnapshot {
246 /** Contains the active block. */
247 readonly a?: string;
248 /** Contains focus information. */
249 readonly b?: {
250 [key: string]: false | true | undefined;
251 };
252 /** Contains the email address that was used to pause. */
253 readonly d?: string;
254 /** Contains a timestamp of the snapshot. */
255 readonly e?: number;
256 }
257 export interface IAutoscrollController {
258 definition: IDefinition;
259 styles: IAutoscrollStyles;
260 l10n: TL10n;
261 view: TRunnerViews;
262 readonly instance: Instance | undefined;
263 readonly fingerprint: string;
264 readonly snapshot: ISnapshot<IAutoscrollSnapshot> | undefined;
265 readonly isRunning: boolean;
266 readonly isFinishing: boolean;
267 readonly isPausing: boolean;
268 readonly isLicensed: boolean;
269 readonly allowStart: boolean;
270 readonly allowRestart: boolean;
271 readonly allowPause: boolean;
272 readonly allowStop: boolean;
273 readonly start: () => void;
274 readonly restart: () => void;
275 readonly pause: () => ISnapshot<IAutoscrollSnapshot> | Promise<ISnapshot<IAutoscrollSnapshot>> | undefined;
276 readonly stop: () => void;
277 readonly doPreview: (data: TRunnerPreviewData) => void;
278 }
279 export interface IBuilderInstance extends Hooks<"OnChange" | "OnEdit"> {
280 definition: IDefinition | undefined;
281 edit(sType: "branch" | "section" | "node" | "condition", sId: string): void;
282 edit(sType: "epilogue", sId?: string): void;
283 edit(sType?: "properties" | "prologue"): void;
284 }
285 export type TAutoscrollDisplay = "inline" | "page";
286 export type TAutoscrollPause =
287 | {
288 readonly recipe: "email";
289 readonly onPause: (
290 emailAddress: string,
291 snapshot: ISnapshot,
292 language: string,
293 locale: string,
294 namespace: string
295 ) => Promise<void> | boolean | void;
296 }
297 | ((snapshot: ISnapshot, language: string, locale: string, namespace: string) => Promise<void> | boolean | void);
298 export interface IAutoscrollUIProps extends IRunnerProps<IAutoscrollSnapshot> {
299 /** Specifies the styles (colors, font, size, etc.) for the runner. */
300 readonly styles?: IAutoscrollStyles;
301 /** Specifies the localization (locale and translation) information. */
302 readonly l10n?: TL10n;
303 /** Specifies the initial view mode of the runner. */
304 readonly view?: TRunnerViews;
305 /** Specifies the display mode of the runner. */
306 readonly display?: TAutoscrollDisplay;
307 /** Specifies a license code for the runner. */
308 readonly license?: string;
309 /** Removes all Tripetto branding when a valid license is supplied. */
310 readonly removeBranding?: boolean;
311 /** Specifies a custom class name for the HTML element that holds the runner. */
312 readonly className?: string;
313 /** Specifies the inline style for the HTML element that holds the runner. */
314 readonly customStyle?: CSSProperties;
315 /**
316 * Specifies custom CSS rules.
317 * To specify rules for a specific block, use this selector: [data-block="<block identifier>"] { ... }
318 */
319 readonly customCSS?: string;
320 /** Specifies a function that is invoked when the runner needs a locale or translation. */
321 readonly onL10n?: (l10n: TL10n) => Promise<void>;
322 /** Specifies a function that is invoked when the runner wants to reload the definition. */
323 readonly onReload?: () => IDefinition | Promise<IDefinition>;
324 /** Specifies a function that is invoked when an edit action is requested. */
325 readonly onEdit?: (type: "prologue" | "epilogue" | "styles" | "l10n" | "block", id?: string) => void;
326 /** Specifies a function or recipe that is invoked when the runner wants to pause. */
327 readonly onPause?: TAutoscrollPause;
328 /** Specifies a function that is invoked when the runner is "touched" by a user. */
329 readonly onTouch?: () => void;
330 /** Reference to the runner controller. */
331 readonly controller?: MutableRefObject<IAutoscrollController | undefined>;
332 /** Specifies a function that is invoked when the runner controller is available. */
333 readonly onController?: (controller: MutableRefObject<IAutoscrollController>) => void;
334 }
335 export type IAutoscrollProps = Omit<
336 IAutoscrollUIProps,
337 "definition" | "snapshot" | "styles" | "license" | "l10n" | "onL10n" | "l10nNamespace"
338 > & {
339 /** Specifies the definition to run. */
340 readonly definition?: IDefinition | Promise<IDefinition | undefined>;
341 /** Specifies the snapshot that should be restored. */
342 readonly snapshot?: ISnapshot<IAutoscrollSnapshot> | Promise<ISnapshot<IAutoscrollSnapshot> | undefined>;
343 /** Specifies the styles. */
344 readonly styles?: IAutoscrollStyles | Promise<IAutoscrollStyles | undefined>;
345 /** Specifies a license code for the runner. */
346 readonly license?: string | Promise<string | undefined>;
347 /** Removes all Tripetto branding when a valid license is supplied. */
348 readonly removeBranding?: boolean;
349 /** Try to store sessions in the local store to preserve persistency on navigation between multiple pages that host the runner. */
350 readonly persistent?: boolean;
351 /** Specifies the localization information. */
352 readonly l10n?: TL10n | Promise<TL10n | undefined>;
353 /** Specifies the preferred language (when no language is specified in the definition). */
354 readonly language?: string;
355 /** Provides locale information. */
356 readonly locale?: L10n.ILocale | ((locale: string) => L10n.ILocale | Promise<L10n.ILocale | undefined> | undefined);
357 /** Provides translations. */
358 readonly translations?:
359 | L10n.TTranslation
360 | L10n.TTranslation[]
361 | ((
362 language: string,
363 name: string,
364 version: string
365 ) => L10n.TTranslation | L10n.TTranslation[] | Promise<L10n.TTranslation | L10n.TTranslation[] | undefined> | undefined);
366 /** Specifies a loader that is shown when the runner is loading. */
367 readonly loader?: JSX.Element;
368 /** Reference to a builder instance to enable live preview for the builder. */
369 readonly builder?: MutableRefObject<IBuilderInstance | undefined>;
370 };
371 export const AutoscrollUI: (props: IAutoscrollUIProps) => import("react/jsx-runtime").JSX.Element;
372 export interface IAutoscroll {
373 /** Specifies the parent element for the runner. */
374 readonly element?: HTMLElement | null;
375 /** Specifies the definition to run. */
376 readonly definition?: IDefinition | Promise<IDefinition | undefined>;
377 /** Specifies the snapshot that should be restored. */
378 readonly snapshot?: ISnapshot<IAutoscrollSnapshot> | Promise<ISnapshot<IAutoscrollSnapshot> | undefined>;
379 /** Specifies the styles (colors, font, size, etc.) for the runner. */
380 readonly styles?: IAutoscrollStyles | Promise<IAutoscrollStyles | undefined>;
381 /** Specifies the localization (locale and translation) information. */
382 readonly l10n?: TL10n | Promise<TL10n | undefined>;
383 /** Specifies the initial view mode of the runner. */
384 readonly view?: TRunnerViews;
385 /** Specifies the display mode of the runner. */
386 readonly display?: TAutoscrollDisplay;
387 /** Try to store sessions in the local store to preserve persistency on navigation between multiple pages that host the runner. */
388 readonly persistent?: boolean;
389 /** Specifies a license code for the runner. */
390 readonly license?: string | Promise<string | undefined>;
391 /** Removes all Tripetto branding when a valid license is supplied. */
392 readonly removeBranding?: boolean;
393 /** Specifies a custom class name for the runner element. */
394 readonly className?: string;
395 /** Specifies the inline style for the runner element. */
396 readonly customStyle?: CSSProperties;
397 /**
398 * Specifies custom CSS rules.
399 * To specify rules for a specific block, use this selector: [data-block="<block identifier>"] { ... }
400 */
401 readonly customCSS?: string;
402 /** Specifies the attachments handler. */
403 readonly attachments?: IRunnerAttachments;
404 /** Specifies the preferred language (when no language is specified in the definition). */
405 readonly language?: string;
406 /** Provides locale information. */
407 readonly locale?: L10n.ILocale | ((locale: string) => L10n.ILocale | Promise<L10n.ILocale | undefined> | undefined);
408 /** Provides translations. */
409 readonly translations?:
410 | L10n.TTranslation
411 | L10n.TTranslation[]
412 | ((
413 language: string,
414 name: string,
415 version: string
416 ) => L10n.TTranslation | L10n.TTranslation[] | Promise<L10n.TTranslation | L10n.TTranslation[] | undefined> | undefined);
417 /** Reference to a builder instance to enable live preview for the builder. */
418 readonly builder?: IBuilderInstance;
419 /** Specifies a function that is invoked when the runner is ready. */
420 readonly onReady?: (instance?: Instance) => void;
421 /** Specifies a function that is invoked when the runner is touched by a user. */
422 readonly onTouch?: () => void;
423 /** Specifies a function that is invoked when the user performs an action. */
424 readonly onAction?: (
425 type: "start" | "stage" | "unstage" | "focus" | "blur" | "pause" | "complete",
426 definition: {
427 readonly fingerprint: string;
428 readonly name: string;
429 },
430 block?: {
431 readonly id: string;
432 readonly name: string;
433 readonly alias?: string;
434 }
435 ) => void;
436 /** Invoked when data can be imported into the instance. */
437 readonly onImport?: (instance: Instance) => void;
438 /** Invoked when there is a change. */
439 readonly onChange?: (instance: Instance) => void;
440 /** Invoked when there is a data change. */
441 readonly onData?: (instance: Instance) => void;
442 /** Specifies a function that is invoked when the runner wants to pause. */
443 readonly onPause?: TAutoscrollPause;
444 /** Specifies a function that is invoked when the runner submits data. */
445 readonly onSubmit?: (
446 instance: Instance,
447 language: string,
448 locale: string,
449 namespace?: string
450 ) => Promise<string | undefined> | boolean | void;
451 /** Invoked when the runner is completed (after the data is submitted). */
452 readonly onComplete?: (instance: Instance, id?: string) => void;
453 /** Invoked when the runner wants to reload the definition. */
454 readonly onReload?: () => IDefinition | Promise<IDefinition>;
455 /** Specifies a function that is invoked when an edit action is requested. */
456 readonly onEdit?: (type: "prologue" | "epilogue" | "styles" | "l10n" | "block", id?: string) => void;
457 /** Specifies a function that is invoked when the runner is destroyed. */
458 readonly onDestroy?: () => void;
459 }
460 export interface IAutoscrollRunner extends IAutoscrollController {
461 readonly destroy: () => void;
462 }
463 export const AutoscrollRunner: (props: IAutoscrollProps) => import("react/jsx-runtime").JSX.Element;
464 /**
465 * Bootstraps a new runner.
466 * @param props Specifies the properties for the runner.
467 * @returns Returns a promise to the runner controller.
468 */
469 export const run: (props: IAutoscroll) => Promise<IAutoscrollRunner>;
470 /** Namespace identifier for the runner. */
471 export const namespace: string;
472 export { color } from "@tripetto/runner-fabric/color";
473 export { ButtonFabric } from "@tripetto/runner-fabric/components/button";
474 export { CheckboxFabric } from "@tripetto/runner-fabric/components/checkbox";
475 export { CheckboxesFabric, ICheckbox } from "@tripetto/runner-fabric/components/checkboxes";
476 export { DateTimeFabric } from "@tripetto/runner-fabric/components/datetime";
477 export { DropdownFabric, IDropdownFabricOption } from "@tripetto/runner-fabric/components/dropdown";
478 export { EmailFabric } from "@tripetto/runner-fabric/components/email";
479 export { FileFabric, FileThumbnailFabric, IFileController, IFileService } from "@tripetto/runner-fabric/components/file";
480 export { InputFabric } from "@tripetto/runner-fabric/components/input";
481 export { MatrixFabric, IMatrixColumn, IMatrixRow } from "@tripetto/runner-fabric/components/matrix";
482 export { MultiSelectFabric, IMultiSelectOption } from "@tripetto/runner-fabric/components/multi-select";
483 export { MultipleChoiceFabric, IMultipleChoiceButton } from "@tripetto/runner-fabric/components/multiple-choice";
484 export { NumberFabric } from "@tripetto/runner-fabric/components/number";
485 export { PasswordFabric } from "@tripetto/runner-fabric/components/password";
486 export { PhoneNumberFabric } from "@tripetto/runner-fabric/components/phone-number";
487 export { PictureChoiceFabric, IPictureChoiceOption } from "@tripetto/runner-fabric/components/picture-choice";
488 export { RadiobuttonsFabric, IRadiobutton } from "@tripetto/runner-fabric/components/radiobuttons";
489 export { RatingFabric, RatingShapes } from "@tripetto/runner-fabric/components/rating";
490 export { RequiredIndicatorFabric } from "@tripetto/runner-fabric/components/required-indicator";
491 export { ScaleFabric, IScaleNumeric, IScaleOption } from "@tripetto/runner-fabric/components/scale";
492 export { TextFabric } from "@tripetto/runner-fabric/components/text";
493 export { TextareaFabric } from "@tripetto/runner-fabric/components/textarea";
494 export { URLFabric } from "@tripetto/runner-fabric/components/url";
495 export { YesNoFabric, IYesNo } from "@tripetto/runner-fabric/components/yes-no";
496 export { styled };
497 export { css, keyframes } from "styled-components";
498}