@wlloyalty/wll-react-sdk 1.0.43 → 1.0.45
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.ts +126 -90
- package/dist/index.js +830 -710
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import * as React$1 from 'react';
|
|
2
|
-
import React__default, { ReactNode
|
|
3
|
-
import { ViewStyle, ImageSourcePropType, StyleProp, View, TextProps as TextProps$1, TextStyle, ImageProps } from 'react-native';
|
|
2
|
+
import React__default, { ReactNode } from 'react';
|
|
4
3
|
import * as LucideIcons from 'lucide-react';
|
|
4
|
+
import * as react_native from 'react-native';
|
|
5
|
+
import { ImageSourcePropType, StyleProp, ViewStyle, TextProps as TextProps$1, TextStyle, ImageProps } from 'react-native';
|
|
5
6
|
|
|
6
7
|
declare const sizes: {
|
|
7
8
|
readonly borderRadiusSm: 15;
|
|
@@ -69,19 +70,7 @@ type ButtonProps = {
|
|
|
69
70
|
onPress: () => void;
|
|
70
71
|
variant: Variant;
|
|
71
72
|
};
|
|
72
|
-
declare const Button:
|
|
73
|
-
|
|
74
|
-
type Justify$1 = 'start' | 'end' | 'center' | 'between' | 'around' | 'evenly';
|
|
75
|
-
type Align$1 = 'start' | 'end' | 'center' | 'stretch';
|
|
76
|
-
type ColumnProps = {
|
|
77
|
-
children: React$1.ReactNode;
|
|
78
|
-
justify?: Justify$1;
|
|
79
|
-
align?: Align$1;
|
|
80
|
-
direction?: FlexDirection$1;
|
|
81
|
-
style?: ViewStyle;
|
|
82
|
-
};
|
|
83
|
-
type FlexDirection$1 = 'column' | 'row' | 'column-reverse' | 'row-reverse';
|
|
84
|
-
declare const Column$1: React$1.FC<ColumnProps>;
|
|
73
|
+
declare const Button: ({ title, onPress, variant }: ButtonProps) => JSX.Element;
|
|
85
74
|
|
|
86
75
|
type IconName = keyof typeof LucideIcons;
|
|
87
76
|
type IconProps = {
|
|
@@ -90,7 +79,33 @@ type IconProps = {
|
|
|
90
79
|
size?: number;
|
|
91
80
|
strokeWidth?: number;
|
|
92
81
|
};
|
|
93
|
-
declare const Icon:
|
|
82
|
+
declare const Icon: ({ name, color, size, strokeWidth, ...props }: IconProps) => JSX.Element | null;
|
|
83
|
+
|
|
84
|
+
declare const LoadingIndicator: () => JSX.Element;
|
|
85
|
+
|
|
86
|
+
type ProgressBarProps = {
|
|
87
|
+
percentage: number;
|
|
88
|
+
variant?: Variant;
|
|
89
|
+
height?: Size;
|
|
90
|
+
animationDuration?: number;
|
|
91
|
+
};
|
|
92
|
+
declare const ProgressBar: ({ percentage, variant, height, animationDuration, }: ProgressBarProps) => JSX.Element;
|
|
93
|
+
|
|
94
|
+
type ProgressiveImageProps = {
|
|
95
|
+
source: ImageSourcePropType;
|
|
96
|
+
style?: StyleProp<ViewStyle>;
|
|
97
|
+
isDesaturated?: boolean;
|
|
98
|
+
[key: string]: any;
|
|
99
|
+
};
|
|
100
|
+
declare const ProgressiveImage: ({ source, style, isDesaturated, ...props }: ProgressiveImageProps) => JSX.Element;
|
|
101
|
+
|
|
102
|
+
type TextVariant = 'eyebrow' | 'title' | 'description' | 'body' | 'caption' | 'label' | 'tier-requirement' | 'tier-earned';
|
|
103
|
+
type TextProps = TextProps$1 & {
|
|
104
|
+
variant?: TextVariant;
|
|
105
|
+
style?: TextStyle;
|
|
106
|
+
isSurface?: boolean;
|
|
107
|
+
};
|
|
108
|
+
declare const Text: ({ variant, style, isSurface, ...props }: TextProps) => JSX.Element;
|
|
94
109
|
|
|
95
110
|
type Badge = {
|
|
96
111
|
id: string;
|
|
@@ -308,72 +323,42 @@ type Tile = {
|
|
|
308
323
|
declare const getConfigForTileType: (tileType: TileType) => typeof BannerTileConfig | typeof PointsTileConfig | typeof ContentTileConfig | typeof RewardTileConfig | typeof BadgeTileConfig | typeof RewardCategoryTileConfig | typeof TierTileConfig;
|
|
309
324
|
type TileConfig = InstanceType<ReturnType<typeof getConfigForTileType>>;
|
|
310
325
|
|
|
311
|
-
type LoadingIndicatorProps = {
|
|
312
|
-
tile: Tile;
|
|
313
|
-
};
|
|
314
|
-
declare const LoadingIndicator: React$1.FC<LoadingIndicatorProps>;
|
|
315
|
-
|
|
316
|
-
type ProgressBarProps = {
|
|
317
|
-
percentage: number;
|
|
318
|
-
variant?: Variant;
|
|
319
|
-
height?: Size;
|
|
320
|
-
animationDuration?: number;
|
|
321
|
-
};
|
|
322
|
-
declare const ProgressBar: React$1.FC<ProgressBarProps>;
|
|
323
|
-
|
|
324
|
-
type ProgressiveImageProps = {
|
|
325
|
-
source: ImageSourcePropType;
|
|
326
|
-
style?: StyleProp<ViewStyle>;
|
|
327
|
-
isDesaturated?: boolean;
|
|
328
|
-
[key: string]: any;
|
|
329
|
-
};
|
|
330
|
-
declare const ProgressiveImage: React__default.FC<ProgressiveImageProps>;
|
|
331
|
-
|
|
332
|
-
type RowHeaderProps = {
|
|
333
|
-
children: React$1.ReactNode;
|
|
334
|
-
className?: string;
|
|
335
|
-
} & React$1.ComponentProps<typeof View>;
|
|
336
|
-
declare const RowHeader: React$1.FC<RowHeaderProps>;
|
|
337
|
-
|
|
338
|
-
type TextVariant = 'eyebrow' | 'title' | 'description' | 'body' | 'caption' | 'label' | 'tier-requirement' | 'tier-earned';
|
|
339
|
-
type TextProps = TextProps$1 & {
|
|
340
|
-
variant?: TextVariant;
|
|
341
|
-
style?: TextStyle;
|
|
342
|
-
isSurface?: boolean;
|
|
343
|
-
};
|
|
344
|
-
declare const Text: React$1.FC<TextProps>;
|
|
345
|
-
|
|
346
326
|
type BaseBannerProps = {
|
|
347
327
|
tile: Tile;
|
|
348
|
-
children:
|
|
328
|
+
children: React__default.ReactNode;
|
|
349
329
|
};
|
|
350
|
-
declare const BaseBanner:
|
|
351
|
-
|
|
352
|
-
type ImagePropsNoSource = Omit<ImageProps, 'source'>;
|
|
330
|
+
declare const BaseBanner: ({ tile, children }: BaseBannerProps) => JSX.Element;
|
|
353
331
|
|
|
354
332
|
type BaseTileProps = {
|
|
355
333
|
tile: Tile;
|
|
356
334
|
children: ReactNode;
|
|
357
335
|
style?: ViewStyle;
|
|
358
336
|
};
|
|
359
|
-
type
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
337
|
+
type BaseTileRootProps = {
|
|
338
|
+
children: ReactNode;
|
|
339
|
+
style?: ViewStyle;
|
|
340
|
+
};
|
|
341
|
+
/**
|
|
342
|
+
* BaseTile component with subcomponents attached.
|
|
343
|
+
*/
|
|
344
|
+
declare const BaseTile: (({ tile, children }: BaseTileProps) => JSX.Element) & {
|
|
345
|
+
Root: ({ children, style }: BaseTileRootProps) => JSX.Element;
|
|
346
|
+
Media: React__default.FC<ImagePropsNoSource>;
|
|
347
|
+
Content: React__default.FC<{
|
|
348
|
+
children: React__default.ReactNode;
|
|
367
349
|
}>;
|
|
368
|
-
Header: FC<{
|
|
369
|
-
children?: ReactNode;
|
|
350
|
+
Header: React__default.FC<{
|
|
351
|
+
children?: React__default.ReactNode;
|
|
370
352
|
}>;
|
|
371
|
-
Title: FC;
|
|
372
|
-
Body:
|
|
353
|
+
Title: React__default.FC;
|
|
354
|
+
Body: (props: Omit<react_native.TextProps, "style"> & {
|
|
355
|
+
variant?: "eyebrow" | "title" | "description" | "body" | "caption" | "label" | "tier-requirement" | "tier-earned";
|
|
356
|
+
isSurface?: boolean;
|
|
357
|
+
style?: react_native.TextStyle;
|
|
358
|
+
}) => React__default.JSX.Element | null;
|
|
373
359
|
};
|
|
374
|
-
declare const BaseTile: BaseTileComponent;
|
|
375
360
|
|
|
376
|
-
declare const Indicator: () =>
|
|
361
|
+
declare const Indicator: () => JSX.Element;
|
|
377
362
|
|
|
378
363
|
interface SkeletonProps {
|
|
379
364
|
width?: number | `${number}%`;
|
|
@@ -382,34 +367,72 @@ interface SkeletonProps {
|
|
|
382
367
|
style?: ViewStyle;
|
|
383
368
|
numberOfSquares?: number;
|
|
384
369
|
}
|
|
385
|
-
declare const Skeleton:
|
|
370
|
+
declare const Skeleton: ({ style, numberOfSquares, }: SkeletonProps) => JSX.Element;
|
|
386
371
|
|
|
387
372
|
type TileContainerProps = {
|
|
388
373
|
tiles: Tile[];
|
|
389
374
|
};
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
375
|
+
/**
|
|
376
|
+
* TileContainer component to render a list of tiles with proper layout and spacing.
|
|
377
|
+
*/
|
|
378
|
+
declare const TileContainer: ({ tiles }: TileContainerProps) => JSX.Element;
|
|
379
|
+
|
|
380
|
+
/**
|
|
381
|
+
* Props for the FlexBox component.
|
|
382
|
+
*
|
|
383
|
+
* @param children - The child components to render inside the flex container.
|
|
384
|
+
* @param style - Optional custom styles to apply to the container.
|
|
385
|
+
*/
|
|
396
386
|
type FlexBoxProps = {
|
|
397
387
|
children: React__default.ReactNode;
|
|
388
|
+
style?: ViewStyle;
|
|
398
389
|
};
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
390
|
+
/**
|
|
391
|
+
* A FlexBox component that provides a flexible container with `flex: 1`.
|
|
392
|
+
*
|
|
393
|
+
* This component is commonly used to create a full-flex container that expands
|
|
394
|
+
* to fill available space in a layout.
|
|
395
|
+
*/
|
|
396
|
+
declare const FlexBox: ({ children, style }: FlexBoxProps) => JSX.Element;
|
|
402
397
|
|
|
398
|
+
type ImagePropsNoSource = Omit<ImageProps, 'source'>;
|
|
403
399
|
type FlexDirection = 'row' | 'row-reverse' | 'column' | 'column-reverse';
|
|
404
400
|
type Justify = 'start' | 'end' | 'center' | 'between' | 'around' | 'evenly';
|
|
405
401
|
type Align = 'start' | 'end' | 'center' | 'stretch' | 'baseline';
|
|
406
|
-
type LayoutProps = {
|
|
402
|
+
type LayoutProps$1 = {
|
|
407
403
|
children: React.ReactNode;
|
|
408
404
|
justify?: Justify;
|
|
409
405
|
align?: Align;
|
|
410
406
|
direction?: FlexDirection;
|
|
411
407
|
style?: ViewStyle;
|
|
412
408
|
};
|
|
409
|
+
declare const justifyMap: Record<Justify, ViewStyle['justifyContent']>;
|
|
410
|
+
declare const alignMap: Record<Align, ViewStyle['alignItems']>;
|
|
411
|
+
|
|
412
|
+
type LayoutProps = {
|
|
413
|
+
children: React$1.ReactNode;
|
|
414
|
+
justify?: Justify;
|
|
415
|
+
align?: Align;
|
|
416
|
+
direction?: FlexDirection;
|
|
417
|
+
style?: ViewStyle;
|
|
418
|
+
};
|
|
419
|
+
declare const Layout: ({ children, justify, align, direction, style, }: LayoutProps) => JSX.Element;
|
|
420
|
+
|
|
421
|
+
/**
|
|
422
|
+
* Props for the Spacer component.
|
|
423
|
+
*
|
|
424
|
+
* @param style - Optional custom styles to apply to the spacer.
|
|
425
|
+
*/
|
|
426
|
+
type SpacerProps = {
|
|
427
|
+
style?: ViewStyle;
|
|
428
|
+
};
|
|
429
|
+
/**
|
|
430
|
+
* A simple Spacer component that creates flexible space in layouts.
|
|
431
|
+
*
|
|
432
|
+
* The Spacer is commonly used in flexbox layouts to create adjustable empty space
|
|
433
|
+
* between child elements, avoiding the need for explicit margins or padding.
|
|
434
|
+
*/
|
|
435
|
+
declare const Spacer: ({ style }: SpacerProps) => JSX.Element;
|
|
413
436
|
|
|
414
437
|
declare enum SectionType {
|
|
415
438
|
Grid = "GRID",
|
|
@@ -437,12 +460,12 @@ type TSection = {
|
|
|
437
460
|
type CarouselProps = {
|
|
438
461
|
section: TSection;
|
|
439
462
|
};
|
|
440
|
-
declare const Carousel:
|
|
463
|
+
declare const Carousel: ({ section }: CarouselProps) => JSX.Element;
|
|
441
464
|
|
|
442
465
|
type GridProps = {
|
|
443
466
|
section: TSection;
|
|
444
467
|
};
|
|
445
|
-
declare const Grid:
|
|
468
|
+
declare const Grid: ({ section }: GridProps) => React__default.JSX.Element;
|
|
446
469
|
|
|
447
470
|
type ProgressIndicatorProps = {
|
|
448
471
|
currentPoints: number;
|
|
@@ -451,13 +474,13 @@ type ProgressIndicatorProps = {
|
|
|
451
474
|
height?: Size;
|
|
452
475
|
attained?: boolean;
|
|
453
476
|
};
|
|
454
|
-
declare const ProgressIndicator:
|
|
477
|
+
declare const ProgressIndicator: ({ currentPoints, maxPoints, variant, height, attained, }: ProgressIndicatorProps) => JSX.Element;
|
|
455
478
|
|
|
456
479
|
type SectionHeaderProps = {
|
|
457
480
|
title?: string;
|
|
458
481
|
description?: string;
|
|
459
482
|
};
|
|
460
|
-
declare const SectionHeader:
|
|
483
|
+
declare const SectionHeader: ({ title, description, }: SectionHeaderProps) => JSX.Element | null;
|
|
461
484
|
|
|
462
485
|
type WithTileFetchingProps = {
|
|
463
486
|
tile?: Tile;
|
|
@@ -472,7 +495,7 @@ declare const _default$5: (props: Omit<BadgeTileProps, "tile"> & WithTileFetchin
|
|
|
472
495
|
type BannerTileProps = {
|
|
473
496
|
tile: Tile;
|
|
474
497
|
};
|
|
475
|
-
declare const _default$4: (props: Omit<BannerTileProps, "tile"> & WithTileFetchingProps) =>
|
|
498
|
+
declare const _default$4: (props: Omit<BannerTileProps, "tile"> & WithTileFetchingProps) => React__default.JSX.Element;
|
|
476
499
|
|
|
477
500
|
type ContentTileProps = {
|
|
478
501
|
tile: Tile;
|
|
@@ -482,7 +505,17 @@ declare const _default$3: (props: Omit<ContentTileProps, "tile"> & WithTileFetch
|
|
|
482
505
|
type GroupProps = {
|
|
483
506
|
id: string;
|
|
484
507
|
};
|
|
485
|
-
|
|
508
|
+
/**
|
|
509
|
+
* A page-level component that represents a Group view in the application.
|
|
510
|
+
*
|
|
511
|
+
* This component serves as a container page that manages the fetching and display
|
|
512
|
+
* of a group's data and its associated sections. It handles various states including
|
|
513
|
+
* loading, errors, and empty states, providing a complete page experience for
|
|
514
|
+
* viewing group content.
|
|
515
|
+
*
|
|
516
|
+
* @param id - The unique identifier of the group to fetch and display.
|
|
517
|
+
*/
|
|
518
|
+
declare const Group: ({ id }: GroupProps) => JSX.Element | null;
|
|
486
519
|
|
|
487
520
|
type PointsTileProps = {
|
|
488
521
|
tile: Tile;
|
|
@@ -492,7 +525,7 @@ declare const _default$2: (props: Omit<PointsTileProps, "tile"> & WithTileFetchi
|
|
|
492
525
|
type RewardCategoryTileProps = {
|
|
493
526
|
tile: Tile;
|
|
494
527
|
};
|
|
495
|
-
declare const _default$1: (props: Omit<RewardCategoryTileProps, "tile"> & WithTileFetchingProps) =>
|
|
528
|
+
declare const _default$1: (props: Omit<RewardCategoryTileProps, "tile"> & WithTileFetchingProps) => React__default.JSX.Element;
|
|
496
529
|
|
|
497
530
|
type RewardTileProps = {
|
|
498
531
|
tile: Tile;
|
|
@@ -503,7 +536,10 @@ type SectionProps = {
|
|
|
503
536
|
section?: TSection;
|
|
504
537
|
sectionId?: string;
|
|
505
538
|
};
|
|
506
|
-
|
|
539
|
+
/**
|
|
540
|
+
* The Section component renders a section based on its type (e.g., Banner, Grid).
|
|
541
|
+
*/
|
|
542
|
+
declare const Section: ({ section, sectionId }: SectionProps) => JSX.Element | null;
|
|
507
543
|
|
|
508
544
|
type TierTileProps = {
|
|
509
545
|
tile: Tile;
|
|
@@ -565,7 +601,7 @@ type WllSdkProviderProps = {
|
|
|
565
601
|
config: SDKConfig;
|
|
566
602
|
navigationConfig?: NavigationConfig;
|
|
567
603
|
};
|
|
568
|
-
declare const WllSdkProvider:
|
|
604
|
+
declare const WllSdkProvider: ({ children, theme: providedTheme, config, navigationConfig, }: WllSdkProviderProps) => JSX.Element;
|
|
569
605
|
declare const useWllSdk: () => WllSdkContextType;
|
|
570
606
|
|
|
571
|
-
export { type APIResponse, type Availability, type Badge, type BadgeDetail, _default$5 as BadgeTile, BadgeTileConfig, BadgeTileType, _default$4 as BannerTile, BannerTileConfig, BaseBanner, type BaseThemeObject, BaseTile, Button, CTALinkTarget, Carousel,
|
|
607
|
+
export { type APIResponse, type Align, type Availability, type Badge, type BadgeDetail, _default$5 as BadgeTile, BadgeTileConfig, BadgeTileType, _default$4 as BannerTile, BannerTileConfig, BaseBanner, type BaseThemeObject, BaseTile, Button, CTALinkTarget, Carousel, _default$3 as ContentTile, ContentTileConfig, type DerivedProperties, FlexBox, type FlexDirection, Grid, Group, Icon, type ImagePropsNoSource, Indicator, type Justify, Layout, type LayoutProps$1 as LayoutProps, LoadingIndicator, type NavigationConfig, type NavigationType, _default$2 as PointsTile, PointsTileConfig, type ProgessType, ProgressBar, ProgressIndicator, ProgressType, ProgressiveImage, Reward, type RewardCategory, _default$1 as RewardCategoryTile, RewardCategoryTileConfig, _default as RewardTile, RewardTileConfig, type SDKConfig, Section, SectionHeader, SectionType, type Size, Skeleton, Spacer, type TGroup, type TSection, Text, type ThemeContextType, type ThemeObject, type ThemeProviderProps, TierTileConfig, TierTileType, TierTile as TierTileUpdated, type TierType, type Tile, type TileConfig, TileContainer, TileHeight, TileType, type Variant, WllSdkProvider, alignMap, justifyMap, useWllSdk };
|