react-pwa-install-updated/es/InstallDialogAction.js

Install support for your PWA on several platforms

var _jsxFileName = "/Users/mobile/Desktop/react-pwa-install/src/InstallDialogAction.js";
import React from "react";
import { DialogActions, Typography, Button, Box } from "@material-ui/core";
import { platforms } from "./Platforms";
import { IOSShareIcon, FireFoxA2HSIcon, MenuIcon, OperaA2HSIcon } from "./Icons";

function DialogActionWithInstructions(props) {
  return /*#__PURE__*/React.createElement(Box, {
    width: "100%",
    display: "flex",
    flexDirection: "column",
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 8,
      columnNumber: 5
    }
  }, /*#__PURE__*/React.createElement(Box, {
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 9,
      columnNumber: 7
    }
  }, /*#__PURE__*/React.createElement(Typography, {
    variant: "subtitle1",
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 10,
      columnNumber: 9
    }
  }, props.instructionTitle || "To install this app:"), /*#__PURE__*/React.createElement("ul", {
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 11,
      columnNumber: 9
    }
  }, /*#__PURE__*/React.createElement("li", {
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 12,
      columnNumber: 11
    }
  }, /*#__PURE__*/React.createElement("span", {
    style: {
      display: "flex",
      alignItems: "center"
    },
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 13,
      columnNumber: 13
    }
  }, props.action1)), /*#__PURE__*/React.createElement("li", {
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 15,
      columnNumber: 11
    }
  }, props.action2))), /*#__PURE__*/React.createElement(Box, {
    width: "100%",
    textAlign: "right",
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 18,
      columnNumber: 7
    }
  }, /*#__PURE__*/React.createElement(Button, {
    onClick: props.onSubmit,
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 19,
      columnNumber: 9
    }
  }, props.instructionActionOk || "Ok")));
}

export default function InstallDialogAction(props) {
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(DialogActions, {
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 28,
      columnNumber: 7
    }
  }, props.platform === platforms.NATIVE && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Button, {
    onClick: props.onClose,
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 31,
      columnNumber: 13
    }
  }, props.instructionActionCancel || "Cancel"), /*#__PURE__*/React.createElement(Button, {
    onClick: props.onSubmit,
    color: "primary",
    variant: "contained",
    disableElevation: true,
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 32,
      columnNumber: 13
    }
  }, props.instructionActionInstall || "Install")), props.platform === platforms.IDEVICE && /*#__PURE__*/React.createElement(DialogActionWithInstructions, {
    action1: /*#__PURE__*/React.createElement(React.Fragment, null, props.instructionIdeviceAction1 || "Tap the share button:", /*#__PURE__*/React.createElement(IOSShareIcon, {
      __self: this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 42,
        columnNumber: 17
      }
    })),
    action2: props.instructionIdeviceAction2 || "then find and tap 'Add to Homescreen'",
    onSubmit: props.onSubmit,
    instructionTitle: props.instructionTitle,
    instructionActionOk: props.instructionActionOk,
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 38,
      columnNumber: 11
    }
  }), props.platform === platforms.FIREFOX && /*#__PURE__*/React.createElement(DialogActionWithInstructions, {
    action1: /*#__PURE__*/React.createElement(React.Fragment, null, props.instructionFirefoxAction1 || "Tap this icon on the address bar:", /*#__PURE__*/React.createElement(FireFoxA2HSIcon, {
      __self: this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 56,
        columnNumber: 17
      }
    })),
    action2: props.instructionFirefoxAction2 || "then tap '+Add to Homescreen'",
    onSubmit: props.onSubmit,
    instructionTitle: props.instructionTitle,
    instructionActionOk: props.instructionActionOk,
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 52,
      columnNumber: 11
    }
  }), props.platform === platforms.FIREFOX_NEW && /*#__PURE__*/React.createElement(DialogActionWithInstructions, {
    action1: /*#__PURE__*/React.createElement(React.Fragment, null, props.instructionFirefoxNewAction1 || "Tap the menu button:", /*#__PURE__*/React.createElement(MenuIcon, {
      __self: this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 70,
        columnNumber: 17
      }
    })),
    action2: props.instructionFirefoxNewAction2 || "then tap 'Install'",
    onSubmit: props.onSubmit,
    instructionTitle: props.instructionTitle,
    instructionActionOk: props.instructionActionOk,
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 66,
      columnNumber: 11
    }
  }), props.platform === platforms.OPERA && /*#__PURE__*/React.createElement(DialogActionWithInstructions, {
    action1: /*#__PURE__*/React.createElement(React.Fragment, null, props.instructionOperaAction1 || "Tap the menu button:", /*#__PURE__*/React.createElement(MenuIcon, {
      __self: this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 84,
        columnNumber: 17
      }
    })),
    action2: /*#__PURE__*/React.createElement(React.Fragment, null, props.instructionOperaAction2 || "then tap 'Home screen: '", /*#__PURE__*/React.createElement(OperaA2HSIcon, {
      __self: this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 90,
        columnNumber: 17
      }
    })),
    onSubmit: props.onSubmit,
    instructionTitle: props.instructionTitle,
    instructionActionOk: props.instructionActionOk,
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 80,
      columnNumber: 11
    }
  }), props.platform === platforms.OTHER && /*#__PURE__*/React.createElement(Box, {
    width: "100%",
    display: "flex",
    flexDirection: "column",
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 99,
      columnNumber: 11
    }
  }, /*#__PURE__*/React.createElement(Box, {
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 100,
      columnNumber: 13
    }
  }, props.instructionNotSupported || "Unfortunately the install feature is not supported by your browser."), /*#__PURE__*/React.createElement(Box, {
    width: "100%",
    textAlign: "right",
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 101,
      columnNumber: 13
    }
  }, /*#__PURE__*/React.createElement(Button, {
    onClick: props.onClose,
    __self: this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 102,
      columnNumber: 15
    }
  }, props.instructionActionOk || "Ok")))));
}