@wscsports/blaze-web-sdk 0.1.51 → 0.1.54

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wscsports/blaze-web-sdk",
-  "version": "0.1.51",
+  "version": "0.1.54",
   "main": "publish/index",
   "types": "publish/index",
   "files": [
@@ -11,7 +11,7 @@
     "build:dev": "webpack --config webpack.config.dev.js",
     "build:prod": "webpack --config webpack.config.prod.js",
     "publish:latest": "npm run build:prod && npm publish --access public --tag latest",
-    "publish:test": "npm run build:prod && npm publish --access public --tag test"
+    "publish:beta": "npm run build:prod && npm publish --access public --tag beta"
   },
   "devDependencies": {
     "@types/animejs": "^3.1.7",

package/publish/index.d.ts

@@ -5,6 +5,7 @@ export declare function WidgetGridView(containerId: string, options: IWidgetView
 export declare function Theme(theme: ThemeType): IWidgetTheme;
 export declare function addDelegateListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;
 export declare const Delegations: typeof Delegation;
+export declare function LabelBuilder(): IWidgetLabelBuilder;
 declare const _default: {
     Initialize: typeof Initialize;
     WidgetGridView: typeof WidgetGridView;
@@ -12,6 +13,7 @@ declare const _default: {
     Theme: typeof Theme;
     addDelegateListener: typeof addDelegateListener;
     setDoNotTrack: typeof setDoNotTrack;
+    LabelBuilder: typeof LabelBuilder;
     Delegations: typeof Delegation;
 };
 export default _default;
@@ -103,7 +105,6 @@ export declare class URLManager {
     static isBackWasCalled: boolean;
     static resetLocation(): void;
     static updateLocationStoryHash(story?: IStory): void;
-    static removePlayerTypeFromUrl(): void;
     static getPlayerTypeFromUrl(): "Widget" | "Share" | "SingleStory" | undefined;
 }
 
@@ -171,9 +172,11 @@ export declare class BlazeImage extends BaseWidget {
 export * from './alert';
 export * from './buttons';
 export * from './chip';
+export * from './div';
 export * from './drawer';
 export * from './image';
 export * from './loader';
+export * from './skeleton';
 export * from './toast';
 export * from './typography';
 
@@ -182,6 +185,12 @@ export declare class BlazeLoader extends HTMLElement {
     connectedCallback(): void;
 }
 
+export declare class BlazeSkeleton extends BaseWidget {
+    borderRadius: string;
+    constructor(elementStyle?: ShapeType);
+    connectedCallback(): void;
+}
+
 export declare class BlazeToast extends BaseWidget {
     constructor();
     static get observedAttributes(): string[];
@@ -394,6 +403,7 @@ export interface WidgetsTagNameMap {
     'blaze-widget-image': BlazeWidgetStoryImage;
     'blaze-widget-video': BlazeWidgetStoryVideo;
     'blaze-loader': BlazeLoader;
+    'blaze-skeleton': BlazeSkeleton;
     'blaze-chip': BlazeChip;
     'blaze-image': BlazeImage;
     'blaze-toast': BlazeToast;
@@ -420,6 +430,7 @@ interface WidgetsTagNameOptionsMap {
     'blaze-widget-image': {};
     'blaze-widget-video': {};
     'blaze-loader': {};
+    'blaze-skeleton': {};
     'blaze-chip': {};
     'blaze-image': {};
     'blaze-toast': {};
@@ -437,6 +448,10 @@ export declare abstract class WidgetsFactory {
 
 export * from './elements.factory';
 
+export * from './widget-theme.guard';
+
+export declare function isWidgetTheme(theme: any): theme is IWidgetTheme;
+
 export * from './svgs';
 
 export declare const playSvg = "data:image/svg+xml;charset=utf-8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"48\" height=\"48\" fill=\"none\"><path stroke=\"%23fff\" stroke-linecap=\"round\" stroke-width=\"1.9\" d=\"M17.74 30.34V18.53a1.8 1.8 0 0 1 2.77-1.52l9.23 5.92a1.8 1.8 0 0 1 0 3.03l-9.23 5.9a1.8 1.8 0 0 1-2.77-1.52z\"/></svg>";
@@ -491,11 +506,12 @@ export interface IDrawable {
 
 export * from './blaze-sdk.interface';
 export * from './database.interface';
+export * from './drawable.interface';
 export * from './response.interface';
 export * from './service.interface';
+export * from './widget-label-builder.interface';
 export * from './widget-options.interface';
 export * from './widget-view.interface';
-export * from './drawable.interface';
 
 export default interface IntersectionObservable {
     intersectionObserver: IntersectionObserver;
@@ -511,24 +527,37 @@ export interface IService {
     init: (...args: any[]) => void;
 }
 
+export interface IWidgetLabelBuilder {
+    singleLabel(label: string): BlazeWidgetLabel;
+    mustInclude(...labels: Array<string | BlazeWidgetLabel>): BlazeWidgetLabel;
+    atLeastOneOf(...labels: Array<string | BlazeWidgetLabel>): BlazeWidgetLabel;
+}
+
 export type ContentType = 'story';
-export interface IWidgetViewOptions {
-    labels: string[];
+export interface IWidgetViewOptionsBase {
     orderType: OrderType;
-    storyIds?: string[];
     maxItemsCount?: number;
     maxDisplayItemsCount?: number;
-    contentType: ContentType;
+    contentType?: ContentType;
     theme?: IWidgetTheme | ThemeType;
     delegates?: Record<Delegation, EventListenerOrEventListenerObject>;
 }
+export interface IWidgetViewOptionsWithLabels extends IWidgetViewOptionsBase {
+    labels: string | string[] | BlazeWidgetLabel;
+    storyIds?: never;
+}
+export interface IWidgetViewOptionsWithStoryIds extends IWidgetViewOptionsBase {
+    storyIds: string[];
+    labels?: never;
+}
+export type IWidgetViewOptions = IWidgetViewOptionsWithLabels | IWidgetViewOptionsWithStoryIds;
 
 export interface IWidgetView {
     setTheme: (theme: IWidgetTheme) => void;
     getTheme: () => IWidgetTheme;
     setLabels: (labels: string[]) => void;
-    reload: (labels?: string[]) => void;
-    addEventListener: (type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined) => void;
+    reload: () => void;
+    setDelegations: (delegates: Record<Delegation, EventListenerOrEventListenerObject>) => void;
 }
 
 declare const AlertServiceClass_base: {
@@ -956,8 +985,11 @@ export declare class Presets {
     static LabelStyle: LabelStyle;
     static Grid2Column: LayoutStyle;
     static Grid3Column: LayoutStyle;
+    static Grid2ColumnHorizontal: LayoutStyle;
+    static Grid3ColumnHorizontal: LayoutStyle;
     static RowCircle: LayoutStyle;
     static RowRectangle: LayoutStyle;
+    static RowHorizontalRectangle: LayoutStyle;
     static Default: LayoutStyle;
     static DefaultStoryStyle: StoryPlayerStyle;
 }
@@ -975,7 +1007,8 @@ export interface IndicatorStyle {
     text: string;
 }
 export interface LayoutStyle {
-    shape: 'circle' | 'rectangle' | 'custom';
+    shape: ShapeType;
+    thumbnailType: ThumbnailType;
     rows: number;
     columns: number;
     itemRatio: number;
@@ -990,7 +1023,7 @@ export interface LayoutStyle {
     statusLiveUnreadStyle: IndicatorStyle;
     statusReadStyle: IndicatorStyle;
     statusUnreadStyle: IndicatorStyle;
-    statusIndicatorPosition: 'insideTopLeft' | 'insideTopRight' | 'insideMiddle' | 'insideBottomRight' | 'insideBottomLeft' | 'insideBottomMiddle' | 'insideMiddleLeft' | 'insideMiddleRight' | 'outsideTop' | 'outsideTopLeft' | 'outsideTopRight' | 'outsideBottomLeft' | 'outsideBottomRight' | 'outsideBottom' | 'outsideRight' | 'outsideLeft';
+    statusIndicatorPosition: PositionType;
 }
 export interface LabelStyle {
     visible: boolean;
@@ -1001,7 +1034,7 @@ export interface LabelStyle {
     padding: string;
     font: string;
     fontSize: string;
-    position: 'insideTopLeft' | 'insideTopRight' | 'insideMiddle' | 'insideBottomRight' | 'insideBottomLeft' | 'insideBottomMiddle' | 'insideMiddleLeft' | 'insideMiddleRight' | 'outsideUnder' | 'outsideAbove' | 'outsideRight' | 'outsideLeft';
+    position: PositionType;
 }
 export interface StoryPlayerStyle {
     titleVisible: boolean;
@@ -1032,7 +1065,7 @@ export declare const Colors: {
     readonly TimeColor: "#7F7F7F";
 };
 
-export type ThemeType = 'default' | 'grid-2-columns' | 'grid-3-columns' | 'row-circle' | 'row-rectangle';
+export type ThemeType = 'grid-2-columns' | 'grid-3-columns' | 'row-circle' | 'row-rectangle' | 'row-rectangle-horizontal' | 'grid-2-columns-horizontal' | 'grid-3-columns-horizontal' | 'default';
 export declare class ThemeFactory {
     static create(name?: ThemeType): IWidgetTheme;
 }
@@ -1390,25 +1423,30 @@ export * from './client-platform.type';
 export * from './direction.type';
 export * from './element.type';
 export * from './fetch-priority.type';
+export * from './label.type';
 export * from './order.type';
+export * from './play.type';
 export * from './severity.type';
 export * from './shape.type';
 export * from './size.type';
 export * from './thumbnail.type';
-export * from './play.type';
+
+export type labelType = string | string[] | BlazeWidgetLabel;
 
 export type OrderType = 'Manual' | 'AtoZ' | 'ZtoA' | 'RecentlyUpdatedFirst' | 'RecentlyUpdatedLast' | 'RecentlyCreatedFirst' | 'RecentlyCreatedLast';
 
 export declare const PlayTypeArray: readonly ["Widget", "Share", "SingleStory"];
 export type PlayType = typeof PlayTypeArray[number];
 
+export type PositionType = 'insideTopLeft' | 'insideTopRight' | 'insideMiddle' | 'insideBottomRight' | 'insideBottomLeft' | 'insideBottomMiddle' | 'insideMiddleLeft' | 'insideMiddleRight' | 'outsideUnder' | 'outsideAbove' | 'outsideTop' | 'outsideTopLeft' | 'outsideTopRight' | 'outsideBottomLeft' | 'outsideBottomRight' | 'outsideBottom' | 'outsideRight' | 'outsideLeft';
+
 export type SeverityType = 'error' | 'warning' | 'info' | 'success';
 
 export type ShapeType = 'rectangle' | 'custom' | 'circle';
 
 export type SizeType = 'small' | 'medium' | 'large';
 
-export type ThumbnailType = 'SquareIcon' | 'VerticalTwoByThree';
+export type ThumbnailType = 'SquareIcon' | 'VerticalTwoByThree' | 'MainThumbnail';
 
 interface ChipSizeOptions {
     statusLiveStyle: IndicatorStyle;
@@ -1485,8 +1523,8 @@ export * from './widget-story-video';
 export interface BlazeWidgetItemOptions {
     theme: IWidgetTheme;
     story: IStory;
-    thumbnailType: string;
 }
+export type itemStateType = 'loading' | 'done' | 'failed';
 export declare class BlazeWidgetItem extends BaseWidget {
     protected options: BlazeWidgetItemOptions;
     wrapper: HTMLElement;
@@ -1502,13 +1540,15 @@ export declare class BlazeWidgetItem extends BaseWidget {
     onClick: (() => void) | undefined;
     chip: HTMLElement;
     newChip: HTMLElement | undefined;
-    state: 'loading' | 'done' | 'failed';
+    state: itemStateType;
     isLive: boolean | undefined;
+    blazeSkeletonThumbnail: BlazeSkeleton;
+    blazeSkeletonLabel: BlazeSkeleton;
     statusIndicatorSettings: IndicatorStyle;
     constructor(options: BlazeWidgetItemOptions);
     setTheme(theme: IWidgetTheme): void;
     setLive(): void;
-    setData(data: IStory | IMoment): void;
+    setData(data: IStory): void;
     analyticsCalls: any;
     event(action: WidgetAction, data: Partial<WidgetEvent>, label?: string | undefined): void;
     get chipDimenssions(): {
@@ -1547,6 +1587,7 @@ export declare class BlazeWidgetLayout extends BlazeWidgetScrollable implements
     reloadTimeout: NodeJS.Timeout | undefined;
     analyticsStack: Record<WidgetAction, boolean>;
     intersectionObserver: IntersectionObserver;
+    isVisibleEventSent: boolean;
     onResizeEvent: (this: Window, ev: UIEvent) => void;
     constructor();
     connectedCallback(): void;
@@ -1557,12 +1598,11 @@ export declare class BlazeWidgetLayout extends BlazeWidgetScrollable implements
     onResize(): void;
     handlePopState(_event: Event): void;
     addDelegateListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;
-    setLabels(labels: string[]): void;
+    setLabels(labels: labelType): void;
     getTheme(): IWidgetTheme;
-    setTheme(theme: IWidgetTheme): void;
-    reload(labels?: string[]): void;
-    setLabel(label: string | BlazeWidgetLabel): void;
-    set delegates(delegates: Record<Delegation, EventListenerOrEventListenerObject>);
+    setTheme(theme: IWidgetTheme | string): void;
+    reload(): void;
+    setDelegations(delegates: Record<Delegation, EventListenerOrEventListenerObject>): void;
     setMaxSize(maxSize: number): void;
     setMaxItemsSize(maxItemsSize: number): void;
     handleIntersection(entries: IntersectionObserverEntry[]): void;
@@ -1574,7 +1614,6 @@ export declare class BlazeWidgetLayout extends BlazeWidgetScrollable implements
     private get theme();
     render(): void;
     maxSize(): number;
-    loadMoments(): Promise<void>;
     event(action: WidgetAction, data: Partial<WidgetEvent>, label?: string | undefined): void;
     updateWidgetsData(): void;
     reorderWidgets(): void;
@@ -1749,11 +1788,16 @@ export declare class BlazeWidgetSDK extends BaseWidget {
     private injectFontResource;
 }
 
+export interface IShareButton {
+    type: ShareButtonType;
+    onClick: (e: MouseEvent) => void;
+}
 export declare class BlazeWidgetShareModal extends BaseWidget {
     shareContainer: BlazeDiv;
     shareDrawer: BlazeDrawer;
     onOpen: (() => void) | undefined;
     onClose: (() => void) | undefined;
+    onClick?: ((button: BlazeShareButton) => void);
     constructor();
     connectedCallback(): Promise<void>;
     disconnectedCallback(): void;
@@ -1866,6 +1910,7 @@ export declare class BlazeWidgetStoryPlayer extends BaseWidget {
     overlay: any;
     constructor();
     connectedCallback(): void;
+    onFocus(): void;
     disconnectedCallback(): void;
     attributeChangedCallback(name: string, oldValue: string, newValue: string): void;
     private setupHammer;
@@ -2004,6 +2049,8 @@ export declare class BlazeWidgetStory extends HTMLElement {
     data: IStory;
     shareModal: BlazeWidgetShareModal | undefined;
     isStoryLoadCompletedTriggered: boolean;
+    isStoryActive: boolean;
+    isResumeOnFocusExecuted: boolean;
     pageIndex: number;
     container: HTMLElement;
     progress: HTMLElement;
@@ -2031,7 +2078,7 @@ export declare class BlazeWidgetStory extends HTMLElement {
     navigationType: 'Automatic' | 'Manual' | undefined;
     navigationDirection: 'Forwards' | 'Backwards' | undefined;
     referring: ReferringEventInfo | undefined;
-    resumeAfterUnfocus: boolean;
+    resumeAfterfocus: boolean;
     totalPlayStopwatch: Stopwatch;
     playerStyle: StoryPlayerStyle;
     listeners: EventsListener;
@@ -2039,6 +2086,7 @@ export declare class BlazeWidgetStory extends HTMLElement {
     shadow: HTMLDivElement;
     isNavigationPending: boolean;
     navigationTimeout: NodeJS.Timeout | null;
+    lastPageIndexToResume: number;
     constructor();
     onShareClick(): Promise<void>;
     updateChip(): void;
@@ -2068,6 +2116,7 @@ export declare class BlazeWidgetStory extends HTMLElement {
     event(action: StoryAction, data: Partial<StoryEvent>, label?: string | undefined): void;
     connectedCallback(): void;
     onShareModalClose(): void;
+    onShareModalButtonClick(shareButton: BlazeShareButton): Promise<void>;
     onVisibilityChange(): void;
     onBlur(): void;
     onFocus(): void;