@prosperitainova/dumbo-react-native/lib/commonjs/components/GrantPermission/index.js

Dumbo for React Native Library

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.GrantPermission = void 0;
var _react = _interopRequireDefault(require("react"));
var _reactNative = require("react-native");
var _colors = require("../../styles/colors");
var _constants = require("../../constants/constants");
var _helpers = require("../../helpers");
var _zIndex = require("../../styles/z-index");
var _Button = require("../Button");
var _Text = require("../Text");
var _SafeAreaWrapper = require("../SafeAreaWrapper");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const cameraPermissionImage = require('./camera_permission.png');
const filePermissionImage = require('./file_permission.png');
const locationPermissionImage = require('./location_permission.png');
const notificationsPermissionImage = require('./notifications_permission.png');

/** Props for GrantPermission component */

/**
 * GrantPermission component for showing the grant device permission flow
 *
 * {@link https://github.com/carbon-design-system/carbon-react-native/blob/main/example/src/Views/GrantPermission.tsx | Example code}
 */
class GrantPermission extends _react.default.Component {
  get wideScreen() {
    const width = _reactNative.Dimensions.get('window').width;
    return width >= 500;
  }
  get styles() {
    return _reactNative.StyleSheet.create({
      modal: {
        zIndex: _zIndex.zIndexes.permissions
      },
      safeAreaWrapper: {
        backgroundColor: (0, _colors.getColor)('background'),
        position: 'relative',
        flexGrow: 1
      },
      wrapper: {
        flexGrow: 1,
        padding: 16
      },
      contentWrapper: {
        flex: 1,
        paddingTop: this.wideScreen ? 32 : 64
      },
      contentWrapperScroll: {
        flexDirection: this.wideScreen ? 'row' : 'column',
        justifyContent: 'flex-start'
      },
      textWrapper: {
        flex: 1
      },
      title: {
        marginBottom: 16
      },
      reasoning: {},
      image: {
        width: 300,
        height: 300,
        marginLeft: 'auto',
        marginRight: 'auto',
        marginTop: this.wideScreen ? 0 : 16
      },
      action: {
        marginTop: 16
      }
    });
  }
  accept = () => {
    const {
      resultsCallback
    } = this.props;
    if (typeof resultsCallback === 'function') {
      resultsCallback(true);
    }
  };
  reject = () => {
    const {
      resultsCallback
    } = this.props;
    if (typeof resultsCallback === 'function') {
      resultsCallback(false);
    }
  };
  get imageSource() {
    const {
      customImage,
      type
    } = this.props;
    if (customImage) {
      return customImage;
    }
    switch (type) {
      case 'camera':
        return cameraPermissionImage;
      case 'location':
        return locationPermissionImage;
      case 'notifications':
        return notificationsPermissionImage;
      case 'files':
      default:
        return filePermissionImage;
    }
  }
  componentWillUnmount() {
    if (this.resizeEvent && typeof this.resizeEvent.remove === 'function') {
      this.resizeEvent.remove();
    }
  }
  componentDidMount() {
    this.resizeEvent = _reactNative.Dimensions.addEventListener('change', () => {
      this.setState({});
    });
  }
  render() {
    const {
      componentProps,
      style,
      title,
      reasoning,
      additionalReasoning,
      continueText,
      cancelText,
      imageStyle
    } = this.props;
    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Modal, {
      style: this.styles.modal,
      supportedOrientations: _constants.modalPresentations,
      transparent: true,
      animationType: "slide",
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_SafeAreaWrapper.SafeAreaWrapper, {
        style: this.styles.safeAreaWrapper,
        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
          style: (0, _helpers.styleReferenceBreaker)(this.styles.wrapper, style),
          ...(componentProps || {}),
          children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.ScrollView, {
            keyboardShouldPersistTaps: "handled",
            contentInsetAdjustmentBehavior: "automatic",
            bounces: false,
            style: this.styles.contentWrapper,
            contentContainerStyle: this.styles.contentWrapperScroll,
            children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
              style: this.styles.textWrapper,
              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.Text, {
                style: this.styles.title,
                text: title,
                type: "heading-05"
              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.Text, {
                style: this.styles.reasoning,
                text: reasoning,
                type: "body-02"
              }), !!additionalReasoning && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.Text, {
                style: this.styles.reasoning,
                text: additionalReasoning,
                type: "body-02"
              })]
            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Image, {
              resizeMode: "contain",
              style: (0, _helpers.styleReferenceBreaker)(this.styles.image, imageStyle),
              source: this.imageSource
            })]
          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.Button, {
            style: this.styles.action,
            onPress: this.accept,
            text: continueText
          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.Button, {
            style: this.styles.action,
            kind: "secondary",
            onPress: this.reject,
            text: cancelText
          })]
        })
      })
    });
  }
}
exports.GrantPermission = GrantPermission;
//# sourceMappingURL=index.js.map