import React from 'react';

type VersionLimits = {
  softLimit?: number;
  hardLimit?: number;
};
/**
 *
 * A wrapper that displays a callout message for partially supported browsers
 *
 * (below a soft limit) along with the site content. If the browser is an
 *
 * unsupported version (below a hard limit), it shows a full-page message to update
 *
 * the browser and does not display the site content. If the browser is in the list
 *
 * of unsupported browsers, it displays a full-page message that the browser is
 *
 * unsupported and does not display the site content.
 *
 * @example 
 *
 * import BrowserSupport from "@bigbinary/neeto-molecules/BrowserSupport";
 * 
 * const App = () => (
 *   <BrowserSupport>
 *     {children}
 *   </BrowserSupport>
 *   <Main />
 * )
 * @endexample
 * Minimum supported browser version of a specific browser can be changed using the
 *
 * overrides prop like so:
 *
 * @example 
 *
 * <BrowserSupport
 *   overrides={{
 *     Chrome: { softLimit: 80, hardLimit: 60 },
 *     Safari: { softLimit: 14.1, hardLimit: 13.5 },
 *   }}
 *   unsupportedBrowsers={["Firefox"]}
 * />
 * @endexample
 * In the above code we have changed the minimum supported versions of Chrome &
 *
 * Safari. Now if a user has accessed the site using Chrome < 80 or Safari < 14.1
 *
 * the callout message will be displayed. If a user has accessed the site using
 *
 * Chrome < 60 or Safari < 13.5, a message will be displayed to update the browser
 *
 * and page contents will not be shown. If a user has accessed the site using any
 *
 * version of Firefox, a message will be displayed that the browser is unsupported
 *
 * and page contents will not be shown.
 *
 * The default supported browser names and their versions are given below:
 *
 * | Browser Name    | Min Supported version |
 *
 * | :-------------- | :-------------------- |
 *
 * | Chrome          | 79                    |
 *
 * | Firefox         | 91                    |
 *
 * | IE              | 11                    |
 *
 * | Opera           | 73                    |
 *
 * | Safari          | 12.2                  |
 *
 * | ChromeMobile    | 105                   |
 *
 * | FirefoxMobile   | 104                   |
 *
 * | UCBrowser       | 13.4                  |
 *
 * | SamsungInternet | 4                     |
 *
 * The default unsupported browsers are given below:
 *
 * Any other browser which is not in the above lists will be considered as unknown
 *
 * and a corresponding callout will be shown.
 *
*/
declare const BrowserSupport: React.FC<{
  overrides?: {
    Chrome?: VersionLimits;
    Edge?: VersionLimits;
    Firefox?: VersionLimits;
    IE?: VersionLimits;
    Opera?: VersionLimits;
    Safari?: VersionLimits;
    AndroidBrowser?: VersionLimits;
    OperaMini?: VersionLimits;
    MobileChrome?: VersionLimits;
    MobileFirefox?: VersionLimits;
    UCBrowser?: VersionLimits;
    SamsungInternet?: VersionLimits;
  };
  unsupportedBrowsers?: string[];
  children?: React.ReactNode | React.ReactNode[];
}>;

export { BrowserSupport as default };
