@wlloyalty/wll-react-sdk 1.0.42 → 1.0.44

package/dist/index.d.ts

@@ -1,7 +1,8 @@
 import * as React$1 from 'react';
-import React__default, { ReactNode, FC } from 'react';
-import { ViewStyle, ImageSourcePropType, StyleProp, View, TextProps as TextProps$1, TextStyle, ImageProps } from 'react-native';
+import React__default, { ReactNode } from 'react';
 import * as LucideIcons from 'lucide-react';
+import * as react_native from 'react-native';
+import { ImageSourcePropType, StyleProp, ViewStyle, View, TextProps as TextProps$1, TextStyle, ImageProps } from 'react-native';
 
 declare const sizes: {
     readonly borderRadiusSm: 15;
@@ -69,19 +70,7 @@ type ButtonProps = {
     onPress: () => void;
     variant: Variant;
 };
-declare const Button: React$1.FC<ButtonProps>;
-
-type Justify$1 = 'start' | 'end' | 'center' | 'between' | 'around' | 'evenly';
-type Align$1 = 'start' | 'end' | 'center' | 'stretch';
-type ColumnProps = {
-    children: React$1.ReactNode;
-    justify?: Justify$1;
-    align?: Align$1;
-    direction?: FlexDirection$1;
-    style?: ViewStyle;
-};
-type FlexDirection$1 = 'column' | 'row' | 'column-reverse' | 'row-reverse';
-declare const Column$1: React$1.FC<ColumnProps>;
+declare const Button: ({ title, onPress, variant }: ButtonProps) => JSX.Element;
 
 type IconName = keyof typeof LucideIcons;
 type IconProps = {
@@ -90,7 +79,39 @@ type IconProps = {
     size?: number;
     strokeWidth?: number;
 };
-declare const Icon: React$1.FC<IconProps>;
+declare const Icon: ({ name, color, size, strokeWidth, ...props }: IconProps) => JSX.Element | null;
+
+declare const LoadingIndicator: () => JSX.Element;
+
+type ProgressBarProps = {
+    percentage: number;
+    variant?: Variant;
+    height?: Size;
+    animationDuration?: number;
+};
+declare const ProgressBar: ({ percentage, variant, height, animationDuration, }: ProgressBarProps) => JSX.Element;
+
+type ProgressiveImageProps = {
+    source: ImageSourcePropType;
+    style?: StyleProp<ViewStyle>;
+    isDesaturated?: boolean;
+    [key: string]: any;
+};
+declare const ProgressiveImage: ({ source, style, isDesaturated, ...props }: ProgressiveImageProps) => JSX.Element;
+
+type RowHeaderProps = {
+    children: React$1.ReactNode;
+    className?: string;
+} & React$1.ComponentProps<typeof View>;
+declare const RowHeader: ({ children, style, ...props }: RowHeaderProps) => JSX.Element;
+
+type TextVariant = 'eyebrow' | 'title' | 'description' | 'body' | 'caption' | 'label' | 'tier-requirement' | 'tier-earned';
+type TextProps = TextProps$1 & {
+    variant?: TextVariant;
+    style?: TextStyle;
+    isSurface?: boolean;
+};
+declare const Text: ({ variant, style, isSurface, ...props }: TextProps) => JSX.Element;
 
 type Badge = {
     id: string;
@@ -308,72 +329,42 @@ type Tile = {
 declare const getConfigForTileType: (tileType: TileType) => typeof BannerTileConfig | typeof PointsTileConfig | typeof ContentTileConfig | typeof RewardTileConfig | typeof BadgeTileConfig | typeof RewardCategoryTileConfig | typeof TierTileConfig;
 type TileConfig = InstanceType<ReturnType<typeof getConfigForTileType>>;
 
-type LoadingIndicatorProps = {
-    tile: Tile;
-};
-declare const LoadingIndicator: React$1.FC<LoadingIndicatorProps>;
-
-type ProgressBarProps = {
-    percentage: number;
-    variant?: Variant;
-    height?: Size;
-    animationDuration?: number;
-};
-declare const ProgressBar: React$1.FC<ProgressBarProps>;
-
-type ProgressiveImageProps = {
-    source: ImageSourcePropType;
-    style?: StyleProp<ViewStyle>;
-    isDesaturated?: boolean;
-    [key: string]: any;
-};
-declare const ProgressiveImage: React__default.FC<ProgressiveImageProps>;
-
-type RowHeaderProps = {
-    children: React$1.ReactNode;
-    className?: string;
-} & React$1.ComponentProps<typeof View>;
-declare const RowHeader: React$1.FC<RowHeaderProps>;
-
-type TextVariant = 'eyebrow' | 'title' | 'description' | 'body' | 'caption' | 'label' | 'tier-requirement' | 'tier-earned';
-type TextProps = TextProps$1 & {
-    variant?: TextVariant;
-    style?: TextStyle;
-    isSurface?: boolean;
-};
-declare const Text: React$1.FC<TextProps>;
-
 type BaseBannerProps = {
     tile: Tile;
-    children: React$1.ReactNode;
+    children: React__default.ReactNode;
 };
-declare const BaseBanner: React$1.FC<BaseBannerProps>;
-
-type ImagePropsNoSource = Omit<ImageProps, 'source'>;
+declare const BaseBanner: ({ tile, children }: BaseBannerProps) => JSX.Element;
 
 type BaseTileProps = {
     tile: Tile;
     children: ReactNode;
     style?: ViewStyle;
 };
-type BaseTileComponent = FC<BaseTileProps> & {
-    Root: FC<{
-        children: ReactNode;
-        style?: ViewStyle;
-    }>;
-    Media: FC<ImagePropsNoSource>;
-    Content: FC<{
-        children: ReactNode;
+type BaseTileRootProps = {
+    children: ReactNode;
+    style?: ViewStyle;
+};
+/**
+ * BaseTile component with subcomponents attached.
+ */
+declare const BaseTile: (({ tile, children }: BaseTileProps) => JSX.Element) & {
+    Root: ({ children, style }: BaseTileRootProps) => JSX.Element;
+    Media: React__default.FC<ImagePropsNoSource>;
+    Content: React__default.FC<{
+        children: React__default.ReactNode;
     }>;
-    Header: FC<{
-        children?: ReactNode;
+    Header: React__default.FC<{
+        children?: React__default.ReactNode;
     }>;
-    Title: FC;
-    Body: FC;
+    Title: React__default.FC;
+    Body: (props: Omit<react_native.TextProps, "style"> & {
+        variant?: "eyebrow" | "title" | "description" | "body" | "caption" | "label" | "tier-requirement" | "tier-earned";
+        isSurface?: boolean;
+        style?: react_native.TextStyle;
+    }) => React__default.JSX.Element | null;
 };
-declare const BaseTile: BaseTileComponent;
 
-declare const Indicator: () => React__default.JSX.Element;
+declare const Indicator: () => JSX.Element;
 
 interface SkeletonProps {
     width?: number | `${number}%`;
@@ -382,24 +373,17 @@ interface SkeletonProps {
     style?: ViewStyle;
     numberOfSquares?: number;
 }
-declare const Skeleton: React$1.FC<SkeletonProps>;
+declare const Skeleton: ({ style, numberOfSquares, }: SkeletonProps) => JSX.Element;
 
 type TileContainerProps = {
     tiles: Tile[];
 };
-declare const TileContainer: React$1.FC<TileContainerProps>;
-
-declare const Column: FC<LayoutProps>;
-
-declare const Row: FC<LayoutProps>;
-
-type FlexBoxProps = {
-    children: React__default.ReactNode;
-};
-declare const FlexBox: ({ children }: FlexBoxProps) => React__default.JSX.Element;
-
-declare const Stack: React.FC<LayoutProps>;
+/**
+ * TileContainer component to render a list of tiles with proper layout and spacing.
+ */
+declare const TileContainer: ({ tiles }: TileContainerProps) => JSX.Element;
 
+type ImagePropsNoSource = Omit<ImageProps, 'source'>;
 type FlexDirection = 'row' | 'row-reverse' | 'column' | 'column-reverse';
 type Justify = 'start' | 'end' | 'center' | 'between' | 'around' | 'evenly';
 type Align = 'start' | 'end' | 'center' | 'stretch' | 'baseline';
@@ -410,6 +394,82 @@ type LayoutProps = {
     direction?: FlexDirection;
     style?: ViewStyle;
 };
+declare const justifyMap: Record<Justify, ViewStyle['justifyContent']>;
+declare const alignMap: Record<Align, ViewStyle['alignItems']>;
+
+type FlexProps = {
+    justify?: Justify;
+    align?: Align;
+    style?: ViewStyle;
+};
+type ColumnLayoutProps = FlexProps & {
+    children?: React__default.ReactNode;
+};
+/**
+ * A Column layout component that arranges its children in a vertical stack.
+ *
+ * @param children - The child components to render inside the column.
+ * @param justify - Defines how children are aligned along the main axis.
+ * @param align - Defines how children are aligned along the cross axis.
+ * @param style - Additional styles to apply to the container.
+ */
+declare const Column: React__default.MemoExoticComponent<({ children, justify, align, style, }: ColumnLayoutProps) => JSX.Element>;
+
+/**
+ * Props for the FlexBox component.
+ *
+ * @param children - The child components to render inside the flex container.
+ * @param style - Optional custom styles to apply to the container.
+ */
+type FlexBoxProps = {
+    children: React__default.ReactNode;
+    style?: ViewStyle;
+};
+/**
+ * A FlexBox component that provides a flexible container with `flex: 1`.
+ *
+ * This component is commonly used to create a full-flex container that expands
+ * to fill available space in a layout.
+ */
+declare const FlexBox: ({ children, style }: FlexBoxProps) => JSX.Element;
+
+/**
+ * A Row layout component that arranges its children in a horizontal stack.
+ *
+ * @param children - The child components to render inside the row.
+ * @param justify - Defines how children are aligned along the main axis (horizontal).
+ * @param align - Defines how children are aligned along the cross axis (vertical).
+ * @param direction - The flex direction for the row (default is 'row').
+ * @param style - Additional styles to apply to the container.
+ */
+declare const Row: ({ children, justify, align, direction, style, }: LayoutProps) => JSX.Element;
+
+/**
+ * Props for the Spacer component.
+ *
+ * @param style - Optional custom styles to apply to the spacer.
+ */
+type SpacerProps = {
+    style?: ViewStyle;
+};
+/**
+ * A simple Spacer component that creates flexible space in layouts.
+ *
+ * The Spacer is commonly used in flexbox layouts to create adjustable empty space
+ * between child elements, avoiding the need for explicit margins or padding.
+ */
+declare const Spacer: ({ style }: SpacerProps) => JSX.Element;
+
+/**
+ * A Stack layout component that arranges its children in a flexible stack.
+ *
+ * @param children - The child components to render inside the stack.
+ * @param justify - Defines how children are aligned along the main axis.
+ * @param align - Defines how children are aligned along the cross axis.
+ * @param direction - The flex direction for the stack (default is 'column').
+ * @param style - Additional styles to apply to the container.
+ */
+declare const Stack: ({ children, justify, align, direction, style, }: LayoutProps) => JSX.Element;
 
 declare enum SectionType {
     Grid = "GRID",
@@ -437,12 +497,12 @@ type TSection = {
 type CarouselProps = {
     section: TSection;
 };
-declare const Carousel: React__default.FC<CarouselProps>;
+declare const Carousel: ({ section }: CarouselProps) => JSX.Element;
 
 type GridProps = {
     section: TSection;
 };
-declare const Grid: React$1.FC<GridProps>;
+declare const Grid: ({ section }: GridProps) => React__default.JSX.Element;
 
 type ProgressIndicatorProps = {
     currentPoints: number;
@@ -451,13 +511,13 @@ type ProgressIndicatorProps = {
     height?: Size;
     attained?: boolean;
 };
-declare const ProgressIndicator: React$1.FC<ProgressIndicatorProps>;
+declare const ProgressIndicator: ({ currentPoints, maxPoints, variant, height, attained, }: ProgressIndicatorProps) => JSX.Element;
 
 type SectionHeaderProps = {
     title?: string;
     description?: string;
 };
-declare const SectionHeader: React__default.FC<SectionHeaderProps>;
+declare const SectionHeader: ({ title, description, }: SectionHeaderProps) => JSX.Element | null;
 
 type WithTileFetchingProps = {
     tile?: Tile;
@@ -472,7 +532,7 @@ declare const _default$5: (props: Omit<BadgeTileProps, "tile"> & WithTileFetchin
 type BannerTileProps = {
     tile: Tile;
 };
-declare const _default$4: (props: Omit<BannerTileProps, "tile"> & WithTileFetchingProps) => React$1.JSX.Element;
+declare const _default$4: (props: Omit<BannerTileProps, "tile"> & WithTileFetchingProps) => React__default.JSX.Element;
 
 type ContentTileProps = {
     tile: Tile;
@@ -482,7 +542,17 @@ declare const _default$3: (props: Omit<ContentTileProps, "tile"> & WithTileFetch
 type GroupProps = {
     id: string;
 };
-declare const Group: React__default.FC<GroupProps>;
+/**
+ * A page-level component that represents a Group view in the application.
+ *
+ * This component serves as a container page that manages the fetching and display
+ * of a group's data and its associated sections. It handles various states including
+ * loading, errors, and empty states, providing a complete page experience for
+ * viewing group content.
+ *
+ * @param id - The unique identifier of the group to fetch and display.
+ */
+declare const Group: ({ id }: GroupProps) => JSX.Element | null;
 
 type PointsTileProps = {
     tile: Tile;
@@ -492,7 +562,7 @@ declare const _default$2: (props: Omit<PointsTileProps, "tile"> & WithTileFetchi
 type RewardCategoryTileProps = {
     tile: Tile;
 };
-declare const _default$1: (props: Omit<RewardCategoryTileProps, "tile"> & WithTileFetchingProps) => React$1.JSX.Element;
+declare const _default$1: (props: Omit<RewardCategoryTileProps, "tile"> & WithTileFetchingProps) => React__default.JSX.Element;
 
 type RewardTileProps = {
     tile: Tile;
@@ -503,7 +573,10 @@ type SectionProps = {
     section?: TSection;
     sectionId?: string;
 };
-declare const Section: React__default.FC<SectionProps>;
+/**
+ * The Section component renders a section based on its type (e.g., Banner, Grid).
+ */
+declare const Section: ({ section, sectionId }: SectionProps) => JSX.Element | null;
 
 type TierTileProps = {
     tile: Tile;
@@ -565,7 +638,7 @@ type WllSdkProviderProps = {
     config: SDKConfig;
     navigationConfig?: NavigationConfig;
 };
-declare const WllSdkProvider: React__default.FC<WllSdkProviderProps>;
+declare const WllSdkProvider: ({ children, theme: providedTheme, config, navigationConfig, }: WllSdkProviderProps) => JSX.Element;
 declare const useWllSdk: () => WllSdkContextType;
 
-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, Column, Column$1 as Content, _default$3 as ContentTile, ContentTileConfig, type DerivedProperties, FlexBox, Grid, Group, Icon, type ImagePropsNoSource, Indicator, type 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, Row, RowHeader, type SDKConfig, Section, SectionHeader, SectionType, type Size, Skeleton, Stack, 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, useWllSdk };
+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, Column, _default$3 as ContentTile, ContentTileConfig, type DerivedProperties, FlexBox, type FlexDirection, Grid, Group, Icon, type ImagePropsNoSource, Indicator, type Justify, type 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, Row, RowHeader, type SDKConfig, Section, SectionHeader, SectionType, type Size, Skeleton, Spacer, Stack, 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 };