@shopify/app-bridge-react 2.0.29 → 2.1.1-alpha.0

package/CHANGELOG.md

@@ -3,6 +3,30 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [2.1.1-alpha.0](https://github.com/Shopify/app-bridge/compare/v2.1.0...v2.1.1-alpha.0) (2022-08-31)
+
+**Note:** Version bump only for package @shopify/app-bridge-react
+
+
+
+
+
+# [2.1.0](https://github.com/Shopify/app-bridge/compare/v2.0.30...v2.1.0) (2022-05-24)
+
+**Note:** Version bump only for package @shopify/app-bridge-react
+
+
+
+
+
+## [2.0.30](https://github.com/Shopify/app-bridge/compare/v2.0.29...v2.0.30) (2022-05-18)
+
+**Note:** Version bump only for package @shopify/app-bridge-react
+
+
+
+
+
 ## [2.0.29](https://github.com/Shopify/app-bridge/compare/v2.0.28...v2.0.29) (2022-05-17)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@shopify/app-bridge-react",
-  "version": "2.0.29",
+  "version": "2.1.1-alpha.0",
   "types": "index.d.ts",
   "main": "index.js",
   "unpkg": "umd/index.js",
@@ -45,7 +45,7 @@
     }
   ],
   "dependencies": {
-    "@shopify/app-bridge": "^2.0.29"
+    "@shopify/app-bridge": "^2.1.1-alpha.0"
   },
   "devDependencies": {
     "@types/react": "^17.0.38",
@@ -53,7 +53,7 @@
     "react-dom": "^17.0.2"
   },
   "peerDependencies": {
-    "react": "^16.0.0 || ^17.0.0"
+    "react": "^16.0.0 || ^17.0.0 || ^18.0.0"
   },
-  "gitHead": "17aa21ddcc7bb6af1d5a37eae36bfedaa8c10ae0"
+  "gitHead": "52a61413c8c25ed7f42bc0651fd08a9e3b9e4072"
 }

package/components/ClientRouter/ClientRouter.d.ts

@@ -1,21 +0,0 @@
-import React from 'react';
-import { Unsubscribe } from '@shopify/app-bridge';
-import { History } from './router';
-export interface Props {
-    history: History;
-}
-/**
- * ClientRouter component
- *
- * @remarks
- * React component which keeps the Shopify admin url in sync with the app url
- *
- * @public
- */
-export default class ClientRouter extends React.Component<Props, never> {
-    static contextType: React.Context<import("../../context").IAppBridgeContext>;
-    unsubscribe?: Unsubscribe;
-    componentDidMount(): void;
-    componentWillUnmount(): void;
-    render(): null;
-}

package/components/ClientRouter/ClientRouter.js

@@ -1,52 +0,0 @@
-"use strict";
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        if (typeof b !== "function" && b !== null)
-            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
-var context_1 = require("../../context");
-var router_1 = require("./router");
-/**
- * ClientRouter component
- *
- * @remarks
- * React component which keeps the Shopify admin url in sync with the app url
- *
- * @public
- */
-var ClientRouter = /** @class */ (function (_super) {
-    __extends(ClientRouter, _super);
-    function ClientRouter() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    ClientRouter.prototype.componentDidMount = function () {
-        var history = this.props.history;
-        this.unsubscribe = router_1.handleRouteChange(this.context, history);
-    };
-    ClientRouter.prototype.componentWillUnmount = function () {
-        if (this.unsubscribe) {
-            this.unsubscribe();
-        }
-    };
-    ClientRouter.prototype.render = function () {
-        return null;
-    };
-    ClientRouter.contextType = context_1.AppBridgeContext;
-    return ClientRouter;
-}(react_1.default.Component));
-exports.default = ClientRouter;

package/components/ClientRouter/hook.d.ts

