| 1 | {"version":3,"sources":["webpack:///webpack/universalModuleDefinition","webpack:///react-taggy.js.min.js","webpack:///webpack/bootstrap 409d1489b865b1ab0c7e","webpack:///./src/index.js","webpack:///external {\"commonjs\":\"react\",\"commonjs2\":\"react\",\"amd\":\"React\",\"root\":\"React\"}"],"names":["root","factory","exports","module","require","define","amd","this","__WEBPACK_EXTERNAL_MODULE_1__","modules","__webpack_require__","moduleId","installedModules","id","loaded","call","m","c","p","_interopRequireDefault","obj","__esModule","default","Object","defineProperty","value","_react","_react2","Taggy","_ref","text","spans","ents","jsx","elements","offset","forEach","_ref2","type","start","end","fragment","slice","entity","push","token","toLowerCase","length","filter","val","e","i","t","createElement","style","padding","margin","lineHeight","display","borderRadius","border","background","find","ent","color","r","g","b","borderColor","boxSizing","fontSize","textTransform","verticalAlign","Array","isArray","tokens","s","index","tokensWithSpaces","map","j","key"],"mappings":"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","file":"react-taggy.js.min.js","sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory(require(\"react\"));\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([\"React\"], factory);\n\telse if(typeof exports === 'object')\n\t\texports[\"reactTaggy\"] = factory(require(\"react\"));\n\telse\n\t\troot[\"reactTaggy\"] = factory(root[\"React\"]);\n})(this, function(__WEBPACK_EXTERNAL_MODULE_1__) {\nreturn \n\n\n// WEBPACK FOOTER //\n// webpack/universalModuleDefinition","(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory(require(\"react\"));\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([\"React\"], factory);\n\telse if(typeof exports === 'object')\n\t\texports[\"reactTaggy\"] = factory(require(\"react\"));\n\telse\n\t\troot[\"reactTaggy\"] = factory(root[\"React\"]);\n})(this, function(__WEBPACK_EXTERNAL_MODULE_1__) {\nreturn /******/ (function(modules) { // webpackBootstrap\n/******/ \t// The module cache\n/******/ \tvar installedModules = {};\n/******/\n/******/ \t// The require function\n/******/ \tfunction __webpack_require__(moduleId) {\n/******/\n/******/ \t\t// Check if module is in cache\n/******/ \t\tif(installedModules[moduleId])\n/******/ \t\t\treturn installedModules[moduleId].exports;\n/******/\n/******/ \t\t// Create a new module (and put it into the cache)\n/******/ \t\tvar module = installedModules[moduleId] = {\n/******/ \t\t\texports: {},\n/******/ \t\t\tid: moduleId,\n/******/ \t\t\tloaded: false\n/******/ \t\t};\n/******/\n/******/ \t\t// Execute the module function\n/******/ \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n/******/\n/******/ \t\t// Flag the module as loaded\n/******/ \t\tmodule.loaded = true;\n/******/\n/******/ \t\t// Return the exports of the module\n/******/ \t\treturn module.exports;\n/******/ \t}\n/******/\n/******/\n/******/ \t// expose the modules object (__webpack_modules__)\n/******/ \t__webpack_require__.m = modules;\n/******/\n/******/ \t// expose the module cache\n/******/ \t__webpack_require__.c = installedModules;\n/******/\n/******/ \t// __webpack_public_path__\n/******/ \t__webpack_require__.p = \"\";\n/******/\n/******/ \t// Load entry module and return exports\n/******/ \treturn __webpack_require__(0);\n/******/ })\n/************************************************************************/\n/******/ ([\n/* 0 */\n/***/ (function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\t\n\tObject.defineProperty(exports, \"__esModule\", {\n\t value: true\n\t});\n\t\n\tvar _react = __webpack_require__(1);\n\t\n\tvar _react2 = _interopRequireDefault(_react);\n\t\n\tfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\t\n\t// Define functional component. Destructure the props.\n\tvar Taggy = function Taggy(_ref) {\n\t var text = _ref.text,\n\t spans = _ref.spans,\n\t ents = _ref.ents;\n\t\n\t\n\t // Initialize an empty array that will hold the text and entities\n\t var jsx = [];\n\t\n\t // METHOD 1 - STRING\n\t if (typeof text === 'string') {\n\t // Initialize an empty array. The contents of 'elements' will eventually get pushed to the 'jsx' array, and will be converted to jsx markup in the process.\n\t var elements = [];\n\t // Keep track of location in the string of text\n\t var offset = 0;\n\t // Loop through the spans, using the span data to construct the 'elements' array\n\t spans.forEach(function (_ref2) {\n\t var type = _ref2.type,\n\t start = _ref2.start,\n\t end = _ref2.end;\n\t\n\t // Create a string of text that does not contain any entities\n\t var fragment = text.slice(offset, start);\n\t // Create an entity\n\t var entity = text.slice(start, end);\n\t // Push the both of them to the elements array\n\t elements.push(fragment);\n\t elements.push({\n\t token: entity,\n\t type: type.toLowerCase()\n\t });\n\t // Update our position within the string of text\n\t offset = end;\n\t });\n\t // After pushing all of the entities to the 'elements' array, push the remaining text to the 'elements' array. Elements should now consist of strings and objects/entities.\n\t elements.push(text.slice(offset, text.length));\n\t // Filter out unnecessary spaces\n\t elements = elements.filter(function (val) {\n\t return val !== ' ';\n\t });\n\t // Loop through elements array looking for multi-word entities.\n\t for (var e = 0; e < elements.length; e++) {\n\t // Check if we've stopped at an entity\n\t if (elements[e].token) {\n\t // Examine the consecutive entities, if any.\n\t for (var i = e + 1; i < elements.length; i++) {\n\t // Combine consecutive entities of the same type into one entity. Then, mark the duplicates as 'false'.\n\t if (typeof elements[i] !== 'string' && elements[i].type === elements[e].type) {\n\t elements[e].token += ' ' + elements[i].token;\n\t elements[i] = false;\n\t }\n\t // Stop the loop when we've run out of consecutive entities\n\t if (typeof elements[i] === 'string') {\n\t break;\n\t }\n\t }\n\t }\n\t }\n\t // Filter out the consecutive entities that were marked as duplicates\n\t elements = elements.filter(function (val) {\n\t return !!val;\n\t });\n\t // Loop through our 'elements' array. Push strings directly to the 'jsx' array. Convert entity objects to jsx markup, then push to the 'jsx' array.\n\t elements.forEach(function (t) {\n\t if (typeof t === 'string') {\n\t jsx.push(t);\n\t } else {\n\t jsx.push(_react2.default.createElement(\n\t 'mark',\n\t {\n\t style: {\n\t padding: '0.25em 0.35em',\n\t margin: '0px 0.25em',\n\t lineHeight: '1',\n\t display: 'inline-block',\n\t borderRadius: '0.25em',\n\t border: '1px solid',\n\t background: 'rgba(\\n ' + ents.find(function (ent) {\n\t return ent.type === t.type;\n\t }).color.r + ',\\n ' + ents.find(function (ent) {\n\t return ent.type === t.type;\n\t }).color.g + ',\\n ' + ents.find(function (ent) {\n\t return ent.type === t.type;\n\t }).color.b + ',\\n 0.2\\n )',\n\t borderColor: 'rgb(\\n ' + ents.find(function (ent) {\n\t return ent.type === t.type;\n\t }).color.r + ',\\n ' + ents.find(function (ent) {\n\t return ent.type === t.type;\n\t }).color.g + ',\\n ' + ents.find(function (ent) {\n\t return ent.type === t.type;\n\t }).color.b + '\\n )'\n\t }\n\t },\n\t t.token,\n\t _react2.default.createElement(\n\t 'span',\n\t {\n\t style: {\n\t boxSizing: 'border-box',\n\t fontSize: '0.6em',\n\t lineHeight: '1',\n\t padding: '0.35em',\n\t borderRadius: '0.35em',\n\t textTransform: 'uppercase',\n\t display: 'inline-block',\n\t verticalAlign: 'middle',\n\t margin: '0px 0px 0.1rem 0.5rem',\n\t background: 'rgb(\\n ' + ents.find(function (ent) {\n\t return ent.type === t.type;\n\t }).color.r + ',\\n ' + ents.find(function (ent) {\n\t return ent.type === t.type;\n\t }).color.g + ',\\n ' + ents.find(function (ent) {\n\t return ent.type === t.type;\n\t }).color.b + '\\n )'\n\t }\n\t },\n\t t.type\n\t )\n\t ));\n\t }\n\t });\n\t }\n\t\n\t // METHOD 2 - TOKENS\n\t if (Array.isArray(text)) {\n\t // Rename 'text' to 'tokens' for clarity\n\t var tokens = text;\n\t // Loop through the 'spans' array. Use the span data to update our 'tokens' array with entities\n\t for (var s = 0; s < spans.length; s++) {\n\t tokens[spans[s].index] = {\n\t token: tokens[spans[s].index],\n\t type: spans[s].type.toLowerCase()\n\t };\n\t }\n\t // Loop through the tokens array, looking for multi-word entities\n\t for (var t = 0; t < tokens.length; t++) {\n\t // Check if we've stopped at an entity\n\t if (tokens[t].token) {\n\t // Examine the consecutive entities, if any.\n\t for (var _i = t + 1; _i < tokens.length; _i++) {\n\t // Combine consecutive entities of the same type into one entity. Then, mark the duplicates as 'false'.\n\t if (typeof tokens[_i] !== 'string' && tokens[_i].type === tokens[t].type) {\n\t tokens[t].token += ' ' + tokens[_i].token;\n\t tokens[_i] = false;\n\t }\n\t // Stop the loop when we've run out of consecutive entities\n\t if (typeof tokens[_i] === 'string') {\n\t break;\n\t }\n\t }\n\t }\n\t }\n\t // Filter out the consecutive entities that were marked as duplicates\n\t tokens = tokens.filter(function (val) {\n\t return !!val;\n\t });\n\t // Add a space to the end of each string/non-entity\n\t var tokensWithSpaces = tokens.map(function (t) {\n\t if (typeof t === 'string') {\n\t return t + ' ';\n\t }\n\t return t;\n\t });\n\t // Loop through our 'tokens' array. Push strings directly to the 'jsx' array. Convert entity objects to jsx markup, then push to the 'jsx' array.\n\t tokensWithSpaces.forEach(function (t) {\n\t if (typeof t === 'string') {\n\t jsx.push(t);\n\t } else {\n\t jsx.push(_react2.default.createElement(\n\t 'mark',\n\t {\n\t style: {\n\t padding: '0.25em 0.35em',\n\t margin: '0px 0.25em',\n\t lineHeight: '1',\n\t display: 'inline-block',\n\t borderRadius: '0.25em',\n\t border: '1px solid',\n\t background: 'rgba(\\n ' + ents.find(function (ent) {\n\t return ent.type === t.type;\n\t }).color.r + ',\\n ' + ents.find(function (ent) {\n\t return ent.type === t.type;\n\t }).color.g + ',\\n ' + ents.find(function (ent) {\n\t return ent.type === t.type;\n\t }).color.b + ',\\n 0.2\\n )',\n\t borderColor: 'rgb(\\n ' + ents.find(function (ent) {\n\t return ent.type === t.type;\n\t }).color.r + ',\\n ' + ents.find(function (ent) {\n\t return ent.type === t.type;\n\t }).color.g + ',\\n ' + ents.find(function (ent) {\n\t return ent.type === t.type;\n\t }).color.b + '\\n )'\n\t }\n\t },\n\t t.token,\n\t _react2.default.createElement(\n\t 'span',\n\t {\n\t style: {\n\t boxSizing: 'border-box',\n\t fontSize: '0.6em',\n\t lineHeight: '1',\n\t padding: '0.35em',\n\t borderRadius: '0.35em',\n\t textTransform: 'uppercase',\n\t display: 'inline-block',\n\t verticalAlign: 'middle',\n\t margin: '0px 0px 0.1rem 0.5rem',\n\t background: 'rgb(\\n ' + ents.find(function (ent) {\n\t return ent.type === t.type;\n\t }).color.r + ',\\n ' + ents.find(function (ent) {\n\t return ent.type === t.type;\n\t }).color.g + ',\\n ' + ents.find(function (ent) {\n\t return ent.type === t.type;\n\t }).color.b + '\\n )'\n\t }\n\t },\n\t t.type\n\t )\n\t ));\n\t }\n\t });\n\t }\n\t\n\t // Return the markup\n\t return _react2.default.createElement(\n\t 'div',\n\t null,\n\t jsx.map(function (j, i) {\n\t return _react2.default.createElement(\n\t 'span',\n\t { key: i },\n\t j\n\t );\n\t })\n\t );\n\t};\n\t\n\texports.default = Taggy;\n\n/***/ }),\n/* 1 */\n/***/ (function(module, exports) {\n\n\tmodule.exports = __WEBPACK_EXTERNAL_MODULE_1__;\n\n/***/ })\n/******/ ])\n});\n;\n\n\n// WEBPACK FOOTER //\n// react-taggy.js.min.js"," \t// The module cache\n \tvar installedModules = {};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId])\n \t\t\treturn installedModules[moduleId].exports;\n\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\texports: {},\n \t\t\tid: moduleId,\n \t\t\tloaded: false\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.loaded = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"\";\n\n \t// Load entry module and return exports\n \treturn __webpack_require__(0);\n\n\n\n// WEBPACK FOOTER //\n// webpack/bootstrap 409d1489b865b1ab0c7e","import React from 'react'\n\n// Define functional component. Destructure the props.\nconst Taggy = ({ text, spans, ents }) => {\n\n // Initialize an empty array that will hold the text and entities\n let jsx = []\n\n // METHOD 1 - STRING\n if (typeof text === 'string') {\n // Initialize an empty array. The contents of 'elements' will eventually get pushed to the 'jsx' array, and will be converted to jsx markup in the process.\n let elements = []\n // Keep track of location in the string of text\n let offset = 0\n // Loop through the spans, using the span data to construct the 'elements' array\n spans.forEach(({ type, start, end }) => {\n // Create a string of text that does not contain any entities\n const fragment = text.slice(offset, start)\n // Create an entity\n const entity = text.slice(start, end)\n // Push the both of them to the elements array\n elements.push(fragment)\n elements.push({\n token: entity,\n type: type.toLowerCase()\n })\n // Update our position within the string of text\n offset = end\n })\n // After pushing all of the entities to the 'elements' array, push the remaining text to the 'elements' array. Elements should now consist of strings and objects/entities.\n elements.push(text.slice(offset, text.length))\n // Filter out unnecessary spaces\n elements = elements.filter(val => val !== ' ')\n // Loop through elements array looking for multi-word entities.\n for (let e = 0; e < elements.length; e++) {\n // Check if we've stopped at an entity\n if (elements[e].token) {\n // Examine the consecutive entities, if any.\n for (let i = e + 1; i < elements.length; i++) {\n // Combine consecutive entities of the same type into one entity. Then, mark the duplicates as 'false'.\n if (typeof elements[i] !== 'string' && elements[i].type === elements[e].type) {\n elements[e].token += ' ' + elements[i].token\n elements[i] = false\n }\n // Stop the loop when we've run out of consecutive entities\n if (typeof elements[i] === 'string') {\n break\n }\n }\n }\n }\n // Filter out the consecutive entities that were marked as duplicates\n elements = elements.filter(val => !!val)\n // Loop through our 'elements' array. Push strings directly to the 'jsx' array. Convert entity objects to jsx markup, then push to the 'jsx' array.\n elements.forEach(t => {\n if (typeof t === 'string') {\n jsx.push(t)\n }\n else {\n jsx.push(\n <mark\n style={{\n padding: '0.25em 0.35em',\n margin: '0px 0.25em',\n lineHeight: '1',\n display: 'inline-block',\n borderRadius: '0.25em',\n border: '1px solid',\n background: `rgba(\n ${ents.find(ent => ent.type === t.type).color.r},\n ${ents.find(ent => ent.type === t.type).color.g},\n ${ents.find(ent => ent.type === t.type).color.b},\n 0.2\n )`,\n borderColor: `rgb(\n ${ents.find(ent => ent.type === t.type).color.r},\n ${ents.find(ent => ent.type === t.type).color.g},\n ${ents.find(ent => ent.type === t.type).color.b}\n )`\n }}\n >\n {t.token}\n <span\n style={{\n boxSizing: 'border-box',\n fontSize: '0.6em',\n lineHeight: '1',\n padding: '0.35em',\n borderRadius: '0.35em',\n textTransform: 'uppercase',\n display: 'inline-block',\n verticalAlign: 'middle',\n margin: '0px 0px 0.1rem 0.5rem',\n background: `rgb(\n ${ents.find(ent => ent.type === t.type).color.r},\n ${ents.find(ent => ent.type === t.type).color.g},\n ${ents.find(ent => ent.type === t.type).color.b}\n )`\n }}\n >\n {t.type}\n </span>\n </mark>\n )\n }\n })\n }\n\n // METHOD 2 - TOKENS\n if (Array.isArray(text)) {\n // Rename 'text' to 'tokens' for clarity\n let tokens = text\n // Loop through the 'spans' array. Use the span data to update our 'tokens' array with entities\n for (let s = 0; s < spans.length; s++) {\n tokens[spans[s].index] = {\n token: tokens[spans[s].index],\n type: spans[s].type.toLowerCase()\n }\n }\n // Loop through the tokens array, looking for multi-word entities\n for (let t = 0; t < tokens.length; t++) {\n // Check if we've stopped at an entity\n if (tokens[t].token) {\n // Examine the consecutive entities, if any.\n for (let i = t + 1; i < tokens.length; i++) {\n // Combine consecutive entities of the same type into one entity. Then, mark the duplicates as 'false'.\n if (typeof tokens[i] !== 'string' && tokens[i].type === tokens[t].type) {\n tokens[t].token += ' ' + tokens[i].token\n tokens[i] = false\n }\n // Stop the loop when we've run out of consecutive entities\n if (typeof tokens[i] === 'string') {\n break\n }\n }\n }\n }\n // Filter out the consecutive entities that were marked as duplicates\n tokens = tokens.filter(val => !!val)\n // Add a space to the end of each string/non-entity\n let tokensWithSpaces = tokens.map(t => {\n if (typeof t === 'string') {\n return `${t} `\n }\n return t\n })\n // Loop through our 'tokens' array. Push strings directly to the 'jsx' array. Convert entity objects to jsx markup, then push to the 'jsx' array.\n tokensWithSpaces.forEach(t => {\n if (typeof t === 'string') {\n jsx.push(t)\n }\n else {\n jsx.push(\n <mark\n style={{\n padding: '0.25em 0.35em',\n margin: '0px 0.25em',\n lineHeight: '1',\n display: 'inline-block',\n borderRadius: '0.25em',\n border: '1px solid',\n background: `rgba(\n ${ents.find(ent => ent.type === t.type).color.r},\n ${ents.find(ent => ent.type === t.type).color.g},\n ${ents.find(ent => ent.type === t.type).color.b},\n 0.2\n )`,\n borderColor: `rgb(\n ${ents.find(ent => ent.type === t.type).color.r},\n ${ents.find(ent => ent.type === t.type).color.g},\n ${ents.find(ent => ent.type === t.type).color.b}\n )`\n }}\n >\n {t.token}\n <span\n style={{\n boxSizing: 'border-box',\n fontSize: '0.6em',\n lineHeight: '1',\n padding: '0.35em',\n borderRadius: '0.35em',\n textTransform: 'uppercase',\n display: 'inline-block',\n verticalAlign: 'middle',\n margin: '0px 0px 0.1rem 0.5rem',\n background: `rgb(\n ${ents.find(ent => ent.type === t.type).color.r},\n ${ents.find(ent => ent.type === t.type).color.g},\n ${ents.find(ent => ent.type === t.type).color.b}\n )`\n }}\n >\n {t.type}\n </span>\n </mark>\n )\n }\n })\n }\n\n // Return the markup\n return (\n <div>\n {jsx.map((j, i) => (\n <span key={i}>{j}</span>\n ))}\n </div>\n )\n\n}\n\nexport default Taggy\n\n\n\n// WEBPACK FOOTER //\n// ./src/index.js","module.exports = __WEBPACK_EXTERNAL_MODULE_1__;\n\n\n//////////////////\n// WEBPACK FOOTER\n// external {\"commonjs\":\"react\",\"commonjs2\":\"react\",\"amd\":\"React\",\"root\":\"React\"}\n// module id = 1\n// module chunks = 0"],"sourceRoot":""} |