UNPKG

@bitjourney/react-from-html

Version:

Builds React elements from HTML snippets, or a safe dangerouslySetInnerHTML alternative

1,037 lines (871 loc) 41.5 kB
(function(e, a) { for(var i in a) e[i] = a[i]; }(exports, /******/ (function(modules) { // webpackBootstrap /******/ // The module cache /******/ var installedModules = {}; /******/ /******/ // The require function /******/ function __webpack_require__(moduleId) { /******/ /******/ // Check if module is in cache /******/ if(installedModules[moduleId]) { /******/ return installedModules[moduleId].exports; /******/ } /******/ // Create a new module (and put it into the cache) /******/ var module = installedModules[moduleId] = { /******/ i: moduleId, /******/ l: false, /******/ exports: {} /******/ }; /******/ /******/ // Execute the module function /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); /******/ /******/ // Flag the module as loaded /******/ module.l = true; /******/ /******/ // Return the exports of the module /******/ return module.exports; /******/ } /******/ /******/ /******/ // expose the modules object (__webpack_modules__) /******/ __webpack_require__.m = modules; /******/ /******/ // expose the module cache /******/ __webpack_require__.c = installedModules; /******/ /******/ // define getter function for harmony exports /******/ __webpack_require__.d = function(exports, name, getter) { /******/ if(!__webpack_require__.o(exports, name)) { /******/ Object.defineProperty(exports, name, { enumerable: true, get: getter }); /******/ } /******/ }; /******/ /******/ // define __esModule on exports /******/ __webpack_require__.r = function(exports) { /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) { /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' }); /******/ } /******/ Object.defineProperty(exports, '__esModule', { value: true }); /******/ }; /******/ /******/ // create a fake namespace object /******/ // mode & 1: value is a module id, require it /******/ // mode & 2: merge all properties of value into the ns /******/ // mode & 4: return value when already ns object /******/ // mode & 8|1: behave like require /******/ __webpack_require__.t = function(value, mode) { /******/ if(mode & 1) value = __webpack_require__(value); /******/ if(mode & 8) return value; /******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value; /******/ var ns = Object.create(null); /******/ __webpack_require__.r(ns); /******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value }); /******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key)); /******/ return ns; /******/ }; /******/ /******/ // getDefaultExport function for compatibility with non-harmony modules /******/ __webpack_require__.n = function(module) { /******/ var getter = module && module.__esModule ? /******/ function getDefault() { return module['default']; } : /******/ function getModuleExports() { return module; }; /******/ __webpack_require__.d(getter, 'a', getter); /******/ return getter; /******/ }; /******/ /******/ // Object.prototype.hasOwnProperty.call /******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); }; /******/ /******/ // __webpack_public_path__ /******/ __webpack_require__.p = ""; /******/ /******/ /******/ // Load entry module and return exports /******/ return __webpack_require__(__webpack_require__.s = "./src/index.ts"); /******/ }) /************************************************************************/ /******/ ({ /***/ "./src/DOMParserContext.ts": /*!*********************************!*\ !*** ./src/DOMParserContext.ts ***! \*********************************/ /*! exports provided: DOMParserContext */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "DOMParserContext", function() { return DOMParserContext; }); /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react"); /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__); var DOMParserContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["createContext"])({ parseFromString: function () { throw new Error("You must setup <DOMParserContext.Provider/>"); } }); /***/ }), /***/ "./src/RawHtml.tsx": /*!*************************!*\ !*** ./src/RawHtml.tsx ***! \*************************/ /*! exports provided: RawHtml */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "RawHtml", function() { return RawHtml; }); /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react"); /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__); /* harmony import */ var _useDOMParser__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./useDOMParser */ "./src/useDOMParser.ts"); /* harmony import */ var _ReactFromHtml__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./ReactFromHtml */ "./src/ReactFromHtml.ts"); var RawHtml = function (props) { var domParser = Object(_useDOMParser__WEBPACK_IMPORTED_MODULE_1__["useDOMParser"])(); return Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () { var reactFromHtml = new _ReactFromHtml__WEBPACK_IMPORTED_MODULE_2__["ReactFromHtml"]({ domParser: domParser }); return reactFromHtml.parseToFragment(props.html); }, [props.html]); }; /***/ }), /***/ "./src/ReactFromHtml.ts": /*!******************************!*\ !*** ./src/ReactFromHtml.ts ***! \******************************/ /*! exports provided: ReactFromHtml */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ReactFromHtml", function() { return ReactFromHtml; }); /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react"); /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__); /* harmony import */ var _extractPropsFromElement__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./extractPropsFromElement */ "./src/extractPropsFromElement.ts"); /* harmony import */ var crypto_js_sha1__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! crypto-js/sha1 */ "crypto-js/sha1"); /* harmony import */ var crypto_js_sha1__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(crypto_js_sha1__WEBPACK_IMPORTED_MODULE_2__); /* harmony import */ var crypto_js_enc_hex__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! crypto-js/enc-hex */ "crypto-js/enc-hex"); /* harmony import */ var crypto_js_enc_hex__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(crypto_js_enc_hex__WEBPACK_IMPORTED_MODULE_3__); var __assign = (undefined && undefined.__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 __read = (undefined && undefined.__read) || function (o, n) { var m = typeof Symbol === "function" && o[Symbol.iterator]; if (!m) return o; var i = m.call(o), r, ar = [], e; try { while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value); } catch (error) { e = { error: error }; } finally { try { if (r && !r.done && (m = i["return"])) m.call(i); } finally { if (e) throw e.error; } } return ar; }; var __spread = (undefined && undefined.__spread) || function () { for (var ar = [], i = 0; i < arguments.length; i++) ar = ar.concat(__read(arguments[i])); return ar; }; function sha1hex(s) { return crypto_js_enc_hex__WEBPACK_IMPORTED_MODULE_3___default.a.stringify(crypto_js_sha1__WEBPACK_IMPORTED_MODULE_2___default()(s)); } var ReactFromHtml = /** @class */ (function () { function ReactFromHtml(options) { if (options === void 0) { options = {}; } this.replace = options.replace || this.nodeToReactNode.bind(this); this.digest = options.digest || this.sha1digest.bind(this); // NOTE: DOMParser does not exist on NodeJS environment. this.domParser = options.domParser || new DOMParser(); } ReactFromHtml.prototype.sha1digest = function (node, index) { if (node.nodeName === "#comment") { return index + "/" + node.nodeName; } else if (node.nodeName === "#text") { return index + "/" + node.nodeName + "/" + sha1hex(node.data); } else { return index + "/" + node.nodeName + "/" + sha1hex(node.outerHTML); } }; ReactFromHtml.prototype.elementToReactNode = function (element, extraProps) { var props = {}; var children = []; if (element.nodeName === "#comment") { return null; } else if (element.nodeName === "SCRIPT" || element.nodeName === "STYLE") { if (element.firstChild) { props.dangerouslySetInnerHTML = { __html: element.firstChild.data }; } } else if (element.nodeName === "TEXTAREA") { if (element.firstChild) { props.defaultValue = element.firstChild.data; } } else { children.push.apply(children, __spread(this.nodesToReactNodes(element.childNodes))); } return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement.apply(react__WEBPACK_IMPORTED_MODULE_0___default.a, __spread([element.nodeName.toLowerCase(), __assign({}, Object(_extractPropsFromElement__WEBPACK_IMPORTED_MODULE_1__["extractPropsFromElement"])(element), props, extraProps)], children)); }; ReactFromHtml.prototype.nodeToReactNode = function (node, props) { if (node.nodeName === "#text") { return node.data; } else { return this.elementToReactNode(node, props); } }; ReactFromHtml.prototype.nodesToReactNodes = function (nodes) { var reactNodes = []; for (var i = 0, len = nodes.length; i < len; i++) { var reactNode = this.replace(nodes[i], { key: this.digest(nodes[i], i) }); reactNodes.push(reactNode); } return reactNodes; }; ReactFromHtml.prototype.parseToNodeList = function (html) { var doc = this.domParser.parseFromString("<body>" + html, "text/html"); return this.nodesToReactNodes(doc.body.childNodes); }; /** * @requires react v16.0.0 or later */ ReactFromHtml.prototype.parseToFragment = function (html) { console.assert(react__WEBPACK_IMPORTED_MODULE_0___default.a.Fragment, "requires React v16 or later"); return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement.apply(react__WEBPACK_IMPORTED_MODULE_0___default.a, __spread([react__WEBPACK_IMPORTED_MODULE_0___default.a.Fragment, {}], this.parseToNodeList(html))); }; return ReactFromHtml; }()); /***/ }), /***/ "./src/extractPropsFromElement.ts": /*!****************************************!*\ !*** ./src/extractPropsFromElement.ts ***! \****************************************/ /*! exports provided: extractPropsFromElement */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "extractPropsFromElement", function() { return extractPropsFromElement; }); /* harmony import */ var react_dom_shared_DOMProperty__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react-dom.shared/DOMProperty */ "./vendor-build/react-dom.shared/DOMProperty.js"); /* harmony import */ var react_dom_shared_DOMProperty__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react_dom_shared_DOMProperty__WEBPACK_IMPORTED_MODULE_0__); /* harmony import */ var react_dom_shared_CSSProperty__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom.shared/CSSProperty */ "./vendor-build/react-dom.shared/CSSProperty.js"); /* harmony import */ var react_dom_shared_CSSProperty__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_dom_shared_CSSProperty__WEBPACK_IMPORTED_MODULE_1__); var __values = (undefined && undefined.__values) || function (o) { var m = typeof Symbol === "function" && o[Symbol.iterator], i = 0; if (m) return m.call(o); return { next: function () { if (o && i >= o.length) o = void 0; return { value: o && o[i++], done: !o }; } }; }; var ATTR_MAP = (function () { var e_1, _a; var map = new Map(); var records = Object.values(react_dom_shared_DOMProperty__WEBPACK_IMPORTED_MODULE_0__["properties"]); try { for (var records_1 = __values(records), records_1_1 = records_1.next(); !records_1_1.done; records_1_1 = records_1.next()) { var record = records_1_1.value; // an attribute name is always lower-cased map.set(record.attributeName.toLowerCase(), record); } } catch (e_1_1) { e_1 = { error: e_1_1 }; } finally { try { if (records_1_1 && !records_1_1.done && (_a = records_1.return)) _a.call(records_1); } finally { if (e_1) throw e_1.error; } } return map; })(); // the inverse of react-dom's hyphenateStyleName() // e.g. // convertToReactStyleName("background-color") = "backgroundColor" // convertToReactStyleName("-moz-transition") = "MozTransition" // convertToReactStyleName("-ms-transition") = "msTransition" function convertToReactStyleName(name) { return name .replace(/^-ms\b/, "ms") .replace(/-(\w)/g, function (_, firstChar) { return firstChar.toUpperCase(); }); } function looksLikeNumber(value) { var n = Number.parseFloat(value); return Number.isFinite(n); } function convertToReactStyleValue(name, value) { if (react_dom_shared_CSSProperty__WEBPACK_IMPORTED_MODULE_1__["isUnitlessNumber"][name] && looksLikeNumber(value)) { return Number.parseFloat(value); } else { return value; } } function convetCssomToReactStyleObject(style) { var styleObject = {}; for (var i = 0, len = style.length; i < len; i++) { var name_1 = style[i]; var value = style.getPropertyValue(name_1); var reactStyleName = convertToReactStyleName(name_1); styleObject[reactStyleName] = convertToReactStyleValue(reactStyleName, value); } return styleObject; } function convertAttrValueByType(value, type) { switch (type) { case react_dom_shared_DOMProperty__WEBPACK_IMPORTED_MODULE_0__["BOOLEAN"]: return value != null; case react_dom_shared_DOMProperty__WEBPACK_IMPORTED_MODULE_0__["NUMERIC"]: case react_dom_shared_DOMProperty__WEBPACK_IMPORTED_MODULE_0__["POSITIVE_NUMERIC"]: return +(value || 0); default: return value; } } function attrToProp(element, attr) { var name = attr.name; if (name === "value") { if (element.nodeName === "INPUT" || element.nodeName === "SELECT") { return { name: "defaultValue", value: attr.value }; } } var record = ATTR_MAP.get(name); if (record) { if (record.type === react_dom_shared_DOMProperty__WEBPACK_IMPORTED_MODULE_0__["RESERVED"]) { // RESERVED includes style, dangerouslySetInnerHTML, innerHTML, defaultValue, and so on. if (record.propertyName === "style") { return { name: name, value: convetCssomToReactStyleObject(element["style"]) }; } return null; // ignores reserved prop name. } else { return { name: record.propertyName, value: convertAttrValueByType(attr.value, record.type) }; } } else { return { name: name, value: attr.value }; } } function extractPropsFromElement(element) { var attributes = element.attributes; console.assert(attributes, "The element must have #attributes: " + element); var props = {}; for (var i = 0, len = attributes.length; i < len; i++) { var prop = attrToProp(element, attributes[i]); if (prop) { props[prop.name] = prop.value; } } return props; } /***/ }), /***/ "./src/index.ts": /*!**********************!*\ !*** ./src/index.ts ***! \**********************/ /*! exports provided: ReactFromHtml, RawHtml, DOMParserContext */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony import */ var _ReactFromHtml__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./ReactFromHtml */ "./src/ReactFromHtml.ts"); /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "ReactFromHtml", function() { return _ReactFromHtml__WEBPACK_IMPORTED_MODULE_0__["ReactFromHtml"]; }); /* harmony import */ var _RawHtml__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./RawHtml */ "./src/RawHtml.tsx"); /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "RawHtml", function() { return _RawHtml__WEBPACK_IMPORTED_MODULE_1__["RawHtml"]; }); /* harmony import */ var _DOMParserContext__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./DOMParserContext */ "./src/DOMParserContext.ts"); /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "DOMParserContext", function() { return _DOMParserContext__WEBPACK_IMPORTED_MODULE_2__["DOMParserContext"]; }); /***/ }), /***/ "./src/useDOMParser.ts": /*!*****************************!*\ !*** ./src/useDOMParser.ts ***! \*****************************/ /*! exports provided: useDOMParser */ /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; __webpack_require__.r(__webpack_exports__); /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "useDOMParser", function() { return useDOMParser; }); /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react"); /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__); /* harmony import */ var _DOMParserContext__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./DOMParserContext */ "./src/DOMParserContext.ts"); function useDOMParser() { return Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_DOMParserContext__WEBPACK_IMPORTED_MODULE_1__["DOMParserContext"]); } /***/ }), /***/ "./vendor-build/react-dom.shared/CSSProperty.js": /*!******************************************************!*\ !*** ./vendor-build/react-dom.shared/CSSProperty.js ***! \******************************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.isUnitlessNumber = void 0; /** * Copyright (c) Facebook, Inc. and its affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ /** * CSS properties which accept numbers but are not in units of "px". */ var isUnitlessNumber = { animationIterationCount: true, borderImageOutset: true, borderImageSlice: true, borderImageWidth: true, boxFlex: true, boxFlexGroup: true, boxOrdinalGroup: true, columnCount: true, columns: true, flex: true, flexGrow: true, flexPositive: true, flexShrink: true, flexNegative: true, flexOrder: true, gridArea: true, gridRow: true, gridRowEnd: true, gridRowSpan: true, gridRowStart: true, gridColumn: true, gridColumnEnd: true, gridColumnSpan: true, gridColumnStart: true, fontWeight: true, lineClamp: true, lineHeight: true, opacity: true, order: true, orphans: true, tabSize: true, widows: true, zIndex: true, zoom: true, // SVG-related properties fillOpacity: true, floodOpacity: true, stopOpacity: true, strokeDasharray: true, strokeDashoffset: true, strokeMiterlimit: true, strokeOpacity: true, strokeWidth: true }; /** * @param {string} prefix vendor-specific prefix, eg: Webkit * @param {string} key style name, eg: transitionDuration * @return {string} style name prefixed with `prefix`, properly camelCased, eg: * WebkitTransitionDuration */ exports.isUnitlessNumber = isUnitlessNumber; function prefixKey(prefix, key) { return prefix + key.charAt(0).toUpperCase() + key.substring(1); } /** * Support style names that may come passed in prefixed by adding permutations * of vendor prefixes. */ var prefixes = ['Webkit', 'ms', 'Moz', 'O']; // Using Object.keys here, or else the vanilla for-in loop makes IE8 go into an // infinite loop, because it iterates over the newly added props too. Object.keys(isUnitlessNumber).forEach(function (prop) { prefixes.forEach(function (prefix) { isUnitlessNumber[prefixKey(prefix, prop)] = isUnitlessNumber[prop]; }); }); /***/ }), /***/ "./vendor-build/react-dom.shared/DOMProperty.js": /*!******************************************************!*\ !*** ./vendor-build/react-dom.shared/DOMProperty.js ***! \******************************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.isAttributeNameSafe = isAttributeNameSafe; exports.shouldIgnoreAttribute = shouldIgnoreAttribute; exports.shouldRemoveAttributeWithWarning = shouldRemoveAttributeWithWarning; exports.shouldRemoveAttribute = shouldRemoveAttribute; exports.getPropertyInfo = getPropertyInfo; exports.VALID_ATTRIBUTE_NAME_REGEX = exports.ROOT_ATTRIBUTE_NAME = exports.ID_ATTRIBUTE_NAME = exports.ATTRIBUTE_NAME_CHAR = exports.ATTRIBUTE_NAME_START_CHAR = exports.POSITIVE_NUMERIC = exports.NUMERIC = exports.OVERLOADED_BOOLEAN = exports.BOOLEAN = exports.BOOLEANISH_STRING = exports.STRING = exports.RESERVED = void 0; var _warning = _interopRequireDefault(__webpack_require__(/*! shared/warning */ "./vendor-build/shared/warning.js")); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); } function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); } // A reserved attribute. // It is handled by React separately and shouldn't be written to the DOM. var RESERVED = 0; // A simple string attribute. // Attributes that aren't in the whitelist are presumed to have this type. exports.RESERVED = RESERVED; var STRING = 1; // A string attribute that accepts booleans in React. In HTML, these are called // "enumerated" attributes with "true" and "false" as possible values. // When true, it should be set to a "true" string. // When false, it should be set to a "false" string. exports.STRING = STRING; var BOOLEANISH_STRING = 2; // A real boolean attribute. // When true, it should be present (set either to an empty string or its name). // When false, it should be omitted. exports.BOOLEANISH_STRING = BOOLEANISH_STRING; var BOOLEAN = 3; // An attribute that can be used as a flag as well as with a value. // When true, it should be present (set either to an empty string or its name). // When false, it should be omitted. // For any other value, should be present with that value. exports.BOOLEAN = BOOLEAN; var OVERLOADED_BOOLEAN = 4; // An attribute that must be numeric or parse as a numeric. // When falsy, it should be removed. exports.OVERLOADED_BOOLEAN = OVERLOADED_BOOLEAN; var NUMERIC = 5; // An attribute that must be positive numeric or parse as a positive numeric. // When falsy, it should be removed. exports.NUMERIC = NUMERIC; var POSITIVE_NUMERIC = 6; exports.POSITIVE_NUMERIC = POSITIVE_NUMERIC; /* eslint-disable max-len */ var ATTRIBUTE_NAME_START_CHAR = ":A-Z_a-z\\u00C0-\\u00D6\\u00D8-\\u00F6\\u00F8-\\u02FF\\u0370-\\u037D\\u037F-\\u1FFF\\u200C-\\u200D\\u2070-\\u218F\\u2C00-\\u2FEF\\u3001-\\uD7FF\\uF900-\\uFDCF\\uFDF0-\\uFFFD"; /* eslint-enable max-len */ exports.ATTRIBUTE_NAME_START_CHAR = ATTRIBUTE_NAME_START_CHAR; var ATTRIBUTE_NAME_CHAR = ATTRIBUTE_NAME_START_CHAR + "\\-.0-9\\u00B7\\u0300-\\u036F\\u203F-\\u2040"; exports.ATTRIBUTE_NAME_CHAR = ATTRIBUTE_NAME_CHAR; var ID_ATTRIBUTE_NAME = 'data-reactid'; exports.ID_ATTRIBUTE_NAME = ID_ATTRIBUTE_NAME; var ROOT_ATTRIBUTE_NAME = 'data-reactroot'; exports.ROOT_ATTRIBUTE_NAME = ROOT_ATTRIBUTE_NAME; var VALID_ATTRIBUTE_NAME_REGEX = new RegExp('^[' + ATTRIBUTE_NAME_START_CHAR + '][' + ATTRIBUTE_NAME_CHAR + ']*$'); exports.VALID_ATTRIBUTE_NAME_REGEX = VALID_ATTRIBUTE_NAME_REGEX; var hasOwnProperty = Object.prototype.hasOwnProperty; var illegalAttributeNameCache = {}; var validatedAttributeNameCache = {}; function isAttributeNameSafe(attributeName) { if (hasOwnProperty.call(validatedAttributeNameCache, attributeName)) { return true; } if (hasOwnProperty.call(illegalAttributeNameCache, attributeName)) { return false; } if (VALID_ATTRIBUTE_NAME_REGEX.test(attributeName)) { validatedAttributeNameCache[attributeName] = true; return true; } illegalAttributeNameCache[attributeName] = true; if (false) {} return false; } function shouldIgnoreAttribute(name, propertyInfo, isCustomComponentTag) { if (propertyInfo !== null) { return propertyInfo.type === RESERVED; } if (isCustomComponentTag) { return false; } if (name.length > 2 && (name[0] === 'o' || name[0] === 'O') && (name[1] === 'n' || name[1] === 'N')) { return true; } return false; } function shouldRemoveAttributeWithWarning(name, value, propertyInfo, isCustomComponentTag) { if (propertyInfo !== null && propertyInfo.type === RESERVED) { return false; } switch (_typeof(value)) { case 'function': // $FlowIssue symbol is perfectly valid here case 'symbol': // eslint-disable-line return true; case 'boolean': { if (isCustomComponentTag) { return false; } if (propertyInfo !== null) { return !propertyInfo.acceptsBooleans; } else { var prefix = name.toLowerCase().slice(0, 5); return prefix !== 'data-' && prefix !== 'aria-'; } } default: return false; } } function shouldRemoveAttribute(name, value, propertyInfo, isCustomComponentTag) { if (value === null || typeof value === 'undefined') { return true; } if (shouldRemoveAttributeWithWarning(name, value, propertyInfo, isCustomComponentTag)) { return true; } if (isCustomComponentTag) { return false; } if (propertyInfo !== null) { switch (propertyInfo.type) { case BOOLEAN: return !value; case OVERLOADED_BOOLEAN: return value === false; case NUMERIC: return isNaN(value); case POSITIVE_NUMERIC: return isNaN(value) || value < 1; } } return false; } function getPropertyInfo(name) { return properties.hasOwnProperty(name) ? properties[name] : null; } function PropertyInfoRecord(name, type, mustUseProperty, attributeName, attributeNamespace) { this.acceptsBooleans = type === BOOLEANISH_STRING || type === BOOLEAN || type === OVERLOADED_BOOLEAN; this.attributeName = attributeName; this.attributeNamespace = attributeNamespace; this.mustUseProperty = mustUseProperty; this.propertyName = name; this.type = type; } // When adding attributes to this list, be sure to also add them to // the `possibleStandardNames` module to ensure casing and incorrect // name warnings. var properties = {}; // These props are reserved by React. They shouldn't be written to the DOM. ['children', 'dangerouslySetInnerHTML', // TODO: This prevents the assignment of defaultValue to regular // elements (not just inputs). Now that ReactDOMInput assigns to the // defaultValue property -- do we need this? 'defaultValue', 'defaultChecked', 'innerHTML', 'suppressContentEditableWarning', 'suppressHydrationWarning', 'style'].forEach(function (name) { properties[name] = new PropertyInfoRecord(name, RESERVED, false, // mustUseProperty name, // attributeName null); }); // A few React string attributes have a different name. // This is a mapping from React prop names to the attribute names. [['acceptCharset', 'accept-charset'], ['className', 'class'], ['htmlFor', 'for'], ['httpEquiv', 'http-equiv']].forEach(function (_ref) { var _ref2 = _slicedToArray(_ref, 2), name = _ref2[0], attributeName = _ref2[1]; properties[name] = new PropertyInfoRecord(name, STRING, false, // mustUseProperty attributeName, // attributeName null); }); // These are "enumerated" HTML attributes that accept "true" and "false". // In React, we let users pass `true` and `false` even though technically // these aren't boolean attributes (they are coerced to strings). ['contentEditable', 'draggable', 'spellCheck', 'value'].forEach(function (name) { properties[name] = new PropertyInfoRecord(name, BOOLEANISH_STRING, false, // mustUseProperty name.toLowerCase(), // attributeName null); }); // These are "enumerated" SVG attributes that accept "true" and "false". // In React, we let users pass `true` and `false` even though technically // these aren't boolean attributes (they are coerced to strings). // Since these are SVG attributes, their attribute names are case-sensitive. ['autoReverse', 'externalResourcesRequired', 'focusable', 'preserveAlpha'].forEach(function (name) { properties[name] = new PropertyInfoRecord(name, BOOLEANISH_STRING, false, // mustUseProperty name, // attributeName null); }); // These are HTML boolean attributes. ['allowFullScreen', 'async', // Note: there is a special case that prevents it from being written to the DOM // on the client side because the browsers are inconsistent. Instead we call focus(). 'autoFocus', 'autoPlay', 'controls', 'default', 'defer', 'disabled', 'formNoValidate', 'hidden', 'loop', 'noModule', 'noValidate', 'open', 'playsInline', 'readOnly', 'required', 'reversed', 'scoped', 'seamless', // Microdata 'itemScope'].forEach(function (name) { properties[name] = new PropertyInfoRecord(name, BOOLEAN, false, // mustUseProperty name.toLowerCase(), // attributeName null); }); // These are the few React props that we set as DOM properties // rather than attributes. These are all booleans. ['checked', // Note: `option.selected` is not updated if `select.multiple` is // disabled with `removeAttribute`. We have special logic for handling this. 'multiple', 'muted', 'selected'].forEach(function (name) { properties[name] = new PropertyInfoRecord(name, BOOLEAN, true, // mustUseProperty name, // attributeName null); }); // These are HTML attributes that are "overloaded booleans": they behave like // booleans, but can also accept a string value. ['capture', 'download'].forEach(function (name) { properties[name] = new PropertyInfoRecord(name, OVERLOADED_BOOLEAN, false, // mustUseProperty name, // attributeName null); }); // These are HTML attributes that must be positive numbers. ['cols', 'rows', 'size', 'span'].forEach(function (name) { properties[name] = new PropertyInfoRecord(name, POSITIVE_NUMERIC, false, // mustUseProperty name, // attributeName null); }); // These are HTML attributes that must be numbers. ['rowSpan', 'start'].forEach(function (name) { properties[name] = new PropertyInfoRecord(name, NUMERIC, false, // mustUseProperty name.toLowerCase(), // attributeName null); }); var CAMELIZE = /[\-\:]([a-z])/g; var capitalize = function capitalize(token) { return token[1].toUpperCase(); }; // This is a list of all SVG attributes that need special casing, namespacing, // or boolean value assignment. Regular attributes that just accept strings // and have the same names are omitted, just like in the HTML whitelist. // Some of these attributes can be hard to find. This list was created by // scrapping the MDN documentation. ['accent-height', 'alignment-baseline', 'arabic-form', 'baseline-shift', 'cap-height', 'clip-path', 'clip-rule', 'color-interpolation', 'color-interpolation-filters', 'color-profile', 'color-rendering', 'dominant-baseline', 'enable-background', 'fill-opacity', 'fill-rule', 'flood-color', 'flood-opacity', 'font-family', 'font-size', 'font-size-adjust', 'font-stretch', 'font-style', 'font-variant', 'font-weight', 'glyph-name', 'glyph-orientation-horizontal', 'glyph-orientation-vertical', 'horiz-adv-x', 'horiz-origin-x', 'image-rendering', 'letter-spacing', 'lighting-color', 'marker-end', 'marker-mid', 'marker-start', 'overline-position', 'overline-thickness', 'paint-order', 'panose-1', 'pointer-events', 'rendering-intent', 'shape-rendering', 'stop-color', 'stop-opacity', 'strikethrough-position', 'strikethrough-thickness', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'text-anchor', 'text-decoration', 'text-rendering', 'underline-position', 'underline-thickness', 'unicode-bidi', 'unicode-range', 'units-per-em', 'v-alphabetic', 'v-hanging', 'v-ideographic', 'v-mathematical', 'vector-effect', 'vert-adv-y', 'vert-origin-x', 'vert-origin-y', 'word-spacing', 'writing-mode', 'xmlns:xlink', 'x-height'].forEach(function (attributeName) { var name = attributeName.replace(CAMELIZE, capitalize); properties[name] = new PropertyInfoRecord(name, STRING, false, // mustUseProperty attributeName, null); }); // String SVG attributes with the xlink namespace. ['xlink:actuate', 'xlink:arcrole', 'xlink:href', 'xlink:role', 'xlink:show', 'xlink:title', 'xlink:type'].forEach(function (attributeName) { var name = attributeName.replace(CAMELIZE, capitalize); properties[name] = new PropertyInfoRecord(name, STRING, false, // mustUseProperty attributeName, 'http://www.w3.org/1999/xlink'); }); // String SVG attributes with the xml namespace. ['xml:base', 'xml:lang', 'xml:space'].forEach(function (attributeName) { var name = attributeName.replace(CAMELIZE, capitalize); properties[name] = new PropertyInfoRecord(name, STRING, false, // mustUseProperty attributeName, 'http://www.w3.org/XML/1998/namespace'); }); // These attribute exists both in HTML and SVG. // The attribute name is case-sensitive in SVG so we can't just use // the React name like we do for attributes that exist only in HTML. ['tabIndex', 'crossOrigin'].forEach(function (attributeName) { properties[attributeName] = new PropertyInfoRecord(attributeName, STRING, false, // mustUseProperty attributeName.toLowerCase(), // attributeName null); }); exports.properties = properties; /***/ }), /***/ "./vendor-build/shared/ReactSharedInternals.js": /*!*****************************************************!*\ !*** ./vendor-build/shared/ReactSharedInternals.js ***! \*****************************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; var _react = _interopRequireDefault(__webpack_require__(/*! react */ "react")); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } /** * Copyright (c) Facebook, Inc. and its affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ var ReactSharedInternals = _react.default.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED; // Prevent newer renderers from RTE when used with older react package versions. // Current owner and dispatcher used to share the same ref, // but PR #14548 split them out to better support the react-debug-tools package. if (!ReactSharedInternals.hasOwnProperty('ReactCurrentDispatcher')) { ReactSharedInternals.ReactCurrentDispatcher = { current: null }; } var _default = ReactSharedInternals; exports.default = _default; /***/ }), /***/ "./vendor-build/shared/warning.js": /*!****************************************!*\ !*** ./vendor-build/shared/warning.js ***! \****************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; var _warningWithoutStack = _interopRequireDefault(__webpack_require__(/*! shared/warningWithoutStack */ "./vendor-build/shared/warningWithoutStack.js")); var _ReactSharedInternals = _interopRequireDefault(__webpack_require__(/*! shared/ReactSharedInternals */ "./vendor-build/shared/ReactSharedInternals.js")); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } /** * Copyright (c) Facebook, Inc. and its affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ /** * Similar to invariant but only logs a warning if the condition is not met. * This can be used to log issues in development environments in critical * paths. Removing the logging code for production environments will keep the * same logic and follow the same code paths. */ var warning = _warningWithoutStack.default; if (false) {} var _default = warning; exports.default = _default; /***/ }), /***/ "./vendor-build/shared/warningWithoutStack.js": /*!****************************************************!*\ !*** ./vendor-build/shared/warningWithoutStack.js ***! \****************************************************/ /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; /** * Copyright (c) Facebook, Inc. and its affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */ /** * Similar to invariant but only logs a warning if the condition is not met. * This can be used to log issues in development environments in critical * paths. Removing the logging code for production environments will keep the * same logic and follow the same code paths. */ var warningWithoutStack = function warningWithoutStack() {}; if (false) {} var _default = warningWithoutStack; exports.default = _default; /***/ }), /***/ "crypto-js/enc-hex": /*!*************************************************!*\ !*** external {"commonjs":"crypto-js/enc-hex"} ***! \*************************************************/ /*! no static exports found */ /***/ (function(module, exports) { module.exports = require("crypto-js/enc-hex"); /***/ }), /***/ "crypto-js/sha1": /*!**********************************************!*\ !*** external {"commonjs":"crypto-js/sha1"} ***! \**********************************************/ /*! no static exports found */ /***/ (function(module, exports) { module.exports = require("crypto-js/sha1"); /***/ }), /***/ "react": /*!*************************************!*\ !*** external {"commonjs":"react"} ***! \*************************************/ /*! no static exports found */ /***/ (function(module, exports) { module.exports = require("react"); /***/ }) /******/ }))); //# sourceMappingURL=react-from-html.development.js.map