@@ -1,10 +0,0 @@
-import { History } from './router';
-/**
- * useRoutePropagation
- *
- * @remarks
- * A hook which keeps the Shopify admin url in sync with the app url
- *
- * @public
- */
-export default function useClientRouting(history: History): void;

package/components/ClientRouter/hook.js

@@ -1,20 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = require("react");
-var useAppBridge_1 = require("../../useAppBridge");
-var router_1 = require("./router");
-/**
- * useRoutePropagation
- *
- * @remarks
- * A hook which keeps the Shopify admin url in sync with the app url
- *
- * @public
- */
-function useClientRouting(history) {
-    var app = useAppBridge_1.useAppBridge();
-    react_1.useEffect(function () {
-        return router_1.handleRouteChange(app, history);
-    }, [app, history]);
-}
-exports.default = useClientRouting;

package/components/ClientRouter/index.d.ts

@@ -1,3 +0,0 @@
-export { default as ClientRouter } from './ClientRouter';
-export { default as useClientRouting } from './hook';
-export { History } from './router';

package/components/ClientRouter/index.js

@@ -1,10 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useClientRouting = exports.ClientRouter = void 0;
-var ClientRouter_1 = require("./ClientRouter");
-Object.defineProperty(exports, "ClientRouter", { enumerable: true, get: function () { return __importDefault(ClientRouter_1).default; } });
-var hook_1 = require("./hook");
-Object.defineProperty(exports, "useClientRouting", { enumerable: true, get: function () { return __importDefault(hook_1).default; } });

package/components/ClientRouter/router.d.ts

@@ -1,5 +0,0 @@
-import { ClientApplication } from '@shopify/app-bridge';
-export interface History {
-    replace(path: string): void;
-}
-export declare function handleRouteChange(app: ClientApplication, history: History): import("@shopify/app-bridge").Unsubscribe;

package/components/ClientRouter/router.js

@@ -1,11 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.handleRouteChange = void 0;
-var actions_1 = require("@shopify/app-bridge/actions");
-function handleRouteChange(app, history) {
-    return app.subscribe(actions_1.Redirect.Action.APP, function (_a) {
-        var path = _a.path;
-        history.replace(path);
-    });
-}
-exports.handleRouteChange = handleRouteChange;

package/components/ContextualSaveBar/ContextualSaveBar.d.ts

@@ -1,13 +0,0 @@
-import type { ContextAction, DiscardAction } from '@shopify/app-bridge/actions/ContextualSaveBar';
-export interface Props {
-    discardAction: DiscardAction & {
-        onAction(): void;
-    };
-    saveAction: ContextAction & {
-        onAction(): void;
-    };
-    fullWidth?: boolean;
-    leaveConfirmationDisable?: boolean;
-    visible?: boolean;
-}
-export default function ContextualSaveBar({ discardAction, saveAction, fullWidth, leaveConfirmationDisable, visible, }: Props): null;

package/components/ContextualSaveBar/ContextualSaveBar.js

