React-Drag-Sort

├── .gitignore ├── README.md ├── examples ├── ykit.js ├── package.json ├── index.html ├── src │ ├── EasyDragSort.js │ └── index.js └── prd │ └── index.min.js ├── package.json ├── LICENSE ├── index.js └── EasyDragSort.js /.gitignore: -------------------------------------------------------------------------------- 1 | .vscode 2 | node_modules -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # drag-sort 2 | 3 | 基本：./index.js 4 | 5 | 高级版本: ./EasyDragSort.js 6 | -------------------------------------------------------------------------------- /examples/ykit.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | plugins: ['react'], 3 | config: { 4 | export: ['./index.js'] 5 | } 6 | }; -------------------------------------------------------------------------------- /examples/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "examples", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "ykit.js", 6 | "scripts": { 7 | "build": "ykit pack -m", 8 | "test": "echo \"Error: no test specified\" && exit 1" 9 | }, 10 | "author": "", 11 | "license": "ISC", 12 | "dependencies": { 13 | "ykit-config-react": "^2.1.0" 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "react-drag-sort", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1" 8 | }, 9 | "repository": { 10 | "type": "git", 11 | "url": "git+https://github.com/suxiaoxin/react-drag-sort.git" 12 | }, 13 | "keywords": [ 14 | "drag", 15 | "sort", 16 | "react" 17 | ], 18 | "author": "suxiaoxin", 19 | "license": "MIT", 20 | "bugs": { 21 | "url": "https://github.com/suxiaoxin/react-drag-sort/issues" 22 | }, 23 | "homepage": "https://github.com/suxiaoxin/react-drag-sort#readme" 24 | } 25 | -------------------------------------------------------------------------------- /examples/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | React-Drag-Sort 9 | 21 | 22 | 23 | 24 |

25 |

26 | 27 | 28 | 29 | 30 | 31 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2017 苏文雄 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | let curDragIndex = null; 4 | 5 | export default function EasyDragSort(props){ 6 | let container = props.children; 7 | function onChange(from, to){ 8 | if(from === to ) return ; 9 | let curValue = props.data; 10 | let newValue = arrMove(curValue, from, to); 11 | if(typeof props.onChange === 'function'){ 12 | return props.onChange(newValue, from ,to); 13 | } 14 | } 15 | return

16 | {container.map((item, index)=>{ 17 | if(React.isValidElement(item)){ 18 | return React.cloneElement(item, { 19 | draggable:"true", 20 | onDragStart: function(){ 21 | curDragIndex = index 22 | }, 23 | onDragEnter: function() { 24 | onChange(curDragIndex, index) 25 | curDragIndex = index; 26 | }, 27 | onDragEnd: function(){ 28 | curDragIndex = null; 29 | if(typeof props.onDragEnd === 'function'){ 30 | props.onDragEnd() 31 | } 32 | } 33 | }) 34 | } 35 | return item; 36 | })} 37 |

; 38 | } 39 | 40 | function arrMove(arr, fromIndex, toIndex){ 41 | arr = [].concat(arr); 42 | let item = arr.splice(fromIndex, 1)[0]; 43 | arr.splice(toIndex , 0, item); 44 | return arr; 45 | } -------------------------------------------------------------------------------- /examples/src/EasyDragSort.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | let curDragIndex = null; 4 | 5 | export default function EasyDragSort(props){ 6 | let container = props.children; 7 | function onChange(from, to){ 8 | if(from === to ) return ; 9 | let curValue = props.data; 10 | let newValue = arrMove(curValue, from, to); 11 | if(typeof props.onChange === 'function'){ 12 | return props.onChange(newValue, from ,to); 13 | } 14 | } 15 | return

; 38 | } 39 | 40 | function arrMove(arr, fromIndex, toIndex){ 41 | arr = [].concat(arr); 42 | let item = arr.splice(fromIndex, 1)[0]; 43 | arr.splice(toIndex , 0, item); 44 | return arr; 45 | } -------------------------------------------------------------------------------- /examples/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import EasyDragSort from './EasyDragSort.js' 4 | 5 | export default class App extends React.Component { 6 | constructor(props) { 7 | super(props); 8 | this.state = { 9 | list: [{name: 'title'},{name: 'name'},{name: 'code'},{name: 'email'}], 10 | curMoveItem: null 11 | } 12 | } 13 | 14 | handleDragMove = (data, from, to) => { 15 | this.setState({ 16 | curMoveItem: to, 17 | list: data 18 | }) 19 | } 20 | 21 | handleDragEnd = ()=>{ 22 | this.setState({ 23 | curMoveItem: null 24 | }) 25 | } 26 | 27 | render() { 28 | 29 | 30 | return ( 31 |

32 |

react-drag-sort

33 |

35 | 36 | {this.state.list.map( (item, index) =>{ 37 | return

{ 40 | let newItems = this.state.list.slice(); 41 | newItems.splice(index, 1); 42 | this.setState({list: newItems}); 43 | }} 44 | >{item.name}

45 | })} 46 |

48 | 49 | 50 |

51 | ) 52 | } 53 | } 54 | 55 | const render = () => ReactDOM.render( 56 | , document.getElementById('app') 57 | ); 58 | 59 | render(); 60 | 61 | // hot-reload 62 | if (module.hot) { 63 | module.hot.accept(); 64 | } 65 | -------------------------------------------------------------------------------- /EasyDragSort.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | 4 | import PropTypes from 'prop-types'; 5 | 6 | /** 7 | * @author suxiaoxin 8 | * @demo 9 | * this.state.list} onChange={this.handleChange} > 10 | * {list} 11 | * 12 | */ 13 | let curDragIndex = null; 14 | 15 | function isDom(obj) { 16 | return ( 17 | obj && 18 | typeof obj === 'object' && 19 | obj.nodeType === 1 && 20 | typeof obj.nodeName === 'string' && 21 | typeof obj.getAttribute === 'function' 22 | ); 23 | } 24 | 25 | export default class EasyDragSort extends React.Component { 26 | static propTypes = { 27 | children: PropTypes.array, 28 | onChange: PropTypes.func, 29 | onDragEnd: PropTypes.func, 30 | data: PropTypes.func, 31 | onlyChild: PropTypes.string 32 | }; 33 | 34 | render() { 35 | const that = this; 36 | const props = this.props; 37 | const { onlyChild } = props; 38 | let container = props.children; 39 | const onChange = (from, to) => { 40 | if (from === to) { 41 | return; 42 | } 43 | let curValue; 44 | 45 | curValue = props.data(); 46 | 47 | let newValue = arrMove(curValue, from, to); 48 | if (typeof props.onChange === 'function') { 49 | return props.onChange(newValue, from, to); 50 | } 51 | }; 52 | return ( 53 |

