@native-html/iframe-plugin/lib/commonjs/HTMLIframe.js

🌐 A WebView-based plugin to render iframes in react-native-render-html

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = HTMLIframe;

var _react = _interopRequireWildcard(require("react"));

var _webshell = require("@formidable-webview/webshell");

var _reactNative = require("react-native");

var _pluginsCore = require("@native-html/plugins-core");

function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }

function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

const RM_BODY_SPACING_CSS = 'body{padding: 0 !important; margin: 0 !important;}';
const features = [new _webshell.HandleLinkPressFeature({
  preventDefault: true
})];
/**
 * A component to render iframes in react-native-render-html.
 *
 * @public
 */

function HTMLIframe({
  WebView,
  webViewProps: userWebViewProps,
  source,
  style,
  onLinkPress,
  scaleFactor,
  injectedCSSStyles,
  removeBodySpacing,
  scalesPageToFit = false
}) {
  const onDOMLinkPress = (0, _react.useCallback)(event => onLinkPress === null || onLinkPress === void 0 ? void 0 : onLinkPress.apply(null, (0, _pluginsCore.linkPressTargetToOnDOMLinkPressArgs)(event)), [onLinkPress]);
  const injectedCss = (0, _react.useMemo)(() => (removeBodySpacing && RM_BODY_SPACING_CSS || '').concat(injectedCSSStyles || ''), [injectedCSSStyles, removeBodySpacing]);
  const assembledFeatures = (0, _react.useMemo)(() => {
    const feats = [...features, new _webshell.ForceResponsiveViewportFeature({
      initScale: scalesPageToFit ? scaleFactor : 1,
      maxScale: scalesPageToFit ? scaleFactor : 1,
      minScale: scalesPageToFit ? scaleFactor : 1
    })];

    if (injectedCss) {
      feats.push(new _webshell.InjectStyleFeature({
        css: injectedCss
      }));
    }

    return feats;
  }, [injectedCss, scaleFactor, scalesPageToFit]);
  const webViewProps = (0, _webshell.useWebshell)({
    features: assembledFeatures,
    props: { ...userWebViewProps,
      onDOMLinkPress,
      source,
      testID: 'iframe'
    }
  }); // We need to wrap the WebView in a View to circumvent a bug in
  // react-native-webview, see https://git.io/JKY1r

  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
    style: style
  }, /*#__PURE__*/_react.default.createElement(WebView, webViewProps));
}
//# sourceMappingURL=HTMLIframe.js.map