@@ -1,64 +0,0 @@
-"use strict";
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = require("react");
-var actions_1 = require("@shopify/app-bridge/actions");
-var useAppBridge_1 = require("../../useAppBridge");
-var Action = actions_1.ContextualSaveBar.Action, create = actions_1.ContextualSaveBar.create;
-function ContextualSaveBar(_a) {
-    var discardAction = _a.discardAction, saveAction = _a.saveAction, fullWidth = _a.fullWidth, leaveConfirmationDisable = _a.leaveConfirmationDisable, visible = _a.visible;
-    var app = useAppBridge_1.useAppBridge();
-    var onSaveAction = saveAction.onAction, saveActionProps = __rest(saveAction, ["onAction"]);
-    var onDiscardAction = discardAction.onAction, discardActionProps = __rest(discardAction, ["onAction"]);
-    var contextualSaveBar = react_1.useMemo(function () {
-        return create(app, {
-            saveAction: saveActionProps,
-            discardAction: discardActionProps,
-            fullWidth: fullWidth,
-            leaveConfirmationDisable: leaveConfirmationDisable,
-        });
-    }, [app]);
-    react_1.useEffect(function () {
-        contextualSaveBar.set({
-            saveAction: saveActionProps,
-            discardAction: discardActionProps,
-            fullWidth: fullWidth,
-            leaveConfirmationDisable: leaveConfirmationDisable,
-        }, visible);
-    }, [
-        app,
-        contextualSaveBar,
-        saveActionProps,
-        discardActionProps,
-        fullWidth,
-        leaveConfirmationDisable,
-        visible,
-    ]);
-    react_1.useEffect(function () {
-        contextualSaveBar.subscribe(Action.DISCARD, onDiscardAction);
-        contextualSaveBar.subscribe(Action.SAVE, onSaveAction);
-        return function () {
-            contextualSaveBar.unsubscribe();
-        };
-    }, [contextualSaveBar]);
-    react_1.useEffect(function () {
-        if (visible) {
-            contextualSaveBar.dispatch(Action.SHOW);
-        }
-        else {
-            contextualSaveBar.dispatch(Action.HIDE);
-        }
-    }, [contextualSaveBar, visible]);
-    return null;
-}
-exports.default = ContextualSaveBar;

package/components/ContextualSaveBar/index.d.ts

@@ -1,3 +0,0 @@
-import ContextualSaveBar, { Props } from './ContextualSaveBar';
-export default ContextualSaveBar;
-export { Props };

package/components/ContextualSaveBar/index.js

@@ -1,7 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var ContextualSaveBar_1 = __importDefault(require("./ContextualSaveBar"));
-exports.default = ContextualSaveBar_1.default;

package/components/Loading/Loading.d.ts

@@ -1,17 +0,0 @@
-import React from 'react';
-/**
- * Loading component
- *
- * @remarks
- * React component which wraps the Shopify App Bridge Loading action.
- *
- * @public
- */
-declare class Loading extends React.Component {
-    static contextType: React.Context<import("../../context").IAppBridgeContext>;
-    private loading;
-    componentDidMount(): void;
-    componentWillUnmount(): void;
-    render(): null;
-}
-export default Loading;

package/components/Loading/Loading.js

@@ -1,55 +0,0 @@
-"use strict";
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        if (typeof b !== "function" && b !== null)
-            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
-var actions_1 = require("@shopify/app-bridge/actions");
-var context_1 = require("../../context");
-/**
- * Loading component
- *
- * @remarks
- * React component which wraps the Shopify App Bridge Loading action.
- *
- * @public
- */
-var Loading = /** @class */ (function (_super) {
-    __extends(Loading, _super);
-    function Loading() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Loading.prototype.componentDidMount = function () {
-        var app = this.context;
-        this.loading = actions_1.Loading.create(app);
-        if (this.loading != null) {
-            this.loading.dispatch(actions_1.Loading.Action.START);
-        }
-    };
-    Loading.prototype.componentWillUnmount = function () {
-        if (this.loading != null) {
-            this.loading.dispatch(actions_1.Loading.Action.STOP);
-        }
-    };
-    Loading.prototype.render = function () {
-        return null;
-    };
-    Loading.contextType = context_1.AppBridgeContext;
-    return Loading;
-}(react_1.default.Component));
-exports.default = Loading;

package/components/Loading/index.d.ts

@@ -1,2 +0,0 @@
-import Loading from './Loading';
-export default Loading;

package/components/Loading/index.js

@@ -1,7 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var Loading_1 = __importDefault(require("./Loading"));
-exports.default = Loading_1.default;

package/components/Modal/Modal.d.ts