54 | {container.map((item, index) => { 55 | if (React.isValidElement(item)) { 56 | return React.cloneElement(item, { 57 | draggable: onlyChild ? false : true, 58 | ref: 'x' + index, 59 | 'data-ref': 'x' + index, 60 | onDragStart: function() { 61 | curDragIndex = index; 62 | }, 63 | /** 64 | * 控制 dom 是否可拖动 65 | * @param {*} e 66 | */ 67 | onMouseDown(e) { 68 | if (!onlyChild) { 69 | return; 70 | } 71 | let el = e.target, 72 | target = e.target; 73 | if (!isDom(el)) { 74 | return; 75 | } 76 | do { 77 | if (el && isDom(el) && el.getAttribute(onlyChild)) { 78 | target = el; 79 | } 80 | if (el && el.tagName == 'DIV' && el.getAttribute('data-ref')) { 81 | break; 82 | } 83 | } while ((el = el.parentNode)); 84 | if (!el) { 85 | return; 86 | } 87 | let ref = that.refs[el.getAttribute('data-ref')]; 88 | let dom = ReactDOM.findDOMNode(ref); 89 | if (dom) { 90 | dom.draggable = target.getAttribute(onlyChild) ? true : false; 91 | } 92 | }, 93 | onDragEnter: function() { 94 | onChange(curDragIndex, index); 95 | curDragIndex = index; 96 | }, 97 | onDragEnd: function() { 98 | curDragIndex = null; 99 | if (typeof props.onDragEnd === 'function') { 100 | props.onDragEnd(); 101 | } 102 | } 103 | }); 104 | } 105 | return item; 106 | })} 107 |

