@seatsio/seatsio-react 14.3.0 → 14.5.0

package/build/Embeddable.d.mts

@@ -1,28 +1,29 @@
 import * as React from 'react';
-import { SeatingChart, Region, CommonConfigOptions, Seatsio, EventManager, ChartDesigner } from '@seatsio/seatsio-types';
+import { SeatingChart, EventManager, Region, CommonConfigOptions, Seatsio, ChartDesigner } from '@seatsio/seatsio-types';
 
 type EmbeddableProps<T> = {
-    onRenderStarted?: (chart: SeatingChart) => void;
+    onRenderStarted?: (chart: SeatingChart | EventManager) => void;
     chartJsUrl?: string;
     region: Region;
 } & T;
 declare abstract class Embeddable<T extends CommonConfigOptions> extends React.Component<EmbeddableProps<T>> {
     private container;
-    private rendering?;
     private chart;
+    private firstRender;
+    private static seatsioBundles;
     static defaultProps: {
         chartJsUrl: string;
     };
     constructor(props: EmbeddableProps<T>);
     abstract createChart(seatsio: Seatsio, config: T): SeatingChart | EventManager | ChartDesigner;
-    componentDidMount(): Promise<void>;
-    componentDidUpdate(prevProps: EmbeddableProps<T>): Promise<void>;
+    componentDidMount(): void;
+    componentDidUpdate(prevProps: EmbeddableProps<T>): void;
+    getChartUrl(): string;
     createAndRenderChart(): Promise<void>;
     extractConfigFromProps(): any;
     componentWillUnmount(): void;
     destroyChart(): void;
-    getSeatsio(): Promise<any>;
-    loadSeatsio(): Promise<unknown>;
+    loadSeatsio(): Promise<Seatsio>;
     render(): React.ReactNode;
 }
 

package/build/Embeddable.d.ts

@@ -1,28 +1,29 @@
 import * as React from 'react';
-import { SeatingChart, Region, CommonConfigOptions, Seatsio, EventManager, ChartDesigner } from '@seatsio/seatsio-types';
+import { SeatingChart, EventManager, Region, CommonConfigOptions, Seatsio, ChartDesigner } from '@seatsio/seatsio-types';
 
 type EmbeddableProps<T> = {
-    onRenderStarted?: (chart: SeatingChart) => void;
+    onRenderStarted?: (chart: SeatingChart | EventManager) => void;
     chartJsUrl?: string;
     region: Region;
 } & T;
 declare abstract class Embeddable<T extends CommonConfigOptions> extends React.Component<EmbeddableProps<T>> {
     private container;
-    private rendering?;
     private chart;
+    private firstRender;
+    private static seatsioBundles;
     static defaultProps: {
         chartJsUrl: string;
     };
     constructor(props: EmbeddableProps<T>);
     abstract createChart(seatsio: Seatsio, config: T): SeatingChart | EventManager | ChartDesigner;
-    componentDidMount(): Promise<void>;
-    componentDidUpdate(prevProps: EmbeddableProps<T>): Promise<void>;
+    componentDidMount(): void;
+    componentDidUpdate(prevProps: EmbeddableProps<T>): void;
+    getChartUrl(): string;
     createAndRenderChart(): Promise<void>;
     extractConfigFromProps(): any;
     componentWillUnmount(): void;
     destroyChart(): void;
-    getSeatsio(): Promise<any>;
-    loadSeatsio(): Promise<unknown>;
+    loadSeatsio(): Promise<Seatsio>;
     render(): React.ReactNode;
 }
 

package/build/Embeddable.js

@@ -55,24 +55,29 @@ var didPropsChange = (prevProps, nextProps) => {
 };
 
 // src/main/Embeddable.tsx
