@wlloyalty/wll-react-sdk 1.0.57 → 1.0.59

package/dist/types/constants/theme.d.ts

@@ -0,0 +1,6 @@
+export declare const COLOR_CONSTANTS: {
+    readonly MINIMUM_CONTRAST_RATIO: 2;
+    readonly DEFAULT_LIGHTNESS_ADJUSTMENT: 0.2;
+    readonly DESATURATION_LIGHTEN_AMOUNT: 2;
+    readonly DEFAULT_COLOR: "#FFFFFF";
+};

package/dist/{context → types/context}/WllSdkContext.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import { ReactNode } from 'react';
 import { TGroup } from '../types/group';
 import { NavigationConfig } from '../types/navigation';
 import { TSection } from '../types/section';
@@ -20,10 +20,12 @@ type WllSdkContextType = ThemeContextType & {
     getGroupByID: (id: string) => Promise<APIResponse<TGroup>>;
     getSectionByID: (id: string) => Promise<APIResponse<TSection>>;
     getTileByID: (id: string) => Promise<APIResponse<Tile>>;
-    handleNavigation: (link: string, target: CTALinkTarget) => void;
-};
+    handleNavigation: (link: string, target: CTALinkTarget) => Promise<void>;
+} & Readonly<{
+    readonly config: SDKConfig;
+}>;
 type WllSdkProviderProps = {
-    children: React.ReactNode;
+    children: ReactNode;
     theme?: Partial<BaseThemeObject>;
     config: SDKConfig;
     navigationConfig?: NavigationConfig;

package/dist/{hooks → types/hooks}/useHandleTilePress.d.ts

@@ -1,2 +1,2 @@
 import { Tile } from '../types/tile';
-export declare const useHandleTilePress: (tile: Tile, ctaLink?: string | null, ctaLinkTarget?: string) => () => void;
+export declare const useHandleTilePress: (tile: Tile, ctaLink?: string | null, ctaLinkTarget?: string) => () => Promise<void> | undefined;

package/dist/{hooks → types/hooks}/useNavigationHandler.d.ts

@@ -1,3 +1,3 @@
 import { NavigationConfig } from '../types/navigation';
 import { CTALinkTarget } from '../types/tile';
-export declare const useNavigation: (config: NavigationConfig) => (link: string, ctaTarget: CTALinkTarget) => void;
+export declare const useNavigation: (config: NavigationConfig) => (link: string, ctaTarget: CTALinkTarget) => Promise<void>;

package/dist/types/index.d.ts

@@ -0,0 +1,11 @@
+export * from './components/atoms';
+export * from './components/molecules';
+export * from './components/organisms';
+export * from './context/WllSdkContext';
+export * from './types/common';
+export * from './types/group';
+export * from './types/navigation';
+export * from './types/section';
+export * from './types/theme';
+export * from './types/tile';
+export * from './types/wll';

package/dist/types/types/navigation.d.ts

@@ -0,0 +1,17 @@
+export type NavigationType = 'external' | 'internal' | 'modal';
+type NavigationHandlerParams = {
+    target: string;
+    windowTarget: string;
+};
+export type NavigationConfig = {
+    navigationHandlers?: {
+        external?: (params: NavigationHandlerParams) => Promise<void>;
+        internal?: (params: NavigationHandlerParams) => Promise<void>;
+        modal?: (params: NavigationHandlerParams) => Promise<void>;
+    };
+    external?: (params: NavigationHandlerParams) => Promise<void>;
+    internal?: (params: NavigationHandlerParams) => Promise<void>;
+    modal?: (params: NavigationHandlerParams) => Promise<void>;
+    baseUrl?: string;
+};
+export {};

package/dist/types/{theme.d.ts → types/theme.d.ts}

@@ -1,6 +1,11 @@
 import { ReactNode } from 'react';
 import { sizes } from '../utils/styling';
-import { DerivedColors } from '../utils/themeHelpers';
+import { BadgeTileType } from './tile';
+export type PercentageKey = 5 | 10 | 20 | 30 | 40 | 50 | 60 | 70 | 80 | 90 | 95;
+export type DerivedColors = {
+    [K in PercentageKey]: string;
+};
+export type DesaturationType = BadgeTileType.Specific | BadgeTileType.Latest;
 export type BaseThemeObject = {
     accent: string;
     background: string;

package/dist/types/utils/themeHelpers.d.ts

@@ -0,0 +1,54 @@
+import { BaseThemeObject, DerivedColors, DesaturationType } from '../types/theme';
+import { themeItems, ThemeName, themes } from './storybookThemes';
+/**
+ * Validates a theme object to ensure all required colors are present and valid
+ * @param theme - Partial theme object to validate
+ * @returns Boolean indicating if theme is valid
+ */
+export declare const validateTheme: (theme: Partial<BaseThemeObject>) => boolean;
+/**
+ * Returns a derived color based on the background darkness
+ * @param color - Base color to derive from
+ * @returns Derived color string or default color if invalid
+ */
+export declare const getDerivedColor: (color: string) => string;
+/**
+ * Determines the most readable text color (black or white) for a given background
+ * @param backgroundColor - Background color to check against
+ * @returns Hex color string for text
+ */
+export declare const getReadableTextColor: (backgroundColor: string) => string;
+/**
+ * Generates a set of colors with varying lightness based on the base color
+ * @param color - Base color to derive from
+ * @returns Object containing derived colors at different lightness levels
+ */
+export declare const getDerivedColorPercentages: (color: string) => DerivedColors;
+/**
+ * Generates a set of colors with varying alpha values
+ * @param color - Base color to derive from
+ * @returns Object containing derived colors at different alpha levels
+ */
+export declare const getAlphaDerivedColors: (color: string) => DerivedColors;
+/**
+ * Determines if a color should be desaturated based on type and count
+ * @param type - Type of desaturation to apply
+ * @param count - Count value affecting desaturation
+ * @returns Boolean indicating if color should be desaturated
+ */
+export declare const shouldDesaturate: (type: DesaturationType, count: number) => boolean;
+/**
+ * Desaturates a color and lightens it
+ * @param color - Color to desaturate
+ * @returns Desaturated color string or default color if invalid
+ */
+export declare const desaturateColor: (color: string) => string;
+/**
+ * Gets the appropriate state color based on type and count
+ * @param baseColor - Base color to process
+ * @param type - Type of state
+ * @param count - Count affecting the state
+ * @returns Processed color string
+ */
+export declare const getStateColor: (baseColor: string, type: DesaturationType, count: number) => string;
+export { themeItems, ThemeName, themes };