├── timeline ├── .gitignore ├── extension │ ├── styles │ │ └── index.css │ ├── theme.js │ ├── .DS_Store │ ├── devtools.html │ ├── icon │ │ └── F.png │ ├── panel.js │ ├── load.html │ ├── load.js │ ├── manifest.json │ └── dependencies │ │ ├── react.js │ │ └── react-dom.js ├── index.js ├── src │ ├── extension │ │ ├── theme.js │ │ ├── .DS_Store │ │ └── components │ │ │ ├── Buttons.js │ │ │ ├── ErrorComponent.js │ │ │ ├── ReactPerfDevtool.js │ │ │ └── Measures.js │ ├── index.js │ └── npm │ │ └── hook.js ├── .DS_Store ├── .babelrc ├── README.md ├── webpack │ └── webpack.config.js └── package.json ├── .DS_Store ├── chart.jpg ├── console.jpg ├── .gitignore ├── hook ├── src │ ├── addHook.js │ ├── inject.js │ ├── perfHook.js │ ├── eventTypes.js │ └── globalHook.js ├── webpack.config.js ├── package.json └── dist │ └── fiberlineHook.js ├── README.md └── fiberlineHook.js /timeline/.gitignore: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /timeline/extension/styles/index.css: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /timeline/index.js: -------------------------------------------------------------------------------- 1 | module.exports = require('./src/npm/hook') 2 | -------------------------------------------------------------------------------- /timeline/extension/theme.js: -------------------------------------------------------------------------------- 1 | module.exports = chrome.devtools.panels.themeName 2 | -------------------------------------------------------------------------------- /.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/reactFiberline/react-fiberline/HEAD/.DS_Store -------------------------------------------------------------------------------- /chart.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/reactFiberline/react-fiberline/HEAD/chart.jpg -------------------------------------------------------------------------------- /console.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/reactFiberline/react-fiberline/HEAD/console.jpg -------------------------------------------------------------------------------- /timeline/src/extension/theme.js: -------------------------------------------------------------------------------- 1 | module.exports = chrome.devtools.panels.themeName 2 | -------------------------------------------------------------------------------- /timeline/.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/reactFiberline/react-fiberline/HEAD/timeline/.DS_Store -------------------------------------------------------------------------------- /timeline/extension/.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/reactFiberline/react-fiberline/HEAD/timeline/extension/.DS_Store -------------------------------------------------------------------------------- /timeline/extension/devtools.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /timeline/extension/icon/F.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/reactFiberline/react-fiberline/HEAD/timeline/extension/icon/F.png -------------------------------------------------------------------------------- /timeline/src/extension/.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/reactFiberline/react-fiberline/HEAD/timeline/src/extension/.DS_Store -------------------------------------------------------------------------------- /timeline/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["env", "react"], 3 | "plugins": [ 4 | "transform-class-properties", 5 | "transform-object-rest-spread" 6 | ] 7 | } -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # dependencies 2 | hook/node_modules 3 | timeline/node_modules 4 | hook/.eslintignore 5 | hook/.eslintrc.js 6 | 7 | npm-debug.log* 8 | yarn-debug.log* 9 | yarn-error.log* 10 | -------------------------------------------------------------------------------- /timeline/extension/panel.js: -------------------------------------------------------------------------------- 1 | chrome.devtools.panels.create( 2 | 'React Fiberline', 3 | './icon/F.png', 4 | 'load.html', 5 | function(panel) { 6 | console.log('Started!') 7 | } 8 | ) 9 | -------------------------------------------------------------------------------- /timeline/src/index.js: -------------------------------------------------------------------------------- 1 | import { ReactPerfDevtool } from './extension/components/ReactPerfDevtool' 2 | import { registerObserver } from './npm/hook' 3 | 4 | export { ReactPerfDevtool, registerObserver } 5 | -------------------------------------------------------------------------------- /timeline/extension/load.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /timeline/README.md: -------------------------------------------------------------------------------- 1 | # timeline 2 | 3 | make sure to register obsever in your index.js file 4 | 5 | import React from 'react'; 6 | import { render } from 'react-dom'; 7 | import App from './components/App'; 8 | 9 | const { registerObserver } = require('./../react-perf-devtool/src/npm/hook.js') 10 | 11 | 12 | registerObserver() 13 | 14 | render( 15 | , 16 | document.getElementById('root') 17 | ); 18 | -------------------------------------------------------------------------------- /timeline/src/extension/components/Buttons.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | export function Buttons({ clear, reload }) { 4 | return ( 5 | 6 |
7 | 10 |
11 | ) 12 | } 13 | -------------------------------------------------------------------------------- /timeline/extension/load.js: -------------------------------------------------------------------------------- 1 | require.config({ 2 | paths: { 3 | react: './dependencies/react', 4 | 'react-dom': './dependencies/react-dom' 5 | } 6 | }) 7 | 8 | requirejs( 9 | ['react', 'react-dom', '../build/ReactPerfDevtool'], 10 | function(React, ReactDOM, { ReactPerfDevtool }) { 11 | const root = document.getElementById('root') 12 | 13 | ReactDOM.render( 14 | React.createElement(ReactPerfDevtool), 15 | root 16 | ) 17 | } 18 | ) 19 | -------------------------------------------------------------------------------- /hook/src/addHook.js: -------------------------------------------------------------------------------- 1 | const installGlobalHook = require('./globalHook.js'); 2 | const inject = require('./inject.js'); 3 | const { registerObserver } = require('./perfHook.js'); 4 | 5 | const js = ';(' + installGlobalHook.toString() + '(window))' + 6 | ';(' + registerObserver.toString() + '())'; 7 | 8 | const script = document.createElement('script'); 9 | script.textContent = js; 10 | document.documentElement.appendChild(script); 11 | script.parentNode.removeChild(script); 12 | 13 | inject(window.__REACT_FIBERLINE_GLOBAL_HOOK__); 14 | -------------------------------------------------------------------------------- /hook/src/inject.js: -------------------------------------------------------------------------------- 1 | const types = require('./eventTypes.js'); 2 | 3 | module.exports = function(hook) { 4 | // if we want to add the ability to remove listeners later, the 'hook.on' 5 | // method should return a 'hook.off' method that does that. All the returned 6 | // functions should be stored in an array 7 | types.forEach((type) => { 8 | hook.on(type, ({ fiber, time }, evt) => { 9 | hook.fiberlineEvents.push({ fiber, time, evt }); 10 | }); 11 | }); 12 | hook.on('updateQueue', ({ fiber, queue, time }) => hook.updatequeueLog.push({ fiber, queue, time})); 13 | }; 14 | -------------------------------------------------------------------------------- /timeline/extension/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "manifest_version": 2, 3 | 4 | "name": "React Fiberline", 5 | "short_name": "react-fiberline", 6 | "description": 7 | "A devtool extension for inspecting the performance of React components.", 8 | "version": "4", 9 | "devtools_page": "devtools.html", 10 | 11 | "icons": { 12 | //"16": "./icon/RP16.png", 13 | "48": "./icon/F.png" 14 | //"128": "./icon/RP128.png" 15 | }, 16 | 17 | "permissions": ["file:///*", "http://*/*", "https://*/*"], 18 | 19 | "content_security_policy": 20 | "script-src 'self' 'unsafe-eval'; object-src 'self'" 21 | } 22 | -------------------------------------------------------------------------------- /hook/webpack.config.js: -------------------------------------------------------------------------------- 1 | const path = require('path'); 2 | 3 | module.exports = { 4 | entry: './src/AddHook.js', 5 | output: { 6 | filename: 'fiberlineHook.js', 7 | path: path.resolve(__dirname, 'dist'), 8 | }, 9 | // target: 'web' packs bundle for the web so it can be run in the HTML head 10 | target: 'web', 11 | module: { 12 | rules: [ 13 | { 14 | test: /(\.js)$/, 15 | exclude: /node_modules/, 16 | use:{ 17 | loader:'babel-loader', 18 | options: { 19 | presets: ['env'], 20 | }, 21 | }, 22 | }, 23 | ], 24 | }, 25 | }; 26 | -------------------------------------------------------------------------------- /timeline/src/extension/components/ErrorComponent.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | export function ErrorComponent() { 4 | return ( 5 |
6 | An error occurred while collecting the measures. This is possibly due to 7 |
    8 |
  • 9 | absence of register observer hook in your project. 10 |
    • 11 |
    12 |
  • your project is not using React.
    • 13 |
14 |

15 | If above solutions don't work, then try reloading the plugin or close 16 | and reopen the inspected window. 17 |

18 |
19 | ) 20 | } 21 | -------------------------------------------------------------------------------- /hook/src/perfHook.js: -------------------------------------------------------------------------------- 1 | const registerObserver = (params, callback) => { 2 | 3 | if (window.PerformanceObserver) { 4 | 5 | let observer = new window.PerformanceObserver(list => { 6 | 7 | if (!window.__REACT_PERF_DEVTOOL_GLOBAL_STORE__){ 8 | window.__REACT_PERF_DEVTOOL_GLOBAL_STORE__ = { 9 | length: list.getEntries().length, 10 | rawMeasures: [], 11 | queue: [] 12 | } 13 | } 14 | 15 | window.__REACT_PERF_DEVTOOL_GLOBAL_STORE__. 16 | rawMeasures = window.__REACT_PERF_DEVTOOL_GLOBAL_STORE__. 17 | rawMeasures.concat(list.getEntries()) 18 | }) 19 | 20 | observer.observe({ 21 | entryTypes: ['measure'] 22 | }) 23 | } 24 | } 25 | 26 | export { registerObserver } 27 | -------------------------------------------------------------------------------- /hook/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "fiberline-hook", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "AddHook.js", 6 | "scripts": { 7 | "build": "webpack", 8 | "build:dev": "webpack --mode development", 9 | "test": "echo \"Error: no test specified\" && exit 1" 10 | }, 11 | "author": "", 12 | "license": "ISC", 13 | "dependencies": { 14 | "babel-core": "^6.26.0", 15 | "babel-loader": "^7.1.4", 16 | "webpack": "^4.1.1", 17 | "webpack-cli": "^2.0.12" 18 | }, 19 | "devDependencies": { 20 | "babel-preset-env": "^1.6.1", 21 | "eslint": "^4.19.1", 22 | "eslint-config-airbnb": "^16.1.0", 23 | "eslint-plugin-import": "^2.10.0", 24 | "eslint-plugin-jsx-a11y": "^6.0.3", 25 | "eslint-plugin-react": "^7.7.0" 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /timeline/src/npm/hook.js: -------------------------------------------------------------------------------- 1 | const registerObserver = (params, callback) => { 2 | 3 | if (window.PerformanceObserver) { 4 | 5 | let observer = new window.PerformanceObserver(list => { 6 | 7 | if (!window.__REACT_PERF_DEVTOOL_GLOBAL_STORE__){ 8 | window.__REACT_PERF_DEVTOOL_GLOBAL_STORE__ = { 9 | length: list.getEntries().length, 10 | rawMeasures: [], 11 | queue: [] 12 | } 13 | } 14 | 15 | window.__REACT_PERF_DEVTOOL_GLOBAL_STORE__. 16 | rawMeasures = window.__REACT_PERF_DEVTOOL_GLOBAL_STORE__. 17 | rawMeasures.concat(list.getEntries()) 18 | 19 | //console.log(window.__REACT_PERF_DEVTOOL_GLOBAL_STORE__) 20 | 21 | // if (callback && typeof callback === 'function') { 22 | // callback(measures) 23 | // } 24 | }) 25 | 26 | observer.observe({ 27 | entryTypes: ['measure'] 28 | }) 29 | } 30 | } 31 | 32 | export { registerObserver } 33 | -------------------------------------------------------------------------------- /timeline/webpack/webpack.config.js: -------------------------------------------------------------------------------- 1 | const path = require('path') 2 | const webpack = require('webpack') 3 | const UglifyJSPlugin = require('uglifyjs-webpack-plugin') 4 | 5 | const getMode = () => 6 | process.env.NODE_ENV === 'production' ? 'production' : 'development' 7 | 8 | const output = () => ({ 9 | filename: 'ReactPerfDevtool.js', 10 | path: path.resolve(__dirname, '../extension/build'), 11 | publicPath: '/', 12 | libraryTarget: 'umd' 13 | }) 14 | 15 | const externals = () => ({ 16 | react: 'react' 17 | }) 18 | 19 | const jsLoader = () => ({ 20 | test: /\.js$/, 21 | include: path.resolve(__dirname, '../src'), 22 | exclude: ['node_modules'], 23 | use: 'babel-loader' 24 | }) 25 | 26 | const plugins = () => [ 27 | new webpack.LoaderOptionsPlugin({ 28 | minimize: true, 29 | debug: false 30 | }), 31 | new webpack.DefinePlugin({ 32 | 'process.env.NODE_ENV': JSON.stringify('production') 33 | }), 34 | new webpack.optimize.ModuleConcatenationPlugin(), 35 | new UglifyJSPlugin() 36 | ] 37 | 38 | module.exports = { 39 | entry: path.resolve(__dirname, '../src/index.js'), 40 | output: output(), 41 | target: 'web', 42 | mode: getMode(), 43 | externals: externals(), 44 | module: { 45 | rules: [jsLoader()] 46 | }, 47 | plugins: plugins(), 48 | performance: { 49 | hints: false 50 | } 51 | } 52 | -------------------------------------------------------------------------------- /hook/src/eventTypes.js: -------------------------------------------------------------------------------- 1 | 2 | module.exports = [ 3 | 'bailedOutOnFinishedWork', 4 | 'bailedOutOnLowPriorityWork', 5 | // 'callComponentUpdating', 6 | // 'classComponentUpdating', 7 | // 'commitHostEffectsStart', 8 | // 'commitHostEffectsEnd', 9 | // 'commitLifeCyclesStart', 10 | // 'commitLifeCyclesEnd', 11 | 'commitStart', 12 | 'commitEnd', 13 | 'componentDidMountStart', 14 | 'componentDidMountEnd', 15 | 'componentDidUpdateStart', 16 | 'componentDidUpdateEnd', 17 | 'componentWillMountStart', 18 | 'componentWillMountEnd', 19 | 'componentWillUnmountStart', 20 | 'componentWillUnmountEnd', 21 | 'componentWillReceivePropsStart', 22 | 'componentWillReceivePropsEnd', 23 | 'componentWillUpdateStart', 24 | 'componentWillUpdateEnd', 25 | 'contextChangePropagating', 26 | 'contextConsumerUpdating', 27 | 'contextProviderUpdating', 28 | 'fiberDidNotComplete', 29 | 'fiberNodeCreatedFromElement', 30 | 'fiberNodeCreatedFromFragment', 31 | 'fiberNodeCreatedFromText', 32 | 'fiberNodeCreatedFromPortal', 33 | 'fiberNodeCreatedHostForDeletion', 34 | 'fragmentStartedUpdating', 35 | 'fragmentUpdated', 36 | 'hostComponentUpdating', 37 | 'hostRootUpdating', 38 | 'hostTextUpdating', 39 | 'indeterminateComponentMounting', 40 | 'interruption', 41 | 'loadingComponentUpdating', 42 | 'modeUpdating', 43 | 'functionalComponentUpdating', 44 | 'getChildContextStart', 45 | 'getChildContextEnd', 46 | 'portalComponentUpdating', 47 | 'pushHostRootContext', 48 | 'shouldComponentUpdateStart', 49 | 'shouldComponentUpdateEnd', 50 | 'timeoutComponentUpdating', 51 | 'workLoopStart', 52 | 'workLoopEnded', 53 | 'workStarted', 54 | 'workCompleted', 55 | ]; 56 | -------------------------------------------------------------------------------- /timeline/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "react-fiberline", 3 | "version": "1.0.0", 4 | "description": "A devtool for inspecting the performance of React Components", 5 | "main": "index.js", 6 | "files": [ 7 | "lib/shared", 8 | "lib/npm" 9 | ], 10 | "author": "Jon Coe", 11 | "license": "MIT", 12 | "peerDependencies": { 13 | "react": "^16.2.0", 14 | "react-dom": "^16.2.0" 15 | }, 16 | "devDependencies": { 17 | "babel-core": "^6.26.0", 18 | "babel-jest": "^21.2.0", 19 | "babel-loader": "^7.1.2", 20 | "babel-plugin-transform-class-properties": "^6.24.1", 21 | "babel-plugin-transform-object-rest-spread": "^6.26.0", 22 | "babel-preset-env": "^1.6.1", 23 | "babel-preset-react": "^6.24.1", 24 | "lint-staged": "^6.0.0", 25 | "react": "^16.2.0", 26 | "react-dom": "^16.2.0", 27 | "react-test-renderer": "^16.2.0", 28 | "uglifyjs-webpack-plugin": "^1.1.2", 29 | "webpack-cli": "^2.0.9" 30 | }, 31 | "scripts": { 32 | "build:babel": "rm -rf lib && babel src --out-dir lib", 33 | "build:watch": "rm -rf ./extension/build && NODE_ENV=production ./node_modules/.bin/webpack-cli --watch --config ./webpack/webpack.config.js --progress", 34 | "build": "rm -rf ./extension/build && NODE_ENV=production ./node_modules/.bin/webpack-cli --config ./webpack/webpack.config.js --progress", 35 | "build:extension": "yarn format && yarn test && yarn generate" 36 | }, 37 | "lint-staged": { 38 | "*.{js,json}": [ 39 | "./node_modules/.bin/prettier --write --no-semi --single-quote", 40 | "git add" 41 | ] 42 | }, 43 | "dependencies": { 44 | "lodash": "^4.17.5", 45 | "prop-types": "^15.6.1", 46 | "victory": "^0.25.7", 47 | "webpack": "^4.1.1" 48 | } 49 | } 50 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # react-fiberline 2 | React Fiberline is a visualizer to help illustrate the inner workings of the new React Fiber Architecture. 3 | 4 | ### Usage 5 | Fiber is *intense*, it is complicated and has a lot of nuance to it. Fiberline is a great way to start understanding how things are now working under the hood. 6 | 7 | ## Getting Started 8 | ### Step 1 9 | Install the Fiberline Chrome extension -- [found here](https://chrome.google.com/webstore/detail/react-fiberline/ghgjnfokjgenlpnjcobcnelemicbhbbb) 10 | 11 | ### Step 2 Option 1: Use the pre-built Demo 12 | Since Facebook hasn't exposed a lot of Fiber's inner workings yet, there is a considerable amount of setup involved. If you would like to skip the setup and see how Fiberline works with the now famous [movie demo](https://reactjs.org/blog/2018/03/01/sneak-peek-beyond-react-16.html), take a loooong sloooow drink from your water bottle and follow these steps: 13 | 14 | 1. [Clone this repo](https://github.com/reactFiberline/movie-demo) 15 | 2. `cd movie-demo` 16 | 3. `npm start` (don't run npm install, everything is pre-built!) 17 | 18 | The page will run on `localhost:3000`, as long as you installed the extension from Step 1 you can now use the React Fiberline Devtool from the inspector. 19 | 20 | ![fiberline pic](https://github.com/reactFiberline/react-fiberline/blob/master/chart.jpg) 21 | 22 | #### Get a deeper look 23 | 24 | By opening your browser console and logging `__REACT_FIBERLINE_GLOBAL_HOOK__.fiberlineEvents`, you can see much more detailed information about the processes inside React Fiber. 25 | 26 | ![console pic](https://github.com/reactFiberline/react-fiberline/blob/master/console.jpg) 27 | 28 | ### Step 2 Option 2: Use your own content! 29 | 30 | Coming soon... 31 | 32 | ## Using Fiberline 33 | 34 | #### Notes on future versions 35 | Until Facebook releases an API for Fiber, most of the data Fiberline uses is not exposed. Once that changes, we plan on a major version release with a much easier setup and more features. If there is a feature or metric you would like to see added, please add it on the issues page or contribute to an existing conversation about it. 36 | 37 | #### Thanks to 38 | -- The Facebook team for React and Andrew Clark for the Movie Demo -> https://codesandbox.io/s/5zk7x551vk 39 | -------------------------------------------------------------------------------- /fiberlineHook.js: -------------------------------------------------------------------------------- 1 | !function(t){var e={};function n(o){if(e[o])return e[o].exports;var r=e[o]={i:o,l:!1,exports:{}};return t[o].call(r.exports,r,r.exports,n),r.l=!0,r.exports}n.m=t,n.c=e,n.d=function(t,e,o){n.o(t,e)||Object.defineProperty(t,e,{configurable:!1,enumerable:!0,get:o})},n.r=function(t){Object.defineProperty(t,"__esModule",{value:!0})},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=3)}([function(t,e,n){"use strict";t.exports=["bailedOutOnFinishedWork","bailedOutOnLowPriorityWork","callComponentUpdating","classComponentUpdating","commitHostEffectsStart","commitHostEffectsEnd","commitLifeCyclesStart","commitLifeCyclesEnd","commitStart","commitEnd","componentDidMountStart","componentDidMountEnd","componentDidUpdateStart","componentDidUpdateEnd","componentWillMountStart","componentWillMountEnd","componentWillUnmountStart","componentWillUnmountEnd","componentWillReceivePropsStart","componentWillReceivePropsEnd","componentWillUpdateStart","componentWillUpdateEnd","contextChangePropagating","contextConsumerUpdating","contextProviderUpdating","fiberDidNotComplete","fiberNodeCreatedFromElement","fiberNodeCreatedFromFragment","fiberNodeCreatedFromText","fiberNodeCreatedFromPortal","fiberNodeCreatedHostForDeletion","fragmentStartedUpdating","fragmentUpdated","hostComponentUpdating","hostRootUpdating","hostTextUpdating","indeterminateComponentMounting","interruption","loadingComponentUpdating","modeUpdating","functionalComponentUpdating","getChildContextStart","getChildContextEnd","portalComponentUpdating","pushHostRootContext","shouldComponentUpdateStart","shouldComponentUpdateEnd","timeoutComponentUpdating","workLoopStart","workLoopEnded","workStarted","workCompleted"]},function(t,e,n){"use strict";var o=n(0);t.exports=function(t){o.forEach(function(e){t.on(e,function(e,n){var o=e.fiber,r=e.time;t.fiberlineEvents.push({fiber:o,time:r,evt:n})})}),t.on("updateQueue",function(e){var n=e.fiber,o=e.queue,r=e.time;return t.updatequeueLog.push({fiber:n,queue:o,time:r})})}},function(t,e,n){"use strict";t.exports=function(t){var e={_listeners:{},on:function(t,n){e._listeners[t]||(e._listeners[t]=[]),e._listeners[t].push(n)},emit:function(t,n){e._listeners[t]&&e._listeners[t].map(function(e){return Promise.resolve().then(e(n,t))})},toJSON:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:this.fiberlineEvents;return JSON.stringify(t.reduce(function(t,e){return e.fiber?(t[e.fiber._debugID]||(t[e.fiber._debugID]={}),t[e.fiber._debugID][e.evt]||(t[e.fiber._debugID][e.evt]=[]),t[e.fiber._debugID][e.evt].push({time:e.time,child:e.child,effectTag:e.fiber.effectTag,effectTagEnglish:getEffectTag(e.fiber.effectTag),tag:getTag(e.fiber.tag)}),t):t},{}))},toCircularJSON:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:this.fiberlineEvents,e=[],n=[];return JSON.stringify(function t(o,r){var i;if(!(!(o instanceof Object&&null!==o)||o instanceof Boolean||o instanceof Date||o instanceof Number||o instanceof RegExp||o instanceof String)){for(var a=0;a { 45 | this.getMeasures(); 46 | this.getWorkLoopMeasures(); 47 | 48 | }, 3500) 49 | } 50 | 51 | componentWillUnmount() { 52 | clearInterval(this.timer) 53 | } 54 | 55 | reloadInspectedWindow = () => chrome.devtools.inspectedWindow.reload() 56 | 57 | setErrorState = () => this.setState({ hasError: true, loading: false }) 58 | 59 | getMeasures = () => { 60 | this.evaluate(queries['rawMeasures'], (measures, err) => { 61 | if (err) { 62 | this.setErrorState() 63 | return 64 | } 65 | 66 | this.setState({ 67 | loading: false, 68 | rawMeasures: JSON.parse(measures) 69 | }) 70 | }) 71 | } 72 | 73 | 74 | getWorkLoopMeasures = () => { 75 | this.evaluate(queries['workLoopMeasures'], (measures, err) => { 76 | if (err) { 77 | this.setErrorState() 78 | return 79 | } 80 | 81 | this.setState({ 82 | loading: false, 83 | workLoopMeasures: JSON.parse(measures) 84 | }) 85 | }) 86 | } 87 | 88 | clearMeasures = () => this.evaluate(queries['clear']) 89 | 90 | clear = () => { 91 | this.setState({ 92 | rawMeasures: [] 93 | }) 94 | this.clearMeasures() 95 | } 96 | 97 | browserReload = () => 98 | typeof window !== undefined ? window.location.reload() : null 99 | 100 | // Reload. 101 | reload = () => { 102 | this.clear() 103 | this.browserReload() 104 | 105 | // This avoids a flash when the inspected window is reloaded. 106 | this.setState({ loading: true }) 107 | 108 | this.reloadInspectedWindow() 109 | } 110 | 111 | render() { 112 | if (this.state.loading) { 113 | return ( 114 |
115 |

Collecting Data...

116 |
117 | ) 118 | } 119 | 120 | return ( 121 | 122 |
125 | 126 | {this.state.hasError ? ( 127 | 128 | ) : ( 129 | 130 | 131 | 138 | 139 | 140 | )} 141 |
142 | ) 143 | } 144 | } 145 | 146 | -------------------------------------------------------------------------------- /hook/dist/fiberlineHook.js: -------------------------------------------------------------------------------- 1 | !function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{configurable:!1,enumerable:!0,get:r})},n.r=function(e){Object.defineProperty(e,"__esModule",{value:!0})},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=4)}([function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});t.registerObserver=function(e,t){window.PerformanceObserver&&new window.PerformanceObserver(function(e){window.__REACT_PERF_DEVTOOL_GLOBAL_STORE__||(window.__REACT_PERF_DEVTOOL_GLOBAL_STORE__={length:e.getEntries().length,rawMeasures:[],queue:[]}),window.__REACT_PERF_DEVTOOL_GLOBAL_STORE__.rawMeasures=window.__REACT_PERF_DEVTOOL_GLOBAL_STORE__.rawMeasures.concat(e.getEntries())}).observe({entryTypes:["measure"]})}},function(e,t,n){"use strict";e.exports=["bailedOutOnFinishedWork","bailedOutOnLowPriorityWork","commitStart","commitEnd","componentDidMountStart","componentDidMountEnd","componentDidUpdateStart","componentDidUpdateEnd","componentWillMountStart","componentWillMountEnd","componentWillUnmountStart","componentWillUnmountEnd","componentWillReceivePropsStart","componentWillReceivePropsEnd","componentWillUpdateStart","componentWillUpdateEnd","contextChangePropagating","contextConsumerUpdating","contextProviderUpdating","fiberDidNotComplete","fiberNodeCreatedFromElement","fiberNodeCreatedFromFragment","fiberNodeCreatedFromText","fiberNodeCreatedFromPortal","fiberNodeCreatedHostForDeletion","fragmentStartedUpdating","fragmentUpdated","hostComponentUpdating","hostRootUpdating","hostTextUpdating","indeterminateComponentMounting","interruption","loadingComponentUpdating","modeUpdating","functionalComponentUpdating","getChildContextStart","getChildContextEnd","portalComponentUpdating","pushHostRootContext","shouldComponentUpdateStart","shouldComponentUpdateEnd","timeoutComponentUpdating","workLoopStart","workLoopEnded","workStarted","workCompleted"]},function(e,t,n){"use strict";var r=n(1);e.exports=function(e){r.forEach(function(t){e.on(t,function(t,n){var r=t.fiber,o=t.time;e.fiberlineEvents.push({fiber:r,time:o,evt:n})})}),e.on("updateQueue",function(t){var n=t.fiber,r=t.queue,o=t.time;return e.updatequeueLog.push({fiber:n,queue:r,time:o})})}},function(e,t,n){"use strict";e.exports=function(e){var t={_listeners:{},_dataCache:[],on:function(e,n){t._listeners[e]||(t._listeners[e]=[]),t._listeners[e].push(n)},emit:function(e,n){t._listeners[e]&&t._listeners[e].map(function(t){return Promise.resolve().then(t(n,e))})},toJSON:function(){for(var e=(arguments.length>0&&void 0!==arguments[0]?arguments[0]:this.fiberlineEvents).reduce(function(e,t){return t.fiber?(e[t.fiber._debugID]||(e[t.fiber._debugID]=[]),e[t.fiber._debugID].push({time:t.time,evt:t.evt,tag:function(e){switch(e){case 0:return"Indeterminate Component";case 1:return"Functional Component";case 2:return"Class Component";case 3:return"Host Root";case 4:return"Host Portal";case 5:return"Host Component";case 6:return"Host Text";case 7:return"Call Component";case 8:return"Call Handler Phase";case 9:return"Return Component";case 10:return"Fragment";case 11:return"Mode";case 12:return"Context Consumer";case 13:return"Context Provider";case 14:return"Loading Component";case 15:return"Timeout Component";default:return"unknown"}}(t.fiber.tag)}),e):e},{}),t=Object.keys(e),n=[],r=this._dataCache.length;r0&&void 0!==arguments[0]?arguments[0]:this.fiberlineEvents,t=[],n=[];return JSON.stringify(function e(r,o){var i;if(!(!(r instanceof Object&&null!==r)||r instanceof Boolean||r instanceof Date||r instanceof Number||r instanceof RegExp||r instanceof String)){for(var a=0;a Promise.resolve().then(fn(data, evt))); 55 | } 56 | }, 57 | toJSON: function(obj = this.fiberlineEvents) { 58 | const raw = obj.reduce((a, b) => { 59 | 60 | if (!b.fiber) return a; 61 | 62 | if (!a[b.fiber._debugID]) a[b.fiber._debugID] = []; 63 | a[b.fiber._debugID].push({ 64 | 'time': b.time, 65 | 'evt': b.evt, 66 | 'tag': getTag(b.fiber.tag), 67 | // 'state': b.fiber.stateNode, 68 | // 'type': b.fiber.type 69 | }); 70 | return a; 71 | }, {}); 72 | 73 | const keys = Object.keys(raw); 74 | const result = []; 75 | 76 | // function precisionRound(number, precision) { 77 | // var factor = Math.pow(10, precision); 78 | // return Math.round(number * factor) / factor; 79 | // } 80 | 81 | for (let i = this._dataCache.length; i < keys.length; i++) { 82 | for (let j = 0; j < raw[keys[i]].length-1; j++) { 83 | 84 | const datum = { 85 | x0: raw[keys[i]][j].time/1000, 86 | x: raw[keys[i]][j+1].time/1000, 87 | name: raw[keys[i]][j].tag, 88 | label: raw[keys[i]][j].evt + 89 | ' on ' + raw[keys[i]][j].tag + 90 | '\nat ' + raw[keys[i]][j].time/1000, 91 | 92 | y: parseInt(keys[i]), 93 | }; 94 | 95 | result.push(datum) 96 | } 97 | 98 | } 99 | this._dataCache = this._dataCache.concat(result) 100 | return JSON.stringify(this._dataCache); 101 | }, 102 | toCircularJSON: function(object = this.fiberlineEvents) { 103 | 104 | var objects = [], 105 | paths = []; 106 | 107 | return JSON.stringify((function derez(value, path) { 108 | 109 | var nu; 110 | 111 | if (value instanceof Object && value !== null && 112 | !(value instanceof Boolean) && 113 | !(value instanceof Date) && 114 | !(value instanceof Number) && 115 | !(value instanceof RegExp) && 116 | !(value instanceof String)) { 117 | 118 | for (let i = 0; i < objects.length; i += 1) { 119 | if (objects[i] === value) { 120 | return {'$ref': paths[i]}; 121 | } 122 | } 123 | 124 | objects.push(value); 125 | paths.push(path); 126 | 127 | if (Object.prototype.toString.apply(value) === '[object Array]') { 128 | nu = []; 129 | for (let i = 0; i < value.length; i += 1) { 130 | nu[i] = derez(value[i], path + '[' + i + ']'); 131 | } 132 | } else { 133 | 134 | nu = {}; 135 | for (let name in value) { 136 | if (Object.prototype.hasOwnProperty.call(value, name)) { 137 | nu[name] = derez(value[name], 138 | path + '[' + JSON.stringify(name) + ']'); 139 | } 140 | } 141 | } 142 | return nu; 143 | } 144 | return value; 145 | }(object, '$'))); 146 | }, 147 | fiberlineEvents: [], 148 | updatequeueLog: [], 149 | }; 150 | 151 | Object.defineProperty(window, '__REACT_FIBERLINE_GLOBAL_HOOK__', { 152 | value: hook, 153 | }); 154 | } 155 | 156 | module.exports = globalHook; 157 | -------------------------------------------------------------------------------- /timeline/src/extension/components/Measures.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import { VictoryTooltip, VictoryBrushContainer, VictoryZoomContainer, VictoryLabel, VictoryBar, VictoryChart, VictoryAxis, VictoryTheme, VictoryStack } from 'victory'; 3 | import { minBy, maxBy } from 'lodash'; // get more specific to make bundle smaller 4 | 5 | 6 | var buttonContainerStyle = { 7 | paddingLeft: "400px", 8 | background: "#19004c", 9 | padding:"10px 0 10px 400px", 10 | width: "600px", 11 | }; 12 | 13 | 14 | export class Measures extends React.Component { 15 | constructor(props) { 16 | super(props) 17 | this.state = { 18 | zoom: false, 19 | timelineMeasures: false, 20 | fiberlineMeasures: false, 21 | color: false, 22 | hint: false, 23 | button_color_yellow: true, 24 | hoveredBar: false, 25 | lastColor: false, 26 | searchText: '', 27 | searchResult: [], 28 | entireDomain: {x: [0, 1], y: [0, 20]}, 29 | zoomedDomain: [0, 1], 30 | } 31 | } 32 | 33 | componentDidMount(){ 34 | this.buildFiberlineData(this.props.workLoopMeasures); 35 | } 36 | 37 | componentWillReceiveProps(nextProps){ 38 | const entireDomain = this.getEntireDomain(nextProps.workLoopMeasures); 39 | const fiberlineMeasures = this.buildFiberlineData(nextProps.workLoopMeasures, entireDomain); 40 | this.setState({ 41 | entireDomain, 42 | fiberlineMeasures 43 | }) 44 | } 45 | 46 | buildFiberlineData = (workLoopMeasures, domain) => { 47 | if (workLoopMeasures) { 48 | const { maxPoints } = this.props; 49 | const _zoomedDomain = !!domain ? domain : {x: [0, 1], y: [0, 20]}; 50 | const filtered = workLoopMeasures.filter( 51 | (d) => ( 52 | d.x >= _zoomedDomain.x[0] && 53 | d.x <= _zoomedDomain.x[1] && 54 | d.y >= _zoomedDomain.y[0] && 55 | d.y <= _zoomedDomain.y[1] || 56 | d.x0 >= _zoomedDomain.x[0] && 57 | d.x0 <= _zoomedDomain.x[1] && 58 | d.y >= _zoomedDomain.y[0] && 59 | d.y <= _zoomedDomain.y[1] 60 | ) 61 | ); 62 | if (filtered.length > maxPoints) { 63 | const k = Math.ceil(filtered.length / maxPoints); 64 | return filtered.filter( 65 | (d, i) => ((i % k) === 0) 66 | ); 67 | } 68 | return filtered; 69 | } 70 | } 71 | 72 | onDomainChange(domain) { 73 | const fiberlineMeasures = this.buildFiberlineData(this.props.workLoopMeasures, domain) 74 | this.setState({ 75 | fiberlineMeasures, 76 | zoomedDomain: domain, 77 | }); 78 | } 79 | 80 | getEntireDomain(data) { 81 | return { 82 | y: [_.minBy(data, d => d.y).y, _.maxBy(data, d => d.y).y], 83 | x: [ data[0].x, _.maxBy(data, d => d.x).x ] 84 | }; 85 | } 86 | 87 | render(){ 88 | let buttonColor = this.state.button_color_yellow ? "#ffff80" : "green"; 89 | 90 | return ( 91 |
92 | 93 |
94 | 95 | 96 | 97 |
98 | 99 | 100 | {/* Fibernode graph */} 101 | 113 | } 114 | > 115 | 116 | 121 | 140 | } 141 | 142 | 143 | events={[{ 144 | target: "data", 145 | eventHandlers: { 146 | onMouseOver: () => { 147 | return [ 148 | { 149 | target: "data", 150 | mutation: () => ({ style: { fill: "#3de285" } }) 151 | }, { 152 | target: "labels", 153 | mutation: () => ({ active: true }) 154 | } 155 | ]; 156 | }, 157 | onMouseOut: () => { 158 | return [ 159 | { 160 | target: "data", 161 | mutation: () => { } 162 | }, { 163 | target: "labels", 164 | mutation: () => ({ active: false }) 165 | } 166 | ]; 167 | } 168 | } 169 | }]} 170 | /> 171 | 172 | 173 | 174 |
175 | ) 176 | } 177 | } 178 | -------------------------------------------------------------------------------- /timeline/extension/dependencies/react.js: -------------------------------------------------------------------------------- 1 | /** @license React v16.2.0 2 | * react.production.min.js 3 | * 4 | * Copyright (c) 2013-present, Facebook, Inc. 5 | * 6 | * This source code is licensed under the MIT license found in the 7 | * LICENSE file in the root directory of this source tree. 8 | */ 9 | 'use strict';(function(q,k){"object"===typeof exports&&"undefined"!==typeof module?module.exports=k():"function"===typeof define&&define.amd?define(k):q.React=k()})(this,function(){function q(a){for(var b=arguments.length-1,c="Minified React error #"+a+"; visit http://facebook.github.io/react/docs/error-decoder.html?invariant\x3d"+a,d=0;du.length&&u.push(a)}function t(a,b,c,d){var f=typeof a;if("undefined"===f||"boolean"===f)a=null;var l=!1;if(null===a)l=!0;else switch(f){case "string":case "number":l=!0;break;case "object":switch(a.$$typeof){case r:case P:case Q:case R:l=!0}}if(l)return c(d,a,""===b?"."+D(a,0):b),1;l=0;b=""===b?".":b+":";if(Array.isArray(a))for(var e= 13 | 0;ea;a++)b["_"+String.fromCharCode(a)]=a;if("0123456789"!==Object.getOwnPropertyNames(b).map(function(a){return b[a]}).join(""))return!1;var c={};"abcdefghijklmnopqrst".split("").forEach(function(a){c[a]=a});return"abcdefghijklmnopqrst"!==Object.keys(Object.assign({},c)).join("")?!1:!0}catch(d){return!1}}()?Object.assign: 16 | function(a,b){if(null===a||void 0===a)throw new TypeError("Object.assign cannot be called with null or undefined");var c=Object(a);for(var d,f=1;fthis.eventPool.length&&this.eventPool.push(a)}function md(a){a.eventPool=[];a.getPooled=ef;a.release=ff}function nd(a,b,c,d){return n.call(this,a,b,c,d)}function od(a,b,c,d){return n.call(this,a,b,c,d)}function gf(){var a=window.opera;return"object"===typeof a&&"function"===typeof a.version&&12>=parseInt(a.version(),10)}function pd(a,b){switch(a){case "topKeyUp":return-1!==hf.indexOf(b.keyCode);case "topKeyDown":return 229!==b.keyCode;case "topKeyPress":case "topMouseDown":case "topBlur":return!0; 24 | default:return!1}}function qd(a){a=a.detail;return"object"===typeof a&&"data"in a?a.data:null}function jf(a,b){switch(a){case "topCompositionEnd":return qd(b);case "topKeyPress":if(32!==b.which)return null;rd=!0;return sd;case "topTextInput":return a=b.data,a===sd&&rd?null:a;default:return null}}function kf(a,b){if(za)return"topCompositionEnd"===a||!bc&&pd(a,b)?(a=kd(),H._root=null,H._startText=null,H._fallbackText=null,za=!1,a):null;switch(a){case "topPaste":return null;case "topKeyPress":if(!(b.ctrlKey|| 25 | b.altKey||b.metaKey)||b.ctrlKey&&b.altKey){if(b.char&&1qb.length&&qb.push(a)}}}function rb(a,b){var c={};c[a.toLowerCase()]=b.toLowerCase();c["Webkit"+a]="webkit"+b;c["Moz"+a]="moz"+b;c["ms"+a]="MS"+b;c["O"+a]="o"+b.toLowerCase();return c}function sb(a){if(kc[a])return kc[a];if(!U[a])return a;var b=U[a],c;for(c in b)if(b.hasOwnProperty(c)&&c in Jd)return kc[a]=b[c];return""}function Kd(a){Object.prototype.hasOwnProperty.call(a,tb)||(a[tb]=zf++,Ld[a[tb]]= 36 | {});return Ld[a[tb]]}function Md(a,b){return a===b?0!==a||0!==b||1/a===1/b:a!==a&&b!==b}function Nd(a,b){return a&&b?a===b?!0:Od(a)?!1:Od(b)?Nd(a,b.parentNode):"contains"in a?a.contains(b):a.compareDocumentPosition?!!(a.compareDocumentPosition(b)&16):!1:!1}function Pd(a){for(;a&&a.firstChild;)a=a.firstChild;return a}function Qd(a,b){var c=Pd(a);a=0;for(var d;c;){if(3===c.nodeType){d=a+c.textContent.length;if(a<=b&&d>=b)return{node:c,offset:b-a};a=d}a:{for(;c;){if(c.nextSibling){c=c.nextSibling;break a}c= 37 | c.parentNode}c=void 0}c=Pd(c)}}function lc(a){var b=a&&a.nodeName&&a.nodeName.toLowerCase();return b&&("input"===b&&"text"===a.type||"textarea"===b||"true"===a.contentEditable)}function Rd(a,b){if(mc||null==X||X!==nc())return null;var c=X;"selectionStart"in c&&lc(c)?c={start:c.selectionStart,end:c.selectionEnd}:window.getSelection?(c=window.getSelection(),c={anchorNode:c.anchorNode,anchorOffset:c.anchorOffset,focusNode:c.focusNode,focusOffset:c.focusOffset}):c=void 0;return Sa&&oc(Sa,c)?null:(Sa= 38 | c,a=n.getPooled(Sd.select,pc,a,b),a.type="select",a.target=X,ya(a),a)}function Td(a,b,c,d){return n.call(this,a,b,c,d)}function Ud(a,b,c,d){return n.call(this,a,b,c,d)}function Vd(a,b,c,d){return n.call(this,a,b,c,d)}function ub(a){var b=a.keyCode;"charCode"in a?(a=a.charCode,0===a&&13===b&&(a=13)):a=b;return 32<=a||13===a?a:0}function Wd(a,b,c,d){return n.call(this,a,b,c,d)}function Xd(a,b,c,d){return n.call(this,a,b,c,d)}function Yd(a,b,c,d){return n.call(this,a,b,c,d)}function Zd(a,b,c,d){return n.call(this, 39 | a,b,c,d)}function $d(a,b,c,d){return n.call(this,a,b,c,d)}function I(a,b){0>ra||(a.current=vb[ra],vb[ra]=null,ra--)}function M(a,b,c){ra++;vb[ra]=a.current;a.current=b}function Ta(a){return Ua(a)?wb:ia.current}function Va(a,b){var c=a.type.contextTypes;if(!c)return ja;var d=a.stateNode;if(d&&d.__reactInternalMemoizedUnmaskedChildContext===b)return d.__reactInternalMemoizedMaskedChildContext;var e={},f;for(f in c)e[f]=b[f];d&&(a=a.stateNode,a.__reactInternalMemoizedUnmaskedChildContext=b,a.__reactInternalMemoizedMaskedChildContext= 40 | e);return e}function Ua(a){return 2===a.tag&&null!=a.type.childContextTypes}function ae(a){Ua(a)&&(I(J,a),I(ia,a))}function be(a,b,c){null!=ia.cursor?l("168"):void 0;M(ia,b,a);M(J,c,a)}function ce(a,b){var c=a.stateNode,d=a.type.childContextTypes;if("function"!==typeof c.getChildContext)return b;c=c.getChildContext();for(var e in c)e in d?void 0:l("108",Pa(a)||"Unknown",e);return C({},b,c)}function xb(a){if(!Ua(a))return!1;var b=a.stateNode;b=b&&b.__reactInternalMemoizedMergedChildContext||ja;wb= 41 | ia.current;M(ia,b,a);M(J,J.current,a);return!0}function de(a,b){var c=a.stateNode;c?void 0:l("169");if(b){var d=ce(a,wb);c.__reactInternalMemoizedMergedChildContext=d;I(J,a);I(ia,a);M(ia,d,a)}else I(J,a);M(J,b,a)}function Q(a,b,c){this.tag=a;this.key=b;this.stateNode=this.type=null;this.sibling=this.child=this["return"]=null;this.index=0;this.memoizedState=this.updateQueue=this.memoizedProps=this.pendingProps=this.ref=null;this.internalContextTag=c;this.effectTag=0;this.lastEffect=this.firstEffect= 42 | this.nextEffect=null;this.expirationTime=0;this.alternate=null}function yb(a,b,c){var d=a.alternate;null===d?(d=new Q(a.tag,a.key,a.internalContextTag),d.type=a.type,d.stateNode=a.stateNode,d.alternate=a,a.alternate=d):(d.effectTag=0,d.nextEffect=null,d.firstEffect=null,d.lastEffect=null);d.expirationTime=c;d.pendingProps=b;d.child=a.child;d.memoizedProps=a.memoizedProps;d.memoizedState=a.memoizedState;d.updateQueue=a.updateQueue;d.sibling=a.sibling;d.index=a.index;d.ref=a.ref;return d}function qc(a, 43 | b,c){var d=void 0,e=a.type,f=a.key;"function"===typeof e?(d=e.prototype&&e.prototype.isReactComponent?new Q(2,f,b):new Q(0,f,b),d.type=e,d.pendingProps=a.props):"string"===typeof e?(d=new Q(5,f,b),d.type=e,d.pendingProps=a.props):"object"===typeof e&&null!==e&&"number"===typeof e.tag?(d=e,d.pendingProps=a.props):l("130",null==e?e:typeof e,"");d.expirationTime=c;return d}function zb(a,b,c,d){b=new Q(10,d,b);b.pendingProps=a;b.expirationTime=c;return b}function rc(a,b,c){b=new Q(6,null,b);b.pendingProps= 44 | a;b.expirationTime=c;return b}function sc(a,b,c){b=new Q(7,a.key,b);b.type=a.handler;b.pendingProps=a;b.expirationTime=c;return b}function tc(a,b,c){a=new Q(9,null,b);a.expirationTime=c;return a}function uc(a,b,c){b=new Q(4,a.key,b);b.pendingProps=a.children||[];b.expirationTime=c;b.stateNode={containerInfo:a.containerInfo,pendingChildren:null,implementation:a.implementation};return b}function ee(a){return function(b){try{return a(b)}catch(c){}}}function Af(a){if("undefined"===typeof __REACT_DEVTOOLS_GLOBAL_HOOK__)return!1; 45 | var b=__REACT_DEVTOOLS_GLOBAL_HOOK__;if(b.isDisabled||!b.supportsFiber)return!0;try{var c=b.inject(a);vc=ee(function(a){return b.onCommitFiberRoot(c,a)});wc=ee(function(a){return b.onCommitFiberUnmount(c,a)})}catch(d){}return!0}function fe(a){"function"===typeof vc&&vc(a)}function ge(a){"function"===typeof wc&&wc(a)}function he(a){return{baseState:a,expirationTime:0,first:null,last:null,callbackList:null,hasForceUpdate:!1,isInitialized:!1}}function Ab(a,b){null===a.last?a.first=a.last=b:(a.last.next= 46 | b,a.last=b);if(0===a.expirationTime||a.expirationTime>b.expirationTime)a.expirationTime=b.expirationTime}function Bb(a,b){var c=a.alternate,d=a.updateQueue;null===d&&(d=a.updateQueue=he(null));null!==c?(a=c.updateQueue,null===a&&(a=c.updateQueue=he(null))):a=null;a=a!==d?a:null;null===a?Ab(d,b):null===d.last||null===a.last?(Ab(d,b),Ab(a,b)):(Ab(d,b),a.last=b)}function ie(a,b,c,d){a=a.partialState;return"function"===typeof a?a.call(b,c,d):a}function xc(a,b,c,d,e,f){null!==a&&a.updateQueue===c&&(c= 47 | b.updateQueue={baseState:c.baseState,expirationTime:c.expirationTime,first:c.first,last:c.last,isInitialized:c.isInitialized,callbackList:null,hasForceUpdate:!1});c.expirationTime=0;c.isInitialized?a=c.baseState:(a=c.baseState=b.memoizedState,c.isInitialized=!0);for(var g=!0,h=c.first,k=!1;null!==h;){var l=h.expirationTime;if(l>f){var D=c.expirationTime;if(0===D||D>l)c.expirationTime=l;k||(k=!0,c.baseState=a)}else{k||(c.first=h.next,null===c.first&&(c.last=null));if(h.isReplace)a=ie(h,d,a,e),g=!0; 48 | else if(l=ie(h,d,a,e))a=g?C({},a,l):C(a,l),g=!1;h.isForced&&(c.hasForceUpdate=!0);null!==h.callback&&(l=c.callbackList,null===l&&(l=c.callbackList=[]),l.push(h))}h=h.next}null!==c.callbackList?b.effectTag|=32:null!==c.first||c.hasForceUpdate||(b.updateQueue=null);k||(c.baseState=a);return a}function je(a,b){var c=a.callbackList;if(null!==c)for(a.callbackList=null,a=0;ax?(k=p,p=null):k=p.sibling;var l=L(e,p,h[x],z);if(null===l){null===p&&(p=k);break}a&&p&&null===l.alternate&& 57 | b(e,p);g=f(l,g,x);null===q?t=l:q.sibling=l;q=l;p=k}if(x===h.length)return c(e,p),t;if(null===p){for(;xx?(k=p,p=null):k=p.sibling;var La=L(e,p,m.value,z);if(null===La){p||(p=k);break}a&&p&&null===La.alternate&&b(e,p);g=f(La,g,x);null===q?t=La:q.sibling=La;q=La;p=k}if(m.done)return c(e,p),t;if(null===p){for(;!m.done;x++,m=h.next())m=K(e,m.value,z),null!==m&&(g=f(m,g,x),null===q?t=m:q.sibling=m,q=m);return t}for(p=d(e,p);!m.done;x++,m=h.next())if(m=R(p,e,x,m.value,z),null!==m){if(a&&null!==m.alternate)p["delete"](null===m.key?x:m.key); 59 | g=f(m,g,x);null===q?t=m:q.sibling=m;q=m}a&&p.forEach(function(a){return b(e,a)});return t}return function(a,d,f,h){"object"===typeof f&&null!==f&&f.type===sa&&null===f.key&&(f=f.props.children);var k="object"===typeof f&&null!==f;if(k)switch(f.$$typeof){case Db:a:{var q=f.key;for(k=d;null!==k;){if(k.key===q)if(10===k.tag?f.type===sa:k.type===f.type){c(a,k.sibling);d=e(k,f.type===sa?f.props.children:f.props,h);d.ref=Xa(k,f);d["return"]=a;a=d;break a}else{c(a,k);break}else b(a,k);k=k.sibling}f.type=== 60 | sa?(d=zb(f.props.children,a.internalContextTag,h,f.key),d["return"]=a,a=d):(h=qc(f,a.internalContextTag,h),h.ref=Xa(d,f),h["return"]=a,a=h)}return g(a);case Eb:a:{for(k=f.key;null!==d;){if(d.key===k)if(7===d.tag){c(a,d.sibling);d=e(d,f,h);d["return"]=a;a=d;break a}else{c(a,d);break}else b(a,d);d=d.sibling}d=sc(f,a.internalContextTag,h);d["return"]=a;a=d}return g(a);case Fb:a:{if(null!==d)if(9===d.tag){c(a,d.sibling);d=e(d,null,h);d.type=f.value;d["return"]=a;a=d;break a}else c(a,d);d=tc(f,a.internalContextTag, 61 | h);d.type=f.value;d["return"]=a;a=d}return g(a);case Ya:a:{for(k=f.key;null!==d;){if(d.key===k)if(4===d.tag&&d.stateNode.containerInfo===f.containerInfo&&d.stateNode.implementation===f.implementation){c(a,d.sibling);d=e(d,f.children||[],h);d["return"]=a;a=d;break a}else{c(a,d);break}else b(a,d);d=d.sibling}d=uc(f,a.internalContextTag,h);d["return"]=a;a=d}return g(a)}if("string"===typeof f||"number"===typeof f)return f=""+f,null!==d&&6===d.tag?(c(a,d.sibling),d=e(d,f,h)):(c(a,d),d=rc(f,a.internalContextTag, 62 | h)),d["return"]=a,a=d,g(a);if(Gb(f))return n(a,d,f,h);if(Wa(f))return r(a,d,f,h);k&&Cb(a,f);if("undefined"===typeof f)switch(a.tag){case 2:case 1:h=a.type,l("152",h.displayName||h.name||"Component")}return c(a,d)}}function Bf(a,b,c){var d=3c||d.hasOverloadedBooleanValue&&!1===c?oe(a,b):d.mustUseProperty?a[d.propertyName]=c:(b=d.attributeName,(e=d.attributeNamespace)?a.setAttributeNS(e,b,""+c):d.hasBooleanValue||d.hasOverloadedBooleanValue&&!0===c?a.setAttribute(b,""):a.setAttribute(b,""+c))}else Ac(a,b,Xc(b,c)?c:null)}function Ac(a,b,c){Cf(b)&&(null==c?a.removeAttribute(b): 64 | a.setAttribute(b,""+c))}function oe(a,b){var c=Ub(b);c?(b=c.mutationMethod)?b(a,void 0):c.mustUseProperty?a[c.propertyName]=c.hasBooleanValue?!1:"":a.removeAttribute(c.attributeName):a.removeAttribute(b)}function Bc(a,b){var c=b.value,d=b.checked;return C({type:void 0,step:void 0,min:void 0,max:void 0},b,{defaultChecked:void 0,defaultValue:void 0,value:null!=c?c:a._wrapperState.initialValue,checked:null!=d?d:a._wrapperState.initialChecked})}function pe(a,b){var c=b.defaultValue;a._wrapperState={initialChecked:null!= 65 | b.checked?b.checked:b.defaultChecked,initialValue:null!=b.value?b.value:c,controlled:"checkbox"===b.type||"radio"===b.type?null!=b.checked:null!=b.value}}function qe(a,b){b=b.checked;null!=b&&zc(a,"checked",b)}function Cc(a,b){qe(a,b);var c=b.value;if(null!=c)if(0===c&&""===a.value)a.value="0";else if("number"===b.type){if(b=parseFloat(a.value)||0,c!=b||c==b&&a.value!=c)a.value=""+c}else a.value!==""+c&&(a.value=""+c);else null==b.value&&null!=b.defaultValue&&a.defaultValue!==""+b.defaultValue&&(a.defaultValue= 66 | ""+b.defaultValue),null==b.checked&&null!=b.defaultChecked&&(a.defaultChecked=!!b.defaultChecked)}function re(a,b){switch(b.type){case "submit":case "reset":break;case "color":case "date":case "datetime":case "datetime-local":case "month":case "time":case "week":a.value="";a.value=a.defaultValue;break;default:a.value=a.value}b=a.name;""!==b&&(a.name="");a.defaultChecked=!a.defaultChecked;a.defaultChecked=!a.defaultChecked;""!==b&&(a.name=b)}function Ef(a){var b="";na.Children.forEach(a,function(a){null== 67 | a||"string"!==typeof a&&"number"!==typeof a||(b+=a)});return b}function Dc(a,b){a=C({children:void 0},b);if(b=Ef(b.children))a.children=b;return a}function ka(a,b,c,d){a=a.options;if(b){b={};for(var e=0;e=b.length?void 0:l("93"),b=b[0]),c=""+b),null==c&&(c=""));a._wrapperState={initialValue:""+ 69 | c}}function ue(a,b){var c=b.value;null!=c&&(c=""+c,c!==a.value&&(a.value=c),null==b.defaultValue&&(a.defaultValue=c));null!=b.defaultValue&&(a.defaultValue=b.defaultValue)}function ve(a){switch(a){case "svg":return"http://www.w3.org/2000/svg";case "math":return"http://www.w3.org/1998/Math/MathML";default:return"http://www.w3.org/1999/xhtml"}}function Fc(a,b){return null==a||"http://www.w3.org/1999/xhtml"===a?ve(b):"http://www.w3.org/2000/svg"===a&&"foreignObject"===b?"http://www.w3.org/1999/xhtml": 70 | a}function we(a,b,c){a=a.style;for(var d in b)if(b.hasOwnProperty(d)){c=0===d.indexOf("--");var e=d;var f=b[d];e=null==f||"boolean"===typeof f||""===f?"":c||"number"!==typeof f||0===f||Za.hasOwnProperty(e)&&Za[e]?(""+f).trim():f+"px";"float"===d&&(d="cssFloat");c?a.setProperty(d,e):a[d]=e}}function Gc(a,b,c){b&&(Ff[a]&&(null!=b.children||null!=b.dangerouslySetInnerHTML?l("137",a,c()):void 0),null!=b.dangerouslySetInnerHTML&&(null!=b.children?l("60"):void 0,"object"===typeof b.dangerouslySetInnerHTML&& 71 | "__html"in b.dangerouslySetInnerHTML?void 0:l("61")),null!=b.style&&"object"!==typeof b.style?l("62",c()):void 0)}function Hc(a,b){if(-1===a.indexOf("-"))return"string"===typeof b.is;switch(a){case "annotation-xml":case "color-profile":case "font-face":case "font-face-src":case "font-face-uri":case "font-face-format":case "font-face-name":case "missing-glyph":return!1;default:return!0}}function Y(a,b){a=9===a.nodeType||11===a.nodeType?a:a.ownerDocument;var c=Kd(a);b=kb[b];for(var d=0;d=g.hasBooleanValue+g.hasNumericValue+g.hasOverloadedBooleanValue?void 0:l("50",f);e.hasOwnProperty(f)&&(g.attributeName=e[f]);d.hasOwnProperty(f)&&(g.attributeNamespace=d[f]);a.hasOwnProperty(f)&&(g.mutationMethod=a[f]);ib[f]=g}}},ib={},aa=Ie,Ib=aa.MUST_USE_PROPERTY,w=aa.HAS_BOOLEAN_VALUE,Je=aa.HAS_NUMERIC_VALUE,Jb=aa.HAS_POSITIVE_NUMERIC_VALUE,Ke=aa.HAS_OVERLOADED_BOOLEAN_VALUE, 87 | Kb=aa.HAS_STRING_BOOLEAN_VALUE,Hf={Properties:{allowFullScreen:w,async:w,autoFocus:w,autoPlay:w,capture:Ke,checked:Ib|w,cols:Jb,contentEditable:Kb,controls:w,"default":w,defer:w,disabled:w,download:Ke,draggable:Kb,formNoValidate:w,hidden:w,loop:w,multiple:Ib|w,muted:Ib|w,noValidate:w,open:w,playsInline:w,readOnly:w,required:w,reversed:w,rows:Jb,rowSpan:Je,scoped:w,seamless:w,selected:Ib|w,size:Jb,start:Je,span:Jb,spellCheck:Kb,style:0,tabIndex:0,itemScope:w,acceptCharset:0,className:0,htmlFor:0,httpEquiv:0, 88 | value:Kb},DOMAttributeNames:{acceptCharset:"accept-charset",className:"class",htmlFor:"for",httpEquiv:"http-equiv"},DOMMutationMethods:{value:function(a,b){if(null==b)return a.removeAttribute("value");"number"!==a.type||!1===a.hasAttribute("value")?a.setAttribute("value",""+b):a.validity&&!a.validity.badInput&&a.ownerDocument.activeElement!==a&&a.setAttribute("value",""+b)}}},Kc=aa.HAS_STRING_BOOLEAN_VALUE,Lc={Properties:{autoReverse:Kc,externalResourcesRequired:Kc,preserveAlpha:Kc},DOMAttributeNames:{autoReverse:"autoReverse", 89 | externalResourcesRequired:"externalResourcesRequired",preserveAlpha:"preserveAlpha"},DOMAttributeNamespaces:{xlinkActuate:"http://www.w3.org/1999/xlink",xlinkArcrole:"http://www.w3.org/1999/xlink",xlinkHref:"http://www.w3.org/1999/xlink",xlinkRole:"http://www.w3.org/1999/xlink",xlinkShow:"http://www.w3.org/1999/xlink",xlinkTitle:"http://www.w3.org/1999/xlink",xlinkType:"http://www.w3.org/1999/xlink",xmlBase:"http://www.w3.org/XML/1998/namespace",xmlLang:"http://www.w3.org/XML/1998/namespace",xmlSpace:"http://www.w3.org/XML/1998/namespace"}}, 90 | If=/[\-\:]([a-z])/g,Jf=function(a){return a[1].toUpperCase()};"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 x-height xlink:actuate xlink:arcrole xlink:href xlink:role xlink:show xlink:title xlink:type xml:base xmlns:xlink xml:lang xml:space".split(" ").forEach(function(a){var b= 91 | a.replace(If,Jf);Lc.Properties[b]=0;Lc.DOMAttributeNames[b]=a});aa.injectDOMPropertyConfig(Hf);aa.injectDOMPropertyConfig(Lc);var y={_caughtError:null,_hasCaughtError:!1,_rethrowError:null,_hasRethrowError:!1,injection:{injectErrorUtils:function(a){"function"!==typeof a.invokeGuardedCallback?l("197"):void 0;Le=a.invokeGuardedCallback}},invokeGuardedCallback:function(a,b,c,d,e,f,g,h,k){Le.apply(y,arguments)},invokeGuardedCallbackAndCatchFirstError:function(a,b,c,d,e,f,g,h,k){y.invokeGuardedCallback.apply(this, 92 | arguments);if(y.hasCaughtError()){var l=y.clearCaughtError();y._hasRethrowError||(y._hasRethrowError=!0,y._rethrowError=l)}},rethrowCaughtError:function(){return Kf.apply(y,arguments)},hasCaughtError:function(){return y._hasCaughtError},clearCaughtError:function(){if(y._hasCaughtError){var a=y._caughtError;y._caughtError=null;y._hasCaughtError=!1;return a}l("198")}},Le=function(a,b,c,d,e,f,g,h,k){y._hasCaughtError=!1;y._caughtError=null;var l=Array.prototype.slice.call(arguments,3);try{b.apply(c, 93 | l)}catch(D){y._caughtError=D,y._hasCaughtError=!0}},Kf=function(){if(y._hasRethrowError){var a=y._rethrowError;y._rethrowError=null;y._hasRethrowError=!1;throw a;}},jb=null,ba={},oa=[],Vb={},ca={},kb={},Lf=Object.freeze({plugins:oa,eventNameDispatchConfigs:Vb,registrationNameModules:ca,registrationNameDependencies:kb,possibleRegistrationNames:null,injectEventPluginOrder:ad,injectEventPluginsByName:bd}),ta=function(){};ta.thatReturns=lb;ta.thatReturnsFalse=lb(!1);ta.thatReturnsTrue=lb(!0);ta.thatReturnsNull= 94 | lb(null);ta.thatReturnsThis=function(){return this};ta.thatReturnsArgument=function(a){return a};var G=ta,Xb=null,vd=null,dd=null,pa=null,Me=function(a,b){if(a){var c=a._dispatchListeners,d=a._dispatchInstances;if(Array.isArray(c))for(var e=0;e=ab),sd=String.fromCharCode(32), 100 | V={beforeInput:{phasedRegistrationNames:{bubbled:"onBeforeInput",captured:"onBeforeInputCapture"},dependencies:["topCompositionEnd","topKeyPress","topTextInput","topPaste"]},compositionEnd:{phasedRegistrationNames:{bubbled:"onCompositionEnd",captured:"onCompositionEndCapture"},dependencies:"topBlur topCompositionEnd topKeyDown topKeyPress topKeyUp topMouseDown".split(" ")},compositionStart:{phasedRegistrationNames:{bubbled:"onCompositionStart",captured:"onCompositionStartCapture"},dependencies:"topBlur topCompositionStart topKeyDown topKeyPress topKeyUp topMouseDown".split(" ")}, 101 | compositionUpdate:{phasedRegistrationNames:{bubbled:"onCompositionUpdate",captured:"onCompositionUpdateCapture"},dependencies:"topBlur topCompositionUpdate topKeyDown topKeyPress topKeyUp topMouseDown".split(" ")}},rd=!1,za=!1,Qf={eventTypes:V,extractEvents:function(a,b,c,d){var e;if(bc)b:{switch(a){case "topCompositionStart":var f=V.compositionStart;break b;case "topCompositionEnd":f=V.compositionEnd;break b;case "topCompositionUpdate":f=V.compositionUpdate;break b}f=void 0}else za?pd(a,c)&&(f=V.compositionEnd): 102 | "topKeyDown"===a&&229===c.keyCode&&(f=V.compositionStart);f?(td&&(za||f!==V.compositionStart?f===V.compositionEnd&&za&&(e=kd()):(H._root=d,H._startText=ld(),za=!0)),f=nd.getPooled(f,b,c,d),e?f.data=e:(e=qd(c),null!==e&&(f.data=e)),ya(f),e=f):e=null;(a=Pf?jf(a,c):kf(a,c))?(b=od.getPooled(V.beforeInput,b,c,d),b.data=a,ya(b)):b=null;return[e,b]}},mb=null,Ga=null,fa=null,Qe={injectFiberControlledHostComponent:function(a){mb=a}},Rf=Object.freeze({injection:Qe,enqueueStateRestore:wd,restoreStateIfNeeded:xd}), 103 | ec=function(a,b){return a(b)},dc=!1,lf={color:!0,date:!0,datetime:!0,"datetime-local":!0,email:!0,month:!0,number:!0,password:!0,range:!0,search:!0,tel:!0,text:!0,time:!0,url:!0,week:!0},zd;P.canUseDOM&&(zd=document.implementation&&document.implementation.hasFeature&&!0!==document.implementation.hasFeature("",""));var Dd={change:{phasedRegistrationNames:{bubbled:"onChange",captured:"onChangeCapture"},dependencies:"topBlur topChange topClick topFocus topInput topKeyDown topKeyUp topSelectionChange".split(" ")}}, 104 | Ha=null,Oa=null,Nc=!1;P.canUseDOM&&(Nc=gc("input")&&(!document.documentMode||9=document.documentMode,Sd={select:{phasedRegistrationNames:{bubbled:"onSelect",captured:"onSelectCapture"},dependencies:"topBlur topContextMenu topFocus topKeyDown topKeyUp topMouseDown topMouseUp topSelectionChange".split(" ")}}, 115 | X=null,pc=null,Sa=null,mc=!1,Xf={eventTypes:Sd,extractEvents:function(a,b,c,d){var e=d.window===d?d.document:9===d.nodeType?d:d.ownerDocument,f;if(!(f=!e)){a:{e=Kd(e);f=kb.onSelect;for(var g=0;gc)return D(a,b);switch(b.tag){case 0:null!== 133 | a?l("155"):void 0;var d=b.type,e=b.pendingProps,q=Ta(b);q=Va(b,q);d=d(e,q);b.effectTag|=1;"object"===typeof d&&null!==d&&"function"===typeof d.render?(b.tag=2,e=xb(b),x(b,d),z(b,c),b=h(a,b,!0,e)):(b.tag=1,f(a,b,d),b.memoizedProps=e,b=b.child);return b;case 1:a:{e=b.type;c=b.pendingProps;d=b.memoizedProps;if(J.current)null===c&&(c=d);else if(null===c||d===c){b=m(a,b);break a}d=Ta(b);d=Va(b,d);e=e(c,d);b.effectTag|=1;f(a,b,e);b.memoizedProps=c;b=b.child}return b;case 2:return e=xb(b),d=void 0,null=== 134 | a?b.stateNode?l("153"):(t(b,b.pendingProps),z(b,c),d=!0):d=yc(a,b,c),h(a,b,d,e);case 3:return k(b),e=b.updateQueue,null!==e?(d=b.memoizedState,e=xc(a,b,e,null,null,c),d===e?(w(),b=m(a,b)):(d=e.element,q=b.stateNode,(null===a||null===a.child)&&q.hydrate&&r(b)?(b.effectTag|=2,b.child=Mb(b,null,d,c)):(w(),f(a,b,d)),b.memoizedState=e,b=b.child)):(w(),b=m(a,b)),b;case 5:L(b);null===a&&y(b);e=b.type;var p=b.memoizedProps;d=b.pendingProps;null===d&&(d=p,null===d?l("154"):void 0);q=null!==a?a.memoizedProps: 135 | null;J.current||null!==d&&p!==d?(p=d.children,A(e,d)?p=null:q&&A(e,q)&&(b.effectTag|=16),g(a,b),2147483647!==c&&!v&&n(e,d)?(b.expirationTime=2147483647,b=null):(f(a,b,p),b.memoizedProps=d,b=b.child)):b=m(a,b);return b;case 6:return null===a&&y(b),a=b.pendingProps,null===a&&(a=b.memoizedProps),b.memoizedProps=a,null;case 8:b.tag=7;case 7:e=b.pendingProps;if(J.current)null===e&&(e=a&&a.memoizedProps,null===e?l("154"):void 0);else if(null===e||b.memoizedProps===e)e=b.memoizedProps;d=e.children;b.stateNode= 136 | null===a?Mb(b,b.stateNode,d,c):db(b,b.stateNode,d,c);b.memoizedProps=e;return b.stateNode;case 9:return null;case 4:a:{R(b,b.stateNode.containerInfo);e=b.pendingProps;if(J.current)null===e&&(e=a&&a.memoizedProps,null==e?l("154"):void 0);else if(null===e||b.memoizedProps===e){b=m(a,b);break a}null===a?b.child=db(b,null,e,c):f(a,b,e);b.memoizedProps=e;b=b.child}return b;case 10:a:{c=b.pendingProps;if(J.current)null===c&&(c=b.memoizedProps);else if(null===c||b.memoizedProps===c){b=m(a,b);break a}f(a, 137 | b,c);b.memoizedProps=c;b=b.child}return b;default:l("156")}},beginFailedWork:function(a,b,c){switch(b.tag){case 2:xb(b);break;case 3:k(b);break;default:l("157")}b.effectTag|=64;null===a?b.child=null:b.child!==a.child&&(b.child=a.child);if(0===b.expirationTime||b.expirationTime>c)return D(a,b);b.firstEffect=null;b.lastEffect=null;b.child=null===a?Mb(b,null,null,c):db(b,a.child,null,c);2===b.tag&&(a=b.stateNode,b.memoizedProps=a.props,b.memoizedState=a.state);return b.child}}},cg=function(a,b,c){function d(a){a.effectTag|= 138 | 4}var e=a.createInstance,f=a.createTextInstance,g=a.appendInitialChild,h=a.finalizeInitialChildren,k=a.prepareUpdate,m=a.persistence,D=b.getRootHostContainer,A=b.popHostContext,v=b.getHostContext,n=b.popHostContainer,L=c.prepareToHydrateHostInstance,R=c.prepareToHydrateHostTextInstance,r=c.popHydrationState,w=void 0,y=void 0,x=void 0;a.mutation?(w=function(a){},y=function(a,b,c,e,f,g,h){(b.updateQueue=c)&&d(b)},x=function(a,b,c,e){c!==e&&d(b)}):m?l("235"):l("236");return{completeWork:function(a,b, 139 | c){var t=b.pendingProps;if(null===t)t=b.memoizedProps;else if(2147483647!==b.expirationTime||2147483647===c)b.pendingProps=null;switch(b.tag){case 1:return null;case 2:return ae(b),null;case 3:n(b);I(J,b);I(ia,b);t=b.stateNode;t.pendingContext&&(t.context=t.pendingContext,t.pendingContext=null);if(null===a||null===a.child)r(b),b.effectTag&=-3;w(b);return null;case 5:A(b);c=D();var z=b.type;if(null!==a&&null!=b.stateNode){var m=a.memoizedProps,K=b.stateNode,yc=v();K=k(K,z,m,t,c,yc);y(a,b,K,z,m,t,c); 140 | a.ref!==b.ref&&(b.effectTag|=128)}else{if(!t)return null===b.stateNode?l("166"):void 0,null;a=v();if(r(b))L(b,c,a)&&d(b);else{a=e(z,t,c,a,b);a:for(m=b.child;null!==m;){if(5===m.tag||6===m.tag)g(a,m.stateNode);else if(4!==m.tag&&null!==m.child){m.child["return"]=m;m=m.child;continue}if(m===b)break;for(;null===m.sibling;){if(null===m["return"]||m["return"]===b)break a;m=m["return"]}m.sibling["return"]=m["return"];m=m.sibling}h(a,z,t,c)&&d(b);b.stateNode=a}null!==b.ref&&(b.effectTag|=128)}return null; 141 | case 6:if(a&&null!=b.stateNode)x(a,b,a.memoizedProps,t);else{if("string"!==typeof t)return null===b.stateNode?l("166"):void 0,null;a=D();c=v();r(b)?R(b)&&d(b):b.stateNode=f(t,a,c,b)}return null;case 7:(t=b.memoizedProps)?void 0:l("165");b.tag=8;z=[];a:for((m=b.stateNode)&&(m["return"]=b);null!==m;){if(5===m.tag||6===m.tag||4===m.tag)l("247");else if(9===m.tag)z.push(m.type);else if(null!==m.child){m.child["return"]=m;m=m.child;continue}for(;null===m.sibling;){if(null===m["return"]||m["return"]=== 142 | b)break a;m=m["return"]}m.sibling["return"]=m["return"];m=m.sibling}m=t.handler;t=m(t.props,z);b.child=db(b,null!==a?a.child:null,t,c);return b.child;case 8:return b.tag=7,null;case 9:return null;case 10:return null;case 4:return n(b),w(b),null;case 0:l("167");default:l("156")}}}},dg=function(a,b){function c(a){var c=a.ref;if(null!==c)try{c(null)}catch(z){b(a,z)}}function d(a){"function"===typeof ge&&ge(a);switch(a.tag){case 2:c(a);var d=a.stateNode;if("function"===typeof d.componentWillUnmount)try{d.props= 143 | a.memoizedProps,d.state=a.memoizedState,d.componentWillUnmount()}catch(z){b(a,z)}break;case 5:c(a);break;case 7:e(a.stateNode);break;case 4:k&&g(a)}}function e(a){for(var b=a;;)if(d(b),null===b.child||k&&4===b.tag){if(b===a)break;for(;null===b.sibling;){if(null===b["return"]||b["return"]===a)return;b=b["return"]}b.sibling["return"]=b["return"];b=b.sibling}else b.child["return"]=b,b=b.child}function f(a){return 5===a.tag||3===a.tag||4===a.tag}function g(a){for(var b=a,c=!1,f=void 0,g=void 0;;){if(!c){c= 144 | b["return"];a:for(;;){null===c?l("160"):void 0;switch(c.tag){case 5:f=c.stateNode;g=!1;break a;case 3:f=c.stateNode.containerInfo;g=!0;break a;case 4:f=c.stateNode.containerInfo;g=!0;break a}c=c["return"]}c=!0}if(5===b.tag||6===b.tag)e(b),g?y(f,b.stateNode):w(f,b.stateNode);else if(4===b.tag?f=b.stateNode.containerInfo:d(b),null!==b.child){b.child["return"]=b;b=b.child;continue}if(b===a)break;for(;null===b.sibling;){if(null===b["return"]||b["return"]===a)return;b=b["return"];4===b.tag&&(c=!1)}b.sibling["return"]= 145 | b["return"];b=b.sibling}}var h=a.getPublicInstance,k=a.mutation;a=a.persistence;k||(a?l("235"):l("236"));var m=k.commitMount,D=k.commitUpdate,A=k.resetTextContent,v=k.commitTextUpdate,n=k.appendChild,L=k.appendChildToContainer,R=k.insertBefore,r=k.insertInContainerBefore,w=k.removeChild,y=k.removeChildFromContainer;return{commitResetTextContent:function(a){A(a.stateNode)},commitPlacement:function(a){a:{for(var b=a["return"];null!==b;){if(f(b)){var c=b;break a}b=b["return"]}l("160");c=void 0}var d= 146 | b=void 0;switch(c.tag){case 5:b=c.stateNode;d=!1;break;case 3:b=c.stateNode.containerInfo;d=!0;break;case 4:b=c.stateNode.containerInfo;d=!0;break;default:l("161")}c.effectTag&16&&(A(b),c.effectTag&=-17);a:b:for(c=a;;){for(;null===c.sibling;){if(null===c["return"]||f(c["return"])){c=null;break a}c=c["return"]}c.sibling["return"]=c["return"];for(c=c.sibling;5!==c.tag&&6!==c.tag;){if(c.effectTag&2)continue b;if(null===c.child||4===c.tag)continue b;else c.child["return"]=c,c=c.child}if(!(c.effectTag& 147 | 2)){c=c.stateNode;break a}}for(var e=a;;){if(5===e.tag||6===e.tag)c?d?r(b,e.stateNode,c):R(b,e.stateNode,c):d?L(b,e.stateNode):n(b,e.stateNode);else if(4!==e.tag&&null!==e.child){e.child["return"]=e;e=e.child;continue}if(e===a)break;for(;null===e.sibling;){if(null===e["return"]||e["return"]===a)return;e=e["return"]}e.sibling["return"]=e["return"];e=e.sibling}},commitDeletion:function(a){g(a);a["return"]=null;a.child=null;a.alternate&&(a.alternate.child=null,a.alternate["return"]=null)},commitWork:function(a, 148 | b){switch(b.tag){case 2:break;case 5:var c=b.stateNode;if(null!=c){var d=b.memoizedProps;a=null!==a?a.memoizedProps:d;var e=b.type,f=b.updateQueue;b.updateQueue=null;null!==f&&D(c,f,e,a,d,b)}break;case 6:null===b.stateNode?l("162"):void 0;c=b.memoizedProps;v(b.stateNode,null!==a?a.memoizedProps:c,c);break;case 3:break;default:l("163")}},commitLifeCycles:function(a,b){switch(b.tag){case 2:var c=b.stateNode;if(b.effectTag&4)if(null===a)c.props=b.memoizedProps,c.state=b.memoizedState,c.componentDidMount(); 149 | else{var d=a.memoizedProps;a=a.memoizedState;c.props=b.memoizedProps;c.state=b.memoizedState;c.componentDidUpdate(d,a)}b=b.updateQueue;null!==b&&je(b,c);break;case 3:c=b.updateQueue;null!==c&&je(c,null!==b.child?b.child.stateNode:null);break;case 5:c=b.stateNode;null===a&&b.effectTag&4&&m(c,b.type,b.memoizedProps,b);break;case 6:break;case 4:break;default:l("163")}},commitAttachRef:function(a){var b=a.ref;if(null!==b){var c=a.stateNode;switch(a.tag){case 5:b(h(c));break;default:b(c)}}},commitDetachRef:function(a){a= 150 | a.ref;null!==a&&a(null)}}},la={},eg=function(a){function b(a){a===la?l("174"):void 0;return a}var c=a.getChildHostContext,d=a.getRootHostContext,e={current:la},f={current:la},g={current:la};return{getHostContext:function(){return b(e.current)},getRootHostContainer:function(){return b(g.current)},popHostContainer:function(a){I(e,a);I(f,a);I(g,a)},popHostContext:function(a){f.current===a&&(I(e,a),I(f,a))},pushHostContainer:function(a,b){M(g,b,a);b=d(b);M(f,a,a);M(e,b,a)},pushHostContext:function(a){var d= 151 | b(g.current),h=b(e.current);d=c(h,a.type,d);h!==d&&(M(f,a,a),M(e,d,a))},resetHostContainer:function(){e.current=la;g.current=la}}},fg=function(a){function b(a,b){var c=new Q(5,null,0);c.type="DELETED";c.stateNode=b;c["return"]=a;c.effectTag=8;null!==a.lastEffect?(a.lastEffect.nextEffect=c,a.lastEffect=c):a.firstEffect=a.lastEffect=c}function c(a,b){switch(a.tag){case 5:return b=f(b,a.type,a.pendingProps),null!==b?(a.stateNode=b,!0):!1;case 6:return b=g(b,a.pendingProps),null!==b?(a.stateNode=b,!0): 152 | !1;default:return!1}}function d(a){for(a=a["return"];null!==a&&5!==a.tag&&3!==a.tag;)a=a["return"];A=a}var e=a.shouldSetTextContent;a=a.hydration;if(!a)return{enterHydrationState:function(){return!1},resetHydrationState:function(){},tryToClaimNextHydratableInstance:function(){},prepareToHydrateHostInstance:function(){l("175")},prepareToHydrateHostTextInstance:function(){l("176")},popHydrationState:function(a){return!1}};var f=a.canHydrateInstance,g=a.canHydrateTextInstance,h=a.getNextHydratableSibling, 153 | k=a.getFirstHydratableChild,m=a.hydrateInstance,D=a.hydrateTextInstance,A=null,v=null,n=!1;return{enterHydrationState:function(a){v=k(a.stateNode.containerInfo);A=a;return n=!0},resetHydrationState:function(){v=A=null;n=!1},tryToClaimNextHydratableInstance:function(a){if(n){var d=v;if(d){if(!c(a,d)){d=h(d);if(!d||!c(a,d)){a.effectTag|=2;n=!1;A=a;return}b(A,v)}A=a;v=k(d)}else a.effectTag|=2,n=!1,A=a}},prepareToHydrateHostInstance:function(a,b,c){b=m(a.stateNode,a.type,a.memoizedProps,b,c,a);a.updateQueue= 154 | b;return null!==b?!0:!1},prepareToHydrateHostTextInstance:function(a){return D(a.stateNode,a.memoizedProps,a)},popHydrationState:function(a){if(a!==A)return!1;if(!n)return d(a),n=!0,!1;var c=a.type;if(5!==a.tag||"head"!==c&&"body"!==c&&!e(c,a.memoizedProps))for(c=v;c;)b(a,c),c=h(c);d(a);v=A?h(a.stateNode):null;return!0}}},gg=function(a){function b(a){X=Ba=!0;var b=a.stateNode;b.current===a?l("177"):void 0;b.isReadyForCommit=!1;bb.current=null;if(1g.expirationTime)&&(f=g.expirationTime),g=g.sibling;e.expirationTime=f}if(null!== 158 | b)return b;null!==c&&(null===c.firstEffect&&(c.firstEffect=a.firstEffect),null!==a.lastEffect&&(null!==c.lastEffect&&(c.lastEffect.nextEffect=a.firstEffect),c.lastEffect=a.lastEffect),1a))if(F<=ha)for(;null!==B;)B=k(B)?e(B):d(B);else for(;null!==B&&!z();)B=k(B)?e(B):d(B)}else if(!(0===F||F>a))if(F<=ha)for(;null!==B;)B=d(B);else for(;null!==B&&!z();)B=d(B)}function g(a,b){Ba?l("243"):void 0;Ba=!0;a.isReadyForCommit=!1;if(a!==Ja||b!==F||null===B){for(;-1b)a.expirationTime=b;null!==a.alternate&&(0===a.alternate.expirationTime||a.alternate.expirationTime>b)&&(a.alternate.expirationTime=b);if(null=== 164 | a["return"])if(3===a.tag){c=a.stateNode;!Ba&&c===Ja&&bGa&&l("185");if(null===d.nextScheduledRoot)d.remainingExpirationTime=e,null===N?(Ka=N=d,d.nextScheduledRoot=d):(N=N.nextScheduledRoot=d,N.nextScheduledRoot=Ka);else{var f=d.remainingExpirationTime;if(0===f||eZ)return;xa(la)}var b=ba()-qa;Z=a;la=wa(H,{timeout:10*(a-2)-b})}function E(){var a=0,b=null;if(null!==N)for(var c=N,d=Ka;null!==d;){var e=d.remainingExpirationTime;if(0===e){null===c||null===N?l("244"):void 0;if(d===d.nextScheduledRoot){Ka=N=d.nextScheduledRoot=null;break}else if(d===Ka)Ka=e=d.nextScheduledRoot,N.nextScheduledRoot=e,d.nextScheduledRoot=null;else if(d===N){N=c;N.nextScheduledRoot=Ka;d.nextScheduledRoot=null;break}else c.nextScheduledRoot=d.nextScheduledRoot, 166 | d.nextScheduledRoot=null;d=c.nextScheduledRoot}else{if(0===a||eHa?!1:oa=!0}function G(a){null===Ea?l("246"):void 0;Ea.remainingExpirationTime=0;da||(da=!0,pa=a)}var q=eg(a),p=fg(a),I=q.popHostContainer,O=q.popHostContext,P=q.resetHostContainer,M=bg(a,q,p,v,A),Q=M.beginWork,T=M.beginFailedWork, 168 | Y=cg(a,q,p).completeWork;q=dg(a,h);var aa=q.commitResetTextContent,V=q.commitPlacement,na=q.commitDeletion,ca=q.commitWork,sa=q.commitLifeCycles,ta=q.commitAttachRef,va=q.commitDetachRef,ba=a.now,wa=a.scheduleDeferredCallback,xa=a.cancelDeferredCallback,ya=a.useSyncScheduling,za=a.prepareForCommit,Aa=a.resetAfterCommit,qa=ba(),ha=2,Ca=0,Ba=!1,B=null,Ja=null,F=0,u=null,S=null,Ia=null,ua=null,ma=null,U=!1,X=!1,ka=!1,Ka=null,N=null,Z=0,la=-1,Na=!1,Ea=null,Fa=0,oa=!1,da=!1,pa=null,W=null,Da=!1,ea=!1, 169 | Ga=1E3,fa=0,Ha=1;return{computeAsyncExpiration:n,computeExpirationForFiber:A,scheduleWork:v,batchedUpdates:function(a,b){var c=Da;Da=!0;try{return a(b)}finally{(Da=c)||Na||x(1,null)}},unbatchedUpdates:function(a){if(Da&&!ea){ea=!0;try{return a()}finally{ea=!1}}return a()},flushSync:function(a){var b=Da;Da=!0;try{a:{var c=Ca;Ca=1;try{var d=a();break a}finally{Ca=c}d=void 0}return d}finally{Da=b,Na?l("187"):void 0,x(1,null)}},deferredUpdates:function(a){var b=Ca;Ca=n();try{return a()}finally{Ca=b}}}}, 170 | Te=function(a){function b(a){a=wf(a);return null===a?null:a.stateNode}var c=a.getPublicInstance;a=gg(a);var d=a.computeAsyncExpiration,e=a.computeExpirationForFiber,f=a.scheduleWork;return{createContainer:function(a,b){var c=new Q(3,null,0);a={current:c,containerInfo:a,pendingChildren:null,remainingExpirationTime:0,isReadyForCommit:!1,finishedWork:null,context:null,pendingContext:null,hydrate:b,nextScheduledRoot:null};return c.stateNode=a},updateContainer:function(a,b,c,m){var g=b.current;if(c){c= 171 | c._reactInternalFiber;var h;b:{2===Qa(c)&&2===c.tag?void 0:l("170");for(h=c;3!==h.tag;){if(Ua(h)){h=h.stateNode.__reactInternalMemoizedMergedChildContext;break b}(h=h["return"])?void 0:l("171")}h=h.stateNode.context}c=Ua(c)?ce(c,h):h}else c=ja;null===b.context?b.context=c:b.pendingContext=c;b=m;b=void 0===b?null:b;m=null!=a&&null!=a.type&&null!=a.type.prototype&&!0===a.type.prototype.unstable_isAsyncReactComponent?d():e(g);Bb(g,{expirationTime:m,partialState:{element:a},callback:b,isReplace:!1,isForced:!1, 172 | nextCallback:null,next:null});f(g,m)},batchedUpdates:a.batchedUpdates,unbatchedUpdates:a.unbatchedUpdates,deferredUpdates:a.deferredUpdates,flushSync:a.flushSync,getPublicRootInstance:function(a){a=a.current;if(!a.child)return null;switch(a.child.tag){case 5:return c(a.child.stateNode);default:return a.child.stateNode}},findHostInstance:b,findHostInstanceWithNoPortals:function(a){a=xf(a);return null===a?null:a.stateNode},injectIntoDevTools:function(a){var c=a.findFiberByHostInstance;return Af(C({}, 173 | a,{findHostInstanceByFiber:function(a){return b(a)},findFiberByHostInstance:function(a){return c?c(a):null}}))}}},Ue=Object.freeze({default:Te}),Sc=Ue&&Te||Ue,hg=Sc["default"]?Sc["default"]:Sc,Ve="object"===typeof performance&&"function"===typeof performance.now,Nb=void 0;Nb=Ve?function(){return performance.now()}:function(){return Date.now()};var Ob=void 0,Pb=void 0;if(P.canUseDOM)if("function"!==typeof requestIdleCallback||"function"!==typeof cancelIdleCallback){var Qb=null,Rb=!1,eb=-1,fb=!1,gb= 174 | 0,Sb=33,hb=33;var Tc=Ve?{didTimeout:!1,timeRemaining:function(){var a=gb-performance.now();return 0=gb-a)if(-1!==eb&&eb<=a)Tc.didTimeout=!0;else{fb||(fb=!0,requestAnimationFrame(Xe));return}else Tc.didTimeout=!1;eb=-1;a=Qb;Qb=null;null!==a&&a(Tc)}},!1); 175 | var Xe=function(a){fb=!1;var b=a-gb+hb;bb&&(b=8),hb=bd&&(e=d,d=a,a=e);e=Qd(c,a);var f=Qd(c,d);if(e&&f&&(1!==b.rangeCount||b.anchorNode!==e.node||b.anchorOffset!==e.offset||b.focusNode!==f.node|| 185 | b.focusOffset!==f.offset)){var g=document.createRange();g.setStart(e.node,e.offset);b.removeAllRanges();a>d?(b.addRange(g),b.extend(f.node,f.offset)):(g.setEnd(f.node,f.offset),b.addRange(g))}}b=[];for(a=c;a=a.parentNode;)1===a.nodeType&&b.push({element:a,left:a.scrollLeft,top:a.scrollTop});try{c.focus()}catch(h){}for(c=0;c