@@ -1,32 +0,0 @@
-import { Size } from '@shopify/app-bridge/actions/Modal';
-import { ActionProps } from '../../types';
-export interface Props {
-    /** Whether the modal is open or not */
-    open: boolean;
-    /** The url that will be loaded as the content of the modal */
-    src?: string;
-    /** The content for the title of the modal */
-    title?: string;
-    /** Controls the size of the modal */
-    size?: keyof typeof Size;
-    /** Message to display inside modal */
-    message?: string;
-    /** Primary action */
-    primaryAction?: ActionProps;
-    /** Collection of secondary actions */
-    secondaryActions?: ActionProps[];
-    /** Callback when the modal is closed */
-    onClose?(): void;
-    /** Enable loading behaviour, when `true` bear in mind you will need to use `Modal Content` to dismiss the loading after the iframe page is fully loaded */
-    loading?: boolean;
-}
-/**
- * Modal component
- *
- * @remarks
- * React component which wraps the Shopify App Bridge Modal action.
- *
- * @public
- */
-declare function Modal(props: Props): null;
-export default Modal;

package/components/Modal/Modal.js

@@ -1,139 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = require("react");
-var Modal_1 = require("@shopify/app-bridge/actions/Modal");
-var transformers_1 = require("../../utilities/transformers");
-var useAppBridge_1 = require("../../useAppBridge");
-/**
- * Modal component
- *
- * @remarks
- * React component which wraps the Shopify App Bridge Modal action.
- *
- * @public
- */
-function Modal(props) {
-    var app = useAppBridge_1.useAppBridge();
-    var focusReturnPoint = react_1.useRef(null);
-    // Initialize with open: false so the open action will dispatch on initial load
-    var prevProps = react_1.useRef({ open: false });
-    var open = props.open;
-    var isUnmounted = react_1.useRef(false);
-    var modal = react_1.useMemo(function () {
-        /**
-         * We purposely don't pass buttons here as they will be replaced
-         * by the subsequent useEffect to call `set` to update the options.
-         * If we pass them in here button subscriptions will be created without
-         * being cleaned up.
-         */
-        var primaryAction = props.primaryAction, secondaryActions = props.secondaryActions, rest = __rest(props, ["primaryAction", "secondaryActions"]);
-        return Modal_1.create(app, transformProps(app, rest));
-    }, [app]);
-    /**
-     * All option updates are handled in this useEffect to avoid race conditions.
-     * For example, we need to call `modal.unsubscribe` to clean up button subscriptions
-     * but we calling it will also unsubscribe the onClose handler. Therefore we want
-     * to ensure all callbacks are handled in a single useEffect with a single clean up
-     * call to unsubscribe.
-     */
-    react_1.useEffect(function () {
-        if (isUnmounted.current) {
-            prevProps.current = props;
-            return;
-        }
-        var wasOpen = prevProps.current.open;
-        var openUpdated = wasOpen !== open;
-        /** We only call `set` to update the options if the modal is open.
-         * This is because while the modal is closed updates don't take effect on screen.
-         */
-        if (open) {
-            var transformedProps = transformProps(app, props, wasOpen);
-            /** We skip dispatching the update action if we're about to update the open state.
-             * This is because the OPEN action will always sends the updated options
-             * so we don't need to send it twice.
-             */
-            var shouldSendUpdate = !openUpdated;
-            if (isIframeModal(transformedProps)) {
-                modal.set(transformedProps, shouldSendUpdate);
-            }
-            else {
-                modal.set(transformedProps, shouldSendUpdate);
-            }
-        }
-        if (openUpdated) {
-            if (open) {
-                modal.dispatch(Modal_1.Action.OPEN);
-                focusReturnPoint.current = document.activeElement;
-            }
-            else {
-                modal.dispatch(Modal_1.Action.CLOSE);
-                if (focusReturnPoint.current != null && document.contains(focusReturnPoint.current)) {
-                    focusReturnPoint.current.focus();
-                    focusReturnPoint.current = null;
-                }
-            }
-        }
-        if (props.onClose != null) {
-            modal.subscribe(Modal_1.Action.CLOSE, props.onClose);
-        }
-        prevProps.current = props;
-        return function () {
-            // This is important to clean up previous buttons and onClose subscriptions
-            modal.unsubscribe();
-        };
-    }, [props, open]);
-    react_1.useEffect(function () {
-        return function () {
-            if (prevProps.current.open) {
-                modal.dispatch(Modal_1.Action.CLOSE);
-            }
-        };
-    }, [modal]);
-    return null;
-}
-function isIframeModal(options) {
-    return (typeof options.url === 'string' ||
-        typeof options.path === 'string');
-}
-function transformProps(app, props, wasOpen) {
-    var title = props.title, size = props.size, message = props.message, src = props.src, primaryAction = props.primaryAction, secondaryActions = props.secondaryActions, loading = props.loading;
-    var safeSize = size == null ? undefined : Modal_1.Size[size];
-    var srcPayload = {};
-    if (src != null) {
-        if (src.match('^https?://')) {
-            srcPayload.url = src;
-        }
-        else {
-            srcPayload.path = src;
-        }
-    }
-    return __assign(__assign({ title: title, message: message, size: safeSize }, srcPayload), { footer: {
-            buttons: transformers_1.transformActions(app, {
-                primaryAction: primaryAction,
-                secondaryActions: secondaryActions,
-            }),
-        }, loading: wasOpen ? undefined : loading });
-}
-exports.default = Modal;

