@seatmap.pro/renderer 0.0.6 → 1.47.0

package/lib/index.d.ts

@@ -122,7 +122,8 @@ interface IPlainSeatsDTO {
  * Contains the core properties of a seat as received from the backend.
  * @hidden
  */
-type ISeatDTO = IBaseSeat;
+interface ISeatDTO extends IBaseSeat {
+}
 /**
  * Interface representing a row in the venue.
  * @hidden
@@ -139,13 +140,14 @@ interface IRowDTO {
  * Contains the core properties of a sector as received from the backend.
  * @hidden
  */
-type ISectorDTO = IBaseSector;
+interface ISectorDTO extends IBaseSector {
+}
 /**
  * Interface representing the SVG background data transfer object from the API.
  * @hidden
  */
 interface ISVGBackgroundDTO {
-    svg: string;
+    svg?: Nullable<string>;
     viewBox: {
         x: number;
         y: number;
@@ -154,6 +156,7 @@ interface ISVGBackgroundDTO {
     };
     svgLink?: string;
     images?: IPngBackgroundDTO;
+    outlineSvg?: Nullable<string>;
 }
 /**
  * Interface representing the configuration data transfer object from the API.
@@ -253,6 +256,7 @@ interface IPngBackgroundDTO {
 interface IBookingApiClientSettings {
     baseUrl: string;
     publicKey: string;
+    debug?: boolean;
 }
 /**
  * Metrics for API requests.
@@ -305,7 +309,7 @@ declare class BookingApiClient {
      * Makes request to booking API
      * @param url Relative API endpoint URL, e.g. 'event/prices/?id=XXX'
      */
-    requestPlain<T extends RequestMetrics>(url: string): Promise<any>;
+    requestPlain<T extends RequestMetrics>(url: string): Promise<T>;
     private restoreSeats;
     private restoreIds;
 }
@@ -314,15 +318,10 @@ interface IPoint {
     readonly x: number;
     readonly y: number;
 }
-/**
- * @hidden
- */
-declare const addPoints: (a: IPoint, b: IPoint) => IPoint;
-/**
- * @hidden
- */
-declare const subPoints: (a: IPoint, b: IPoint) => IPoint;
 
+type ById$1<T> = {
+    [id: number]: T;
+};
 interface IPrice {
     id: IPriceId;
     name: string;
@@ -334,6 +333,27 @@ interface IColoredPrice extends IPrice {
  * @hidden
  */
 type ColorSequenceSettings = string[][];
+/**
+ * @hidden
+ */
+declare const sortPrices: <T extends IPrice>(prices: T[]) => T[];
+/**
+ * @hidden
+ */
+declare const convertPricesToColored: (prices: IPrice[], colorSettings: ColorSequenceSettings) => IColoredPrice[];
+/**
+ * @hidden
+ */
+declare const convertPricesToColoredById: (prices: IPrice[], colorSettings: ColorSequenceSettings) => ById$1<IColoredPrice>;
+
+interface IVisibilityStatus {
+    selectable: boolean;
+    visible: boolean;
+}
+interface IVisibilityStatuses {
+    outline: IVisibilityStatus;
+    seat: IVisibilityStatus;
+}
 
 /**
  * @hidden
@@ -347,7 +367,12 @@ interface IRendererMachineContext {
         targetType: RendererTargetType;
         id: number;
     };
+    visibility?: IVisibilityStatuses;
 }
+/**
+ * @hidden
+ */
+type RendererMachineReducer<T> = (ctx: IRendererMachineContext, src: T) => IRendererMachineContext;
 /**
  * @hidden
  */
@@ -371,6 +396,78 @@ declare enum RendererSelectMode {
     ADD = "add",
     SUBTRACT = "subtract"
 }
+/**
+ * Source events
+ */
+/**
+ * @hidden
+ */
+declare enum SrcEventType {
+    DRAG_START = "srcDragStart",
+    DRAG_MOVE = "srcDragMove",
+    DRAG_END = "srcDragEnd",
+    CLICK = "srcClick",
+    MOUSE_MOVE = "srcMouseMove"
+}
+/**
+ * @hidden
+ */
+type SrcEvent = IDragStartSrcEvent | IDragMoveSrcEvent | IDragEndSrcEvent | IClickSrcEvent | IMouseMoveSrcEvent;
+/**
+ * @hidden
+ */
+interface IDragSrcEvent<T> {
+    type: T;
+    origin: {
+        x: number;
+        y: number;
+    };
+    delta: {
+        x: number;
+        y: number;
+    };
+    shiftKey?: boolean;
+    altKey?: boolean;
+}
+/**
+ * @hidden
+ */
+interface IDragStartSrcEvent extends IDragSrcEvent<SrcEventType.DRAG_START> {
+}
+/**
+ * @hidden
+ */
+interface IDragMoveSrcEvent extends IDragSrcEvent<SrcEventType.DRAG_MOVE> {
+}
+/**
+ * @hidden
+ */
+interface IDragEndSrcEvent extends IDragSrcEvent<SrcEventType.DRAG_END> {
+}
+/**
+ * @hidden
+ */
+interface IClickSrcEvent {
+    type: SrcEventType.CLICK;
+    target: HTMLElement;
+    point: {
+        x: number;
+        y: number;
+    };
+    section?: ISection;
+    seat?: ISeat;
+    shiftKey?: boolean;
+    altKey?: boolean;
+}
+/**
+ * @hidden
+ */
+interface IMouseMoveSrcEvent {
+    type: SrcEventType.MOUSE_MOVE;
+    target: HTMLElement;
+    section?: ISection;
+    seat?: ISeat;
+}
 /**
  * Output events
  */
@@ -531,8 +628,9 @@ declare class Context {
     scale: number;
     translate: IPoint;
     isEagleView: boolean;
+    visibility: IVisibilityStatuses;
     private _seats;
-    seatsIndex: KDBush<ISeat>;
+    seatsIndex: KDBush;
     seatsById: ById<ISeat>;
     seatsByRowId: {
         [rowId: number]: ISeat[];
@@ -549,7 +647,7 @@ declare class Context {
     private _selectedSeatIds;
     private _selectedGaId?;
     underlay: {
-        svgString: string;
+        svgString?: Nullable<string>;
         viewBox: {
             x: number;
             y: number;
@@ -557,6 +655,7 @@ declare class Context {
             height: number;
         };
         svgUrl?: string;
+        outlineSvg?: Nullable<string>;
         pngBackground?: IPngBackgroundDTO;
     };
     hoveredSeat?: ISeat;
@@ -619,12 +718,19 @@ declare class Context {
     getSeatByOffset: (offset: IPoint) => ISeat | undefined;
 }
 
+type Nullable<T> = T | null | undefined;
+type DeepPartial<T> = T extends object ? {
+    [P in keyof T]?: DeepPartial<T[P]>;
+} : T;
 /**
  * Type for mapping objects by their ID.
  */
 type ById<T> = {
     [id: number]: T;
 };
+type ColorById<T> = {
+    [id: number | string]: T;
+};
 /**
  * Type representing a price identifier, which can be either a number or a string.
  * Used to uniquely identify price points in the system.
@@ -655,6 +761,10 @@ interface ISeat extends IBaseSeat {
      * Special state information for the seat.
      */
     special?: ISpecialState;
+    /**
+     * The state of the seat.
+     */
+    state?: SeatInteractionState;
 }
 /**
  * Interface representing a sector in the venue with extended properties.
@@ -853,7 +963,7 @@ interface ICartGa {
     /**
      * The price per GA ticket.
      */
-    price: number;
+    price?: number;
 }
 /**
  * Interface representing a removed general admission (GA) item from the cart.
@@ -908,11 +1018,34 @@ type ISeatPriceScheme = {
      */
     priceId: IPriceId;
 };
+interface IZoomSettings {
+    presets: number[];
+    maxZoomToFitScale: number;
+    minPinchZoom: number;
+    maxPinchZoom: number;
+}
+interface IRange {
+    from?: number;
+    to?: number;
+}
+interface IVisibleSetting {
+    visible?: IRange;
+    selectable?: IRange;
+}
+interface IVisibilitySettings {
+    seats?: IVisibleSetting;
+    outlines?: IVisibleSetting;
+}
 /**
  * Configuration settings for the renderer.
  * Defines various options that control the behavior and appearance of the renderer.
  */
 interface IRendererSettings {
+    /**
+     * Debug mode for the renderer.
+     * @hidden
+     */
+    debug?: boolean;
     /**
      * Environment setting that determines which API endpoint to use.
      * Can be 'local', 'stage', or 'production' (default).
@@ -948,6 +1081,9 @@ interface IRendererSettings {
     padding?: number;
     /**
      * Minimum zoom level required to enable seat selection.
+     *
+     * @deprecated
+     * Use visibilitySettings instead
      */
     seatSelectionMinZoom?: number;
     /**
@@ -970,6 +1106,14 @@ interface IRendererSettings {
      * If true, disables zoom when clicking on empty space.
      */
     disableZoomToEmptySpace?: boolean;
+    /**
+     * If true, disables cart changed when clicking on sections.
+     */
+    disableCartInteractions?: boolean;
+    /**
+     *
+     */
+    disableOutlinesInHelicopterView?: boolean;
     /**
      * If true, hides all seats from view.
      */
@@ -990,6 +1134,14 @@ interface IRendererSettings {
      * If true, uses WebGL for rendering instead of Canvas.
      */
     switchToWebGL?: boolean;
+    /**
+     * Option to configure zoom settings
+     */
+    zoomSettings?: IZoomSettings;
+    /**
+     * Option to configure visibility settings
+     */
+    visibilitySettings?: IVisibilitySettings;
     /**
      * Rises when the mouse pointer moves above a seat.
      *
@@ -1131,7 +1283,7 @@ interface IRendererSettings {
  * Represents the possible interaction states of a seat.
  * Used to determine how a seat should be rendered based on user interaction.
  */
-type SeatInteractionState = 'default' | 'hovered' | 'selected';
+type SeatInteractionState = 'default' | 'hovered' | 'selected' | 'unavailable' | 'loading' | 'error';
 /**
  * Interface for the event data passed to the onBeforeSeatDraw callback.
  * Contains information about the seat being drawn and its current state.
@@ -1160,8 +1312,10 @@ interface IRendererSeatStyleSettings {
     filtered?: ISeatStyle;
     hovered?: ISeatStyle;
     selected?: ISeatStyle;
+    loading?: ISeatStyle;
+    error?: ISeatStyle;
 }
-interface ISeatStyle {
+interface IBasicSeatStyle {
     size: number;
     color: string;
     seatName?: {
@@ -1180,7 +1334,9 @@ interface ISeatStyle {
         x?: number;
         y?: number;
     };
-    accessible?: ISeatStyle;
+}
+interface ISeatStyle extends IBasicSeatStyle {
+    accessible?: IBasicSeatStyle;
 }
 interface IRendererSvgSectionStylesSetting {
     default?: Pick<ISvgSectionStyle, 'sectionName' | 'stroke' | 'cursor'>;
@@ -1197,6 +1353,7 @@ interface ISvgSectionStyle {
     stroke?: {
         color?: string;
         opacity?: number;
+        width?: string;
     };
     cursor?: string;
 }
@@ -1229,23 +1386,56 @@ interface IOutlineRect {
 declare class OutlineLayer {
     svgElement: SVGSVGElement;
     private outlineShapes;
+    private outlineRect;
     private context;
+    private originalSvg;
+    private backgroundSVG;
+    private hasBackgroundOutline;
+    private underlayBindedPathAttr;
+    private calculatedOutlineRects;
     constructor(context: Context);
     destroy(): void;
     setSectionSelection(id: number | undefined): void;
     highlightGa(id: number | undefined): void;
     clearSectionHighlight(): void;
     highlightSection(id: number | undefined): void;
+    clearSectionFocus(): void;
+    focusSection(id: number | undefined): void;
+    private removeClassNameAll;
+    private addClassName;
+    getSectionRect(id: Nullable<number>): Nullable<DOMRect>;
+    getSectionElement(id: number | undefined): Nullable<Element>;
     get width(): number;
     get height(): number;
     updateSize(): void;
-    checkBackgroundOutlines(): boolean;
+    checkBackgroundOutlines(): boolean | undefined;
+    initializeBackgroundOutline(): void;
+    /**
+     *
+     * refactoring plan:
+     * * decompose this method into smaller ones
+     *   - prepare SVG background outlines
+     *     - GA outlines
+     *     - sections outlines
+     *   - prepare shapes outlines
+     *     - GA only
+     *   - prepare auto-generated outlines
+     *     - Reserved seats
+     *     - Tables
+     *   - append outlines to the main svg element
+     */
     setBackgroundAsOutline(): void;
+    private extractSVGBackgroundOutlines;
     cleanSvgInlineStyles(stylesToRemove?: string[]): void;
     updateOutlines(): void;
+    private appendAutoAndGaOutlines;
+    private createOrGetOutlineShapes;
+    private appendAutoOutlines;
+    private appendGAOutlines;
+    private getOutlineRects;
     createOutlineRect(section: ISector): SVGRectElement;
     calcOutlineRect(section: ISector): IOutlineRect;
-    handleChangeEagleView(): void;
+    handleChangeEagleView(isEagleView?: boolean): void;
     createGaInfo: (gaGroups: SVGGElement[]) => IGaInfo[];
     disableSvgSectionById: (id: number) => void;
     enableSvgSectionById: (id: number) => void;
@@ -1255,6 +1445,7 @@ declare class OutlineLayer {
     updateAnimationStep(scale: number, translate: IPoint): void;
     hide(): void;
     show(): void;
+    private getContextSvg;
 }
 
 /**
@@ -1430,19 +1621,29 @@ interface IRenderer {
      */
     getSvgSectionBySelection: () => ISectorDTO[];
 }
-interface IZoomSettings {
-    presets: number[];
-    maxZoomToFitScale: number;
-    minPinchZoom: number;
-    maxPinchZoom: number;
+/**
+ * @hidden
+ */
+interface IRendererAnimation {
+    startTime?: number;
+    duration: number;
+    fromScale: number;
+    toScale: number;
+    fromTranslate?: IPoint;
+    translate?: IPoint;
+    toTranslate: IPoint;
+    relativeTranslate?: IPoint;
+    frame: number;
+    inProgress: boolean;
 }
+
 /**
  * Base Renderer class that implements the IRenderer interface.
  * Provides core functionality for rendering and interacting with a venue map.
  */
 declare class Renderer implements IRenderer {
-    protected zoomSettings: IZoomSettings;
     private hammer;
+    private visibilityManager;
     private height;
     private width;
     private padding;
@@ -1450,16 +1651,16 @@ declare class Renderer implements IRenderer {
     private stageLayer;
     private selectionLayer;
     protected outlineLayer: OutlineLayer;
+    private service;
     private zoomToFitScale;
     private isTouchMode;
     private pinchStartPoint?;
     private animation?;
     private resizeTimer;
-    private service;
     protected isRunning: boolean;
     private disableZoomToEmptySpace;
-    private backgroundLoadStepTime;
     private switchToWebGL;
+    private originalSectionPrices;
     /**
      * Creates a new instance of the Renderer.
      *
@@ -1641,7 +1842,7 @@ declare class Renderer implements IRenderer {
      *
      * ```js
      * renderer.addGaToCart({
-     *   id: 100500,
+     *   sectorId: 100500,
      *   key: 'Table 2',
      *   price: 200,
      *   // quantity of GA tickets
@@ -1788,12 +1989,14 @@ declare class Renderer implements IRenderer {
      */
     getSeatSelection(): IExtendedSeat[];
     setSectionSelection(sections?: number[] | string[]): void;
-    getSvgSectionBySelection(): IBaseSector[];
+    getSvgSectionBySelection(): ISectorDTO[];
     disableSvgSectionsByIds(ids: number[], options?: {
         resetAll?: boolean;
     }): void;
     enableSvgSectionsByIds(ids: number[]): void;
     private updateBackgroundImage;
+    disableSectionsByIds(ids: number[]): void;
+    enableSectionsByIds(): void;
     filterSvgSectionsByIds(ids: number[], options?: {
         resetAll?: boolean;
     }): void;
@@ -1861,6 +2064,11 @@ declare class Renderer implements IRenderer {
     highlightSector(id: number | undefined): void;
     private startPanAnimation;
     private animationPanStep;
+    zoomToSection(section: string | number, options?: {
+        focus?: boolean;
+    }): void;
+    zoomToDestination(newScale: number, destination: IPoint, duration?: number): void;
+    private getSectionId;
     private startAnimation;
     private animationStep;
     private cachedDraw;
@@ -1892,6 +2100,7 @@ declare class Renderer implements IRenderer {
      */
     getMaxZoom(): number;
     viewSection(section: ISection): void;
+    private getStageLayer;
 }
 
 interface IAdminRendererSettings extends IRendererSettings {
@@ -1909,19 +2118,6 @@ interface IAdminRendererSettings extends IRendererSettings {
      */
     env?: string;
 }
-/**
- * Interface for the Admin Renderer functionality.
- * Extends the base renderer interface with admin-specific methods.
- */
-interface IAdminRenderer extends IRenderer {
-    /**
-     * Loads an event by its ID.
-     *
-     * @param eventId - The ID of the event to load
-     * @returns A promise that resolves when the event is loaded
-     */
-    loadEvent: (eventId: string) => Promise<void>;
-}
 /**
  * Admin Renderer class for seatmap administration.
  * Extends the base Renderer with admin-specific functionality.
@@ -2048,7 +2244,7 @@ interface IBookingRendererSettings extends IRendererSettings {
      * Environment setting that determines which API endpoint to use.
      * Can be 'local', 'stage', or 'production' (default).
      */
-    env?: string;
+    env?: 'local' | 'stage' | 'production';
     /**
      * If set to `true`, zoom is disabled when clicking into empty space.
      *
@@ -2067,49 +2263,13 @@ interface IBookingRendererSettings extends IRendererSettings {
      * @defaultValue `0`
      */
     backgroundLoadStepTime?: number;
-}
-/**
- * Interface for the Booking Renderer functionality.
- * Extends the base renderer interface with booking-specific methods.
- *
- * @hidden
- */
-interface IBookingRenderer extends IRenderer {
     /**
-     * Loads an event by its ID.
+     * If set to true, renderer will be in debug mode.
      *
-     * @param eventId - The ID of the event to load
-     * @returns A promise that resolves when the event is loaded
-     */
-    loadEvent: (eventId: string) => Promise<void>;
-}
-/**
- * Interface defining the view box properties for the booking renderer.
- * Contains information about the current viewport dimensions and transformations.
- *
- * @hidden
- */
-interface IViewBox {
-    /**
-     * The width of the view box in pixels.
-     */
-    readonly width: number;
-    /**
-     * The height of the view box in pixels.
-     */
-    readonly height: number;
-    /**
-     * The current scale factor of the view.
-     */
-    readonly scale: number;
-    /**
-     * The X translation of the view in pixels.
-     */
-    readonly translateX: number;
-    /**
-     * The Y translation of the view in pixels.
+     * @defaultValue `false`
+     * @hidden
      */
-    readonly translateY: number;
+    debug?: boolean;
 }
 /**
  * Booking Renderer class for seatmap booking.
@@ -2193,6 +2353,7 @@ declare class SeatmapBookingRenderer extends Renderer {
     private leaveSectionOnly;
 }
 
-declare const mergeSettings: <TSettings extends IRendererSettings>(defaults: IRendererSettings, settings?: TSettings | undefined) => IRendererSettings & TSettings;
+declare const defaultZoomSettings: IZoomSettings;
+declare const mergeSettings: (defaults: IRendererSettings, settings?: Partial<IRendererSettings>) => IRendererSettings & Partial<IRendererSettings>;
 
-export { BookingApiClient, type ById, type ColorSequenceSettings, type IAdminRenderer, type IAdminRendererSettings, type IBaseSeat, type IBaseSector, type IBeforeSeatDrawEvent, type IBookingRenderer, type IBookingRendererSettings, type ICart, type ICartGa, type ICartSeat, type IColoredPrice, type IConfigurationDTO, type IExtendedSeat, type IPlainSeatsDTO, type IPngBackgroundDTO, type IPoint, type IPrice, type IPriceDTO, type IPriceId, type IPriceListDTO, type IRemovedCartGa, type IRenderer, type IRendererSeatStyleSettings, type IRendererSettings, type IRendererSvgSectionStylesSetting, type IRendererTheme, type IRowDTO, type ISVGBackgroundDTO, type ISchemaDTO, type ISeat, type ISeatDTO, type ISeatPriceScheme, type ISeatStyle, type ISection, type ISectionRect, type ISectionWithCoords, type ISector, type ISectorDTO, type ISpecialPrice, type ISpecialState, type ISvgSectionStyle, type IVenueDTO, type IViewBox, Renderer, type RendererMachine, type RendererMachineService, RendererSelectMode, RendererTargetType, type SeatFilter, type SeatInteractionState, SeatmapAdminRenderer, SeatmapBookingRenderer, type TransformArray, addPoints, mergeSettings, subPoints };
+export { BookingApiClient, type ById, type ColorById, type ColorSequenceSettings, type DeepPartial, type DestEvent, DestEventType, type IAdminRendererSettings, type IBaseSeat, type IBaseSector, type IBasicSeatStyle, type IBeforeSeatDrawEvent, type IBookingRendererSettings, type ICart, type ICartGa, type ICartSeat, type IClickSrcEvent, type IColoredPrice, type IConfigurationDTO, type IDeselectDestEvent, type IDragEndSrcEvent, type IDragMoveSrcEvent, type IDragStartSrcEvent, type IExtendedSeat, type IMouseMoveSrcEvent, type IPanDestEvent, type IPanZoomDestEvent, type IPlainSeatsDTO, type IPngBackgroundDTO, type IPoint, type IPrice, type IPriceDTO, type IPriceId, type IPriceListDTO, type IRectSelectDestEvent, type IRemovedCartGa, type IRenderer, type IRendererAnimation, type IRendererMachineContext, type IRendererSeatStyleSettings, type IRendererSettings, type IRendererSvgSectionStylesSetting, type IRendererTheme, type IRowDTO, type ISVGBackgroundDTO, type ISchemaDTO, type ISeat, type ISeatCartSwitchDestEvent, type ISeatDTO, type ISeatMouseEnterDestEvent, type ISeatMouseLeaveDestEvent, type ISeatPriceScheme, type ISeatSelectDestEvent, type ISeatStyle, type ISection, type ISectionClickDestEvent, type ISectionMouseEnterDestEvent, type ISectionMouseLeaveDestEvent, type ISectionRect, type ISectionWithCoords, type ISector, type ISectorDTO, type ISpecialPrice, type ISpecialState, type ISvgSectionStyle, type IVenueDTO, type IVisibilitySettings, type IZoomSettings, type Nullable, Renderer, type RendererMachine, type RendererMachineReducer, type RendererMachineService, RendererSelectMode, RendererTargetType, type SeatFilter, type SeatInteractionState, SeatmapAdminRenderer, SeatmapBookingRenderer, type SrcEvent, SrcEventType, type TransformArray, convertPricesToColored, convertPricesToColoredById, defaultZoomSettings, mergeSettings, sortPrices };