@wscsports/blaze-web-sdk 0.1.4 → 0.1.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wscsports/blaze-web-sdk",
-  "version": "0.1.4",
+  "version": "0.1.5",
   "main": "publish/index",
   "types": "publish/index",
   "files": [

package/publish/index.d.ts

@@ -1,8 +1,3 @@
-export declare class BlazeSDK {
-    static isMuted: boolean;
-    static isPlaying: boolean;
-}
-
 export declare function Initialize(apiKey: string, options?: Omit<IBlazeSDKOptions, "apiKey">): Promise<void>;
 export declare function WidgetRowView(containerId: string, options: IWidgetViewOptions): IWidgetView;
 export declare function WidgetGridView(containerId: string, options: IWidgetViewOptions): IWidgetView;
@@ -39,10 +34,18 @@ export declare class API {
 
 export * from './api';
 
-export declare abstract class BaseHTMLElement extends HTMLElement {
+export declare abstract class BaseDrawableElement extends BaseWidget implements IDrawable {
+    protected abstract connectedCallback(): void;
+    protected abstract disconnectedCallback(): void;
+    protected abstract attributeChangedCallback(name: string, oldValue?: string, newValue?: string): void;
+    abstract render(): void;
+}
+
+export declare abstract class BaseWidget extends HTMLElement {
     protected _animationDuration: number;
     constructor();
     getAttribute<T = boolean | string | number>(qualifiedName: string): T;
+    setStyle<T extends keyof CSSStyleDeclaration>(styles: Record<T, string | null>): void;
 }
 
 export declare class EventsListener {
@@ -56,11 +59,12 @@ export declare class EventsListener {
     removeAll(): void;
 }
 
-export * from './base-html-element.class';
+export * from './base-drawable-element.class';
+export * from './base-element.class';
+export * from './events-listener';
 export * from './long-press.handler';
 export * from './singleton.class';
 export * from './throttle';
-export * from './events-listener';
 
 export interface ILongPressHandlerOptions {
     onStart: () => void;
@@ -94,7 +98,7 @@ export interface ResizeEvent extends Event {
 }
 export declare function throttle<T extends Event>(func: EventHandler<T>, delay: number): (event: T) => void;
 
-export declare class BlazeAlert extends BaseHTMLElement {
+export declare class BlazeAlert extends BaseWidget {
     titleContainer: HTMLDivElement;
     textContainer: HTMLDivElement;
     constructor();
@@ -105,30 +109,71 @@ export declare class BlazeAlert extends BaseHTMLElement {
     setAttribute(qualifiedName: 'alert-title' | 'alert-text', value: string): void;
 }
 
-export declare class BlazeChip extends BaseHTMLElement {
+export declare class BlazeChip extends BaseWidget {
+    constructor();
+    connectedCallback(): void;
+}
+
+export declare class BlazeDiv extends BaseWidget {
+    constructor();
+}
+
+export interface IDrawerOptions {
+    anchor: 'top' | 'right' | 'bottom' | 'left';
+    component: BaseWidget;
+    height?: string;
+    width?: string;
+}
+type DrawerAttributes = 'open';
+export declare class BlazeDrawer extends BaseWidget {
+    backdropContainer: BlazeDiv;
+    drawerContainer: BlazeDiv;
+    isOpen: boolean;
+    drawerOptions: IDrawerOptions | undefined;
+    drawerComponent: BaseWidget | undefined;
+    onOpen: (() => void) | undefined;
+    onClose: (() => void) | undefined;
     constructor();
+    private get drawerContainerHeight();
+    static get observedAttributes(): string[];
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    attributeChangedCallback(name: DrawerAttributes, oldValue: string, newValue: string): void;
+    private onOpenChange;
+    setAttribute(qualifiedName: DrawerAttributes, value: string): void;
+    private onBackdropClick;
+    init(options: IDrawerOptions): void;
+    private buildBackdrop;
+    private buildModal;
+    open(): Promise<void>;
+    close(): Promise<void>;
+    private animateDrawer;
 }
 
 export interface BlazeImageOptions {
     fetchPriority: FetchPriorityType;
     src: string;
 }
-export declare class BlazeImage extends BaseHTMLElement {
+export declare class BlazeImage extends BaseWidget {
     constructor();
+    protected render(): void;
 }
 
 export * from './alert';
+export * from './buttons';
 export * from './chip';
+export * from './drawer';
 export * from './image';
 export * from './loader';
 export * from './toast';
+export * from './typography';
 
 export declare class BlazeLoader extends HTMLElement {
     constructor();
     connectedCallback(): void;
 }
 
-export declare class BlazeToast extends BaseHTMLElement {
+export declare class BlazeToast extends BaseWidget {
     constructor();
     static get observedAttributes(): string[];
     connectedCallback(): void;
@@ -140,6 +185,43 @@ export declare class BlazeToast extends BaseHTMLElement {
         title?: string;
         text: string;
     }): void;
+    protected render(): void;
+}
+
+type AttributeType = 'size' | 'text';
+export declare class BlazeTypography extends BaseWidget {
+    constructor();
+    static get observedAttributes(): string[];
+    get size(): SizeType;
+    set size(value: SizeType);
+    get text(): string;
+    set text(value: string);
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    attributeChangedCallback(name: AttributeType, oldValue: string, newValue: string): void;
+    onSizeChange(size: SizeType): void;
+    onTextChange(text: string): void;
+    get fontSize(): ".8rem" | "1rem" | ".5rem";
+}
+
+export * from './share-button';
+
+export type ShareButtonType = 'copy-link' | 'linked-in';
+type AttributeType = 'size' | 'button-type';
+export declare class BlazeShareButton extends BaseWidget {
+    onClick: ((e: MouseEvent) => void) | undefined;
+    constructor();
+    static get observedAttributes(): string[];
+    get size(): SizeType;
+    set size(value: SizeType);
+    set type(value: ShareButtonType);
+    get fontSize(): ".8rem" | "1rem" | ".5rem";
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    attributeChangedCallback(name: AttributeType, oldValue: string, newValue: string): void;
+    onSizeChange(size?: SizeType): void;
+    onTypeChange(type: ShareButtonType): void;
+    createButton(text: string, svgIcon: string): void;
 }
 
 export declare enum StoryAction {
@@ -165,6 +247,8 @@ type ExposedFields = {
 };
 export declare const exposedFieldsByAction: ExposedFields;
 
+export * from './analytics.constants';
+
 export declare class Database implements IDatabase {
     private readonly options;
     constructor(options: IDatabaseOptions);
@@ -277,10 +361,62 @@ export declare enum Delegation {
 export * from './error-codes.enum';
 export * from './event.enum';
 
-export declare abstract class ElementsFactory {
-    static create<T extends BaseHTMLElement>(e: ElementType): T;
-    static define(name: string, constructor: CustomElementConstructor, options?: ElementDefinitionOptions | undefined): void;
-    static whenDefined(name: string): Promise<CustomElementConstructor>;
+export interface WidgetsTagNameMap {
+    'blaze-sdk': BlazeWidgetSDK;
+    'blaze-widget-modal': BlazeWidgetModal;
+    'blaze-widget-item': BlazeWidgetItem;
+    'blaze-widget-layout': BlazeWidgetLayout;
+    'blaze-widget-story': BlazeWidgetStory;
+    'blaze-widget-story-preview': BlazeWidgetStoryPreview;
+    'blaze-widget-story-player': BlazeWidgetStoryPlayer;
+    'blaze-widget-story-modal': BlazeWidgetStoryModal;
+    'blaze-widget-moment': BlazeWidgetMoment;
+    'blaze-widget-moment-preview': BlazeWidgetMomentPreview;
+    'blaze-widget-moment-player': BlazeWidgetMomentPlayer;
+    'blaze-widget-moment-modal': BlazeWidgetMomentModal;
+    'blaze-widget-share-modal': BlazeWidgetShareModal;
+    'blaze-widget-image': BlazeWidgetStoryImage;
+    'blaze-widget-video': BlazeWidgetStoryVideo;
+    'blaze-loader': BlazeLoader;
+    'blaze-chip': BlazeChip;
+    'blaze-image': BlazeImage;
+    'blaze-toast': BlazeToast;
+    'blaze-alert': BlazeAlert;
+    'blaze-modal': BlazeDrawer;
+    'blaze-div': BlazeDiv;
+    'blaze-share-button': BlazeShareButton;
+    'blaze-typography': BlazeTypography;
+}
+interface WidgetsTagNameOptionsMap {
+    'blaze-sdk': {};
+    'blaze-widget-modal': {};
+    'blaze-widget-item': {};
+    'blaze-widget-layout': {};
+    'blaze-widget-story': {};
+    'blaze-widget-story-preview': {};
+    'blaze-widget-story-player': {};
+    'blaze-widget-story-modal': {};
+    'blaze-widget-moment': {};
+    'blaze-widget-moment-preview': {};
+    'blaze-widget-moment-player': {};
+    'blaze-widget-moment-modal': {};
+    'blaze-widget-share-modal': {};
+    'blaze-widget-image': {};
+    'blaze-widget-video': {};
+    'blaze-loader': {};
+    'blaze-chip': {};
+    'blaze-image': {};
+    'blaze-toast': {};
+    'blaze-alert': {};
+    'blaze-modal': {};
+    'blaze-div': {};
+    'blaze-share-button': {};
+    'blaze-typography': {};
+}
+export declare abstract class WidgetsFactory {
+    static create<T extends keyof WidgetsTagNameMap>(name: T, options?: ElementCreationOptions & WidgetsTagNameOptionsMap[T]): WidgetsTagNameMap[T];
+    static define<T extends keyof WidgetsTagNameMap>(name: T, constructor: CustomElementConstructor, options?: ElementDefinitionOptions): void;
+    static whenDefined<T extends keyof WidgetsTagNameMap>(name: T): Promise<CustomElementConstructor>;
 }
 
 export * from './elements.factory';
@@ -303,6 +439,8 @@ export declare const replaySvg = "data:image/svg+xml;charset=utf-8,<svg xmlns=\"
 export declare const replayWhiteSvg = "data:image/svg+xml;charset=utf-8,<svg xmlns=\"http://www.w3.org/2000/svg\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"0 0 24 24\" data-testid=\"ReplayIcon\" aria-label=\"fontSize large\"><path fill=\"white\" d=\"M12 5V1L7 6l5 5V7c3.31 0 6 2.69 6 6s-2.69 6-6 6-6-2.69-6-6H4c0 4.42 3.58 8 8 8s8-3.58 8-8-3.58-8-8-8z\"></path></svg>";
 export declare const likeSvg = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAVSSURBVHgBzVltTFtVGH5PvzbaLq6fTOjccmlaCKwRN/zAGCVb2NABJsuSQZaYuO3P4o/FxUEYaAS3jKiBBEUNmM0Zrcbwh83InIqb8wcOJpYSoKHFBCEW2kImbek67vGcknbQ9ePe0sCeX/fe8957nr7nvM9537cIUkRO3p4CxAKzhKAAIWAQIBlGIKNjCIMXA+vEGM0ggAkyPmQf6bdCCkB8jDMzTTK5UlJOXqsMk+E8EQYnBrCiewGz3W6Z4fweFyNKbIty8xEW4UpIBzD8zJVoUoL6/KJyzEI1X48lnZh4FNgls33szi+J7ISJBvV5Tx9jAarJz5BAuoFADgLBs1vVOum8a+rP+GYxENprCkkdFqBdsB7A4PB6AmedTos3ekgQy16m3HRu3chREBWQKzbXxRp6aInpspL99hysNxBkxlruVQQZQ9FeLITXYINA9DJ3qyp7Yd41bQs/iyxxTk6xFoSoCjYYhGQ1jYHwvSh8gSXBKuJmLZeP7N9XojpQWrJti1wu/m9hIdjzY++/137qdfO1ic0QZFKiuUSEPl++hWXv4U3BTuCAzvYPnyx58YXtPp//vs/vvyfNyJBIpRmi3hu3Jmvqm0LH2cctFwqL9hRui7a5crXHcarm7WEu83jdgSoa1SEPhrzHAa3NjfmU3JXvexxNF1psbs9ckD5vaqgxVh85ZPiioy2D3uflGtSfdFwavnjZPBltQ6+5kJQpJBXEi+ZQkCg0uhOQ5KQw6JmMxndqd3/9bddYTf17o37/Ihse6735uzvg9/tfrXiZ0ahVUkrug9Z2R7QNs3OHuPzgfsZmG3ePO/72Q0IgZs413SWkWQkhVwFJ0FB72mg05CjO1DX+5Z5b9spKDAxa7mpUSjQ0POI619w6Husb/QOD8ydeP6pfYpeC1673ziackJxeSnXWkAhj2MUlZZDLpWKX2+Oz2R2+eDYNTc1jib7h8niC9Bs0cIADWJLOCWguB+sIGjCcjYVQQHQQabjYjtrsd9UqpfQAkQ9IEXQf02juuz2YXG4glPEwAiLVmVyML5GIpLJx5vQb+SqlQgQ8Qd/5tO39otlZt//GzVucCBKKMgHZg5zyPLp/PmrvsO54Yvtj333VWcyXJNVG+m5L22fWRPt4NT+QCRWabM7HG41UKievlJXuLN33kvbqD9enVkpJPFBxf774mWwqPx0Xv5wEHhAqtdlUYjhvXL4kwycP1c948hMXpPgSKtS6MuCZznMl+W79W8bKg2UMJdfQ2GwDvkDwj1CpeZzoINIBTyQjSckdrTpsSJkcUAfiMaFKm6XAgJ6CFBCPZDrIUZC6+zeyxFli4sG9kCKiSRaaCuSHD1XqaUJBz2xYCzD+RkgO5Bm+gZKIpNGgV/xKUq+Tp2qHYA0gJ5zTMdLfuZzNaLMIubUVSWGSQYJjJ98chLUCQx9xXl8oTTCZTLKF+5vM8AgBiQLH7RbLTKgmsVgsXgFG3fCogLRGKDl6GSmapOJFM1l3L2ww6N5D4kBkNSNlp9PpDKo0WcFUJSddQLDUabcORlp1q+piz+z0mEqto30+I2wASD+xm0Ru18pnD3UWPK6pO0qNroBcckrD0gjHxMjt89EPY/dmRIvnSXg7YP1g9YoCZ2MNJKxGSJ/mOGlaJi2o1gK6rBMjf8StyRP2B+lyk3xxhpaA5Da9DUxE+9j4MlnWhPrLqQWcYyKdh2CoNZLymb0S1Gs+ImtOiyWprPFqoj8gSo9FzKmPE5ko5DHU7RUudnMhlhLBlWBydxOSiPwFIWBI+aWljadwfRMiwyLv8l8Q7BDL4gnH6EBKycP/05ePdBFq824AAAAASUVORK5CYII=";
 export declare const newShareSvg = "data:image/png;base64,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";
+export declare const IconLink = "data:image/svg+xml;charset=utf-8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"10\" viewBox=\"0 0 20 10\" fill=\"none\"><path d=\"M9 10H5C3.61667 10 2.4375 9.5125 1.4625 8.5375C0.4875 7.5625 0 6.38333 0 5C0 3.61667 0.4875 2.4375 1.4625 1.4625C2.4375 0.4875 3.61667 0 5 0H9V2H5C4.16667 2 3.45833 2.29167 2.875 2.875C2.29167 3.45833 2 4.16667 2 5C2 5.83333 2.29167 6.54167 2.875 7.125C3.45833 7.70833 4.16667 8 5 8H9V10ZM6 6V4H14V6H6ZM11 10V8H15C15.8333 8 16.5417 7.70833 17.125 7.125C17.7083 6.54167 18 5.83333 18 5C18 4.16667 17.7083 3.45833 17.125 2.875C16.5417 2.29167 15.8333 2 15 2H11V0H15C16.3833 0 17.5625 0.4875 18.5375 1.4625C19.5125 2.4375 20 3.61667 20 5C20 6.38333 19.5125 7.5625 18.5375 8.5375C17.5625 9.5125 16.3833 10 15 10H11Z\" fill=\"white\" fill-opacity=\"0.92\"/></svg>";
+export declare const IconGlobe = "data:image/svg+xml;charset=utf-8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"><path d=\"M10 20C8.61667 20 7.31667 19.7375 6.1 19.2125C4.88333 18.6875 3.825 17.975 2.925 17.075C2.025 16.175 1.3125 15.1167 0.7875 13.9C0.2625 12.6833 0 11.3833 0 10C0 8.61667 0.2625 7.31667 0.7875 6.1C1.3125 4.88333 2.025 3.825 2.925 2.925C3.825 2.025 4.88333 1.3125 6.1 0.7875C7.31667 0.2625 8.61667 0 10 0C11.3833 0 12.6833 0.2625 13.9 0.7875C15.1167 1.3125 16.175 2.025 17.075 2.925C17.975 3.825 18.6875 4.88333 19.2125 6.1C19.7375 7.31667 20 8.61667 20 10C20 11.3833 19.7375 12.6833 19.2125 13.9C18.6875 15.1167 17.975 16.175 17.075 17.075C16.175 17.975 15.1167 18.6875 13.9 19.2125C12.6833 19.7375 11.3833 20 10 20ZM9 17.95V16C8.45 16 7.97917 15.8042 7.5875 15.4125C7.19583 15.0208 7 14.55 7 14V13L2.2 8.2C2.15 8.5 2.10417 8.8 2.0625 9.1C2.02083 9.4 2 9.7 2 10C2 12.0167 2.6625 13.7833 3.9875 15.3C5.3125 16.8167 6.98333 17.7 9 17.95ZM15.9 15.4C16.2333 15.0333 16.5333 14.6375 16.8 14.2125C17.0667 13.7875 17.2875 13.3458 17.4625 12.8875C17.6375 12.4292 17.7708 11.9583 17.8625 11.475C17.9542 10.9917 18 10.5 18 10C18 8.36667 17.5458 6.875 16.6375 5.525C15.7292 4.175 14.5167 3.2 13 2.6V3C13 3.55 12.8042 4.02083 12.4125 4.4125C12.0208 4.80417 11.55 5 11 5H9V7C9 7.28333 8.90417 7.52083 8.7125 7.7125C8.52083 7.90417 8.28333 8 8 8H6V10H12C12.2833 10 12.5208 10.0958 12.7125 10.2875C12.9042 10.4792 13 10.7167 13 11V14H14C14.4333 14 14.825 14.1292 15.175 14.3875C15.525 14.6458 15.7667 14.9833 15.9 15.4Z\" fill=\"%23131313\"/></svg>";
 
 export type EnvironmentType = 'prod' | 'uat';
 export interface IBlazeSDKOptions {
@@ -328,12 +466,17 @@ export interface IDatabaseOptions {
     version: number;
 }
 
+export interface IDrawable {
+    render: () => void;
+}
+
 export * from './blaze-sdk.interface';
 export * from './database.interface';
 export * from './response.interface';
 export * from './service.interface';
 export * from './widget-options.interface';
 export * from './widget-view.interface';
+export * from './drawable.interface';
 
 export default interface IntersectionObservable {
     intersectionObserver: IntersectionObserver;
@@ -353,6 +496,7 @@ export type ContentType = 'story';
 export interface IWidgetViewOptions {
     labels: string[];
     orderType: OrderType;
+    storyIds?: string[];
     maxItemsCount?: number;
     maxDisplayItemsCount?: number;
     contentType: ContentType;
@@ -547,6 +691,11 @@ declare const ApiServiceClass_base: {
 declare abstract class ApiServiceClass extends ApiServiceClass_base implements IService {
     api: API;
     init(): Promise<void>;
+    getStoriesByIds(storyIds: string[], orderType?: OrderType): Promise<IResponse<{
+        assetsExpiryTime: string;
+        totalItems: number;
+        result: IStory[];
+    }>>;
     getStories(labels: string, orderType: OrderType, maxItemsSize?: number): Promise<IResponse<{
         assetsExpiryTime: string;
         totalItems: number;
@@ -687,6 +836,7 @@ export * from './event.service';
 export * from './startup.service';
 export * from './user.service';
 export * from './video-cache.service';
+export * from './video-player.service';
 export * from './widgets.service';
 
 declare const StartupServiceClass_base: {
@@ -735,6 +885,22 @@ declare abstract class VideoCacheServiceClass extends VideoCacheServiceClass_bas
 }
 export declare const VideoCacheService: VideoCacheServiceClass;
 
+declare const VideoPlayerServiceClass_base: {
+    new (): {};
+    _instance: VideoPlayerServiceClass;
+    getInstance(): VideoPlayerServiceClass;
+};
+declare abstract class VideoPlayerServiceClass extends VideoPlayerServiceClass_base implements IService {
+    private _isMuted;
+    private _isPlaying;
+    init(): Promise<void>;
+    get isMuted(): boolean;
+    set isMuted(value: boolean);
+    get isPlaying(): boolean;
+    set isPlaying(value: boolean);
+}
+export declare const VideoPlayerService: VideoPlayerServiceClass;
+
 declare const WidgetsServiceClass_base: {
     new (): {};
     _instance: WidgetsServiceClass;
@@ -1193,6 +1359,7 @@ export * from './fetch-priority.type';
 export * from './order.type';
 export * from './severity.type';
 export * from './shape.type';
+export * from './size.type';
 export * from './thumbnail.type';
 
 export type OrderType = 'Manual' | 'AtoZ' | 'ZtoA' | 'RecentlyUpdatedFirst' | 'RecentlyUpdatedLast' | 'RecentlyCreatedFirst' | 'RecentlyCreatedLast';
@@ -1201,6 +1368,8 @@ export type SeverityType = 'error' | 'warning' | 'info' | 'success';
 
 export type ShapeType = 'rectangle' | 'custom' | 'circle';
 
+export type SizeType = 'small' | 'medium' | 'large';
+
 export type ThumbnailType = 'SquareIcon' | 'VerticalTwoByThree';
 
 interface ChipSizeOptions {
@@ -1253,29 +1422,30 @@ export declare class Stopwatch {
     reset(): void;
 }
 
-export { BlazeWidgetLabel } from './widget-label';
-export { BlazeWidgetItem } from './widget-item';
-export { BlazeWidgetLayout } from './widget-layout';
-export { BlazeWidgetModal } from './widget-modal';
-export { BlazeWidgetMoment } from './widget-moment';
-export { BlazeWidgetMomentModal } from './widget-moment-modal';
-export { BlazeWidgetMomentPlayer } from './widget-moment-player';
-export { BlazeWidgetMomentPreview } from './widget-moment-preview';
-export { BlazeWidgetScrollable } from './widget-scrollable';
-export { BlazeWidgetSdk } from './widget-sdk';
-export { BlazeWidgetStory } from './widget-story';
-export { BlazeWidgetStoryImage } from './widget-story-image';
-export { BlazeWidgetStoryModal } from './widget-story-modal';
-export { BlazeWidgetStoryPlayer } from './widget-story-player';
-export { BlazeWidgetStoryPreview } from './widget-story-preview';
-export { BlazeWidgetStoryVideo } from './widget-story-video';
+export * from './widget-item';
+export * from './widget-label';
+export * from './widget-layout';
+export * from './widget-modal';
+export * from './widget-moment';
+export * from './widget-moment-modal';
+export * from './widget-moment-player';
+export * from './widget-moment-preview';
+export * from './widget-scrollable';
+export * from './widget-sdk';
+export * from './widget-share-modal';
+export * from './widget-story';
+export * from './widget-story-image';
+export * from './widget-story-modal';
+export * from './widget-story-player';
+export * from './widget-story-preview';
+export * from './widget-story-video';
 
 export interface BlazeWidgetItemOptions {
     theme: IWidgetTheme;
     story: IStory;
     thumbnailType: string;
 }
-export declare class BlazeWidgetItem extends BaseHTMLElement {
+export declare class BlazeWidgetItem extends BaseWidget {
     protected options: BlazeWidgetItemOptions;
     wrapper: HTMLElement;
     container: HTMLElement;
@@ -1323,7 +1493,7 @@ export declare class BlazeWidgetLabel {
 }
 
 /// <reference types="node" />
-export declare class BlazeWidgetLayout extends BaseHTMLElement implements Observable, IWidgetView {
+export declare class BlazeWidgetLayout extends BlazeWidgetScrollable implements Observable, IWidgetView {
     modal: BlazeWidgetStoryModal | undefined;
     modalMoments: BlazeWidgetMomentModal | undefined;
     stories: IStory[];
@@ -1336,8 +1506,6 @@ export declare class BlazeWidgetLayout extends BaseHTMLElement implements Observ
     analyticsStack: Record<WidgetAction, boolean>;
     intersectionObserver: IntersectionObserver;
     onResizeEvent: () => () => void;
-    buttonsState: never[];
-    totalMovement: number;
     constructor();
     addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;
     setLabels(labels: string[]): void;
@@ -1346,9 +1514,8 @@ export declare class BlazeWidgetLayout extends BaseHTMLElement implements Observ
     reload(labels?: string[]): void;
     connectedCallback(): void;
     disconnectedCallback(): void;
-    onClick(event: MouseEvent): void;
-    onMouseMove(event: MouseEvent): void;
-    attributeChangedCallback(name: string, oldValue?: string, newValue?: string): void;
+    set storyIds(value: string);
+    attributeChangedCallback(name: string, oldValue: string, newValue: string): void;
     setLabel(label: string | BlazeWidgetLabel): void;
     setMaxSize(maxSize: number): void;
     setMaxItemsSize(maxItemsSize: number): void;
@@ -1505,13 +1672,14 @@ export declare class BlazeWidgetMoment extends HTMLElement {
     render(): void;
 }
 
-export declare class BlazeWidgetScrollable extends BaseHTMLElement {
+export declare class BlazeWidgetScrollable extends BaseWidget {
     buttonsState: never[];
     mouseMoveEvent: ((e: MouseEvent) => void | undefined) | undefined;
     touchMoveEvent: ((e: TouchEvent) => boolean | undefined) | undefined;
     clickEvent: ((e: MouseEvent) => void | undefined) | undefined;
     totalMovement: number;
     constructor();
+    render(): void;
     connectedCallback(): void;
     onClick(event: MouseEvent): void;
     onMouseMove(event: MouseEvent): void;
@@ -1520,18 +1688,38 @@ export declare class BlazeWidgetScrollable extends BaseHTMLElement {
     disconnectedCallback(): void;
 }
 
-export declare class BlazeWidgetSdk extends BaseHTMLElement {
+export declare class BlazeWidgetSDK extends BaseWidget {
     static isMuted: boolean;
     static isPlaying: boolean;
+    modalStoryIds: BlazeWidgetStoryModal | undefined;
     static get observedAttributes(): string[];
     constructor();
     connectedCallback(): Promise<void>;
+    loadStoriesByHash(storyIds: string): Promise<void>;
     attributeChangedCallback(name: string, oldValue: string, newValue: string): Promise<void>;
     private getConfigAttributes;
     private initialize;
     private injectFontResource;
 }
 
+export declare class BlazeWidgetShareModal extends BaseWidget {
+    shareContainer: BlazeDiv;
+    shareDrawer: BlazeDrawer;
+    onOpen: (() => void) | undefined;
+    onClose: (() => void) | undefined;
+    constructor();
+    connectedCallback(): Promise<void>;
+    disconnectedCallback(): void;
+    attributeChangedCallback(name: string, oldValue: string, newValue: string): void;
+    onDarwerOpen(): void;
+    onDrawerClose(): void;
+    open(): void;
+    close(): void;
+    renderButtons(): void;
+    renderTitle(): void;
+    render(): void;
+}
+
 export declare class BlazeWidgetStoryBase extends HTMLElement {
     data: IPage | undefined;
     constructor();
@@ -1610,7 +1798,7 @@ export declare class BlazeWidgetStoryModal extends BlazeWidgetModal {
     render(): void;
 }
 
-export declare class BlazeWidgetStoryPlayer extends BaseHTMLElement {
+export declare class BlazeWidgetStoryPlayer extends BaseWidget {
     data: any;
     hammer: HammerManager;
     isNavigationBlocked: boolean;
@@ -1639,6 +1827,7 @@ export declare class BlazeWidgetStoryPlayer extends BaseHTMLElement {
     private handlePanStart;
     private handlePanMove;
     private handlePanEnd;
+    private updateLocationStoryHash;
     private reverseAnimation;
     private cleanupHammer;
     renderBackground(): void;
@@ -1764,6 +1953,7 @@ export declare class BlazeWidgetStoryVideo extends BlazeWidgetStoryBase {
 export declare class BlazeWidgetStory extends HTMLElement {
     pages: BlazeWidgetStoryBase[];
     data: IStory;
+    shareModal: BlazeWidgetShareModal | undefined;
     pageIndex: number;
     container: HTMLElement;
     progress: HTMLElement;
@@ -1796,6 +1986,7 @@ export declare class BlazeWidgetStory extends HTMLElement {
     playerStyle: StoryPlayerStyle;
     listeners: EventsListener;
     constructor();
+    onShareClick(): Promise<void>;
     updateChip(): void;
     setTheme(storyPlayerStyle: StoryPlayerStyle): void;
     updatePlayerButtonIcons(): void;
@@ -1820,6 +2011,7 @@ export declare class BlazeWidgetStory extends HTMLElement {
     play(): void;
     event(action: StoryAction, data: Partial<StoryEvent>, label?: string | undefined): void;
     connectedCallback(): void;
+    onShareModalClose(): void;
     onVisibilityChange(): void;
     onBlur(): void;
     onFocus(): void;