package/components/Modal/ModalContent/ModalContent.d.ts

@@ -1,22 +0,0 @@
-import React from 'react';
-export interface Props {
-    /** Show/Dismiss loading spinner */
-    loading: boolean;
-}
-/**
- * Modal Content component
- *
- * @remarks
- * React component which wraps the Shopify App Bridge Modal Content action.
- *
- * @public
- */
-declare class ModalContent extends React.Component<Props> {
-    static contextType: React.Context<import("../../../context").IAppBridgeContext>;
-    private modalContent;
-    componentDidMount(): void;
-    componentDidUpdate(): void;
-    syncLoadingStatus(): void;
-    render(): null;
-}
-export default ModalContent;

package/components/Modal/ModalContent/ModalContent.js

@@ -1,61 +0,0 @@
-"use strict";
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        if (typeof b !== "function" && b !== null)
-            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
-var actions_1 = require("@shopify/app-bridge/actions");
-var context_1 = require("../../../context");
-/**
- * Modal Content component
- *
- * @remarks
- * React component which wraps the Shopify App Bridge Modal Content action.
- *
- * @public
- */
-var ModalContent = /** @class */ (function (_super) {
-    __extends(ModalContent, _super);
-    function ModalContent() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    ModalContent.prototype.componentDidMount = function () {
-        var app = this.context;
-        this.modalContent = actions_1.ModalContent.create(app);
-        this.syncLoadingStatus();
-    };
-    ModalContent.prototype.componentDidUpdate = function () {
-        this.syncLoadingStatus();
-    };
-    ModalContent.prototype.syncLoadingStatus = function () {
-        if (!this.modalContent)
-            return;
-        if (this.props.loading) {
-            this.modalContent.loading();
-        }
-        else {
-            this.modalContent.loaded();
-        }
-    };
-    ModalContent.prototype.render = function () {
-        return null;
-    };
-    ModalContent.contextType = context_1.AppBridgeContext;
-    return ModalContent;
-}(react_1.default.Component));
-exports.default = ModalContent;

package/components/Modal/ModalContent/index.d.ts

@@ -1,2 +0,0 @@
-import ModalContent from './ModalContent';
-export default ModalContent;

package/components/Modal/ModalContent/index.js

@@ -1,7 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var ModalContent_1 = __importDefault(require("./ModalContent"));
-exports.default = ModalContent_1.default;

package/components/Modal/index.d.ts

@@ -1,4 +0,0 @@
-import Modal from './Modal';
-export { default as ModalContent } from './ModalContent';
-export { Props } from './Modal';
-export default Modal;