108 | ); 109 | } 110 | } 111 | 112 | function arrMove(arr, fromIndex, toIndex) { 113 | arr = [].concat(arr); 114 | let item = arr.splice(fromIndex, 1)[0]; 115 | arr.splice(toIndex, 0, item); 116 | return arr; 117 | } 118 | -------------------------------------------------------------------------------- /examples/prd/index.min.js: -------------------------------------------------------------------------------- 1 | (function(e){function n(r){if(t[r])return t[r].exports;var i=t[r]={exports:{},id:r,loaded:false};e[r].call(i.exports,i,i.exports,n);i.loaded=true;return i.exports}var t={};n.m=e;n.c=t;n.p="";return n(0)})([function(e,t,n){e.exports=n(1)},function(e,t,n){"use strict";function l(e){return e&&e.__esModule?e:{"default":e}}function c(e,t){if(!(e instanceof t)){throw new TypeError("Cannot call a class as a function")}}function h(e,t){if(!e){throw new ReferenceError("this hasn't been initialised - super() hasn't been called")}return t&&(typeof t==="object"||typeof t==="function")?t:e}function p(e,t){if(typeof t!=="function"&&t!==null){throw new TypeError("Super expression must either be null or a function, not "+typeof t)}e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:false,writable:true,configurable:true}});if(t)Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t}Object.defineProperty(t,"__esModule",{value:true});t.default=undefined;var r=function(){function e(e,t){for(var n=0;n1){var b=Array(y);for(var w=0;w1){var b=Array(y);for(var w=0;w1?n-1:0),i=1;i2?r-2:0),o=2;o1?o-1:0),a=1;a-1&&navigator.userAgent.indexOf("Edge")===-1||navigator.userAgent.indexOf("Firefox")>-1){var v=window.location.protocol.indexOf("http")===-1&&navigator.userAgent.indexOf("Firefox")===-1;console.debug("Download the React DevTools "+(v?"and use an HTTP server (instead of a file: URL) ":"")+"for a better development experience: "+"https://fb.me/react-devtools")}}var m=function(){};process.env.NODE_ENV!=="production"?h((m.name||m.toString()).indexOf("testFn")!==-1,"It looks like you're using a minified copy of the development build "+"of React. When deploying React apps to production, make sure to use "+"the production build which skips development warnings and is faster. "+"See https://fb.me/react-minification for more details."):void 0;var g=document.documentMode&&document.documentMode<8;process.env.NODE_ENV!=="production"?h(!g,"Internet Explorer is running in compatibility mode; please add the "+"following tag to your HTML to prevent this from happening: "+''):void 0;var y=[Array.isArray,Array.prototype.every,Array.prototype.forEach,Array.prototype.indexOf,Array.prototype.map,Date.now,Function.prototype.bind,Object.keys,String.prototype.trim];for(var b=0;b8&&c<=11);var v=32;var m=String.fromCharCode(v);var g={beforeInput:{phasedRegistrationNames:{bubbled:"onBeforeInput",captured:"onBeforeInputCapture"},dependencies:["topCompositionEnd","topKeyPress","topTextInput","topPaste"]},compositionEnd:{phasedRegistrationNames:{bubbled:"onCompositionEnd",captured:"onCompositionEndCapture"},dependencies:["topBlur","topCompositionEnd","topKeyDown","topKeyPress","topKeyUp","topMouseDown"]},compositionStart:{phasedRegistrationNames:{bubbled:"onCompositionStart",captured:"onCompositionStartCapture"},dependencies:["topBlur","topCompositionStart","topKeyDown","topKeyPress","topKeyUp","topMouseDown"]},compositionUpdate:{phasedRegistrationNames:{bubbled:"onCompositionUpdate",captured:"onCompositionUpdateCapture"},dependencies:["topBlur","topCompositionUpdate","topKeyDown","topKeyPress","topKeyUp","topMouseDown"]}};var y=false;var T=null;var A={eventTypes:g,extractEvents:function(e,t,n,r){return[N(e,t,n,r),L(e,t,n,r)]}};e.exports=A},function(e,t,n){"use strict";function f(e,t,n){var r=t.dispatchConfig.phasedRegistrationNames[n];return a(e,r)}function l(e,t,n){if(false){process.env.NODE_ENV!=="production"?u(e,"Dispatching inst must not be null"):void 0}var r=f(e,n,t);if(r){n._dispatchListeners=s(n._dispatchListeners,r);n._dispatchInstances=s(n._dispatchInstances,e)}}function c(e){if(e&&e.dispatchConfig.phasedRegistrationNames){i.traverseTwoPhase(e._targetInst,l,e)}}function h(e){if(e&&e.dispatchConfig.phasedRegistrationNames){var t=e._targetInst;var n=t?i.getParentInstance(t):null;i.traverseTwoPhase(n,l,e)}}function p(e,t,n){if(n&&n.dispatchConfig.registrationName){var r=n.dispatchConfig.registrationName;var i=a(e,r);if(i){n._dispatchListeners=s(n._dispatchListeners,i);n._dispatchInstances=s(n._dispatchInstances,e)}}}function d(e){if(e&&e.dispatchConfig.registrationName){p(e._targetInst,null,e)}}function v(e){o(e,c)}function m(e){o(e,h)}function g(e,t,n,r){i.traverseEnterLeave(n,r,p,e,t)}function y(e){o(e,d)}var r=n(39);var i=n(41);var s=n(43);var o=n(44);var u=n(11);var a=r.getListener;var b={accumulateTwoPhaseDispatches:v,accumulateTwoPhaseDispatchesSkipTarget:m,accumulateDirectDispatches:y,accumulateEnterLeaveDispatches:g};e.exports=b},function(e,t,n){"use strict";function m(e){return e==="button"||e==="input"||e==="select"||e==="textarea"}function g(e,t,n){switch(e){case"onClick":case"onClickCapture":case"onDoubleClick":case"onDoubleClickCapture":case"onMouseDown":case"onMouseDownCapture":case"onMouseMove":case"onMouseMoveCapture":case"onMouseUp":case"onMouseUpCapture":return!!(n.disabled&&m(t));default:return false}}var r=n(32);var i=n(40);var s=n(41);var o=n(42);var u=n(43);var a=n(44);var f=n(8);var l={};var c=null;var h=function(e,t){if(e){s.executeDispatchesInOrder(e,t);if(!e.isPersistent()){e.constructor.release(e)}}};var p=function(e){return h(e,true)};var d=function(e){return h(e,false)};var v=function(e){return"."+e._rootNodeID};var y={injection:{injectEventPluginOrder:i.injectEventPluginOrder,injectEventPluginsByName:i.injectEventPluginsByName},putListener:function(e,t,n){!(typeof n==="function")?false?f(false,"Expected %s listener to be a function, instead got type %s",t,typeof n):r("94",t,typeof n):void 0;var s=v(e);var o=l[t]||(l[t]={});o[s]=n;var u=i.registrationNameModules[t];if(u&&u.didPutListener){u.didPutListener(e,t,n)}},getListener:function(e,t){var n=l[t];if(g(t,e._currentElement.type,e._currentElement.props)){return null}var r=v(e);return n&&n[r]},deleteListener:function(e,t){var n=i.registrationNameModules[t];if(n&&n.willDeleteListener){n.willDeleteListener(e,t)}var r=l[t];if(r){var s=v(e);delete r[s]}},deleteAllListeners:function(e){var t=v(e);for(var n in l){if(!l.hasOwnProperty(n)){continue}if(!l[n][t]){continue}var r=i.registrationNameModules[n];if(r&&r.willDeleteListener){r.willDeleteListener(e,n)}delete l[n][t]}},extractEvents:function(e,t,n,r){var s;var o=i.plugins;for(var a=0;a-1)?false?i(false,"EventPluginRegistry: Cannot inject event plugins that do not exist in the plugin ordering, `%s`.",e):r("96",e):void 0;if(l.plugins[n]){continue}!t.extractEvents?false?i(false,"EventPluginRegistry: Event plugins must implement an `extractEvents` method, but `%s` does not.",e):r("97",e):void 0;l.plugins[n]=t;var u=t.eventTypes;for(var f in u){!a(u[f],t,f)?false?i(false,"EventPluginRegistry: Failed to publish event `%s` for plugin `%s`.",f,e):r("98",f,e):void 0}}}function a(e,t,n){!!l.eventNameDispatchConfigs.hasOwnProperty(n)?false?i(false,"EventPluginHub: More than one plugin attempted to publish the same event name, `%s`.",n):r("99",n):void 0;l.eventNameDispatchConfigs[n]=e;var s=e.phasedRegistrationNames;if(s){for(var o in s){if(s.hasOwnProperty(o)){var u=s[o];f(u,t,n)}}return true}else if(e.registrationName){f(e.registrationName,t,n);return true}return false}function f(e,t,n){!!l.registrationNameModules[e]?false?i(false,"EventPluginHub: More than one plugin attempted to publish the same registration name, `%s`.",e):r("100",e):void 0;l.registrationNameModules[e]=t;l.registrationNameDependencies[e]=t.eventTypes[n].dependencies;if(false){var s=e.toLowerCase();l.possibleRegistrationNames[s]=e;if(e==="onDoubleClick"){l.possibleRegistrationNames.ondblclick=e}}}var r=n(32);var i=n(8);var s=null;var o={};var l={plugins:[],eventNameDispatchConfigs:{},registrationNameModules:{},registrationNameDependencies:{},possibleRegistrationNames:false?{}:null,injectEventPluginOrder:function(e){!!s?false?i(false,"EventPluginRegistry: Cannot inject event plugin ordering more than once. You are likely trying to load more than one copy of React."):r("101"):void 0;s=Array.prototype.slice.call(e);u()},injectEventPluginsByName:function(e){var t=false;for(var n in e){if(!e.hasOwnProperty(n)){continue}var s=e[n];if(!o.hasOwnProperty(n)||o[n]!==s){!!o[n]?false?i(false,"EventPluginRegistry: Cannot inject two different event plugins using the same name, `%s`.",n):r("102",n):void 0;o[n]=s;t=true}}if(t){u()}},getPluginModuleForEvent:function(e){var t=e.dispatchConfig;if(t.registrationName){return l.registrationNameModules[t.registrationName]||null}if(t.phasedRegistrationNames!==undefined){var n=t.phasedRegistrationNames;for(var r in n){if(!n.hasOwnProperty(r)){continue}var i=l.registrationNameModules[n[r]];if(i){return i}}}return null},_resetEventPlugins:function(){s=null;for(var e in o){if(o.hasOwnProperty(e)){delete o[e]}}l.plugins.length=0;var t=l.eventNameDispatchConfigs;for(var n in t){if(t.hasOwnProperty(n)){delete t[n]}}var r=l.registrationNameModules;for(var i in r){if(r.hasOwnProperty(i)){delete r[i]}}if(false){var u=l.possibleRegistrationNames;for(var a in u){if(u.hasOwnProperty(a)){delete u[a]}}}}};e.exports=l},function(e,t,n){"use strict";function l(e){return e==="topMouseUp"||e==="topTouchEnd"||e==="topTouchCancel"}function c(e){return e==="topMouseMove"||e==="topTouchMove"}function h(e){return e==="topMouseDown"||e==="topTouchStart"}function d(e,t,n,r){var s=e.type||"unknown-event";e.currentTarget=w.getNodeFromInstance(r);if(t){i.invokeGuardedCallbackWithCatch(s,n,e)}else{i.invokeGuardedCallback(s,n,e)}e.currentTarget=null}function v(e,t){var n=e._dispatchListeners;var r=e._dispatchInstances;if(false){p(e)}if(Array.isArray(n)){for(var i=0;i1?1-r:undefined;this._fallbackText=i.slice(e,u);return this._fallbackText}});i.addPoolingTo(o);e.exports=o},function(e,t,n){"use strict";var r=n(32);var i=n(8);var s=function(e){var t=this;if(t.instancePool.length){var n=t.instancePool.pop();t.call(n,e);return n}else{return new t(e)}};var o=function(e,t){var n=this;if(n.instancePool.length){var r=n.instancePool.pop();n.call(r,e,t);return r}else{return new n(e,t)}};var u=function(e,t,n){var r=this;if(r.instancePool.length){var i=r.instancePool.pop();r.call(i,e,t,n);return i}else{return new r(e,t,n)}};var a=function(e,t,n,r){var i=this;if(i.instancePool.length){var s=i.instancePool.pop();i.call(s,e,t,n,r);return s}else{return new i(e,t,n,r)}};var f=function(e){var t=this;!(e instanceof t)?false?i(false,"Trying to release an instance into a pool of a different type."):r("25"):void 0;e.destructor();if(t.instancePool.length8)}var N=false;if(s.canUseDOM){N=l("input")&&(!document.documentMode||document.documentMode>11)}var C={get:function(){return m.get.call(this)},set:function(e){v=""+e;m.set.call(this,e)}};var H={eventTypes:h,extractEvents:function(e,t,n,r){var s=t?o.getNodeFromInstance(t):window;var u,f;if(g(s)){if(y){u=x}else{f=T}}else if(c(s)){if(N){u=O}else{u=_;f=M}}else if(D(s)){u=P}if(u){var l=u(e,t);if(l){var p=a.getPooled(h.change,l,n,r);p.type="change";i.accumulateTwoPhaseDispatches(p);return p}}if(f){f(e,s,t)}}};e.exports=H},function(e,t,n){"use strict";function m(){!(L.ReactReconcileTransaction&&v)?false?l(false,"ReactUpdates: must inject a reconcile transaction class and batching strategy"):r("123"):void 0}function w(){this.reinitializeTransaction();this.dirtyComponentsLength=null;this.callbackQueue=s.getPooled();this.reconcileTransaction=L.ReactReconcileTransaction.getPooled(true)}function E(e,t,n,r,i,s){m();return v.batchedUpdates(e,t,n,r,i,s)}function S(e,t){return e._mountOrder-t._mountOrder}function x(e){var t=e.dirtyComponentsLength;!(t===c.length)?false?l(false,"Expected flush transaction's stored dirty-components length (%s) to match dirty-components array length (%s).",t,c.length):r("124",t,c.length):void 0;c.sort(S);h++;for(var n=0;n]/;var u=n(76);var a;var f=u(function(e,t){if(e.namespaceURI===i.svg&&!("innerHTML"in e)){a=a||document.createElement("div");a.innerHTML="";var n=a.firstChild;while(n.firstChild){e.appendChild(n.firstChild)}}else{e.innerHTML=t}});if(r.canUseDOM){var l=document.createElement("div");l.innerHTML=" ";if(l.innerHTML===""){f=function(e,t){if(e.parentNode){e.parentNode.replaceChild(e,e)}if(s.test(t)||t[0]==="<"&&o.test(t)){e.innerHTML=String.fromCharCode(65279)+t;var n=e.firstChild;if(n.data.length===1){e.removeChild(n)}else{n.deleteData(0,1)}}else{e.innerHTML=t}}}l=null}e.exports=f},function(e,t){"use strict";var n=function(e){if(typeof MSApp!=="undefined"&&MSApp.execUnsafeLocalFunction){return function(t,n,r,i){MSApp.execUnsafeLocalFunction(function(){return e(t,n,r,i)})}}else{return e}};e.exports=n},function(e,t,n){"use strict";var r=n(45);var i=n(78);var s=n(75);var o=function(e,t){if(t){var n=e.firstChild;if(n&&n===e.lastChild&&n.nodeType===3){n.nodeValue=t;return}}e.textContent=t};if(r.canUseDOM){if(!("textContent"in document.documentElement)){o=function(e,t){if(e.nodeType===3){e.nodeValue=t;return}s(e,i(t))}}}e.exports=o},function(e,t){"use strict";function r(e){var t=""+e;var r=n.exec(t);if(!r){return t}var i;var s="";var o=0;var u=0;for(o=r.index;o]/;e.exports=i},function(e,t,n){"use strict";var r=n(32);var i=n(73);var s=n(45);var o=n(80);var u=n(12);var a=n(8);var f={dangerouslyReplaceNodeWithMarkup:function(e,t){!s.canUseDOM?false?a(false,"dangerouslyReplaceNodeWithMarkup(...): Cannot render markup in a worker thread. Make sure `window` and `document` are available globally before requiring React when unit testing or use ReactDOMServer.renderToString() for server rendering."):r("56"):void 0;!t?false?a(false,"dangerouslyReplaceNodeWithMarkup(...): Missing markup."):r("57"):void 0;!(e.nodeName!=="HTML")?false?a(false,"dangerouslyReplaceNodeWithMarkup(...): Cannot replace markup of the node. This is because browser quirks make this unreliable and/or slow. If you want to render to the root you must use server rendering. See ReactDOMServer.renderToString()."):r("58"):void 0;if(typeof t==="string"){var n=o(t,u)[0];e.parentNode.replaceChild(n,e)}else{i.replaceChildWithTree(e,t)}}};e.exports=f},function(e,t,n){"use strict";function f(e){var t=e.match(a);return t&&t[1].toLowerCase()}function l(e,t){var n=u;!!!u?false?o(false,"createNodesFromMarkup dummy not initialized"):o(false):void 0;var r=f(e);var a=r&&s(r);if(a){n.innerHTML=a[1]+e+a[2];var l=a[0];while(l--){n=n.lastChild}}else{n.innerHTML=e}var c=n.getElementsByTagName("script");if(c.length){!t?false?o(false,"createNodesFromMarkup(...): Unexpected