@wscsports/blaze-web-sdk 0.1.84 → 0.1.86

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wscsports/blaze-web-sdk",
-  "version": "0.1.84",
+  "version": "0.1.86",
   "main": "publish/index",
   "types": "publish/index",
   "files": [
@@ -23,7 +23,7 @@
     "javascript-obfuscator": "^4.0.2",
     "style-loader": "^3.3.3",
     "ts-loader": "^9.4.4",
-    "typescript": "^5.1.6",
+    "typescript": "^5.4.2",
     "typescript-declaration-webpack-plugin": "^0.3.0",
     "webpack": "^5.88.1",
     "webpack-cli": "^5.1.4",

package/publish/index.d.ts

@@ -104,6 +104,7 @@ export * from './long-press.handler';
 export * from './singleton.class';
 export * from './throttle';
 export * from './url';
+export * from './device-detector.class';
 
 export interface ILongPressHandlerOptions {
     onStart: () => void;
@@ -192,7 +193,7 @@ export declare class BlazeDrawer extends BaseWidget {
 export declare class BlazeImage extends BaseWidget {
     thumbnailElement: HTMLImageElement;
     constructor();
-    load(src: string, onComplete?: () => void): void;
+    load(src: string): void;
     setRatio(ratio: string): void;
     setBorderRadius(radius: string): void;
 }
@@ -213,9 +214,12 @@ export declare class BlazeLoader extends HTMLElement {
     connectedCallback(): void;
 }
 
-export declare class BlazeSkeleton extends BaseWidget {
-    borderRadius: string;
-    constructor(layoutStyle?: LayoutStyle);
+export declare class BlazeWidgetItemSkeleton extends BaseWidget {
+    width: number;
+    thumbnailHeight: number | string;
+    layoutStyle: LayoutStyle;
+    labelHeight: number;
+    constructor(layoutStyle: LayoutStyle, width: number, thumbnailHeight: number, labelHeight: number);
     connectedCallback(): void;
 }
 
@@ -465,6 +469,11 @@ export interface IStory extends IContent {
     pages: IPage[];
     isAd: boolean;
     adInfo?: IAdInfo;
+    entities?: {
+        gameId: string | null;
+        teamId: string | null;
+        playerId: string | null;
+    };
 }
 
 export interface IThumbnail {
@@ -525,7 +534,6 @@ export interface WidgetsTagNameMap {
     'blaze-widget-moment-video': BlazeWidgetMomentVideo;
     'blaze-widget-interaction': BlazeWidgetInteraction;
     'blaze-loader': BlazeLoader;
-    'blaze-skeleton': BlazeSkeleton;
     'blaze-chip': BlazeChip;
     'blaze-image': BlazeImage;
     'blaze-toast': BlazeToast;
@@ -556,7 +564,6 @@ interface WidgetsTagNameOptionsMap {
     'blaze-widget-moment-video': {};
     'blaze-widget-interaction': {};
     'blaze-loader': {};
-    'blaze-skeleton': {};
     'blaze-chip': {};
     'blaze-image': {};
     'blaze-toast': {};
@@ -674,6 +681,7 @@ export interface IDrawable {
 
 export * from './blaze-sdk.interface';
 export * from './database.interface';
+export * from './device.interface';
 export * from './drawable.interface';
 export * from './response.interface';
 export * from './service.interface';
@@ -710,6 +718,7 @@ export interface IWidgetViewOptionsBase {
     theme?: IWidgetTheme | ThemeType;
     delegates?: Record<Delegation, EventListenerOrEventListenerObject>;
     labelsPriority?: string;
+    perItemStyleOverrides?: PerItemStyleOverrides;
 }
 export interface IWidgetViewOptionsWithLabels extends IWidgetViewOptionsBase {
     labels: string | string[] | BlazeWidgetLabel;
@@ -728,8 +737,10 @@ export interface IWidgetView {
     setLabelsPriority: (labelsPriority: string) => void;
     setContentIds: (storyIds: string[]) => void;
     reload: () => void;
+    updateWidgetUI: () => void;
     setMaxItemsDisplaySize: (size: number) => void;
     setDelegations: (delegates: Record<Delegation, EventListenerOrEventListenerObject>) => void;
+    updateOverrideStyles: (perItemStyleOverrides: PerItemStyleOverrides) => void;
 }
 
 declare const AdServiceClass_base: {
@@ -743,17 +754,6 @@ declare abstract class AdServiceClass extends AdServiceClass_base implements ISe
 }
 export declare const AdService: AdServiceClass;
 
-declare const AlertServiceClass_base: {
-    new (): {};
-    _instance: AlertServiceClass;
-    getInstance(): AlertServiceClass;
-};
-declare abstract class AlertServiceClass extends AlertServiceClass_base implements IService {
-    init(): Promise<void>;
-    alert(): void;
-}
-export declare const AlertService: AlertServiceClass;
-
 declare const AnalyticsServiceClass_base: {
     new (): {};
     _instance: AnalyticsServiceClass;
@@ -1109,7 +1109,6 @@ declare abstract class EventServiceClass extends EventServiceClass_base implemen
 export declare const EventService: EventServiceClass;
 
 export * from './ad.service';
-export * from './alert.ervice';
 export * from './analytics.service';
 export * from './api.service';
 export * from './config.service';
@@ -1250,6 +1249,7 @@ export declare class Presets {
     static StatusLiveUnreadStyle: IndicatorStyle;
     static StatusReadStyle: IndicatorStyle;
     static StatusUnreadStyle: IndicatorStyle;
+    static BadgeStyle: IndicatorStyle;
     static LabelStyle: LabelStyle;
     static Grid2Column: LayoutStyle;
     static Grid3Column: LayoutStyle;
@@ -1265,15 +1265,19 @@ export declare class Presets {
 export interface IndicatorStyle {
     backgroundColor: string;
     backgroundImage: string;
-    textColor: string;
-    font: string;
-    textSize: string;
-    letterSpacing: string;
     borderRadius: string;
     borderColor: string;
     borderWidth: number;
     text: string;
+    textColor: string;
+    textSize: string;
+    letterSpacing: string;
+    font: string;
     isVisible: boolean;
+    width?: number;
+    height?: number;
+    padding: string;
+    positionOffset?: PartialPositionOffset;
 }
 export interface LayoutStyle {
     thumbnailShape: ThumbnailShape;
@@ -1293,7 +1297,9 @@ export interface LayoutStyle {
     statusLiveUnreadStyle: IndicatorStyle;
     statusReadStyle: IndicatorStyle;
     statusUnreadStyle: IndicatorStyle;
+    badgeIndicatorStyle: IndicatorStyle;
     statusIndicatorPosition: PositionType;
+    badgePosition: PositionType;
 }
 export interface LabelStyle {
     isVisible: boolean;
@@ -1708,15 +1714,23 @@ export * from './client-platform.type';
 export * from './direction.type';
 export * from './element.type';
 export * from './fetch-priority.type';
+export * from './item.type';
 export * from './label.type';
 export * from './order.type';
 export * from './play.type';
+export * from './position.type';
 export * from './severity.type';
 export * from './size.type';
 export * from './story-direction.type';
 export * from './thumbnail.type';
 export * from './widget.type';
 
+export type EntitiesType = 'playerId' | 'teamId' | 'gameId';
+export type PerItemStyleOverrides = Record<EntitiesType, Array<{
+    name: string;
+    theme: IWidgetTheme;
+}>>;
+
 export type labelType = string | string[] | BlazeWidgetLabel;
 
 export type OrderType = 'Manual' | 'AtoZ' | 'ZtoA' | 'RecentlyUpdatedFirst' | 'RecentlyUpdatedLast' | 'RecentlyCreatedFirst' | 'RecentlyCreatedLast';
@@ -1725,8 +1739,15 @@ export declare const PlayTypeArray: readonly ["Widget", "Share", "SingleStory"];
 export type PlayType = typeof PlayTypeArray[number];
 
 export type PositionInsideType = 'insideTopLeft' | 'insideTopRight' | 'insideMiddleTop' | 'insideMiddle' | 'insideBottomRight' | 'insideBottomLeft' | 'insideBottomMiddle' | 'insideMiddleLeft' | 'insideMiddleRight';
-export type PositionOutsideType = 'outsideUnder' | 'outsideBelow' | 'outsideAbove' | 'outsideTop' | 'outsideTopLeft' | 'outsideTopRight' | 'outsideBottomLeft' | 'outsideBottomRight' | 'outsideBottom' | 'outsideRight' | 'outsideLeft';
+export type PositionOutsideType = 'outsideTop' | 'outsideTopLeft' | 'outsideTopRight' | 'outsideBottomLeft' | 'outsideBottomRight' | 'outsideBottom' | 'outsideRight' | 'outsideLeft';
 export type PositionType = PositionInsideType | PositionOutsideType;
+export interface PositionOffset {
+    top: string;
+    left: string;
+    right: string;
+    bottom: string;
+}
+export type PartialPositionOffset = Partial<PositionOffset>;
 
 export type SeverityType = 'error' | 'warning' | 'info' | 'success';
 
@@ -1748,8 +1769,9 @@ interface ChipSizeOptions {
     statusUnreadStyle: IndicatorStyle;
 }
 export declare function getChipSize(options: ChipSizeOptions): DOMRect;
-export declare function getMaxChipSize(layout: LayoutStyle): DOMRect;
-export declare function calculateChipSize(statusIndicatorPosition: PositionType, layoutStyle: LayoutStyle): {
+export declare function createChip(indicatorSettings: IndicatorStyle): DOMRect;
+export declare function getMaxChipSize(type: 'chip' | 'badge', layout: LayoutStyle): DOMRect;
+export declare function calculateChipSize(type: 'chip' | 'badge', statusIndicatorPosition: PositionType, layoutStyle: LayoutStyle): {
     chipHeight: number;
     chipWidth: number;
 };
@@ -1764,18 +1786,22 @@ export declare function GuardNullOrEmpty(name: string, value: any): void;
 export declare function formatDuration(startDate: Date): string;
 export declare function removeUndefined(value: any): object;
 export declare function isCssPropertySupported(property: string): boolean;
+export declare function pixelsToNumber(pxString: string): number;
 export declare function isObject(item: any): boolean;
 export declare function mergeDeep(target: any, ...sources: any[]): any;
 export declare function cloneDeep<T>(target: T): T;
 export declare function formatDate(date: Date): string;
 export declare function formatUTCDate(date: Date): string;
+export declare function calculatePercentage(value: number, element: BlazeDiv): string;
 export declare function getRandomId(): string;
+export declare function isEmpty(obj: Record<string, any>): boolean;
 export declare function setId(element: HTMLElement, prefix?: string, suffix?: string): void;
 export type DeepPartial<T> = T extends object ? {
     [P in keyof T]?: DeepPartial<T[P]>;
 } : T;
 export declare function flattenObject<T extends Record<string, any>>(obj: T): Record<string, any>;
 export declare function mergeStyles(element: HTMLElement, styles: Partial<CSSStyleDeclaration>): object;
+export declare function getMaxValue(currentMax: string, newValue: string): string;
 
 export * from './chip.utils';
 export * from './common.utils';
@@ -1792,8 +1818,6 @@ export declare function calculatePosition(statusIndicatorPosition: PositionType)
     isTop: boolean;
     isMiddle: boolean;
     isBottom: boolean;
-    isBelow: boolean;
-    isAbove: boolean;
     isLeft: boolean;
     isRight: boolean;
 };
@@ -1888,12 +1912,11 @@ export declare class BlazeWidgetItem extends BaseWidget {
     private labelBackground;
     private theme;
     private chip;
+    private badge;
     private isLive;
-    private shouldDisplaySkeleton;
-    private blazeSkeletonThumbnail;
-    private blazeSkeletonLabel;
     private analyticsCalls;
     private statusIndicatorSettings;
+    paddingItem: PositionOffset;
     content: IStory;
     onClick: (() => void) | undefined;
     constructor(options: BlazeWidgetItemOptions);
@@ -1901,22 +1924,26 @@ export declare class BlazeWidgetItem extends BaseWidget {
     connectedCallback(): void;
     disconnectedCallback(): void;
     updateWidget(): void;
+    updateWidgetItemStyle(theme: IWidgetTheme): void;
     private setupDOMElements;
     private setupEventListeners;
     private handleWidgetClick;
     private setData;
     getThumbnailUrl(): string;
-    private removeSkeleton;
-    handelOnCompleteLoadingThumbnail(): void;
     private updateLabel;
-    private loadThumbnail;
+    private resetWidgetItemStyles;
     private updateContainerStyles;
     private updateLabelStyles;
     private updateInsideLabelStyles;
     private updateOutsideLabelStyles;
     private updateThumbnailStyles;
-    private updateChipStyles;
+    private updateStatusIndicatorStyle;
+    private handleOutsidePosition;
+    private handleInsidePosition;
+    private applyCommonStyles;
     setTheme(theme: IWidgetTheme): void;
+    getPaddingOnContainer(): PositionOffset;
+    setPaddingOnContainer(padding: PositionOffset): void;
     setChipStyle(): void;
     event(action: WidgetAction, data: Partial<WidgetEvent>, label?: string | undefined): void;
     render(): void;
@@ -1942,8 +1969,11 @@ export declare class BlazeWidgetLayout extends BlazeWidgetScrollable implements
     modalMoments: BlazeWidgetMomentModal | undefined;
     stories: IStory[];
     moments: IMoment[];
+    skeletonContainer: BlazeDiv | undefined;
     widgetItems: BlazeWidgetItem[];
     preset: IWidgetTheme | undefined;
+    perItemStyleOverrides: PerItemStyleOverrides;
+    activeOverridesLayoutThemes: PerItemStyleOverrides;
     thumbnailWidth: number | undefined;
     thumbnailHeight: number | undefined;
     widgetHeight: number;
@@ -1960,10 +1990,10 @@ export declare class BlazeWidgetLayout extends BlazeWidgetScrollable implements
     handleIntersection(entries: IntersectionObserverEntry[]): void;
     connectedCallback(): void;
     disconnectedCallback(): void;
+    attributeChangedCallback(name: string, oldValue: string, newValue: string): void;
     onKeyDown(e: KeyboardEvent): void;
     onStoryChange(mode: StoryDirectionType): void;
     getParentHeightWithoutPadding(): number | null;
-    attributeChangedCallback(name: string, oldValue: string, newValue: string): void;
     setId(id: string): void;
     handlePopState(_event: Event): void;
     addDelegateListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;
@@ -1974,7 +2004,10 @@ export declare class BlazeWidgetLayout extends BlazeWidgetScrollable implements
     getTheme(): IWidgetTheme;
     setTheme(theme: IWidgetTheme | string): void;
     private get theme();
+    updateOverrideStyles(perItemStyleOverrides: PerItemStyleOverrides): void;
     reload(): void;
+    updateActiveLayoutThemesPerItemWithEntity(key: EntitiesType, value: string, theme: IWidgetTheme): void;
+    updateWidgetUI(): void;
     setDelegations(delegates: Record<Delegation, EventListenerOrEventListenerObject>): void;
     setMaxItemsDisplaySize(maxSize: number): void;
     setMaxItemsSize(maxItemsSize: number): void;
@@ -1983,7 +2016,37 @@ export declare class BlazeWidgetLayout extends BlazeWidgetScrollable implements
     static get observedAttributes(): string[];
     onItemClick(item: BlazeWidgetItem, i: number): void;
     loadStories(): Promise<void>;
+    processStoriesInWidget(): void;
+    calculateChipSizes(theme: IWidgetTheme): {
+        badge: {
+            width: number;
+            height: number;
+        };
+        chip: {
+            width: number;
+            height: number;
+        };
+    };
+    getStatusIndicatorBadgeAndChipSizes(): {
+        maxBadgeHeight: number;
+        maxBadgeWidth: number;
+        maxChipHeight: number;
+        maxChipWidth: number;
+    };
+    getMaxSizes(badge: {
+        height: number;
+        width: number;
+    }, chip: {
+        height: number;
+        width: number;
+    }, badgePosition: string, statusIndicatorPosition: string): {
+        maxBadgeHeight: number;
+        maxBadgeWidth: number;
+        maxChipHeight: number;
+        maxChipWidth: number;
+    };
     render(): void;
+    calculateWidthForRow(height: number, itemRatio: number, maxWidth: number, labelAdditionalWidth: number): number;
     calculateLabelSizes(labelStyle: LabelStyle, lineNumber: number): {
         labelWidth: number | "auto";
         labelAdditionalWidth: number;