-var Embeddable = class extends React.Component {
+var _Embeddable = class _Embeddable extends React.Component {
   constructor(props) {
     super(props);
     this.container = React.createRef();
+    this.firstRender = true;
   }
-  async componentDidMount() {
-    if (!this.rendering) {
-      this.rendering = this.createAndRenderChart();
+  componentDidMount() {
+    if (!_Embeddable.seatsioBundles[this.getChartUrl()] || this.firstRender) {
+      this.createAndRenderChart();
+      this.firstRender = false;
     }
   }
-  async componentDidUpdate(prevProps) {
+  componentDidUpdate(prevProps) {
     if (didPropsChange(this.props, prevProps) && this.chart) {
       this.destroyChart();
       this.createAndRenderChart();
     }
   }
+  getChartUrl() {
+    return this.props.chartJsUrl.replace("{region}", this.props.region);
+  }
   async createAndRenderChart() {
-    const seatsio2 = await this.getSeatsio();
+    const seatsio2 = await this.loadSeatsio();
     const config = this.extractConfigFromProps();
     config.container = this.container.current;
     this.chart = this.createChart(seatsio2, config).render();
@@ -92,33 +97,28 @@ var Embeddable = class extends React.Component {
       this.chart.destroy();
     }
   }
-  getSeatsio() {
-    if (typeof seatsio === "undefined") {
-      return this.loadSeatsio();
-    } else if (seatsio.region !== this.props.region) {
-      seatsio = void 0;
-      return this.loadSeatsio();
-    } else {
-      return Promise.resolve(seatsio);
-    }
-  }
   loadSeatsio() {
-    return new Promise((resolve, reject) => {
-      let script = document.createElement("script");
-      script.onload = () => {
-        seatsio.region = this.props.region;
-        resolve(seatsio);
-      };
-      script.onerror = () => reject(`Could not load ${script.src}`);
-      script.src = this.props.chartJsUrl.replace("{region}", this.props.region);
-      document.head.appendChild(script);
-    });
+    const chartUrl = this.getChartUrl();
+    if (!_Embeddable.seatsioBundles[chartUrl]) {
+      _Embeddable.seatsioBundles[chartUrl] = new Promise((resolve, reject) => {
+        const script = document.head.appendChild(document.createElement("script"));
+        window.seatsio = void 0;
+        script.onload = () => {
+          resolve(seatsio);
+        };
+        script.onerror = () => reject(`Could not load ${script.src}`);
+        script.src = chartUrl;
+      });
+    }
+    return _Embeddable.seatsioBundles[chartUrl];
   }
   render() {
     return /* @__PURE__ */ React.createElement("div", { ref: this.container, style: { "height": "100%", "width": "100%" } });
   }
 };
-Embeddable.defaultProps = {
+_Embeddable.seatsioBundles = {};
+_Embeddable.defaultProps = {
   chartJsUrl: "https://cdn-{region}.seatsio.net/chart.js"
 };
+var Embeddable = _Embeddable;
 //# sourceMappingURL=Embeddable.js.map

package/build/Embeddable.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/main/Embeddable.tsx","../src/main/util.ts"],"sourcesContent":["import * as React from 'react'\nimport {didPropsChange} from './util'\nimport { ChartDesigner, CommonConfigOptions, EventManager, Region, SeatingChart, Seatsio } from '@seatsio/seatsio-types'\n\nexport type EmbeddableProps<T> = {\n    onRenderStarted?: (chart: SeatingChart) => void\n    chartJsUrl?: string\n    region: Region\n} & T\n\nexport default abstract class Embeddable<T extends CommonConfigOptions> extends React.Component<EmbeddableProps<T>> {\n    private container: React.RefObject<HTMLDivElement>\n    private rendering?: Promise<void>\n    private chart: SeatingChart\n\n    static defaultProps = {\n        chartJsUrl: 'https://cdn-{region}.seatsio.net/chart.js'\n    }\n\n    constructor(props: EmbeddableProps<T>) {\n        super(props);\n        this.container = React.createRef();\n    }\n\n    abstract createChart (seatsio: Seatsio, config: T): SeatingChart | EventManager | ChartDesigner\n\n    async componentDidMount () {\n        if(!this.rendering) {\n            this.rendering = this.createAndRenderChart()\n        }\n    }\n\n    async componentDidUpdate (prevProps: EmbeddableProps<T>) {\n        if (didPropsChange(this.props, prevProps) && this.chart) {\n            this.destroyChart()\n            this.createAndRenderChart()\n        }\n    }\n\n    async createAndRenderChart () {\n        const seatsio = await this.getSeatsio()\n        const config = this.extractConfigFromProps()\n        config.container = this.container.current\n        this.chart = this.createChart(seatsio, config).render()\n        if (this.props.onRenderStarted) {\n            this.props.onRenderStarted(this.chart)\n        }\n    }\n\n    extractConfigFromProps (): any {\n        // noinspection JSUnusedLocalSymbols\n        let { chartJsUrl, divId, onRenderStarted, region, ...config } = this.props\n        return config\n    }\n\n    componentWillUnmount () {\n        this.destroyChart()\n    }\n\n    destroyChart () {\n        if (this.chart && (this.chart as any).state !== 'DESTROYED') {\n            this.chart.destroy()\n        }\n    }\n\n    getSeatsio () {\n        if (typeof seatsio === 'undefined') {\n            return this.loadSeatsio()\n        } else if (seatsio.region !== this.props.region) {\n            seatsio = undefined\n            return this.loadSeatsio()\n        } else {\n            return Promise.resolve(seatsio)\n        }\n    }\n\n    loadSeatsio () {\n        return new Promise((resolve, reject) => {\n            let script = document.createElement('script')\n            script.onload = () => {\n                seatsio.region = this.props.region\n                resolve(seatsio)\n            }\n            script.onerror = () => reject(`Could not load ${script.src}`)\n            script.src = this.props.chartJsUrl.replace('{region}', this.props.region)\n            document.head.appendChild(script)\n        })\n    }\n\n    render (): React.ReactNode {\n        return (\n            <div ref={this.container as unknown as React.RefObject<HTMLDivElement>} style={{'height': '100%', 'width': '100%'}} />\n        )\n    }\n}","import { BoothProps, GeneralAdmissionAreaProps, InteractiveObjectProps, InteractiveSectionProps, SeatProps, SelectableObjectProps, TableProps } from \"@seatsio/seatsio-types\"\n\nexport const didPropsChange = <P extends { [key: string]: any}>(prevProps: P, nextProps: P): boolean => {\n    if (Object.keys(prevProps).length !== Object.keys(nextProps).length) {\n        return true\n    }\n    return Object.keys(nextProps).some((propName: string) => {\n        let prevValue = prevProps[propName]\n        let nextValue = nextProps[propName]\n        if (prevValue && nextValue) {\n            if (typeof prevValue === 'function' && typeof nextValue === 'function') {\n                return prevValue.toString() !== nextValue.toString()\n            }\n            if (typeof prevValue === 'object' && typeof nextValue === 'object') {\n                return didPropsChange(prevValue, nextValue)\n            }\n        }\n        return prevValue !== nextValue\n    })\n}\n\nexport const isSeat = (obj: SelectableObjectProps): obj is SeatProps => obj.objectType === 'Seat'\nexport const isTable = (obj: SelectableObjectProps): obj is TableProps => obj.objectType === 'Table'\nexport const isSection = (obj: SelectableObjectProps): obj is InteractiveSectionProps => obj.objectType === 'section'\nexport const isBooth = (obj: SelectableObjectProps): obj is BoothProps => obj.objectType === 'Booth'\nexport const isGeneralAdmission = (obj: SelectableObjectProps): obj is GeneralAdmissionAreaProps => obj.objectType === 'GeneralAdmissionArea'"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAAuB;;;ACEhB,IAAM,iBAAiB,CAAkC,WAAc,cAA0B;AACpG,MAAI,OAAO,KAAK,SAAS,EAAE,WAAW,OAAO,KAAK,SAAS,EAAE,QAAQ;AACjE,WAAO;AAAA,EACX;AACA,SAAO,OAAO,KAAK,SAAS,EAAE,KAAK,CAAC,aAAqB;AACrD,QAAI,YAAY,UAAU,QAAQ;AAClC,QAAI,YAAY,UAAU,QAAQ;AAClC,QAAI,aAAa,WAAW;AACxB,UAAI,OAAO,cAAc,cAAc,OAAO,cAAc,YAAY;AACpE,eAAO,UAAU,SAAS,MAAM,UAAU,SAAS;AAAA,MACvD;AACA,UAAI,OAAO,cAAc,YAAY,OAAO,cAAc,UAAU;AAChE,eAAO,eAAe,WAAW,SAAS;AAAA,MAC9C;AAAA,IACJ;AACA,WAAO,cAAc;AAAA,EACzB,CAAC;AACL;;;ADTA,IAA8B,aAA9B,cAAsF,gBAA8B;AAAA,EAShH,YAAY,OAA2B;AACnC,UAAM,KAAK;AACX,SAAK,YAAkB,gBAAU;AAAA,EACrC;AAAA,EAIA,MAAM,oBAAqB;AACvB,QAAG,CAAC,KAAK,WAAW;AAChB,WAAK,YAAY,KAAK,qBAAqB;AAAA,IAC/C;AAAA,EACJ;AAAA,EAEA,MAAM,mBAAoB,WAA+B;AACrD,QAAI,eAAe,KAAK,OAAO,SAAS,KAAK,KAAK,OAAO;AACrD,WAAK,aAAa;AAClB,WAAK,qBAAqB;AAAA,IAC9B;AAAA,EACJ;AAAA,EAEA,MAAM,uBAAwB;AAC1B,UAAMA,WAAU,MAAM,KAAK,WAAW;AACtC,UAAM,SAAS,KAAK,uBAAuB;AAC3C,WAAO,YAAY,KAAK,UAAU;AAClC,SAAK,QAAQ,KAAK,YAAYA,UAAS,MAAM,EAAE,OAAO;AACtD,QAAI,KAAK,MAAM,iBAAiB;AAC5B,WAAK,MAAM,gBAAgB,KAAK,KAAK;AAAA,IACzC;AAAA,EACJ;AAAA,EAEA,yBAA+B;AAE3B,QAAI,EAAE,YAAY,OAAO,iBAAiB,QAAQ,GAAG,OAAO,IAAI,KAAK;AACrE,WAAO;AAAA,EACX;AAAA,EAEA,uBAAwB;AACpB,SAAK,aAAa;AAAA,EACtB;AAAA,EAEA,eAAgB;AACZ,QAAI,KAAK,SAAU,KAAK,MAAc,UAAU,aAAa;AACzD,WAAK,MAAM,QAAQ;AAAA,IACvB;AAAA,EACJ;AAAA,EAEA,aAAc;AACV,QAAI,OAAO,YAAY,aAAa;AAChC,aAAO,KAAK,YAAY;AAAA,IAC5B,WAAW,QAAQ,WAAW,KAAK,MAAM,QAAQ;AAC7C,gBAAU;AACV,aAAO,KAAK,YAAY;AAAA,IAC5B,OAAO;AACH,aAAO,QAAQ,QAAQ,OAAO;AAAA,IAClC;AAAA,EACJ;AAAA,EAEA,cAAe;AACX,WAAO,IAAI,QAAQ,CAAC,SAAS,WAAW;AACpC,UAAI,SAAS,SAAS,cAAc,QAAQ;AAC5C,aAAO,SAAS,MAAM;AAClB,gBAAQ,SAAS,KAAK,MAAM;AAC5B,gBAAQ,OAAO;AAAA,MACnB;AACA,aAAO,UAAU,MAAM,OAAO,kBAAkB,OAAO,GAAG,EAAE;AAC5D,aAAO,MAAM,KAAK,MAAM,WAAW,QAAQ,YAAY,KAAK,MAAM,MAAM;AACxE,eAAS,KAAK,YAAY,MAAM;AAAA,IACpC,CAAC;AAAA,EACL;AAAA,EAEA,SAA2B;AACvB,WACI,oCAAC,SAAI,KAAK,KAAK,WAAyD,OAAO,EAAC,UAAU,QAAQ,SAAS,OAAM,GAAG;AAAA,EAE5H;AACJ;AApF8B,WAKnB,eAAe;AAAA,EAClB,YAAY;AAChB;","names":["seatsio"]}
+{"version":3,"sources":["../src/main/Embeddable.tsx","../src/main/util.ts"],"sourcesContent":["import * as React from 'react'\nimport {didPropsChange} from './util'\nimport { ChartDesigner, CommonConfigOptions, EventManager, Region, SeatingChart, Seatsio } from '@seatsio/seatsio-types'\n\nexport type EmbeddableProps<T > = {\n    onRenderStarted?: (chart: SeatingChart | EventManager) => void\n    chartJsUrl?: string\n    region: Region\n} & T\n\nexport default abstract class Embeddable<T extends CommonConfigOptions> extends React.Component<EmbeddableProps<T>> {\n    private container: React.RefObject<HTMLDivElement>\n    private chart: SeatingChart\n    private firstRender: boolean\n\n    private static seatsioBundles: { [key: string]: Promise<Seatsio> } = {}\n\n    static defaultProps = {\n        chartJsUrl: 'https://cdn-{region}.seatsio.net/chart.js'\n    }\n\n    constructor(props: EmbeddableProps<T>) {\n        super(props);\n        this.container = React.createRef()\n        this.firstRender = true\n    }\n\n    abstract createChart (seatsio: Seatsio, config: T): SeatingChart | EventManager | ChartDesigner\n\n    componentDidMount () {\n        if (!Embeddable.seatsioBundles[this.getChartUrl()] || this.firstRender) {\n            this.createAndRenderChart()\n            this.firstRender = false\n        }\n    }\n\n    componentDidUpdate (prevProps: EmbeddableProps<T>) {\n        if (didPropsChange(this.props, prevProps) && this.chart) {\n            this.destroyChart()\n            this.createAndRenderChart()\n        }\n    }\n\n    getChartUrl () {\n        return this.props.chartJsUrl.replace('{region}', this.props.region)\n    }\n\n    async createAndRenderChart () {\n        const seatsio = await this.loadSeatsio()\n        const config = this.extractConfigFromProps()\n        config.container = this.container.current\n        this.chart = this.createChart(seatsio, config).render()\n        if (this.props.onRenderStarted) {\n            this.props.onRenderStarted(this.chart)\n        }\n    }\n\n    extractConfigFromProps (): any {\n        let { chartJsUrl, divId, onRenderStarted, region, ...config } = this.props\n        return config\n    }\n\n    componentWillUnmount () {\n        this.destroyChart()\n    }\n\n    destroyChart () {\n        if (this.chart && (this.chart as any).state !== 'DESTROYED') {\n            this.chart.destroy()\n        }\n    }\n\n    loadSeatsio (): Promise<Seatsio> {\n        const chartUrl = this.getChartUrl()\n        if (!Embeddable.seatsioBundles[chartUrl]) {\n            Embeddable.seatsioBundles[chartUrl] = new Promise<Seatsio>((resolve, reject) => {\n                const script = document.head.appendChild(document.createElement('script'))\n                // Seatsio global is not replaced if already present, which would cause the wrong region bundle to resolve when changing region\n                window.seatsio = undefined\n                script.onload = () => {\n                    resolve(seatsio)\n                }\n                script.onerror = () => reject(`Could not load ${script.src}`)\n                script.src = chartUrl\n            })\n        }\n\n        return Embeddable.seatsioBundles[chartUrl]\n    }\n\n    render (): React.ReactNode {\n        return (\n            <div ref={this.container as unknown as React.RefObject<HTMLDivElement>} style={{'height': '100%', 'width': '100%'}} />\n        )\n    }\n}","import { BoothProps, GeneralAdmissionAreaProps, InteractiveObjectProps, InteractiveSectionProps, SeatProps, SelectableObjectProps, TableProps } from \"@seatsio/seatsio-types\"\n\nexport const didPropsChange = <P extends { [key: string]: any}>(prevProps: P, nextProps: P): boolean => {\n    if (Object.keys(prevProps).length !== Object.keys(nextProps).length) {\n        return true\n    }\n    return Object.keys(nextProps).some((propName: string) => {\n        let prevValue = prevProps[propName]\n        let nextValue = nextProps[propName]\n        if (prevValue && nextValue) {\n            if (typeof prevValue === 'function' && typeof nextValue === 'function') {\n                return prevValue.toString() !== nextValue.toString()\n            }\n            if (typeof prevValue === 'object' && typeof nextValue === 'object') {\n                return didPropsChange(prevValue, nextValue)\n            }\n        }\n        return prevValue !== nextValue\n    })\n}\n\nexport const isSeat = (obj: SelectableObjectProps): obj is SeatProps => obj.objectType === 'Seat'\nexport const isTable = (obj: SelectableObjectProps): obj is TableProps => obj.objectType === 'Table'\nexport const isSection = (obj: SelectableObjectProps): obj is InteractiveSectionProps => obj.objectType === 'section'\nexport const isBooth = (obj: SelectableObjectProps): obj is BoothProps => obj.objectType === 'Booth'\nexport const isGeneralAdmission = (obj: SelectableObjectProps): obj is GeneralAdmissionAreaProps => obj.objectType === 'GeneralAdmissionArea'"],"mappings":"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","names":["seatsio"]}

package/build/Embeddable.mjs

@@ -22,24 +22,29 @@ var didPropsChange = (prevProps, nextProps) => {
 };
 
 // src/main/Embeddable.tsx
-var Embeddable = class extends React.Component {
+var _Embeddable = class _Embeddable extends React.Component {
   constructor(props) {
     super(props);
     this.container = React.createRef();
+    this.firstRender = true;
   }
-  async componentDidMount() {
-    if (!this.rendering) {
-      this.rendering = this.createAndRenderChart();
+  componentDidMount() {
+    if (!_Embeddable.seatsioBundles[this.getChartUrl()] || this.firstRender) {
+      this.createAndRenderChart();
+      this.firstRender = false;
     }
   }
-  async componentDidUpdate(prevProps) {
+  componentDidUpdate(prevProps) {
     if (didPropsChange(this.props, prevProps) && this.chart) {
       this.destroyChart();
       this.createAndRenderChart();
     }
   }
+  getChartUrl() {
+    return this.props.chartJsUrl.replace("{region}", this.props.region);
+  }
   async createAndRenderChart() {
-    const seatsio2 = await this.getSeatsio();
+    const seatsio2 = await this.loadSeatsio();
     const config = this.extractConfigFromProps();
     config.container = this.container.current;
     this.chart = this.createChart(seatsio2, config).render();
@@ -59,35 +64,30 @@ var Embeddable = class extends React.Component {
       this.chart.destroy();
     }
   }
-  getSeatsio() {
-    if (typeof seatsio === "undefined") {
-      return this.loadSeatsio();
-    } else if (seatsio.region !== this.props.region) {
-      seatsio = void 0;
-      return this.loadSeatsio();
-    } else {
-      return Promise.resolve(seatsio);
-    }
-  }
   loadSeatsio() {
-    return new Promise((resolve, reject) => {
-      let script = document.createElement("script");
-      script.onload = () => {
-        seatsio.region = this.props.region;
-        resolve(seatsio);
-      };
-      script.onerror = () => reject(`Could not load ${script.src}`);
-      script.src = this.props.chartJsUrl.replace("{region}", this.props.region);
-      document.head.appendChild(script);
-    });
+    const chartUrl = this.getChartUrl();
+    if (!_Embeddable.seatsioBundles[chartUrl]) {
+      _Embeddable.seatsioBundles[chartUrl] = new Promise((resolve, reject) => {
+        const script = document.head.appendChild(document.createElement("script"));
+        window.seatsio = void 0;
+        script.onload = () => {
+          resolve(seatsio);
+        };
+        script.onerror = () => reject(`Could not load ${script.src}`);
+        script.src = chartUrl;
+      });
+    }
+    return _Embeddable.seatsioBundles[chartUrl];
   }
   render() {
     return /* @__PURE__ */ React.createElement("div", { ref: this.container, style: { "height": "100%", "width": "100%" } });
   }
 };
-Embeddable.defaultProps = {
+_Embeddable.seatsioBundles = {};
+_Embeddable.defaultProps = {
   chartJsUrl: "https://cdn-{region}.seatsio.net/chart.js"
 };
+var Embeddable = _Embeddable;
 export {
   Embeddable as default
 };

package/build/Embeddable.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/main/Embeddable.tsx","../src/main/util.ts"],"sourcesContent":["import * as React from 'react'\nimport {didPropsChange} from './util'\nimport { ChartDesigner, CommonConfigOptions, EventManager, Region, SeatingChart, Seatsio } from '@seatsio/seatsio-types'\n\nexport type EmbeddableProps<T> = {\n    onRenderStarted?: (chart: SeatingChart) => void\n    chartJsUrl?: string\n    region: Region\n} & T\n\nexport default abstract class Embeddable<T extends CommonConfigOptions> extends React.Component<EmbeddableProps<T>> {\n    private container: React.RefObject<HTMLDivElement>\n    private rendering?: Promise<void>\n    private chart: SeatingChart\n\n    static defaultProps = {\n        chartJsUrl: 'https://cdn-{region}.seatsio.net/chart.js'\n    }\n\n    constructor(props: EmbeddableProps<T>) {\n        super(props);\n        this.container = React.createRef();\n    }\n\n    abstract createChart (seatsio: Seatsio, config: T): SeatingChart | EventManager | ChartDesigner\n\n    async componentDidMount () {\n        if(!this.rendering) {\n            this.rendering = this.createAndRenderChart()\n        }\n    }\n\n    async componentDidUpdate (prevProps: EmbeddableProps<T>) {\n        if (didPropsChange(this.props, prevProps) && this.chart) {\n            this.destroyChart()\n            this.createAndRenderChart()\n        }\n    }\n\n    async createAndRenderChart () {\n        const seatsio = await this.getSeatsio()\n        const config = this.extractConfigFromProps()\n        config.container = this.container.current\n        this.chart = this.createChart(seatsio, config).render()\n        if (this.props.onRenderStarted) {\n            this.props.onRenderStarted(this.chart)\n        }\n    }\n\n    extractConfigFromProps (): any {\n        // noinspection JSUnusedLocalSymbols\n        let { chartJsUrl, divId, onRenderStarted, region, ...config } = this.props\n        return config\n    }\n\n    componentWillUnmount () {\n        this.destroyChart()\n    }\n\n    destroyChart () {\n        if (this.chart && (this.chart as any).state !== 'DESTROYED') {\n            this.chart.destroy()\n        }\n    }\n\n    getSeatsio () {\n        if (typeof seatsio === 'undefined') {\n            return this.loadSeatsio()\n        } else if (seatsio.region !== this.props.region) {\n            seatsio = undefined\n            return this.loadSeatsio()\n        } else {\n            return Promise.resolve(seatsio)\n        }\n    }\n\n    loadSeatsio () {\n        return new Promise((resolve, reject) => {\n            let script = document.createElement('script')\n            script.onload = () => {\n                seatsio.region = this.props.region\n                resolve(seatsio)\n            }\n            script.onerror = () => reject(`Could not load ${script.src}`)\n            script.src = this.props.chartJsUrl.replace('{region}', this.props.region)\n            document.head.appendChild(script)\n        })\n    }\n\n    render (): React.ReactNode {\n        return (\n            <div ref={this.container as unknown as React.RefObject<HTMLDivElement>} style={{'height': '100%', 'width': '100%'}} />\n        )\n    }\n}","import { BoothProps, GeneralAdmissionAreaProps, InteractiveObjectProps, InteractiveSectionProps, SeatProps, SelectableObjectProps, TableProps } from \"@seatsio/seatsio-types\"\n\nexport const didPropsChange = <P extends { [key: string]: any}>(prevProps: P, nextProps: P): boolean => {\n    if (Object.keys(prevProps).length !== Object.keys(nextProps).length) {\n        return true\n    }\n    return Object.keys(nextProps).some((propName: string) => {\n        let prevValue = prevProps[propName]\n        let nextValue = nextProps[propName]\n        if (prevValue && nextValue) {\n            if (typeof prevValue === 'function' && typeof nextValue === 'function') {\n                return prevValue.toString() !== nextValue.toString()\n            }\n            if (typeof prevValue === 'object' && typeof nextValue === 'object') {\n                return didPropsChange(prevValue, nextValue)\n            }\n        }\n        return prevValue !== nextValue\n    })\n}\n\nexport const isSeat = (obj: SelectableObjectProps): obj is SeatProps => obj.objectType === 'Seat'\nexport const isTable = (obj: SelectableObjectProps): obj is TableProps => obj.objectType === 'Table'\nexport const isSection = (obj: SelectableObjectProps): obj is InteractiveSectionProps => obj.objectType === 'section'\nexport const isBooth = (obj: SelectableObjectProps): obj is BoothProps => obj.objectType === 'Booth'\nexport const isGeneralAdmission = (obj: SelectableObjectProps): obj is GeneralAdmissionAreaProps => obj.objectType === 'GeneralAdmissionArea'"],"mappings":";AAAA,YAAY,WAAW;;;ACEhB,IAAM,iBAAiB,CAAkC,WAAc,cAA0B;AACpG,MAAI,OAAO,KAAK,SAAS,EAAE,WAAW,OAAO,KAAK,SAAS,EAAE,QAAQ;AACjE,WAAO;AAAA,EACX;AACA,SAAO,OAAO,KAAK,SAAS,EAAE,KAAK,CAAC,aAAqB;AACrD,QAAI,YAAY,UAAU,QAAQ;AAClC,QAAI,YAAY,UAAU,QAAQ;AAClC,QAAI,aAAa,WAAW;AACxB,UAAI,OAAO,cAAc,cAAc,OAAO,cAAc,YAAY;AACpE,eAAO,UAAU,SAAS,MAAM,UAAU,SAAS;AAAA,MACvD;AACA,UAAI,OAAO,cAAc,YAAY,OAAO,cAAc,UAAU;AAChE,eAAO,eAAe,WAAW,SAAS;AAAA,MAC9C;AAAA,IACJ;AACA,WAAO,cAAc;AAAA,EACzB,CAAC;AACL;;;ADTA,IAA8B,aAA9B,cAAsF,gBAA8B;AAAA,EAShH,YAAY,OAA2B;AACnC,UAAM,KAAK;AACX,SAAK,YAAkB,gBAAU;AAAA,EACrC;AAAA,EAIA,MAAM,oBAAqB;AACvB,QAAG,CAAC,KAAK,WAAW;AAChB,WAAK,YAAY,KAAK,qBAAqB;AAAA,IAC/C;AAAA,EACJ;AAAA,EAEA,MAAM,mBAAoB,WAA+B;AACrD,QAAI,eAAe,KAAK,OAAO,SAAS,KAAK,KAAK,OAAO;AACrD,WAAK,aAAa;AAClB,WAAK,qBAAqB;AAAA,IAC9B;AAAA,EACJ;AAAA,EAEA,MAAM,uBAAwB;AAC1B,UAAMA,WAAU,MAAM,KAAK,WAAW;AACtC,UAAM,SAAS,KAAK,uBAAuB;AAC3C,WAAO,YAAY,KAAK,UAAU;AAClC,SAAK,QAAQ,KAAK,YAAYA,UAAS,MAAM,EAAE,OAAO;AACtD,QAAI,KAAK,MAAM,iBAAiB;AAC5B,WAAK,MAAM,gBAAgB,KAAK,KAAK;AAAA,IACzC;AAAA,EACJ;AAAA,EAEA,yBAA+B;AAE3B,QAAI,EAAE,YAAY,OAAO,iBAAiB,QAAQ,GAAG,OAAO,IAAI,KAAK;AACrE,WAAO;AAAA,EACX;AAAA,EAEA,uBAAwB;AACpB,SAAK,aAAa;AAAA,EACtB;AAAA,EAEA,eAAgB;AACZ,QAAI,KAAK,SAAU,KAAK,MAAc,UAAU,aAAa;AACzD,WAAK,MAAM,QAAQ;AAAA,IACvB;AAAA,EACJ;AAAA,EAEA,aAAc;AACV,QAAI,OAAO,YAAY,aAAa;AAChC,aAAO,KAAK,YAAY;AAAA,IAC5B,WAAW,QAAQ,WAAW,KAAK,MAAM,QAAQ;AAC7C,gBAAU;AACV,aAAO,KAAK,YAAY;AAAA,IAC5B,OAAO;AACH,aAAO,QAAQ,QAAQ,OAAO;AAAA,IAClC;AAAA,EACJ;AAAA,EAEA,cAAe;AACX,WAAO,IAAI,QAAQ,CAAC,SAAS,WAAW;AACpC,UAAI,SAAS,SAAS,cAAc,QAAQ;AAC5C,aAAO,SAAS,MAAM;AAClB,gBAAQ,SAAS,KAAK,MAAM;AAC5B,gBAAQ,OAAO;AAAA,MACnB;AACA,aAAO,UAAU,MAAM,OAAO,kBAAkB,OAAO,GAAG,EAAE;AAC5D,aAAO,MAAM,KAAK,MAAM,WAAW,QAAQ,YAAY,KAAK,MAAM,MAAM;AACxE,eAAS,KAAK,YAAY,MAAM;AAAA,IACpC,CAAC;AAAA,EACL;AAAA,EAEA,SAA2B;AACvB,WACI,oCAAC,SAAI,KAAK,KAAK,WAAyD,OAAO,EAAC,UAAU,QAAQ,SAAS,OAAM,GAAG;AAAA,EAE5H;AACJ;AApF8B,WAKnB,eAAe;AAAA,EAClB,YAAY;AAChB;","names":["seatsio"]}
+{"version":3,"sources":["../src/main/Embeddable.tsx","../src/main/util.ts"],"sourcesContent":["import * as React from 'react'\nimport {didPropsChange} from './util'\nimport { ChartDesigner, CommonConfigOptions, EventManager, Region, SeatingChart, Seatsio } from '@seatsio/seatsio-types'\n\nexport type EmbeddableProps<T > = {\n    onRenderStarted?: (chart: SeatingChart | EventManager) => void\n    chartJsUrl?: string\n    region: Region\n} & T\n\nexport default abstract class Embeddable<T extends CommonConfigOptions> extends React.Component<EmbeddableProps<T>> {\n    private container: React.RefObject<HTMLDivElement>\n    private chart: SeatingChart\n    private firstRender: boolean\n\n    private static seatsioBundles: { [key: string]: Promise<Seatsio> } = {}\n\n    static defaultProps = {\n        chartJsUrl: 'https://cdn-{region}.seatsio.net/chart.js'\n    }\n\n    constructor(props: EmbeddableProps<T>) {\n        super(props);\n        this.container = React.createRef()\n        this.firstRender = true\n    }\n\n    abstract createChart (seatsio: Seatsio, config: T): SeatingChart | EventManager | ChartDesigner\n\n    componentDidMount () {\n        if (!Embeddable.seatsioBundles[this.getChartUrl()] || this.firstRender) {\n            this.createAndRenderChart()\n            this.firstRender = false\n        }\n    }\n\n    componentDidUpdate (prevProps: EmbeddableProps<T>) {\n        if (didPropsChange(this.props, prevProps) && this.chart) {\n            this.destroyChart()\n            this.createAndRenderChart()\n        }\n    }\n\n    getChartUrl () {\n        return this.props.chartJsUrl.replace('{region}', this.props.region)\n    }\n\n    async createAndRenderChart () {\n        const seatsio = await this.loadSeatsio()\n        const config = this.extractConfigFromProps()\n        config.container = this.container.current\n        this.chart = this.createChart(seatsio, config).render()\n        if (this.props.onRenderStarted) {\n            this.props.onRenderStarted(this.chart)\n        }\n    }\n\n    extractConfigFromProps (): any {\n        let { chartJsUrl, divId, onRenderStarted, region, ...config } = this.props\n        return config\n    }\n\n    componentWillUnmount () {\n        this.destroyChart()\n    }\n\n    destroyChart () {\n        if (this.chart && (this.chart as any).state !== 'DESTROYED') {\n            this.chart.destroy()\n        }\n    }\n\n    loadSeatsio (): Promise<Seatsio> {\n        const chartUrl = this.getChartUrl()\n        if (!Embeddable.seatsioBundles[chartUrl]) {\n            Embeddable.seatsioBundles[chartUrl] = new Promise<Seatsio>((resolve, reject) => {\n                const script = document.head.appendChild(document.createElement('script'))\n                // Seatsio global is not replaced if already present, which would cause the wrong region bundle to resolve when changing region\n                window.seatsio = undefined\n                script.onload = () => {\n                    resolve(seatsio)\n                }\n                script.onerror = () => reject(`Could not load ${script.src}`)\n                script.src = chartUrl\n            })\n        }\n\n        return Embeddable.seatsioBundles[chartUrl]\n    }\n\n    render (): React.ReactNode {\n        return (\n            <div ref={this.container as unknown as React.RefObject<HTMLDivElement>} style={{'height': '100%', 'width': '100%'}} />\n        )\n    }\n}","import { BoothProps, GeneralAdmissionAreaProps, InteractiveObjectProps, InteractiveSectionProps, SeatProps, SelectableObjectProps, TableProps } from \"@seatsio/seatsio-types\"\n\nexport const didPropsChange = <P extends { [key: string]: any}>(prevProps: P, nextProps: P): boolean => {\n    if (Object.keys(prevProps).length !== Object.keys(nextProps).length) {\n        return true\n    }\n    return Object.keys(nextProps).some((propName: string) => {\n        let prevValue = prevProps[propName]\n        let nextValue = nextProps[propName]\n        if (prevValue && nextValue) {\n            if (typeof prevValue === 'function' && typeof nextValue === 'function') {\n                return prevValue.toString() !== nextValue.toString()\n            }\n            if (typeof prevValue === 'object' && typeof nextValue === 'object') {\n                return didPropsChange(prevValue, nextValue)\n            }\n        }\n        return prevValue !== nextValue\n    })\n}\n\nexport const isSeat = (obj: SelectableObjectProps): obj is SeatProps => obj.objectType === 'Seat'\nexport const isTable = (obj: SelectableObjectProps): obj is TableProps => obj.objectType === 'Table'\nexport const isSection = (obj: SelectableObjectProps): obj is InteractiveSectionProps => obj.objectType === 'section'\nexport const isBooth = (obj: SelectableObjectProps): obj is BoothProps => obj.objectType === 'Booth'\nexport const isGeneralAdmission = (obj: SelectableObjectProps): obj is GeneralAdmissionAreaProps => obj.objectType === 'GeneralAdmissionArea'"],"mappings":";AAAA,YAAY,WAAW;;;ACEhB,IAAM,iBAAiB,CAAkC,WAAc,cAA0B;AACpG,MAAI,OAAO,KAAK,SAAS,EAAE,WAAW,OAAO,KAAK,SAAS,EAAE,QAAQ;AACjE,WAAO;AAAA,EACX;AACA,SAAO,OAAO,KAAK,SAAS,EAAE,KAAK,CAAC,aAAqB;AACrD,QAAI,YAAY,UAAU,QAAQ;AAClC,QAAI,YAAY,UAAU,QAAQ;AAClC,QAAI,aAAa,WAAW;AACxB,UAAI,OAAO,cAAc,cAAc,OAAO,cAAc,YAAY;AACpE,eAAO,UAAU,SAAS,MAAM,UAAU,SAAS;AAAA,MACvD;AACA,UAAI,OAAO,cAAc,YAAY,OAAO,cAAc,UAAU;AAChE,eAAO,eAAe,WAAW,SAAS;AAAA,MAC9C;AAAA,IACJ;AACA,WAAO,cAAc;AAAA,EACzB,CAAC;AACL;;;ADTA,IAA8B,cAA9B,MAA8B,oBAAwD,gBAA8B;AAAA,EAWhH,YAAY,OAA2B;AACnC,UAAM,KAAK;AACX,SAAK,YAAkB,gBAAU;AACjC,SAAK,cAAc;AAAA,EACvB;AAAA,EAIA,oBAAqB;AACjB,QAAI,CAAC,YAAW,eAAe,KAAK,YAAY,CAAC,KAAK,KAAK,aAAa;AACpE,WAAK,qBAAqB;AAC1B,WAAK,cAAc;AAAA,IACvB;AAAA,EACJ;AAAA,EAEA,mBAAoB,WAA+B;AAC/C,QAAI,eAAe,KAAK,OAAO,SAAS,KAAK,KAAK,OAAO;AACrD,WAAK,aAAa;AAClB,WAAK,qBAAqB;AAAA,IAC9B;AAAA,EACJ;AAAA,EAEA,cAAe;AACX,WAAO,KAAK,MAAM,WAAW,QAAQ,YAAY,KAAK,MAAM,MAAM;AAAA,EACtE;AAAA,EAEA,MAAM,uBAAwB;AAC1B,UAAMA,WAAU,MAAM,KAAK,YAAY;AACvC,UAAM,SAAS,KAAK,uBAAuB;AAC3C,WAAO,YAAY,KAAK,UAAU;AAClC,SAAK,QAAQ,KAAK,YAAYA,UAAS,MAAM,EAAE,OAAO;AACtD,QAAI,KAAK,MAAM,iBAAiB;AAC5B,WAAK,MAAM,gBAAgB,KAAK,KAAK;AAAA,IACzC;AAAA,EACJ;AAAA,EAEA,yBAA+B;AAC3B,QAAI,EAAE,YAAY,OAAO,iBAAiB,QAAQ,GAAG,OAAO,IAAI,KAAK;AACrE,WAAO;AAAA,EACX;AAAA,EAEA,uBAAwB;AACpB,SAAK,aAAa;AAAA,EACtB;AAAA,EAEA,eAAgB;AACZ,QAAI,KAAK,SAAU,KAAK,MAAc,UAAU,aAAa;AACzD,WAAK,MAAM,QAAQ;AAAA,IACvB;AAAA,EACJ;AAAA,EAEA,cAAiC;AAC7B,UAAM,WAAW,KAAK,YAAY;AAClC,QAAI,CAAC,YAAW,eAAe,QAAQ,GAAG;AACtC,kBAAW,eAAe,QAAQ,IAAI,IAAI,QAAiB,CAAC,SAAS,WAAW;AAC5E,cAAM,SAAS,SAAS,KAAK,YAAY,SAAS,cAAc,QAAQ,CAAC;AAEzE,eAAO,UAAU;AACjB,eAAO,SAAS,MAAM;AAClB,kBAAQ,OAAO;AAAA,QACnB;AACA,eAAO,UAAU,MAAM,OAAO,kBAAkB,OAAO,GAAG,EAAE;AAC5D,eAAO,MAAM;AAAA,MACjB,CAAC;AAAA,IACL;AAEA,WAAO,YAAW,eAAe,QAAQ;AAAA,EAC7C;AAAA,EAEA,SAA2B;AACvB,WACI,oCAAC,SAAI,KAAK,KAAK,WAAyD,OAAO,EAAC,UAAU,QAAQ,SAAS,OAAM,GAAG;AAAA,EAE5H;AACJ;AArF8B,YAKX,iBAAsD,CAAC;AAL5C,YAOnB,eAAe;AAAA,EAClB,YAAY;AAChB;AATJ,IAA8B,aAA9B;","names":["seatsio"]}

package/build/SeatsioDesigner.js

@@ -57,24 +57,29 @@ var didPropsChange = (prevProps, nextProps) => {
 };
 
 // src/main/Embeddable.tsx
-var Embeddable = class extends React.Component {
+var _Embeddable = class _Embeddable extends React.Component {
   constructor(props) {
     super(props);
     this.container = React.createRef();
+    this.firstRender = true;
   }
-  async componentDidMount() {
-    if (!this.rendering) {
-      this.rendering = this.createAndRenderChart();
+  componentDidMount() {
+    if (!_Embeddable.seatsioBundles[this.getChartUrl()] || this.firstRender) {
+      this.createAndRenderChart();
+      this.firstRender = false;
     }
   }
-  async componentDidUpdate(prevProps) {
+  componentDidUpdate(prevProps) {
     if (didPropsChange(this.props, prevProps) && this.chart) {
       this.destroyChart();
       this.createAndRenderChart();
     }
   }
+  getChartUrl() {
+    return this.props.chartJsUrl.replace("{region}", this.props.region);
+  }
   async createAndRenderChart() {
-    const seatsio2 = await this.getSeatsio();
+    const seatsio2 = await this.loadSeatsio();
     const config = this.extractConfigFromProps();
     config.container = this.container.current;
     this.chart = this.createChart(seatsio2, config).render();
@@ -94,35 +99,30 @@ var Embeddable = class extends React.Component {
       this.chart.destroy();
     }
   }
-  getSeatsio() {
-    if (typeof seatsio === "undefined") {
-      return this.loadSeatsio();
-    } else if (seatsio.region !== this.props.region) {
-      seatsio = void 0;
-      return this.loadSeatsio();
-    } else {
-      return Promise.resolve(seatsio);
-    }
-  }
   loadSeatsio() {
-    return new Promise((resolve, reject) => {
-      let script = document.createElement("script");
-      script.onload = () => {
-        seatsio.region = this.props.region;
-        resolve(seatsio);
-      };
-      script.onerror = () => reject(`Could not load ${script.src}`);
-      script.src = this.props.chartJsUrl.replace("{region}", this.props.region);
-      document.head.appendChild(script);
-    });
+    const chartUrl = this.getChartUrl();
+    if (!_Embeddable.seatsioBundles[chartUrl]) {
+      _Embeddable.seatsioBundles[chartUrl] = new Promise((resolve, reject) => {
+        const script = document.head.appendChild(document.createElement("script"));
+        window.seatsio = void 0;
+        script.onload = () => {
+          resolve(seatsio);
+        };
+        script.onerror = () => reject(`Could not load ${script.src}`);
+        script.src = chartUrl;
+      });
+    }
+    return _Embeddable.seatsioBundles[chartUrl];
   }
   render() {
     return /* @__PURE__ */ React.createElement("div", { ref: this.container, style: { "height": "100%", "width": "100%" } });
   }
 };
-Embeddable.defaultProps = {
+_Embeddable.seatsioBundles = {};
+_Embeddable.defaultProps = {
   chartJsUrl: "https://cdn-{region}.seatsio.net/chart.js"
 };
+var Embeddable = _Embeddable;
 
 // src/main/SeatsioDesigner.tsx
 var SeatsioDesigner = class extends Embeddable {

package/build/SeatsioDesigner.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/main/SeatsioDesigner.tsx","../src/main/Embeddable.tsx","../src/main/util.ts"],"sourcesContent":["import Embeddable from './Embeddable'\nimport { ChartDesignerConfigOptions, Seatsio } from '@seatsio/seatsio-types'\n\nexport default class SeatsioDesigner extends Embeddable<ChartDesignerConfigOptions> {\n    createChart (seatsio: Seatsio, config: ChartDesignerConfigOptions) {\n        return new seatsio.SeatingChartDesigner(config)\n    }\n}","import * as React from 'react'\nimport {didPropsChange} from './util'\nimport { ChartDesigner, CommonConfigOptions, EventManager, Region, SeatingChart, Seatsio } from '@seatsio/seatsio-types'\n\nexport type EmbeddableProps<T> = {\n    onRenderStarted?: (chart: SeatingChart) => void\n    chartJsUrl?: string\n    region: Region\n} & T\n\nexport default abstract class Embeddable<T extends CommonConfigOptions> extends React.Component<EmbeddableProps<T>> {\n    private container: React.RefObject<HTMLDivElement>\n    private rendering?: Promise<void>\n    private chart: SeatingChart\n\n    static defaultProps = {\n        chartJsUrl: 'https://cdn-{region}.seatsio.net/chart.js'\n    }\n\n    constructor(props: EmbeddableProps<T>) {\n        super(props);\n        this.container = React.createRef();\n    }\n\n    abstract createChart (seatsio: Seatsio, config: T): SeatingChart | EventManager | ChartDesigner\n\n    async componentDidMount () {\n        if(!this.rendering) {\n            this.rendering = this.createAndRenderChart()\n        }\n    }\n\n    async componentDidUpdate (prevProps: EmbeddableProps<T>) {\n        if (didPropsChange(this.props, prevProps) && this.chart) {\n            this.destroyChart()\n            this.createAndRenderChart()\n        }\n    }\n\n    async createAndRenderChart () {\n        const seatsio = await this.getSeatsio()\n        const config = this.extractConfigFromProps()\n        config.container = this.container.current\n        this.chart = this.createChart(seatsio, config).render()\n        if (this.props.onRenderStarted) {\n            this.props.onRenderStarted(this.chart)\n        }\n    }\n\n    extractConfigFromProps (): any {\n        // noinspection JSUnusedLocalSymbols\n        let { chartJsUrl, divId, onRenderStarted, region, ...config } = this.props\n        return config\n    }\n\n    componentWillUnmount () {\n        this.destroyChart()\n    }\n\n    destroyChart () {\n        if (this.chart && (this.chart as any).state !== 'DESTROYED') {\n            this.chart.destroy()\n        }\n    }\n\n    getSeatsio () {\n        if (typeof seatsio === 'undefined') {\n            return this.loadSeatsio()\n        } else if (seatsio.region !== this.props.region) {\n            seatsio = undefined\n            return this.loadSeatsio()\n        } else {\n            return Promise.resolve(seatsio)\n        }\n    }\n\n    loadSeatsio () {\n        return new Promise((resolve, reject) => {\n            let script = document.createElement('script')\n            script.onload = () => {\n                seatsio.region = this.props.region\n                resolve(seatsio)\n            }\n            script.onerror = () => reject(`Could not load ${script.src}`)\n            script.src = this.props.chartJsUrl.replace('{region}', this.props.region)\n            document.head.appendChild(script)\n        })\n    }\n\n    render (): React.ReactNode {\n        return (\n            <div ref={this.container as unknown as React.RefObject<HTMLDivElement>} style={{'height': '100%', 'width': '100%'}} />\n        )\n    }\n}","import { BoothProps, GeneralAdmissionAreaProps, InteractiveObjectProps, InteractiveSectionProps, SeatProps, SelectableObjectProps, TableProps } from \"@seatsio/seatsio-types\"\n\nexport const didPropsChange = <P extends { [key: string]: any}>(prevProps: P, nextProps: P): boolean => {\n    if (Object.keys(prevProps).length !== Object.keys(nextProps).length) {\n        return true\n    }\n    return Object.keys(nextProps).some((propName: string) => {\n        let prevValue = prevProps[propName]\n        let nextValue = nextProps[propName]\n        if (prevValue && nextValue) {\n            if (typeof prevValue === 'function' && typeof nextValue === 'function') {\n                return prevValue.toString() !== nextValue.toString()\n            }\n            if (typeof prevValue === 'object' && typeof nextValue === 'object') {\n                return didPropsChange(prevValue, nextValue)\n            }\n        }\n        return prevValue !== nextValue\n    })\n}\n\nexport const isSeat = (obj: SelectableObjectProps): obj is SeatProps => obj.objectType === 'Seat'\nexport const isTable = (obj: SelectableObjectProps): obj is TableProps => obj.objectType === 'Table'\nexport const isSection = (obj: SelectableObjectProps): obj is InteractiveSectionProps => obj.objectType === 'section'\nexport const isBooth = (obj: SelectableObjectProps): obj is BoothProps => obj.objectType === 'Booth'\nexport const isGeneralAdmission = (obj: SelectableObjectProps): obj is GeneralAdmissionAreaProps => obj.objectType === 'GeneralAdmissionArea'"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,YAAuB;;;ACEhB,IAAM,iBAAiB,CAAkC,WAAc,cAA0B;AACpG,MAAI,OAAO,KAAK,SAAS,EAAE,WAAW,OAAO,KAAK,SAAS,EAAE,QAAQ;AACjE,WAAO;AAAA,EACX;AACA,SAAO,OAAO,KAAK,SAAS,EAAE,KAAK,CAAC,aAAqB;AACrD,QAAI,YAAY,UAAU,QAAQ;AAClC,QAAI,YAAY,UAAU,QAAQ;AAClC,QAAI,aAAa,WAAW;AACxB,UAAI,OAAO,cAAc,cAAc,OAAO,cAAc,YAAY;AACpE,eAAO,UAAU,SAAS,MAAM,UAAU,SAAS;AAAA,MACvD;AACA,UAAI,OAAO,cAAc,YAAY,OAAO,cAAc,UAAU;AAChE,eAAO,eAAe,WAAW,SAAS;AAAA,MAC9C;AAAA,IACJ;AACA,WAAO,cAAc;AAAA,EACzB,CAAC;AACL;;;ADTA,IAA8B,aAA9B,cAAsF,gBAA8B;AAAA,EAShH,YAAY,OAA2B;AACnC,UAAM,KAAK;AACX,SAAK,YAAkB,gBAAU;AAAA,EACrC;AAAA,EAIA,MAAM,oBAAqB;AACvB,QAAG,CAAC,KAAK,WAAW;AAChB,WAAK,YAAY,KAAK,qBAAqB;AAAA,IAC/C;AAAA,EACJ;AAAA,EAEA,MAAM,mBAAoB,WAA+B;AACrD,QAAI,eAAe,KAAK,OAAO,SAAS,KAAK,KAAK,OAAO;AACrD,WAAK,aAAa;AAClB,WAAK,qBAAqB;AAAA,IAC9B;AAAA,EACJ;AAAA,EAEA,MAAM,uBAAwB;AAC1B,UAAMA,WAAU,MAAM,KAAK,WAAW;AACtC,UAAM,SAAS,KAAK,uBAAuB;AAC3C,WAAO,YAAY,KAAK,UAAU;AAClC,SAAK,QAAQ,KAAK,YAAYA,UAAS,MAAM,EAAE,OAAO;AACtD,QAAI,KAAK,MAAM,iBAAiB;AAC5B,WAAK,MAAM,gBAAgB,KAAK,KAAK;AAAA,IACzC;AAAA,EACJ;AAAA,EAEA,yBAA+B;AAE3B,QAAI,EAAE,YAAY,OAAO,iBAAiB,QAAQ,GAAG,OAAO,IAAI,KAAK;AACrE,WAAO;AAAA,EACX;AAAA,EAEA,uBAAwB;AACpB,SAAK,aAAa;AAAA,EACtB;AAAA,EAEA,eAAgB;AACZ,QAAI,KAAK,SAAU,KAAK,MAAc,UAAU,aAAa;AACzD,WAAK,MAAM,QAAQ;AAAA,IACvB;AAAA,EACJ;AAAA,EAEA,aAAc;AACV,QAAI,OAAO,YAAY,aAAa;AAChC,aAAO,KAAK,YAAY;AAAA,IAC5B,WAAW,QAAQ,WAAW,KAAK,MAAM,QAAQ;AAC7C,gBAAU;AACV,aAAO,KAAK,YAAY;AAAA,IAC5B,OAAO;AACH,aAAO,QAAQ,QAAQ,OAAO;AAAA,IAClC;AAAA,EACJ;AAAA,EAEA,cAAe;AACX,WAAO,IAAI,QAAQ,CAAC,SAAS,WAAW;AACpC,UAAI,SAAS,SAAS,cAAc,QAAQ;AAC5C,aAAO,SAAS,MAAM;AAClB,gBAAQ,SAAS,KAAK,MAAM;AAC5B,gBAAQ,OAAO;AAAA,MACnB;AACA,aAAO,UAAU,MAAM,OAAO,kBAAkB,OAAO,GAAG,EAAE;AAC5D,aAAO,MAAM,KAAK,MAAM,WAAW,QAAQ,YAAY,KAAK,MAAM,MAAM;AACxE,eAAS,KAAK,YAAY,MAAM;AAAA,IACpC,CAAC;AAAA,EACL;AAAA,EAEA,SAA2B;AACvB,WACI,oCAAC,SAAI,KAAK,KAAK,WAAyD,OAAO,EAAC,UAAU,QAAQ,SAAS,OAAM,GAAG;AAAA,EAE5H;AACJ;AApF8B,WAKnB,eAAe;AAAA,EAClB,YAAY;AAChB;;;ADdJ,IAAqB,kBAArB,cAA6C,WAAuC;AAAA,EAChF,YAAaC,UAAkB,QAAoC;AAC/D,WAAO,IAAIA,SAAQ,qBAAqB,MAAM;AAAA,EAClD;AACJ;","names":["seatsio","seatsio"]}
+{"version":3,"sources":["../src/main/SeatsioDesigner.tsx","../src/main/Embeddable.tsx","../src/main/util.ts"],"sourcesContent":["import Embeddable from './Embeddable'\nimport { ChartDesignerConfigOptions, Seatsio } from '@seatsio/seatsio-types'\n\nexport default class SeatsioDesigner extends Embeddable<ChartDesignerConfigOptions> {\n    createChart (seatsio: Seatsio, config: ChartDesignerConfigOptions) {\n        return new seatsio.SeatingChartDesigner(config)\n    }\n}","import * as React from 'react'\nimport {didPropsChange} from './util'\nimport { ChartDesigner, CommonConfigOptions, EventManager, Region, SeatingChart, Seatsio } from '@seatsio/seatsio-types'\n\nexport type EmbeddableProps<T > = {\n    onRenderStarted?: (chart: SeatingChart | EventManager) => void\n    chartJsUrl?: string\n    region: Region\n} & T\n\nexport default abstract class Embeddable<T extends CommonConfigOptions> extends React.Component<EmbeddableProps<T>> {\n    private container: React.RefObject<HTMLDivElement>\n    private chart: SeatingChart\n    private firstRender: boolean\n\n    private static seatsioBundles: { [key: string]: Promise<Seatsio> } = {}\n\n    static defaultProps = {\n        chartJsUrl: 'https://cdn-{region}.seatsio.net/chart.js'\n    }\n\n    constructor(props: EmbeddableProps<T>) {\n        super(props);\n        this.container = React.createRef()\n        this.firstRender = true\n    }\n\n    abstract createChart (seatsio: Seatsio, config: T): SeatingChart | EventManager | ChartDesigner\n\n    componentDidMount () {\n        if (!Embeddable.seatsioBundles[this.getChartUrl()] || this.firstRender) {\n            this.createAndRenderChart()\n            this.firstRender = false\n        }\n    }\n\n    componentDidUpdate (prevProps: EmbeddableProps<T>) {\n        if (didPropsChange(this.props, prevProps) && this.chart) {\n            this.destroyChart()\n            this.createAndRenderChart()\n        }\n    }\n\n    getChartUrl () {\n        return this.props.chartJsUrl.replace('{region}', this.props.region)\n    }\n\n    async createAndRenderChart () {\n        const seatsio = await this.loadSeatsio()\n        const config = this.extractConfigFromProps()\n        config.container = this.container.current\n        this.chart = this.createChart(seatsio, config).render()\n        if (this.props.onRenderStarted) {\n            this.props.onRenderStarted(this.chart)\n        }\n    }\n\n    extractConfigFromProps (): any {\n        let { chartJsUrl, divId, onRenderStarted, region, ...config } = this.props\n        return config\n    }\n\n    componentWillUnmount () {\n        this.destroyChart()\n    }\n\n    destroyChart () {\n        if (this.chart && (this.chart as any).state !== 'DESTROYED') {\n            this.chart.destroy()\n        }\n    }\n\n    loadSeatsio (): Promise<Seatsio> {\n        const chartUrl = this.getChartUrl()\n        if (!Embeddable.seatsioBundles[chartUrl]) {\n            Embeddable.seatsioBundles[chartUrl] = new Promise<Seatsio>((resolve, reject) => {\n                const script = document.head.appendChild(document.createElement('script'))\n                // Seatsio global is not replaced if already present, which would cause the wrong region bundle to resolve when changing region\n                window.seatsio = undefined\n                script.onload = () => {\n                    resolve(seatsio)\n                }\n                script.onerror = () => reject(`Could not load ${script.src}`)\n                script.src = chartUrl\n            })\n        }\n\n        return Embeddable.seatsioBundles[chartUrl]\n    }\n\n    render (): React.ReactNode {\n        return (\n            <div ref={this.container as unknown as React.RefObject<HTMLDivElement>} style={{'height': '100%', 'width': '100%'}} />\n        )\n    }\n}","import { BoothProps, GeneralAdmissionAreaProps, InteractiveObjectProps, InteractiveSectionProps, SeatProps, SelectableObjectProps, TableProps } from \"@seatsio/seatsio-types\"\n\nexport const didPropsChange = <P extends { [key: string]: any}>(prevProps: P, nextProps: P): boolean => {\n    if (Object.keys(prevProps).length !== Object.keys(nextProps).length) {\n        return true\n    }\n    return Object.keys(nextProps).some((propName: string) => {\n        let prevValue = prevProps[propName]\n        let nextValue = nextProps[propName]\n        if (prevValue && nextValue) {\n            if (typeof prevValue === 'function' && typeof nextValue === 'function') {\n                return prevValue.toString() !== nextValue.toString()\n            }\n            if (typeof prevValue === 'object' && typeof nextValue === 'object') {\n                return didPropsChange(prevValue, nextValue)\n            }\n        }\n        return prevValue !== nextValue\n    })\n}\n\nexport const isSeat = (obj: SelectableObjectProps): obj is SeatProps => obj.objectType === 'Seat'\nexport const isTable = (obj: SelectableObjectProps): obj is TableProps => obj.objectType === 'Table'\nexport const isSection = (obj: SelectableObjectProps): obj is InteractiveSectionProps => obj.objectType === 'section'\nexport const isBooth = (obj: SelectableObjectProps): obj is BoothProps => obj.objectType === 'Booth'\nexport const isGeneralAdmission = (obj: SelectableObjectProps): obj is GeneralAdmissionAreaProps => obj.objectType === 'GeneralAdmissionArea'"],"mappings":"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","names":["seatsio","seatsio"]}

package/build/SeatsioDesigner.mjs

@@ -22,24 +22,29 @@ var didPropsChange = (prevProps, nextProps) => {
 };
 
 // src/main/Embeddable.tsx
-var Embeddable = class extends React.Component {
+var _Embeddable = class _Embeddable extends React.Component {
   constructor(props) {
     super(props);
     this.container = React.createRef();
+    this.firstRender = true;
   }
-  async componentDidMount() {
-    if (!this.rendering) {
-      this.rendering = this.createAndRenderChart();
+  componentDidMount() {
+    if (!_Embeddable.seatsioBundles[this.getChartUrl()] || this.firstRender) {
+      this.createAndRenderChart();
+      this.firstRender = false;
     }
   }
-  async componentDidUpdate(prevProps) {
+  componentDidUpdate(prevProps) {
     if (didPropsChange(this.props, prevProps) && this.chart) {
       this.destroyChart();
       this.createAndRenderChart();
     }
   }
+  getChartUrl() {
+    return this.props.chartJsUrl.replace("{region}", this.props.region);
+  }
   async createAndRenderChart() {
-    const seatsio2 = await this.getSeatsio();
+    const seatsio2 = await this.loadSeatsio();
     const config = this.extractConfigFromProps();
     config.container = this.container.current;
     this.chart = this.createChart(seatsio2, config).render();
@@ -59,35 +64,30 @@ var Embeddable = class extends React.Component {
       this.chart.destroy();
     }
   }
-  getSeatsio() {
-    if (typeof seatsio === "undefined") {
-      return this.loadSeatsio();
-    } else if (seatsio.region !== this.props.region) {
-      seatsio = void 0;
-      return this.loadSeatsio();
-    } else {
-      return Promise.resolve(seatsio);
-    }
-  }
   loadSeatsio() {
-    return new Promise((resolve, reject) => {
-      let script = document.createElement("script");
-      script.onload = () => {
-        seatsio.region = this.props.region;
-        resolve(seatsio);
-      };
-      script.onerror = () => reject(`Could not load ${script.src}`);
-      script.src = this.props.chartJsUrl.replace("{region}", this.props.region);
-      document.head.appendChild(script);
-    });
+    const chartUrl = this.getChartUrl();
+    if (!_Embeddable.seatsioBundles[chartUrl]) {
+      _Embeddable.seatsioBundles[chartUrl] = new Promise((resolve, reject) => {
+        const script = document.head.appendChild(document.createElement("script"));
+        window.seatsio = void 0;
+        script.onload = () => {
+          resolve(seatsio);
+        };
+        script.onerror = () => reject(`Could not load ${script.src}`);
+        script.src = chartUrl;
+      });
+    }
+    return _Embeddable.seatsioBundles[chartUrl];
   }
   render() {
     return /* @__PURE__ */ React.createElement("div", { ref: this.container, style: { "height": "100%", "width": "100%" } });
   }
 };
-Embeddable.defaultProps = {
+_Embeddable.seatsioBundles = {};
+_Embeddable.defaultProps = {
   chartJsUrl: "https://cdn-{region}.seatsio.net/chart.js"
 };
+var Embeddable = _Embeddable;
 
 // src/main/SeatsioDesigner.tsx
 var SeatsioDesigner = class extends Embeddable {

package/build/SeatsioDesigner.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/main/Embeddable.tsx","../src/main/util.ts","../src/main/SeatsioDesigner.tsx"],"sourcesContent":["import * as React from 'react'\nimport {didPropsChange} from './util'\nimport { ChartDesigner, CommonConfigOptions, EventManager, Region, SeatingChart, Seatsio } from '@seatsio/seatsio-types'\n\nexport type EmbeddableProps<T> = {\n    onRenderStarted?: (chart: SeatingChart) => void\n    chartJsUrl?: string\n    region: Region\n} & T\n\nexport default abstract class Embeddable<T extends CommonConfigOptions> extends React.Component<EmbeddableProps<T>> {\n    private container: React.RefObject<HTMLDivElement>\n    private rendering?: Promise<void>\n    private chart: SeatingChart\n\n    static defaultProps = {\n        chartJsUrl: 'https://cdn-{region}.seatsio.net/chart.js'\n    }\n\n    constructor(props: EmbeddableProps<T>) {\n        super(props);\n        this.container = React.createRef();\n    }\n\n    abstract createChart (seatsio: Seatsio, config: T): SeatingChart | EventManager | ChartDesigner\n\n    async componentDidMount () {\n        if(!this.rendering) {\n            this.rendering = this.createAndRenderChart()\n        }\n    }\n\n    async componentDidUpdate (prevProps: EmbeddableProps<T>) {\n        if (didPropsChange(this.props, prevProps) && this.chart) {\n            this.destroyChart()\n            this.createAndRenderChart()\n        }\n    }\n\n    async createAndRenderChart () {\n        const seatsio = await this.getSeatsio()\n        const config = this.extractConfigFromProps()\n        config.container = this.container.current\n        this.chart = this.createChart(seatsio, config).render()\n        if (this.props.onRenderStarted) {\n            this.props.onRenderStarted(this.chart)\n        }\n    }\n\n    extractConfigFromProps (): any {\n        // noinspection JSUnusedLocalSymbols\n        let { chartJsUrl, divId, onRenderStarted, region, ...config } = this.props\n        return config\n    }\n\n    componentWillUnmount () {\n        this.destroyChart()\n    }\n\n    destroyChart () {\n        if (this.chart && (this.chart as any).state !== 'DESTROYED') {\n            this.chart.destroy()\n        }\n    }\n\n    getSeatsio () {\n        if (typeof seatsio === 'undefined') {\n            return this.loadSeatsio()\n        } else if (seatsio.region !== this.props.region) {\n            seatsio = undefined\n            return this.loadSeatsio()\n        } else {\n            return Promise.resolve(seatsio)\n        }\n    }\n\n    loadSeatsio () {\n        return new Promise((resolve, reject) => {\n            let script = document.createElement('script')\n            script.onload = () => {\n                seatsio.region = this.props.region\n                resolve(seatsio)\n            }\n            script.onerror = () => reject(`Could not load ${script.src}`)\n            script.src = this.props.chartJsUrl.replace('{region}', this.props.region)\n            document.head.appendChild(script)\n        })\n    }\n\n    render (): React.ReactNode {\n        return (\n            <div ref={this.container as unknown as React.RefObject<HTMLDivElement>} style={{'height': '100%', 'width': '100%'}} />\n        )\n    }\n}","import { BoothProps, GeneralAdmissionAreaProps, InteractiveObjectProps, InteractiveSectionProps, SeatProps, SelectableObjectProps, TableProps } from \"@seatsio/seatsio-types\"\n\nexport const didPropsChange = <P extends { [key: string]: any}>(prevProps: P, nextProps: P): boolean => {\n    if (Object.keys(prevProps).length !== Object.keys(nextProps).length) {\n        return true\n    }\n    return Object.keys(nextProps).some((propName: string) => {\n        let prevValue = prevProps[propName]\n        let nextValue = nextProps[propName]\n        if (prevValue && nextValue) {\n            if (typeof prevValue === 'function' && typeof nextValue === 'function') {\n                return prevValue.toString() !== nextValue.toString()\n            }\n            if (typeof prevValue === 'object' && typeof nextValue === 'object') {\n                return didPropsChange(prevValue, nextValue)\n            }\n        }\n        return prevValue !== nextValue\n    })\n}\n\nexport const isSeat = (obj: SelectableObjectProps): obj is SeatProps => obj.objectType === 'Seat'\nexport const isTable = (obj: SelectableObjectProps): obj is TableProps => obj.objectType === 'Table'\nexport const isSection = (obj: SelectableObjectProps): obj is InteractiveSectionProps => obj.objectType === 'section'\nexport const isBooth = (obj: SelectableObjectProps): obj is BoothProps => obj.objectType === 'Booth'\nexport const isGeneralAdmission = (obj: SelectableObjectProps): obj is GeneralAdmissionAreaProps => obj.objectType === 'GeneralAdmissionArea'","import Embeddable from './Embeddable'\nimport { ChartDesignerConfigOptions, Seatsio } from '@seatsio/seatsio-types'\n\nexport default class SeatsioDesigner extends Embeddable<ChartDesignerConfigOptions> {\n    createChart (seatsio: Seatsio, config: ChartDesignerConfigOptions) {\n        return new seatsio.SeatingChartDesigner(config)\n    }\n}"],"mappings":"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","names":["seatsio","seatsio"]}
+{"version":3,"sources":["../src/main/Embeddable.tsx","../src/main/util.ts","../src/main/SeatsioDesigner.tsx"],"sourcesContent":["import * as React from 'react'\nimport {didPropsChange} from './util'\nimport { ChartDesigner, CommonConfigOptions, EventManager, Region, SeatingChart, Seatsio } from '@seatsio/seatsio-types'\n\nexport type EmbeddableProps<T > = {\n    onRenderStarted?: (chart: SeatingChart | EventManager) => void\n    chartJsUrl?: string\n    region: Region\n} & T\n\nexport default abstract class Embeddable<T extends CommonConfigOptions> extends React.Component<EmbeddableProps<T>> {\n    private container: React.RefObject<HTMLDivElement>\n    private chart: SeatingChart\n    private firstRender: boolean\n\n    private static seatsioBundles: { [key: string]: Promise<Seatsio> } = {}\n\n    static defaultProps = {\n        chartJsUrl: 'https://cdn-{region}.seatsio.net/chart.js'\n    }\n\n    constructor(props: EmbeddableProps<T>) {\n        super(props);\n        this.container = React.createRef()\n        this.firstRender = true\n    }\n\n    abstract createChart (seatsio: Seatsio, config: T): SeatingChart | EventManager | ChartDesigner\n\n    componentDidMount () {\n        if (!Embeddable.seatsioBundles[this.getChartUrl()] || this.firstRender) {\n            this.createAndRenderChart()\n            this.firstRender = false\n        }\n    }\n\n    componentDidUpdate (prevProps: EmbeddableProps<T>) {\n        if (didPropsChange(this.props, prevProps) && this.chart) {\n            this.destroyChart()\n            this.createAndRenderChart()\n        }\n    }\n\n    getChartUrl () {\n        return this.props.chartJsUrl.replace('{region}', this.props.region)\n    }\n\n    async createAndRenderChart () {\n        const seatsio = await this.loadSeatsio()\n        const config = this.extractConfigFromProps()\n        config.container = this.container.current\n        this.chart = this.createChart(seatsio, config).render()\n        if (this.props.onRenderStarted) {\n            this.props.onRenderStarted(this.chart)\n        }\n    }\n\n    extractConfigFromProps (): any {\n        let { chartJsUrl, divId, onRenderStarted, region, ...config } = this.props\n        return config\n    }\n\n    componentWillUnmount () {\n        this.destroyChart()\n    }\n\n    destroyChart () {\n        if (this.chart && (this.chart as any).state !== 'DESTROYED') {\n            this.chart.destroy()\n        }\n    }\n\n    loadSeatsio (): Promise<Seatsio> {\n        const chartUrl = this.getChartUrl()\n        if (!Embeddable.seatsioBundles[chartUrl]) {\n            Embeddable.seatsioBundles[chartUrl] = new Promise<Seatsio>((resolve, reject) => {\n                const script = document.head.appendChild(document.createElement('script'))\n                // Seatsio global is not replaced if already present, which would cause the wrong region bundle to resolve when changing region\n                window.seatsio = undefined\n                script.onload = () => {\n                    resolve(seatsio)\n                }\n                script.onerror = () => reject(`Could not load ${script.src}`)\n                script.src = chartUrl\n            })\n        }\n\n        return Embeddable.seatsioBundles[chartUrl]\n    }\n\n    render (): React.ReactNode {\n        return (\n            <div ref={this.container as unknown as React.RefObject<HTMLDivElement>} style={{'height': '100%', 'width': '100%'}} />\n        )\n    }\n}","import { BoothProps, GeneralAdmissionAreaProps, InteractiveObjectProps, InteractiveSectionProps, SeatProps, SelectableObjectProps, TableProps } from \"@seatsio/seatsio-types\"\n\nexport const didPropsChange = <P extends { [key: string]: any}>(prevProps: P, nextProps: P): boolean => {\n    if (Object.keys(prevProps).length !== Object.keys(nextProps).length) {\n        return true\n    }\n    return Object.keys(nextProps).some((propName: string) => {\n        let prevValue = prevProps[propName]\n        let nextValue = nextProps[propName]\n        if (prevValue && nextValue) {\n            if (typeof prevValue === 'function' && typeof nextValue === 'function') {\n                return prevValue.toString() !== nextValue.toString()\n            }\n            if (typeof prevValue === 'object' && typeof nextValue === 'object') {\n                return didPropsChange(prevValue, nextValue)\n            }\n        }\n        return prevValue !== nextValue\n    })\n}\n\nexport const isSeat = (obj: SelectableObjectProps): obj is SeatProps => obj.objectType === 'Seat'\nexport const isTable = (obj: SelectableObjectProps): obj is TableProps => obj.objectType === 'Table'\nexport const isSection = (obj: SelectableObjectProps): obj is InteractiveSectionProps => obj.objectType === 'section'\nexport const isBooth = (obj: SelectableObjectProps): obj is BoothProps => obj.objectType === 'Booth'\nexport const isGeneralAdmission = (obj: SelectableObjectProps): obj is GeneralAdmissionAreaProps => obj.objectType === 'GeneralAdmissionArea'","import Embeddable from './Embeddable'\nimport { ChartDesignerConfigOptions, Seatsio } from '@seatsio/seatsio-types'\n\nexport default class SeatsioDesigner extends Embeddable<ChartDesignerConfigOptions> {\n    createChart (seatsio: Seatsio, config: ChartDesignerConfigOptions) {\n        return new seatsio.SeatingChartDesigner(config)\n    }\n}"],"mappings":"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","names":["seatsio","seatsio"]}