@placetopay/lightbox-sdk 1.0.0 → 2.0.0

package/README.md

@@ -1,18 +1,6 @@
 # Lightbox-sdk
-Small javascript library to encapsulate websites in a lightbox with configurable styles and behaviors.
+Lightbox SDK is a comprehensive npm library designed to facilitate the creation and manipulation of iframes within your application in the form of modals.
 
-The library consists of 2 parts:
+## Getting Started
 
-- LightboxApp
-- LightboxClient
-
-If you have a site A, and within it you want to display a site B using Lightbox-sdk:
-
-On site A the LightboxClient will be used (site that will display a lightbox)
-
-- It will define which site will be displayed in the lightbox
-- It will define the callbacks for each lightbox event
-
-On site B LightboxApp will be used (site that will be shown in a lightbox)
-
-- Define the event emission logic
+Please follow the documentation at [Lightbox SDK Docs](https://placetopay-org.github.io/lightbox-sdk/)!

package/dist/config.d.ts

@@ -1,6 +1,6 @@
-export declare const Config: {
-    defaultDimension: {
-        height: number;
-        width: number;
-    };
-};
+export declare const Config: {
+    defaultDimension: {
+        height: number;
+        width: number;
+    };
+};

package/dist/config.js

@@ -1,4 +1,4 @@
-import { Dimensions } from './constants';
-export const Config = {
-    defaultDimension: Dimensions.MD,
-};
+import { Dimensions } from './constants';
+export const Config = {
+    defaultDimension: Dimensions.MD,
+};

package/dist/constants.d.ts

@@ -1,31 +1,31 @@
-export declare enum ElementIds {
-    WRAPPER_ID = "placetopay_lightbox_wrapper",
-    IFRAME_ID = "placetopay_lightbox",
-    CLOSE_BUTTON_ID = "placetopay_close_button",
-    STYLES_ID = "placetopay-lightbox"
-}
-export declare enum LightboxAppEvents {
-    CLOSE = "lightbox:close",
-    SEND_STYLES = "lightbox:sendStyles",
-    HIDE_CLOSE_BUTTON = "lightbox:hideCloseButton"
-}
-export declare enum Styles {
-    BACKGROUND_COLOR = "--placetopay-lightbox-background-color",
-    ROUNDED = "--placetopay-lightbox-border-radius",
-    MAX_HEIGHT = "--placetopay-lightbox-max-height",
-    MAX_WIDTH = "--placetopay-lightbox-max-width"
-}
-export declare const Dimensions: {
-    SM: {
-        height: number;
-        width: number;
-    };
-    MD: {
-        height: number;
-        width: number;
-    };
-    LG: {
-        height: number;
-        width: number;
-    };
-};
+export declare enum ElementIds {
+    WRAPPER_ID = "placetopay_lightbox_wrapper",
+    IFRAME_ID = "placetopay_lightbox",
+    CLOSE_BUTTON_ID = "placetopay_close_button",
+    STYLES_ID = "placetopay-lightbox"
+}
+export declare enum LightboxEvents {
+    CLOSE = "close",
+    UPDATE_STYLES = "updateStyles",
+    HIDE_CLOSE_BUTTON = "hideCloseButton"
+}
+export declare enum Styles {
+    BACKGROUND_COLOR = "--placetopay-lightbox-background-color",
+    ROUNDED = "--placetopay-lightbox-border-radius",
+    MAX_HEIGHT = "--placetopay-lightbox-max-height",
+    MAX_WIDTH = "--placetopay-lightbox-max-width"
+}
+export declare const Dimensions: {
+    SM: {
+        height: number;
+        width: number;
+    };
+    MD: {
+        height: number;
+        width: number;
+    };
+    LG: {
+        height: number;
+        width: number;
+    };
+};

package/dist/constants.js

@@ -1,25 +1,25 @@
-export var ElementIds;
-(function (ElementIds) {
-    ElementIds["WRAPPER_ID"] = "placetopay_lightbox_wrapper";
-    ElementIds["IFRAME_ID"] = "placetopay_lightbox";
-    ElementIds["CLOSE_BUTTON_ID"] = "placetopay_close_button";
-    ElementIds["STYLES_ID"] = "placetopay-lightbox";
-})(ElementIds || (ElementIds = {}));
-export var LightboxAppEvents;
-(function (LightboxAppEvents) {
-    LightboxAppEvents["CLOSE"] = "lightbox:close";
-    LightboxAppEvents["SEND_STYLES"] = "lightbox:sendStyles";
-    LightboxAppEvents["HIDE_CLOSE_BUTTON"] = "lightbox:hideCloseButton";
-})(LightboxAppEvents || (LightboxAppEvents = {}));
-export var Styles;
-(function (Styles) {
-    Styles["BACKGROUND_COLOR"] = "--placetopay-lightbox-background-color";
-    Styles["ROUNDED"] = "--placetopay-lightbox-border-radius";
-    Styles["MAX_HEIGHT"] = "--placetopay-lightbox-max-height";
-    Styles["MAX_WIDTH"] = "--placetopay-lightbox-max-width";
-})(Styles || (Styles = {}));
-export const Dimensions = {
-    SM: { height: 400, width: 320 },
-    MD: { height: 640, width: 512 },
-    LG: { height: 1000, width: 800 },
-};
+export var ElementIds;
+(function (ElementIds) {
+    ElementIds["WRAPPER_ID"] = "placetopay_lightbox_wrapper";
+    ElementIds["IFRAME_ID"] = "placetopay_lightbox";
+    ElementIds["CLOSE_BUTTON_ID"] = "placetopay_close_button";
+    ElementIds["STYLES_ID"] = "placetopay-lightbox";
+})(ElementIds || (ElementIds = {}));
+export var LightboxEvents;
+(function (LightboxEvents) {
+    LightboxEvents["CLOSE"] = "close";
+    LightboxEvents["UPDATE_STYLES"] = "updateStyles";
+    LightboxEvents["HIDE_CLOSE_BUTTON"] = "hideCloseButton";
+})(LightboxEvents || (LightboxEvents = {}));
+export var Styles;
+(function (Styles) {
+    Styles["BACKGROUND_COLOR"] = "--placetopay-lightbox-background-color";
+    Styles["ROUNDED"] = "--placetopay-lightbox-border-radius";
+    Styles["MAX_HEIGHT"] = "--placetopay-lightbox-max-height";
+    Styles["MAX_WIDTH"] = "--placetopay-lightbox-max-width";
+})(Styles || (Styles = {}));
+export const Dimensions = {
+    SM: { height: 400, width: 320 },
+    MD: { height: 640, width: 512 },
+    LG: { height: 1000, width: 800 },
+};

package/dist/{LightboxClient → core}/assemblers.d.ts

@@ -1,3 +1,3 @@
-import { ClientCallbacks, LightboxStyles } from '../types';
-export declare const mountListener: (callbacks: ClientCallbacks, styles: LightboxStyles) => void;
-export declare const mountLightbox: (url: string, styles: LightboxStyles, closeButtonEnabled: boolean) => void;
+import { ClientCallbacks, LightboxStyles } from '../types';
+export declare const mountListener: (callbacks: ClientCallbacks, styles: LightboxStyles) => void;
+export declare const mountLightbox: (url: string, styles: LightboxStyles, closeButtonEnabled: boolean) => void;

package/dist/{LightboxClient → core}/assemblers.js

@@ -1,70 +1,67 @@
-import { Config } from '../config';
-import { Styles, ElementIds, Dimensions, LightboxAppEvents } from '../constants';
-export const mountListener = (callbacks, styles) => {
-    if (!callbacks)
-        return;
-    const listener = (event) => {
-        var _a, _b;
-        let receivedStyles;
-        switch (event.data.type) {
-            case LightboxAppEvents.CLOSE:
-                unmountLightbox(listener);
-                break;
-            case LightboxAppEvents.SEND_STYLES:
-                receivedStyles = event.data.payload;
-                mountStyles(Object.assign(Object.assign(Object.assign({}, receivedStyles), styles), { background: Object.assign(Object.assign({}, receivedStyles === null || receivedStyles === void 0 ? void 0 : receivedStyles.background), styles.background) }));
-                break;
-            case LightboxAppEvents.HIDE_CLOSE_BUTTON:
-                (_a = document.getElementById(ElementIds.CLOSE_BUTTON_ID)) === null || _a === void 0 ? void 0 : _a.remove();
-                break;
-            default:
-                (_b = callbacks[event.data.type]) === null || _b === void 0 ? void 0 : _b.call(callbacks, event.data.payload);
-                break;
-        }
-    };
-    globalThis.addEventListener('message', listener);
-};
-export const mountLightbox = (url, styles, closeButtonEnabled) => {
-    const wrapper = document.createElement('div');
-    wrapper.id = ElementIds.WRAPPER_ID;
-    const iframe = document.createElement('iframe');
-    iframe.src = url;
-    iframe.id = ElementIds.IFRAME_ID;
-    mountStyles(styles);
-    document.body.appendChild(wrapper);
-    wrapper.appendChild(iframe);
-    if (closeButtonEnabled) {
-        const closeButton = document.createElement('button');
-        closeButton.id = ElementIds.CLOSE_BUTTON_ID;
-        closeButton.addEventListener('click', () => {
-            globalThis.postMessage({ type: LightboxAppEvents.CLOSE }, '*');
-        });
-        const closeButtonContent = document.createElement('span');
-        closeButtonContent.classList.add('placetopay-close-button-content');
-        closeButtonContent.textContent = 'x';
-        closeButton.appendChild(closeButtonContent);
-        wrapper.appendChild(closeButton);
-    }
-};
-const mountStyles = (styles) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
-    const background = (_d = (_c = (_b = (_a = styles.background) === null || _a === void 0 ? void 0 : _a.color) === null || _b === void 0 ? void 0 : _b.replace(/^#?([a-f\d])([a-f\d])([a-f\d])$/i, (m, r, g, b) => '#' + r + r + g + g + b + b).substring(1).match(/.{2}/g)) === null || _c === void 0 ? void 0 : _c.map((x) => parseInt(x, 16))) !== null && _d !== void 0 ? _d : [107, 114, 128];
-    background.push((_f = (_e = styles.background) === null || _e === void 0 ? void 0 : _e.opacity) !== null && _f !== void 0 ? _f : 0.75);
-    document.documentElement.style.setProperty(Styles.BACKGROUND_COLOR, `rgb(${background.join(', ')})`);
-    const rounded = (_g = styles.rounded) !== null && _g !== void 0 ? _g : 0;
-    document.documentElement.style.setProperty(Styles.ROUNDED, `${rounded.toString()}px`);
-    let height = (_h = styles.height) !== null && _h !== void 0 ? _h : Config.defaultDimension.height;
-    if (styles.dimension)
-        height = Dimensions[styles.dimension.toUpperCase()].height;
-    document.documentElement.style.setProperty(Styles.MAX_HEIGHT, `${height.toString()}px`);
-    let width = (_j = styles.width) !== null && _j !== void 0 ? _j : Config.defaultDimension.width;
-    if (styles.dimension)
-        width = Dimensions[styles.dimension.toUpperCase()].width;
-    document.documentElement.style.setProperty(Styles.MAX_WIDTH, `${width.toString()}px`);
-};
-const unmountLightbox = (listener) => {
-    var _a;
-    (_a = document.getElementById(ElementIds.WRAPPER_ID)) === null || _a === void 0 ? void 0 : _a.remove();
-    globalThis.removeEventListener('message', listener);
-    document.documentElement.style.removeProperty(Styles.BACKGROUND_COLOR);
-};
+import { Config } from '../config';
+import { Styles, ElementIds, Dimensions, LightboxEvents } from '../constants';
+export const mountListener = (callbacks, styles) => {
+    const listener = (event) => {
+        var _a, _b, _c;
+        if (event.data.type === LightboxEvents.CLOSE)
+            unmountLightbox(listener, (_a = event.data.target) !== null && _a !== void 0 ? _a : event.origin);
+        if (event.data.type === LightboxEvents.UPDATE_STYLES) {
+            const receivedStyles = event.data.payload;
+            mountStyles(Object.assign(Object.assign(Object.assign({}, receivedStyles), styles), { background: Object.assign(Object.assign({}, receivedStyles === null || receivedStyles === void 0 ? void 0 : receivedStyles.background), styles.background) }));
+        }
+        if (event.data.type === LightboxEvents.HIDE_CLOSE_BUTTON) {
+            (_b = document.getElementById(ElementIds.CLOSE_BUTTON_ID)) === null || _b === void 0 ? void 0 : _b.remove();
+        }
+        (_c = callbacks[event.data.type]) === null || _c === void 0 ? void 0 : _c.call(callbacks, event.data.payload);
+    };
+    globalThis.addEventListener('message', listener);
+};
+export const mountLightbox = (url, styles, closeButtonEnabled) => {
+    const wrapper = document.createElement('div');
+    wrapper.id = new URL(url).origin;
+    wrapper.className = ElementIds.WRAPPER_ID;
+    const iframe = document.createElement('iframe');
+    iframe.src = url;
+    iframe.id = ElementIds.IFRAME_ID;
+    mountStyles(styles);
+    document.body.appendChild(wrapper);
+    wrapper.appendChild(iframe);
+    if (closeButtonEnabled) {
+        const closeButton = document.createElement('button');
+        closeButton.id = ElementIds.CLOSE_BUTTON_ID;
+        closeButton.innerHTML = `<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="#4b5563" height="24px" width="24px">
+            <path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12" />
+        </svg>
+        `;
+        closeButton.addEventListener('click', () => {
+            globalThis.postMessage({ type: LightboxEvents.CLOSE, target: new URL(url).origin }, '*');
+        });
+        wrapper.appendChild(closeButton);
+    }
+};
+const mountStyles = (styles) => {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+    const background = (_d = (_c = (_b = (_a = styles.background) === null || _a === void 0 ? void 0 : _a.color) === null || _b === void 0 ? void 0 : _b.replace(/^#?([a-f\d])([a-f\d])([a-f\d])$/i, (m, r, g, b) => '#' + r + r + g + g + b + b).substring(1).match(/.{2}/g)) === null || _c === void 0 ? void 0 : _c.map((x) => parseInt(x, 16))) !== null && _d !== void 0 ? _d : [107, 114, 128];
+    background.push((_f = (_e = styles.background) === null || _e === void 0 ? void 0 : _e.opacity) !== null && _f !== void 0 ? _f : 0.75);
+    document.documentElement.style.setProperty(Styles.BACKGROUND_COLOR, `rgb(${background.join(', ')})`);
+    const rounded = (_g = styles.rounded) !== null && _g !== void 0 ? _g : 0;
+    document.documentElement.style.setProperty(Styles.ROUNDED, `${rounded.toString()}px`);
+    let height = (_h = styles.height) !== null && _h !== void 0 ? _h : Config.defaultDimension.height;
+    if (styles.dimension)
+        height = Dimensions[styles.dimension.toUpperCase()].height;
+    document.documentElement.style.setProperty(Styles.MAX_HEIGHT, `${height.toString()}px`);
+    let width = (_j = styles.width) !== null && _j !== void 0 ? _j : Config.defaultDimension.width;
+    if (styles.dimension)
+        width = Dimensions[styles.dimension.toUpperCase()].width;
+    document.documentElement.style.setProperty(Styles.MAX_WIDTH, `${width.toString()}px`);
+};
+const unmountLightbox = (listener, origin) => {
+    const element = document.getElementById(origin);
+    if (element) {
+        element.remove();
+        globalThis.removeEventListener('message', listener);
+        document.documentElement.style.removeProperty(Styles.BACKGROUND_COLOR);
+    }
+    else
+        throw new Error(`Frame from "${origin}" not found`);
+};

package/dist/core/index.d.ts

@@ -0,0 +1,11 @@
+import { InitOptions, LightboxInstance, ApiStructure, LightboxStyles } from '../types';
+export declare const isInside: () => boolean;
+export declare const emitClose: (payload?: unknown) => void;
+export declare const emitUpdateStyles: (styles: LightboxStyles) => void;
+export declare const emitHideCloseButton: () => void;
+export declare const emit: ({ type, payload, preventClose }: ApiStructure) => {
+    close: (payload?: unknown) => void;
+};
+export declare const createLightbox: (url: string, options?: InitOptions & {
+    launch?: boolean;
+}) => LightboxInstance;

package/dist/core/index.js

@@ -0,0 +1,35 @@
+import { LightboxEvents } from '../constants';
+import { postMessage, redirectBasedOnDriver } from '../helpers';
+import { mountLightbox, mountListener } from './assemblers';
+export const isInside = () => globalThis.location !== globalThis.parent.location;
+export const emitClose = (payload) => postMessage(LightboxEvents.CLOSE, payload);
+export const emitUpdateStyles = (styles) => postMessage(LightboxEvents.UPDATE_STYLES, styles);
+export const emitHideCloseButton = () => postMessage(LightboxEvents.HIDE_CLOSE_BUTTON);
+export const emit = ({ type, payload, preventClose }) => {
+    postMessage(type, payload, preventClose);
+    return { close: emitClose };
+};
+export const createLightbox = (url, options) => {
+    var _a, _b, _c, _d;
+    const lightbox = {
+        allowRedirects: (_a = options === null || options === void 0 ? void 0 : options.allowRedirects) !== null && _a !== void 0 ? _a : true,
+        callbacks: (_b = options === null || options === void 0 ? void 0 : options.callbacks) !== null && _b !== void 0 ? _b : {},
+        closeButton: (_c = options === null || options === void 0 ? void 0 : options.closeButton) !== null && _c !== void 0 ? _c : true,
+        styles: (_d = options === null || options === void 0 ? void 0 : options.styles) !== null && _d !== void 0 ? _d : {},
+        close: emitClose,
+        updateStyles: emitUpdateStyles,
+        hideCloseButton: emitHideCloseButton,
+        on: (name, callback) => {
+            lightbox.callbacks[name] = callback;
+        },
+        open: () => {
+            if (lightbox.allowRedirects)
+                redirectBasedOnDriver(url);
+            mountListener(lightbox.callbacks, lightbox.styles);
+            mountLightbox(url, lightbox.styles, lightbox.closeButton);
+        },
+    };
+    if (options === null || options === void 0 ? void 0 : options.launch)
+        lightbox.open();
+    return lightbox;
+};

package/dist/helpers.d.ts

@@ -1 +1,2 @@
-export declare const redirectBasedOnDriver: (url: string) => void;
+export declare const postMessage: (type: string, payload?: unknown, preventClose?: boolean) => void;
+export declare const redirectBasedOnDriver: (url: string) => void;

package/dist/helpers.js

@@ -1,7 +1,10 @@
-export const redirectBasedOnDriver = (url) => {
-    if (navigator.userAgent.match(/iPhone|iPad|iPod/i) ||
-        /^((?!chrome|android).)*safari/i.test(navigator.userAgent) // regex from https://stackoverflow.com/a/23522755
-    ) {
-        location.href = url;
-    }
-};
+export const postMessage = (type, payload, preventClose) => {
+    return globalThis.parent.postMessage({ type, preventClose, payload }, '*');
+};
+export const redirectBasedOnDriver = (url) => {
+    if (navigator.userAgent.match(/iPhone|iPad|iPod/i) ||
+        /^((?!chrome|android).)*safari/i.test(navigator.userAgent) // regex from https://stackoverflow.com/a/23522755
+    ) {
+        location.href = url;
+    }
+};

package/dist/index.d.ts

@@ -1,3 +1,2 @@
-export { LightboxApp } from './LightboxApp';
-export { LightboxClient } from './LightboxClient';
-export * from './types';
+export * from './core';
+export * from './types';

package/dist/index.js

@@ -1,3 +1,2 @@
-export { LightboxApp } from './LightboxApp';
-export { LightboxClient } from './LightboxClient';
-export * from './types';
+export * from './core';
+export * from './types';

package/dist/{css/styles.css → styles.css}

@@ -1,6 +1,4 @@
-@import url('./close_button.css');
-
-#placetopay_lightbox_wrapper {
+.placetopay_lightbox_wrapper {
     background: var(--placetopay-lightbox-background-color);
     position: fixed;
     display: flex;
@@ -26,3 +24,20 @@
     overflow: auto;
     box-shadow: 0px 0px 60px rgba(0, 0, 0, 0.5);
 }
+
+#placetopay_close_button {
+    cursor: pointer;
+    padding: 4px;
+    position: absolute;
+    right: 8px;
+    top: 8px;
+    border: 2px solid #4b5563;
+    background: #fff;
+    padding: 4px;
+    border-radius: 100%;
+    transition: all 0.05s ease-in-out;
+}
+
+#placetopay_close_button:hover {
+    transform: scale(0.9);
+}

package/dist/types.d.ts

@@ -1,27 +1,33 @@
-export declare type ClientCallback = (data: unknown) => void;
-export declare type ClientCallbacks = {
-    [key: string]: ClientCallback | undefined;
-};
-export declare type LightboxStyles = {
-    background?: {
-        color?: string;
-        opacity?: number;
-    };
-    dimension?: 'sm' | 'md' | 'lg';
-    height?: number;
-    rounded?: number;
-    width?: number;
-};
-export declare type InitOptions = {
-    allowRedirects?: boolean;
-    callbacks?: ClientCallbacks;
-    closeButton?: boolean;
-    styles?: LightboxStyles;
-};
-export declare type ApiStructure = {
-    payload: unknown;
-    type: string;
-};
-export declare type LightboxInstance = Required<InitOptions> & {
-    open: () => void;
-};
+export declare type ClientCallback = (payload?: unknown) => void;
+export declare type ClientCallbacks = {
+    [key: string]: ClientCallback | undefined;
+};
+export declare type LightboxStyles = {
+    background?: {
+        color?: string;
+        opacity?: number;
+    };
+    dimension?: 'sm' | 'md' | 'lg';
+    height?: number;
+    rounded?: number;
+    width?: number;
+};
+export declare type InitOptions = {
+    allowRedirects?: boolean;
+    callbacks?: ClientCallbacks;
+    closeButton?: boolean;
+    styles?: LightboxStyles;
+};
+export declare type ApiStructure = {
+    type: string;
+    target?: string;
+    payload?: unknown;
+    preventClose?: boolean;
+};
+export declare type LightboxInstance = Required<InitOptions> & {
+    on: (name: string, callback: ClientCallback) => void;
+    open: () => void;
+    close: (payload?: unknown) => void;
+    updateStyles: (styles: LightboxStyles) => void;
+    hideCloseButton: () => void;
+};

package/dist/types.js

@@ -1 +1 @@
-export {};
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@placetopay/lightbox-sdk",
-  "version": "1.0.0",
+  "version": "2.0.0",
   "description": "Small javascript library to encapsulate websites in a lightbox with configurable styles and behaviors",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -9,7 +9,7 @@
   ],
   "repository": {
     "type": "git",
-    "url": "git+https://JuanZea@bitbucket.org/placetopay/lightbox-sdk.git"
+    "url": "git+https://github.com/placetopay-org/lightbox-sdk.git"
   },
   "keywords": [
     "lightbox",
@@ -21,9 +21,9 @@
   "author": "JuanZea",
   "license": "ISC",
   "bugs": {
-    "url": "https://bitbucket.org/placetopay/lightbox-sdk/issues"
+    "url": "https://github.com/placetopay-org/lightbox-sdk/issues"
   },
-  "homepage": "https://bitbucket.org/placetopay/lightbox-sdk#readme",
+  "homepage": "https://placetopay-org.github.io/lightbox-sdk",
   "devDependencies": {
     "typescript": "^4.8.3"
   }

package/dist/LightboxApp/index.d.ts

@@ -1,10 +0,0 @@
-import { LightboxStyles } from '../types';
-export declare const LightboxApp: {
-    isInside: () => boolean;
-    sendStyles: (styles: LightboxStyles) => void;
-    hideCloseButton: () => void;
-    close: (url?: string) => void;
-    emit: (type: string, payload: unknown) => {
-        close: (url?: string) => void;
-    };
-};

package/dist/LightboxApp/index.js

@@ -1,20 +0,0 @@
-import { LightboxAppEvents } from '../constants';
-export const LightboxApp = {
-    isInside: () => globalThis.location !== globalThis.parent.location,
-    sendStyles: (styles) => {
-        globalThis.parent.postMessage({ type: LightboxAppEvents.SEND_STYLES, payload: styles }, '*');
-    },
-    hideCloseButton: () => {
-        globalThis.parent.postMessage({ type: LightboxAppEvents.HIDE_CLOSE_BUTTON }, '*');
-    },
-    close: (url) => {
-        if (!url || LightboxApp.isInside())
-            globalThis.parent.postMessage({ type: LightboxAppEvents.CLOSE }, '*');
-        else
-            globalThis.location.href = url;
-    },
-    emit: (type, payload) => {
-        globalThis.parent.postMessage({ type, payload }, '*');
-        return { close: LightboxApp.close };
-    },
-};

package/dist/LightboxClient/index.d.ts

@@ -1,4 +0,0 @@
-import { InitOptions, LightboxInstance } from '../types';
-export declare const LightboxClient: {
-    init: (url: string, options?: InitOptions) => LightboxInstance;
-};

package/dist/LightboxClient/index.js

@@ -1,20 +0,0 @@
-import { redirectBasedOnDriver } from '../helpers';
-import { mountLightbox, mountListener } from './assemblers';
-export const LightboxClient = {
-    init: (url, options) => {
-        var _a, _b, _c, _d;
-        const lightbox = {
-            allowRedirects: (_a = options === null || options === void 0 ? void 0 : options.allowRedirects) !== null && _a !== void 0 ? _a : true,
-            callbacks: (_b = options === null || options === void 0 ? void 0 : options.callbacks) !== null && _b !== void 0 ? _b : {},
-            closeButton: (_c = options === null || options === void 0 ? void 0 : options.closeButton) !== null && _c !== void 0 ? _c : true,
-            styles: (_d = options === null || options === void 0 ? void 0 : options.styles) !== null && _d !== void 0 ? _d : {},
-            open: () => {
-                if (lightbox.allowRedirects)
-                    redirectBasedOnDriver(url);
-                mountListener(lightbox.callbacks, lightbox.styles);
-                mountLightbox(url, lightbox.styles, lightbox.closeButton);
-            },
-        };
-        return lightbox;
-    },
-};

package/dist/css/close_button.css

@@ -1,34 +0,0 @@
-/* Initial design from uiverse.io by @Voxybuns */
-#placetopay_close_button {
-    /* Variables */
-    --button_radius: 100%;
-    --button_color: #e8e8e8;
-    --button_outline_color: #000000;
-    cursor: pointer;
-    padding: 0;
-    position: absolute;
-    right: 8px;
-    top: 8px;
-    font-size: 17px;
-    font-weight: bold;
-    border: none;
-    border-radius: var(--button_radius);
-    background: var(--button_outline_color);
-}
-
-.placetopay-close-button-content {
-    display: block;
-    box-sizing: border-box;
-    border: 2px solid var(--button_outline_color);
-    border-radius: var(--button_radius);
-    padding: 2px 7px;
-    background: var(--button_color);
-    color: var(--button_outline_color);
-    transform: translateY(-0.1em);
-    transition: transform 0.1s ease;
-}
-
-button:active .placetopay-close-button-content {
-    /* Push the button downwards when pressed */
-    transform: translateY(0);
-}