File: //opt/LibreChat/node_modules/react-devtools-inline/dist/frontend.js
module.exports =
/******/ (function(modules) { // webpackBootstrap
/******/ // The module cache
/******/ var installedModules = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/
/******/ // Check if module is in cache
/******/ if(installedModules[moduleId]) {
/******/ return installedModules[moduleId].exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = installedModules[moduleId] = {
/******/ i: moduleId,
/******/ l: false,
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/ // Flag the module as loaded
/******/ module.l = true;
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = modules;
/******/
/******/ // expose the module cache
/******/ __webpack_require__.c = installedModules;
/******/
/******/ // define getter function for harmony exports
/******/ __webpack_require__.d = function(exports, name, getter) {
/******/ if(!__webpack_require__.o(exports, name)) {
/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter });
/******/ }
/******/ };
/******/
/******/ // define __esModule on exports
/******/ __webpack_require__.r = function(exports) {
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ }
/******/ Object.defineProperty(exports, '__esModule', { value: true });
/******/ };
/******/
/******/ // create a fake namespace object
/******/ // mode & 1: value is a module id, require it
/******/ // mode & 2: merge all properties of value into the ns
/******/ // mode & 4: return value when already ns object
/******/ // mode & 8|1: behave like require
/******/ __webpack_require__.t = function(value, mode) {
/******/ if(mode & 1) value = __webpack_require__(value);
/******/ if(mode & 8) return value;
/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
/******/ var ns = Object.create(null);
/******/ __webpack_require__.r(ns);
/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value });
/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
/******/ return ns;
/******/ };
/******/
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ __webpack_require__.n = function(module) {
/******/ var getter = module && module.__esModule ?
/******/ function getDefault() { return module['default']; } :
/******/ function getModuleExports() { return module; };
/******/ __webpack_require__.d(getter, 'a', getter);
/******/ return getter;
/******/ };
/******/
/******/ // Object.prototype.hasOwnProperty.call
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
/******/
/******/ // __webpack_public_path__
/******/ __webpack_require__.p = "";
/******/
/******/
/******/ // Load entry module and return exports
/******/ return __webpack_require__(__webpack_require__.s = "./src/frontend.js");
/******/ })
/************************************************************************/
/******/ ({
/***/ "../../node_modules/@babel/runtime/helpers/esm/assertThisInitialized.js":
/*!***********************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/@babel/runtime/helpers/esm/assertThisInitialized.js ***!
\***********************************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return _assertThisInitialized; });
function _assertThisInitialized(self) {
if (self === void 0) {
throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
}
return self;
}
/***/ }),
/***/ "../../node_modules/@babel/runtime/helpers/esm/extends.js":
/*!*********************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/@babel/runtime/helpers/esm/extends.js ***!
\*********************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return _extends; });
function _extends() {
_extends = Object.assign || function (target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i];
for (var key in source) {
if (Object.prototype.hasOwnProperty.call(source, key)) {
target[key] = source[key];
}
}
}
return target;
};
return _extends.apply(this, arguments);
}
/***/ }),
/***/ "../../node_modules/@babel/runtime/helpers/esm/inheritsLoose.js":
/*!***************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/@babel/runtime/helpers/esm/inheritsLoose.js ***!
\***************************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return _inheritsLoose; });
function _inheritsLoose(subClass, superClass) {
subClass.prototype = Object.create(superClass.prototype);
subClass.prototype.constructor = subClass;
subClass.__proto__ = superClass;
}
/***/ }),
/***/ "../../node_modules/@babel/runtime/helpers/esm/objectWithoutPropertiesLoose.js":
/*!******************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/@babel/runtime/helpers/esm/objectWithoutPropertiesLoose.js ***!
\******************************************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return _objectWithoutPropertiesLoose; });
function _objectWithoutPropertiesLoose(source, excluded) {
if (source == null) return {};
var target = {};
var sourceKeys = Object.keys(source);
var key, i;
for (i = 0; i < sourceKeys.length; i++) {
key = sourceKeys[i];
if (excluded.indexOf(key) >= 0) continue;
target[key] = source[key];
}
return target;
}
/***/ }),
/***/ "../../node_modules/@reach/auto-id/es/index.js":
/*!**********************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/@reach/auto-id/es/index.js ***!
\**********************************************************************************/
/*! exports provided: useId */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "useId", function() { return useId; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
// Could use UUID but if we hit 9,007,199,254,740,991 unique components over
// the lifetime of the app before it gets reloaded, I mean ... come on.
// I don't even know what xillion that is.
// /me googles
// Oh duh, quadrillion. Nine quadrillion components. I think we're okay.
var id = 0;
var genId = function genId() {
return ++id;
};
var useId = function useId() {
var _useState = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(null),
id = _useState[0],
setId = _useState[1];
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
return setId(genId());
}, []);
return id;
};
/***/ }),
/***/ "../../node_modules/@reach/component-component/es/index.js":
/*!**********************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/@reach/component-component/es/index.js ***!
\**********************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! prop-types */ "../../node_modules/prop-types/index.js");
/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_1__);
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _classCallCheck(instance, Constructor) {
if (!(instance instanceof Constructor)) {
throw new TypeError("Cannot call a class as a function");
}
}
function _possibleConstructorReturn(self, call) {
if (!self) {
throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
}
return call && (_typeof(call) === "object" || typeof call === "function") ? call : self;
}
function _inherits(subClass, superClass) {
if (typeof superClass !== "function" && superClass !== null) {
throw new TypeError("Super expression must either be null or a function, not " + _typeof(superClass));
}
subClass.prototype = Object.create(superClass && superClass.prototype, {
constructor: {
value: subClass,
enumerable: false,
writable: true,
configurable: true
}
});
if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;
}
function _objectWithoutProperties(obj, keys) {
var target = {};
for (var i in obj) {
if (keys.indexOf(i) >= 0) continue;
if (!Object.prototype.hasOwnProperty.call(obj, i)) continue;
target[i] = obj[i];
}
return target;
}
var cleanProps = function cleanProps(props) {
var initialState = props.initialState,
getInitialState = props.getInitialState,
refs = props.refs,
getRefs = props.getRefs,
didMount = props.didMount,
didUpdate = props.didUpdate,
willUnmount = props.willUnmount,
getSnapshotBeforeUpdate = props.getSnapshotBeforeUpdate,
shouldUpdate = props.shouldUpdate,
render = props.render,
rest = _objectWithoutProperties(props, ["initialState", "getInitialState", "refs", "getRefs", "didMount", "didUpdate", "willUnmount", "getSnapshotBeforeUpdate", "shouldUpdate", "render"]);
return rest;
};
var Component = function (_React$Component) {
_inherits(Component, _React$Component);
function Component() {
var _temp, _this, _ret;
_classCallCheck(this, Component);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, _React$Component.call.apply(_React$Component, [this].concat(args))), _this), _initialiseProps.call(_this), _temp), _possibleConstructorReturn(_this, _ret);
}
Component.prototype.getArgs = function getArgs() {
var state = this.state,
props = this.props,
setState = this._setState,
forceUpdate = this._forceUpdate,
refs = this._refs;
return {
state: state,
props: cleanProps(props),
refs: refs,
setState: setState,
forceUpdate: forceUpdate
};
};
Component.prototype.componentDidMount = function componentDidMount() {
if (this.props.didMount) this.props.didMount(this.getArgs());
};
Component.prototype.shouldComponentUpdate = function shouldComponentUpdate(nextProps, nextState) {
if (this.props.shouldUpdate) return this.props.shouldUpdate({
props: this.props,
state: this.state,
nextProps: cleanProps(nextProps),
nextState: nextState
});else return true;
};
Component.prototype.componentWillUnmount = function componentWillUnmount() {
if (this.props.willUnmount) this.props.willUnmount({
state: this.state,
props: cleanProps(this.props),
refs: this._refs
});
};
Component.prototype.componentDidUpdate = function componentDidUpdate(prevProps, prevState, snapshot) {
if (this.props.didUpdate) this.props.didUpdate(Object.assign(this.getArgs(), {
prevProps: cleanProps(prevProps),
prevState: prevState
}), snapshot);
};
Component.prototype.getSnapshotBeforeUpdate = function getSnapshotBeforeUpdate(prevProps, prevState) {
if (this.props.getSnapshotBeforeUpdate) {
return this.props.getSnapshotBeforeUpdate(Object.assign(this.getArgs(), {
prevProps: cleanProps(prevProps),
prevState: prevState
}));
} else {
return null;
}
};
Component.prototype.render = function render() {
var _props = this.props,
children = _props.children,
render = _props.render;
return render ? render(this.getArgs()) : typeof children === "function" ? children(this.getArgs()) : children || null;
};
return Component;
}(react__WEBPACK_IMPORTED_MODULE_0___default.a.Component);
Component.defaultProps = {
getInitialState: function getInitialState() {},
getRefs: function getRefs() {
return {};
}
};
var _initialiseProps = function _initialiseProps() {
var _this2 = this;
this.state = this.props.initialState || this.props.getInitialState(this.props);
this._refs = this.props.refs || this.props.getRefs(this.getArgs());
this._setState = function () {
return _this2.setState.apply(_this2, arguments);
};
this._forceUpdate = function () {
return _this2.forceUpdate.apply(_this2, arguments);
};
};
false ? undefined : void 0;
/* harmony default export */ __webpack_exports__["default"] = (Component);
/***/ }),
/***/ "../../node_modules/@reach/menu-button/es/index.js":
/*!**************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/@reach/menu-button/es/index.js ***!
\**************************************************************************************/
/*! exports provided: Menu, MenuList, MenuButton, MenuLink, MenuItem */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "Menu", function() { return Menu; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MenuList", function() { return MenuList; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MenuButton", function() { return MenuButton; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MenuLink", function() { return MenuLink; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MenuItem", function() { return MenuItem; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _reach_portal__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @reach/portal */ "../../node_modules/@reach/portal/es/index.js");
/* harmony import */ var _reach_rect__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @reach/rect */ "../../node_modules/@reach/rect/es/index.js");
/* harmony import */ var _reach_window_size__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @reach/window-size */ "../../node_modules/@reach/window-size/es/index.js");
/* harmony import */ var _reach_component_component__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @reach/component-component */ "../../node_modules/@reach/component-component/es/index.js");
/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! prop-types */ "../../node_modules/prop-types/index.js");
/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _reach_utils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @reach/utils */ "../../node_modules/@reach/utils/es/index.js");
var _extends = Object.assign || function (target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i];
for (var key in source) {
if (Object.prototype.hasOwnProperty.call(source, key)) {
target[key] = source[key];
}
}
}
return target;
};
function _objectWithoutProperties(obj, keys) {
var target = {};
for (var i in obj) {
if (keys.indexOf(i) >= 0) continue;
if (!Object.prototype.hasOwnProperty.call(obj, i)) continue;
target[i] = obj[i];
}
return target;
}
// TODO: add the mousedown/drag/mouseup to select of native menus, will
// also help w/ remove the menu button tooltip hide-flash.
// TODO: add type-to-highlight like native menus
var _createContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["createContext"])(),
Provider = _createContext.Provider,
Consumer = _createContext.Consumer;
var checkIfAppManagedFocus = function checkIfAppManagedFocus(_ref) {
var refs = _ref.refs,
state = _ref.state,
prevState = _ref.prevState;
if (!state.isOpen && prevState.isOpen) {
return !refs.menu.contains(document.activeElement);
}
return false;
};
var manageFocusOnUpdate = function manageFocusOnUpdate(_ref2, appManagedFocus) {
var refs = _ref2.refs,
state = _ref2.state,
prevState = _ref2.prevState;
if (state.isOpen && !prevState.isOpen) {
window.__REACH_DISABLE_TOOLTIPS = true;
if (state.selectionIndex !== -1) {
// haven't measured the popover yet, give it a frame otherwise
// we'll scroll to the bottom of the page >.<
requestAnimationFrame(function () {
refs.items[state.selectionIndex].focus();
});
} else {
refs.menu.focus();
}
} else if (!state.isOpen && prevState.isOpen) {
if (!appManagedFocus) {
refs.button.focus();
} // we want to ignore the immediate focus of a tooltip so it doesn't pop
// up again when the menu closes, only pops up when focus returns again
// to the tooltip (like native OS tooltips)
window.__REACH_DISABLE_TOOLTIPS = false;
} else if (state.selectionIndex !== prevState.selectionIndex) {
if (state.selectionIndex === -1) {
// clear highlight when mousing over non-menu items, but focus the menu
// so the the keyboard will work after a mouseover
refs.menu.focus();
} else {
refs.items[state.selectionIndex].focus();
}
}
};
var openAtFirstItem = function openAtFirstItem(state) {
return {
isOpen: true,
selectionIndex: 0
};
};
var close = function close(state) {
return {
isOpen: false,
selectionIndex: -1,
closingWithClick: false
};
};
var selectItemAtIndex = function selectItemAtIndex(index) {
return function (state) {
return {
selectionIndex: index
};
};
};
var genId = function genId(prefix) {
return prefix + "-" + Math.random().toString(32).substr(2, 8);
}; ////////////////////////////////////////////////////////////////////////
var getMenuRefs = function getMenuRefs() {
return {
button: null,
menu: null,
items: []
};
};
var getInitialMenuState = function getInitialMenuState() {
return {
isOpen: false,
buttonRect: undefined,
selectionIndex: -1,
closingWithClick: false,
buttonId: genId("button")
};
};
var checkIfStylesIncluded = function checkIfStylesIncluded() {
return Object(_reach_utils__WEBPACK_IMPORTED_MODULE_6__["checkStyles"])("menu-button");
};
var Menu = function Menu(_ref3) {
var children = _ref3.children;
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_reach_component_component__WEBPACK_IMPORTED_MODULE_4__["default"], {
getRefs: getMenuRefs,
getInitialState: getInitialMenuState,
didMount: checkIfStylesIncluded,
didUpdate: manageFocusOnUpdate,
getSnapshotBeforeUpdate: checkIfAppManagedFocus
}, function (context) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(Provider, {
value: context
}, typeof children === "function" ? children({
isOpen: context.state.isOpen
}) : children);
});
};
false ? undefined : void 0; ////////////////////////////////////////////////////////////////////////
var MenuButton = react__WEBPACK_IMPORTED_MODULE_0___default.a.forwardRef(function (_ref4, _ref7) {
var onClick = _ref4.onClick,
onKeyDown = _ref4.onKeyDown,
onMouseDown = _ref4.onMouseDown,
props = _objectWithoutProperties(_ref4, ["onClick", "onKeyDown", "onMouseDown"]);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(Consumer, null, function (_ref5) {
var refs = _ref5.refs,
state = _ref5.state,
setState = _ref5.setState;
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_reach_rect__WEBPACK_IMPORTED_MODULE_2__["default"], {
observe: state.isOpen,
onChange: function onChange(buttonRect) {
return setState({
buttonRect: buttonRect
});
}
}, function (_ref6) {
var rectRef = _ref6.ref;
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("button", _extends({
id: state.buttonId,
"aria-haspopup": "menu",
"aria-expanded": state.isOpen,
"data-reach-menu-button": true,
type: "button",
ref: function ref(node) {
rectRef(node);
Object(_reach_utils__WEBPACK_IMPORTED_MODULE_6__["assignRef"])(_ref7, node);
refs.button = node;
},
onMouseDown: Object(_reach_utils__WEBPACK_IMPORTED_MODULE_6__["wrapEvent"])(onMouseDown, function () {
if (state.isOpen) {
setState({
closingWithClick: true
});
}
}),
onClick: Object(_reach_utils__WEBPACK_IMPORTED_MODULE_6__["wrapEvent"])(onClick, function () {
if (state.isOpen) {
setState(close);
} else {
setState(openAtFirstItem);
}
}),
onKeyDown: Object(_reach_utils__WEBPACK_IMPORTED_MODULE_6__["wrapEvent"])(onKeyDown, function (event) {
if (event.key === "ArrowDown") {
event.preventDefault(); // prevent scroll
setState(openAtFirstItem);
} else if (event.key === "ArrowUp") {
event.preventDefault(); // prevent scroll
setState(openAtFirstItem);
}
})
}, props));
});
});
});
MenuButton.propTypes = {
onClick: prop_types__WEBPACK_IMPORTED_MODULE_5__["func"],
onKeyDown: prop_types__WEBPACK_IMPORTED_MODULE_5__["func"],
children: prop_types__WEBPACK_IMPORTED_MODULE_5__["node"]
};
var MenuItem = react__WEBPACK_IMPORTED_MODULE_0___default.a.forwardRef(function (_ref8, _ref9) {
var onSelect = _ref8.onSelect,
onClick = _ref8.onClick,
_ref8$role = _ref8.role,
role = _ref8$role === undefined ? "menuitem" : _ref8$role,
state = _ref8.state,
setState = _ref8.setState,
index = _ref8.index,
onKeyDown = _ref8.onKeyDown,
onMouseMove = _ref8.onMouseMove,
onMouseLeave = _ref8.onMouseLeave,
_ref = _ref8._ref,
rest = _objectWithoutProperties(_ref8, ["onSelect", "onClick", "role", "state", "setState", "index", "onKeyDown", "onMouseMove", "onMouseLeave", "_ref"]);
var isSelected = index === state.selectionIndex;
var select = function select() {
onSelect();
setState(close);
};
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", _extends({}, rest, {
ref: function ref(node) {
Object(_reach_utils__WEBPACK_IMPORTED_MODULE_6__["assignRef"])(_ref9, node);
Object(_reach_utils__WEBPACK_IMPORTED_MODULE_6__["assignRef"])(_ref, node);
},
"data-reach-menu-item": role === "menuitem" ? true : undefined,
role: role,
tabIndex: "-1",
"data-selected": role === "menuitem" && isSelected ? true : undefined,
onClick: Object(_reach_utils__WEBPACK_IMPORTED_MODULE_6__["wrapEvent"])(onClick, function (event) {
select();
}),
onKeyDown: Object(_reach_utils__WEBPACK_IMPORTED_MODULE_6__["wrapEvent"])(onKeyDown, function (event) {
if (event.key === "Enter") {
// prevent the button from being "clicked" by
// this "Enter" keydown
event.preventDefault();
select();
}
}),
onMouseMove: Object(_reach_utils__WEBPACK_IMPORTED_MODULE_6__["wrapEvent"])(onMouseMove, function (event) {
if (!isSelected) {
setState(selectItemAtIndex(index));
}
}),
onMouseLeave: Object(_reach_utils__WEBPACK_IMPORTED_MODULE_6__["wrapEvent"])(onMouseLeave, function (event) {
// clear out selection when mouse over a non-menu item child
setState({
selectionIndex: -1
});
})
}));
});
false ? undefined : void 0;
var k = function k() {}; ////////////////////////////////////////////////////////////////////////
var MenuLink = react__WEBPACK_IMPORTED_MODULE_0___default.a.forwardRef(function (_ref10, _ref11) {
var onKeyDown = _ref10.onKeyDown,
onClick = _ref10.onClick,
Comp = _ref10.component,
_ref10$as = _ref10.as,
AsComp = _ref10$as === undefined ? "a" : _ref10$as,
style = _ref10.style,
setState = _ref10.setState,
state = _ref10.state,
index = _ref10.index,
_ref = _ref10._ref,
props = _objectWithoutProperties(_ref10, ["onKeyDown", "onClick", "component", "as", "style", "setState", "state", "index", "_ref"]);
var Link = Comp || AsComp;
if (Comp) {
console.warn("[@reach/menu-button]: Please use the `as` prop instead of `component`.");
}
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(MenuItem, {
role: "none",
state: state,
setState: setState,
index: index,
onSelect: k,
_ref: k
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(Link, _extends({
role: "menuitem",
"data-reach-menu-item": true,
tabIndex: "-1",
"data-selected": index === state.selectionIndex ? true : undefined,
onClick: Object(_reach_utils__WEBPACK_IMPORTED_MODULE_6__["wrapEvent"])(onClick, function (event) {
setState(close);
}),
onKeyDown: Object(_reach_utils__WEBPACK_IMPORTED_MODULE_6__["wrapEvent"])(onKeyDown, function (event) {
if (event.key === "Enter") {
// prevent MenuItem's preventDefault from firing,
// allowing this link to work w/ the keyboard
event.stopPropagation();
}
}),
ref: function ref(node) {
Object(_reach_utils__WEBPACK_IMPORTED_MODULE_6__["assignRef"])(_ref, node);
Object(_reach_utils__WEBPACK_IMPORTED_MODULE_6__["assignRef"])(_ref11, node);
},
style: _extends({}, style)
}, props)));
});
false ? undefined : void 0; ///////////////////////////////////////////////////////////////////
var MenuList = react__WEBPACK_IMPORTED_MODULE_0___default.a.forwardRef(function (props, ref) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(Consumer, null, function (_ref12) {
var refs = _ref12.refs,
state = _ref12.state,
setState = _ref12.setState;
return state.isOpen && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_reach_portal__WEBPACK_IMPORTED_MODULE_1__["default"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_reach_window_size__WEBPACK_IMPORTED_MODULE_3__["default"], null, function () {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_reach_rect__WEBPACK_IMPORTED_MODULE_2__["default"], null, function (_ref13) {
var menuRect = _ref13.rect,
menuRef = _ref13.ref;
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
"data-reach-menu": true,
ref: menuRef,
style: getStyles(state.buttonRect, menuRect)
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(MenuListImpl, _extends({}, props, {
setState: setState,
state: state,
refs: refs,
ref: ref
})));
});
}));
});
});
MenuList.propTypes = {
children: prop_types__WEBPACK_IMPORTED_MODULE_5__["node"]
};
var focusableChildrenTypes = [MenuItem, MenuLink];
var isFocusableChildType = function isFocusableChildType(child) {
return focusableChildrenTypes.includes(child.type);
};
var getFocusableMenuChildren = function getFocusableMenuChildren(children) {
var focusable = [];
react__WEBPACK_IMPORTED_MODULE_0__["Children"].forEach(children, function (child) {
if (isFocusableChildType(child)) focusable.push(child);
});
return focusable;
};
var MenuListImpl = react__WEBPACK_IMPORTED_MODULE_0___default.a.forwardRef(function (_ref14, _ref15) {
var refs = _ref14.refs,
state = _ref14.state,
setState = _ref14.setState,
children = _ref14.children,
onKeyDown = _ref14.onKeyDown,
onBlur = _ref14.onBlur,
rest = _objectWithoutProperties(_ref14, ["refs", "state", "setState", "children", "onKeyDown", "onBlur"]);
var focusableChildren = getFocusableMenuChildren(children);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", _extends({
"data-reach-menu-list": true
}, rest, {
role: "menu",
"aria-labelledby": state.buttonId,
tabIndex: "-1",
ref: function ref(node) {
refs.menu = node;
Object(_reach_utils__WEBPACK_IMPORTED_MODULE_6__["assignRef"])(_ref15, node);
},
onBlur: function onBlur(event) {
if (!state.closingWithClick && !refs.menu.contains(event.relatedTarget)) {
setState(close);
}
},
onKeyDown: Object(_reach_utils__WEBPACK_IMPORTED_MODULE_6__["wrapEvent"])(onKeyDown, function (event) {
if (event.key === "Escape") {
setState(close);
} else if (event.key === "ArrowDown") {
event.preventDefault(); // prevent window scroll
var nextIndex = state.selectionIndex + 1;
if (nextIndex !== focusableChildren.length) {
setState({
selectionIndex: nextIndex
});
}
} else if (event.key === "ArrowUp") {
event.preventDefault(); // prevent window scroll
var _nextIndex = state.selectionIndex - 1;
if (_nextIndex !== -1) {
setState({
selectionIndex: _nextIndex
});
}
} else if (event.key === "Tab") {
event.preventDefault(); // prevent leaving
}
})
}), react__WEBPACK_IMPORTED_MODULE_0__["Children"].map(children, function (child, index) {
if (isFocusableChildType(child)) {
var focusIndex = focusableChildren.indexOf(child);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.cloneElement(child, {
setState: setState,
state: state,
index: focusIndex,
_ref: function _ref(node) {
return refs.items[focusIndex] = node;
}
});
}
return child;
}));
});
false ? undefined : void 0;
var getStyles = function getStyles(buttonRect, menuRect) {
var haventMeasuredButtonYet = !buttonRect;
if (haventMeasuredButtonYet) {
return {
opacity: 0
};
}
var haventMeasuredMenuYet = !menuRect;
var styles = {
left: buttonRect.left + window.pageXOffset + "px",
top: buttonRect.top + buttonRect.height + window.pageYOffset + "px"
};
if (haventMeasuredMenuYet) {
return _extends({}, styles, {
opacity: 0
});
}
if (buttonRect.width < 500) {
styles.minWidth = buttonRect.width;
}
var collisions = {
top: buttonRect.top - menuRect.height < 0,
right: window.innerWidth < buttonRect.left + menuRect.width,
bottom: window.innerHeight < buttonRect.top + menuRect.height,
left: buttonRect.left - menuRect.width < 0
};
var directionRight = collisions.right && !collisions.left;
var directionUp = collisions.bottom && !collisions.top;
return _extends({}, styles, {
left: directionRight ? buttonRect.right - menuRect.width + window.pageXOffset + "px" : buttonRect.left + window.pageXOffset + "px",
top: directionUp ? buttonRect.top - menuRect.height + window.pageYOffset + "px" : buttonRect.top + buttonRect.height + window.pageYOffset + "px"
});
};
/***/ }),
/***/ "../../node_modules/@reach/menu-button/styles.css":
/*!*************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/@reach/menu-button/styles.css ***!
\*************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../css-loader??ref--5-1!./styles.css */ "../../node_modules/css-loader/index.js?!../../node_modules/@reach/menu-button/styles.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../../node_modules/@reach/observe-rect/dist/index.m.js":
/*!*******************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/@reach/observe-rect/dist/index.m.js ***!
\*******************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
var t = ["width", "height", "top", "right", "bottom", "left"],
n = function n(_n, e) {
return void 0 === _n && (_n = {}), void 0 === e && (e = {}), t.some(function (t) {
return _n[t] !== e[t];
});
};
/* harmony default export */ __webpack_exports__["default"] = (function (t, e) {
var o,
i,
r = function r() {
var u = t.getBoundingClientRect();
n(u, o) && e(o = u), i = requestAnimationFrame(r);
};
return {
observe: r,
unobserve: function unobserve() {
cancelAnimationFrame(i);
}
};
});
;
/***/ }),
/***/ "../../node_modules/@reach/portal/es/index.js":
/*!*********************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/@reach/portal/es/index.js ***!
\*********************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ "react-dom");
/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _reach_component_component__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @reach/component-component */ "../../node_modules/@reach/component-component/es/index.js");
var Portal = function Portal(_ref) {
var children = _ref.children,
_ref$type = _ref.type,
type = _ref$type === undefined ? "reach-portal" : _ref$type;
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_reach_component_component__WEBPACK_IMPORTED_MODULE_2__["default"], {
getRefs: function getRefs() {
return {
mountNode: null,
portalNode: null
};
},
didMount: function didMount(_ref2) {
var refs = _ref2.refs,
forceUpdate = _ref2.forceUpdate; // It's possible that the content we are portal has, itself, been portaled.
// In that case, it's important to append to the correct document element.
var ownerDocument = refs.mountNode.ownerDocument;
refs.portalNode = ownerDocument.createElement(type);
ownerDocument.body.appendChild(refs.portalNode);
forceUpdate();
},
willUnmount: function willUnmount(_ref3) {
var portalNode = _ref3.refs.portalNode;
portalNode.ownerDocument.body.removeChild(portalNode);
},
render: function render(_ref4) {
var refs = _ref4.refs;
var portalNode = refs.portalNode;
if (!portalNode) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
ref: function ref(div) {
return refs.mountNode = div;
}
});
} else {
return Object(react_dom__WEBPACK_IMPORTED_MODULE_1__["createPortal"])(children, portalNode);
}
}
});
};
/* harmony default export */ __webpack_exports__["default"] = (Portal);
/***/ }),
/***/ "../../node_modules/@reach/rect/es/index.js":
/*!*******************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/@reach/rect/es/index.js ***!
\*******************************************************************************/
/*! exports provided: useRect, default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "useRect", function() { return useRect; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _reach_component_component__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @reach/component-component */ "../../node_modules/@reach/component-component/es/index.js");
/* harmony import */ var _reach_observe_rect__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @reach/observe-rect */ "../../node_modules/@reach/observe-rect/dist/index.m.js");
/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! prop-types */ "../../node_modules/prop-types/index.js");
/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_3__);
var _extends = Object.assign || function (target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i];
for (var key in source) {
if (Object.prototype.hasOwnProperty.call(source, key)) {
target[key] = source[key];
}
}
}
return target;
};
var render = function render(_ref) {
var refs = _ref.refs,
children = _ref.props.children,
rect = _ref.state.rect;
return children({
ref: function ref(node) {
return refs.node = node;
},
rect: rect
});
};
var didMount = function didMount(_ref2) {
var setState = _ref2.setState,
refs = _ref2.refs,
props = _ref2.props;
if (!refs.node) {
console.warn("You need to place the ref");
return;
}
refs.observer = Object(_reach_observe_rect__WEBPACK_IMPORTED_MODULE_2__["default"])(refs.node, function (rect) {
props.onChange && props.onChange(rect);
setState({
rect: rect
});
});
if (props.observe) {
refs.observer.observe();
}
};
var didUpdate = function didUpdate(_ref3) {
var refs = _ref3.refs,
props = _ref3.props,
prevProps = _ref3.prevProps;
if (props.observe && !prevProps.observe) {
refs.observer.observe();
} else if (!props.observe && prevProps.observe) {
refs.observer.unobserve();
}
};
var willUnmount = function willUnmount(_ref4) {
var refs = _ref4.refs;
refs.observer.unobserve();
};
var Rect = function Rect(props) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_reach_component_component__WEBPACK_IMPORTED_MODULE_1__["default"], _extends({}, props, {
refs: {
node: undefined,
observer: undefined
},
initialState: {
rect: undefined
},
didMount: didMount,
didUpdate: didUpdate,
willUnmount: willUnmount,
render: render
}));
};
false ? undefined : void 0;
Rect.defaultProps = {
observe: true
};
function useRect(nodeRef) {
var observe = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
var _useState = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(null),
rect = _useState[0],
setRect = _useState[1];
var observerRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(null);
Object(react__WEBPACK_IMPORTED_MODULE_0__["useLayoutEffect"])(function () {
if (!observerRef.current) {
observerRef.current = Object(_reach_observe_rect__WEBPACK_IMPORTED_MODULE_2__["default"])(nodeRef.current, setRect);
}
if (observe) {
observerRef.current.observe();
}
return function () {
return observerRef.current.unobserve();
};
}, [observe]);
return rect;
}
/* harmony default export */ __webpack_exports__["default"] = (Rect);
/***/ }),
/***/ "../../node_modules/@reach/tooltip/es/index.js":
/*!**********************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/@reach/tooltip/es/index.js ***!
\**********************************************************************************/
/*! exports provided: useTooltip, default, TooltipPopup */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "useTooltip", function() { return useTooltip; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return Tooltip; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "TooltipPopup", function() { return TooltipPopup; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _reach_auto_id__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @reach/auto-id */ "../../node_modules/@reach/auto-id/es/index.js");
/* harmony import */ var _reach_utils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @reach/utils */ "../../node_modules/@reach/utils/es/index.js");
/* harmony import */ var _reach_portal__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @reach/portal */ "../../node_modules/@reach/portal/es/index.js");
/* harmony import */ var _reach_visually_hidden__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @reach/visually-hidden */ "../../node_modules/@reach/visually-hidden/es/index.js");
/* harmony import */ var _reach_rect__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @reach/rect */ "../../node_modules/@reach/rect/es/index.js");
/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! prop-types */ "../../node_modules/prop-types/index.js");
/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_6__);
var _extends = Object.assign || function (target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i];
for (var key in source) {
if (Object.prototype.hasOwnProperty.call(source, key)) {
target[key] = source[key];
}
}
}
return target;
};
var _states;
function _objectWithoutProperties(obj, keys) {
var target = {};
for (var i in obj) {
if (keys.indexOf(i) >= 0) continue;
if (!Object.prototype.hasOwnProperty.call(obj, i)) continue;
target[i] = obj[i];
}
return target;
} ////////////////////////////////////////////////////////////////////////////////
// Welcome to @reach/tooltip!
//
// Quick definitions:
//
// - "on rest" or "rested on": describes when the element receives mouse hover
// after a short delay (and hopefully soon, touch longpress).
//
// - "activation": describes a mouse click, keyboard enter, or keyboard space.
//
// Only one tooltip can be visible at a time, so we use a global state chart to
// describe the various states and transitions between states that are
// possible. With the all the timeouts involved with tooltips it's important to
// "make impossible states impossible" with a state machine.
//
// It's also okay to use these module globals because you don't server render
// tooltips. None of the state is changed outside of user events.
//
// There are a few features that are important to understand.
//
// 1. Tooltips don't show up until the user has rested on one, we don't
// want tooltips popupping up as you move your mouse around the page.
//
// 2. Once any tooltip becomes visible, other tooltips nearby should skip
// resting and display immediately.
//
// 3. Tooltips stick around for a little bit after blur/mouseleave.
//
// TODO: Research longpress tooltips on Android, iOS
// - Probably want to position it by default above, since your thumb
// is below and would cover it
// - I'm thinking after longpress, display the tooltip and cancel any click
// events. Then on touchend, so they can read it display the tooltip for
// a little while longer in case their hand was obstructing the tooltip.
/* eslint-disable default-case */
////////////////////////////////////////////////////////////////////////////////
// ~The states~
// nothing goin' on
var IDLE = "idle"; // we're considering showing the tooltip, but we're gonna wait a sec
var FOCUSED = "focused"; // IT'S ON
var VISIBLE = "visible"; // Focus has left, but we want to keep it visible for a sec
var LEAVING_VISIBLE = "leavingVisible"; // The user clicked the tool, so we want to hide the thing, we can't just use
// IDLE because we need to ignore mousemove, etc.
var DISMISSED = "dismissed";
var chart = {
initial: IDLE,
states: (_states = {}, _states[IDLE] = {
enter: clearContextId,
on: {
mouseenter: FOCUSED,
focus: VISIBLE
}
}, _states[FOCUSED] = {
enter: startRestTimer,
leave: clearRestTimer,
on: {
mousemove: FOCUSED,
mouseleave: IDLE,
mousedown: DISMISSED,
blur: IDLE,
rest: VISIBLE
}
}, _states[VISIBLE] = {
on: {
focus: FOCUSED,
mouseenter: FOCUSED,
mouseleave: LEAVING_VISIBLE,
blur: LEAVING_VISIBLE,
mousedown: DISMISSED,
selectWithKeyboard: DISMISSED,
globalMouseMove: LEAVING_VISIBLE
}
}, _states[LEAVING_VISIBLE] = {
enter: startLeavingVisibleTimer,
leave: function leave() {
clearLeavingVisibleTimer();
clearContextId();
},
on: {
mouseenter: VISIBLE,
focus: VISIBLE,
timecomplete: IDLE
}
}, _states[DISMISSED] = {
leave: function leave() {
// allows us to come on back later w/o entering something else first
context.id = null;
},
on: {
mouseleave: IDLE,
blur: IDLE
}
}, _states)
}; // chart context allows us to persist some data around, in Tooltip all we use
// is the id of the current tooltip being interacted with.
var context = {
id: null
};
var state = chart.initial; ////////////////////////////////////////////////////////////////////////////////
// Finds the next state from the current state + action. If the chart doesn't
// describe that transition, it will throw.
//
// It also manages lifecycles of the machine, (enter/leave hooks on the state
// chart)
function transition(action, newContext) {
var stateDef = chart.states[state];
var nextState = stateDef.on[action]; // Really useful for debugging
// console.log({ action, state, nextState, contextId: context.id });
if (!nextState) {
throw new Error("Unknown state for action \"" + action + "\" from state \"" + state + "\"");
}
if (stateDef.leave) {
stateDef.leave();
}
if (newContext) {
context = newContext;
}
var nextDef = chart.states[nextState];
if (nextDef.enter) {
nextDef.enter();
}
state = nextState;
notify();
} ////////////////////////////////////////////////////////////////////////////////
// Subscriptions:
//
// We could require apps to render a <TooltipProvider> around the app and use
// React context to notify Tooltips of changes to our state machine, instead
// we manage subscriptions ourselves and simplify the Tooltip API.
//
// Maybe if default context could take a hook (instead of just a static value)
// that was rendered at the root for us, that'd be cool! But it doesn't.
var subscriptions = [];
function subscribe(fn) {
subscriptions.push(fn);
return function () {
subscriptions.splice(subscriptions.indexOf(fn), 1);
};
}
function notify() {
subscriptions.forEach(function (fn) {
return fn(state, context);
});
} ////////////////////////////////////////////////////////////////////////////////
// Timeouts:
// Manages when the user "rests" on an element. Keeps the interface from being
// flashing tooltips all the time as the user moves the mouse around the screen.
var restTimeout = void 0;
function startRestTimer() {
clearTimeout(restTimeout);
restTimeout = setTimeout(function () {
return transition("rest");
}, 100);
}
function clearRestTimer() {
clearTimeout(restTimeout);
} // Manages the delay to hide the tooltip after rest leaves.
var leavingVisibleTimer = void 0;
function startLeavingVisibleTimer() {
clearTimeout(leavingVisibleTimer);
leavingVisibleTimer = setTimeout(function () {
return transition("timecomplete");
}, 500);
}
function clearLeavingVisibleTimer() {
clearTimeout(leavingVisibleTimer);
} // allows us to come on back later w/o entering something else first after the
// user leaves or dismisses
function clearContextId() {
context.id = null;
} ////////////////////////////////////////////////////////////////////////////////
// THE HOOK! It's about time we got to the goods!
function useTooltip() {
var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
onMouseEnter = _ref.onMouseEnter,
onMouseMove = _ref.onMouseMove,
onMouseLeave = _ref.onMouseLeave,
onFocus = _ref.onFocus,
onBlur = _ref.onBlur,
onKeyDown = _ref.onKeyDown,
onMouseDown = _ref.onMouseDown,
ref = _ref.ref,
DEBUG_STYLE = _ref.DEBUG_STYLE;
var id = "tooltip:" + Object(_reach_auto_id__WEBPACK_IMPORTED_MODULE_1__["useId"])();
var _useState = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(DEBUG_STYLE ? true : context.id === id && state === VISIBLE),
isVisible = _useState[0],
setIsVisible = _useState[1]; // hopefully they always pass a ref if they ever pass one
var triggerRef = ref || Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])();
var triggerRect = Object(_reach_rect__WEBPACK_IMPORTED_MODULE_5__["useRect"])(triggerRef, isVisible);
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
return subscribe(function () {
if (context.id === id && (state === VISIBLE || state === LEAVING_VISIBLE)) {
setIsVisible(true);
} else {
setIsVisible(false);
}
});
}, [id]);
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
return Object(_reach_utils__WEBPACK_IMPORTED_MODULE_2__["checkStyles"])("tooltip");
});
var handleMouseEnter = function handleMouseEnter() {
switch (state) {
case IDLE:
case VISIBLE:
case LEAVING_VISIBLE:
{
transition("mouseenter", {
id: id
});
}
}
};
var handleMouseMove = function handleMouseMove() {
switch (state) {
case FOCUSED:
{
transition("mousemove", {
id: id
});
}
}
};
var handleFocus = function handleFocus(event) {
if (window.__REACH_DISABLE_TOOLTIPS) return;
switch (state) {
case IDLE:
case VISIBLE:
case LEAVING_VISIBLE:
{
transition("focus", {
id: id
});
}
}
};
var handleMouseLeave = function handleMouseLeave() {
switch (state) {
case FOCUSED:
case VISIBLE:
case DISMISSED:
{
transition("mouseleave");
}
}
};
var handleBlur = function handleBlur() {
// Allow quick click from one tool to another
if (context.id !== id) return;
switch (state) {
case FOCUSED:
case VISIBLE:
case DISMISSED:
{
transition("blur");
}
}
};
var handleMouseDown = function handleMouseDown() {
// Allow quick click from one tool to another
if (context.id !== id) return;
switch (state) {
case FOCUSED:
case VISIBLE:
{
transition("mousedown");
}
}
};
var handleKeyDown = function handleKeyDown(event) {
if (event.key === "Enter" || event.key === " ") {
switch (state) {
case VISIBLE:
{
transition("selectWithKeyboard");
}
}
}
};
var trigger = {
"aria-describedby": id,
"data-reach-tooltip-trigger": "",
ref: triggerRef,
onMouseEnter: Object(_reach_utils__WEBPACK_IMPORTED_MODULE_2__["wrapEvent"])(onMouseEnter, handleMouseEnter),
onMouseMove: Object(_reach_utils__WEBPACK_IMPORTED_MODULE_2__["wrapEvent"])(onMouseMove, handleMouseMove),
onFocus: Object(_reach_utils__WEBPACK_IMPORTED_MODULE_2__["wrapEvent"])(onFocus, handleFocus),
onBlur: Object(_reach_utils__WEBPACK_IMPORTED_MODULE_2__["wrapEvent"])(onFocus, handleBlur),
onMouseLeave: Object(_reach_utils__WEBPACK_IMPORTED_MODULE_2__["wrapEvent"])(onMouseLeave, handleMouseLeave),
onKeyDown: Object(_reach_utils__WEBPACK_IMPORTED_MODULE_2__["wrapEvent"])(onKeyDown, handleKeyDown),
onMouseDown: Object(_reach_utils__WEBPACK_IMPORTED_MODULE_2__["wrapEvent"])(onMouseDown, handleMouseDown)
};
var tooltip = {
id: id,
triggerRect: triggerRect,
isVisible: isVisible
};
return [trigger, tooltip, isVisible];
} ////////////////////////////////////////////////////////////////////////////////
function Tooltip(_ref2) {
var children = _ref2.children,
label = _ref2.label,
ariaLabel = _ref2.ariaLabel,
DEBUG_STYLE = _ref2.DEBUG_STYLE,
rest = _objectWithoutProperties(_ref2, ["children", "label", "ariaLabel", "DEBUG_STYLE"]);
var _useTooltip = useTooltip({
DEBUG_STYLE: DEBUG_STYLE
}),
trigger = _useTooltip[0],
tooltip = _useTooltip[1];
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, Object(react__WEBPACK_IMPORTED_MODULE_0__["cloneElement"])(react__WEBPACK_IMPORTED_MODULE_0__["Children"].only(children), trigger), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(TooltipPopup, _extends({
label: label,
ariaLabel: ariaLabel
}, tooltip, rest)));
}
false ? undefined : void 0; ////////////////////////////////////////////////////////////////////////////////
var TooltipPopup = Object(react__WEBPACK_IMPORTED_MODULE_0__["forwardRef"])(function TooltipPopup(_ref3, forwardRef) {
var label = _ref3.label,
ariaLabel = _ref3.ariaLabel,
position = _ref3.position,
isVisible = _ref3.isVisible,
id = _ref3.id,
triggerRect = _ref3.triggerRect,
rest = _objectWithoutProperties(_ref3, ["label", "ariaLabel", "position", "isVisible", "id", "triggerRect"]);
return isVisible ? react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_reach_portal__WEBPACK_IMPORTED_MODULE_3__["default"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(TooltipContent, _extends({
label: label,
ariaLabel: ariaLabel,
position: position,
isVisible: isVisible,
id: id,
triggerRect: triggerRect,
ref: forwardRef
}, rest))) : null;
});
false ? undefined : void 0; // Need a separate component so that useRect works inside the portal
var TooltipContent = Object(react__WEBPACK_IMPORTED_MODULE_0__["forwardRef"])(function TooltipContent(_ref4, forwardRef) {
var label = _ref4.label,
ariaLabel = _ref4.ariaLabel,
_ref4$position = _ref4.position,
position = _ref4$position === undefined ? positionDefault : _ref4$position,
isVisible = _ref4.isVisible,
id = _ref4.id,
triggerRect = _ref4.triggerRect,
style = _ref4.style,
rest = _objectWithoutProperties(_ref4, ["label", "ariaLabel", "position", "isVisible", "id", "triggerRect", "style"]);
var useAriaLabel = ariaLabel != null;
var tooltipRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])();
var tooltipRect = Object(_reach_rect__WEBPACK_IMPORTED_MODULE_5__["useRect"])(tooltipRef, isVisible);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", _extends({
"data-reach-tooltip": true,
role: useAriaLabel ? undefined : "tooltip",
id: useAriaLabel ? undefined : id,
children: label,
style: _extends({}, style, getStyles(position, triggerRect, tooltipRect)),
ref: function ref(node) {
tooltipRef.current = node;
if (forwardRef) forwardRef(node);
}
}, rest)), useAriaLabel && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_reach_visually_hidden__WEBPACK_IMPORTED_MODULE_4__["default"], {
role: "tooltip",
id: id
}, ariaLabel));
}); // feels awkward when it's perfectly aligned w/ the trigger
var OFFSET = 8;
var getStyles = function getStyles(position, triggerRect, tooltipRect) {
var haventMeasuredTooltipYet = !tooltipRect;
if (haventMeasuredTooltipYet) {
return {
visibility: "hidden"
};
}
return position(triggerRect, tooltipRect);
};
var positionDefault = function positionDefault(triggerRect, tooltipRect) {
var styles = {
left: triggerRect.left + window.pageXOffset + "px",
top: triggerRect.top + triggerRect.height + window.pageYOffset + "px"
};
var collisions = {
top: triggerRect.top - tooltipRect.height < 0,
right: window.innerWidth < triggerRect.left + tooltipRect.width,
bottom: window.innerHeight < triggerRect.bottom + tooltipRect.height + OFFSET,
left: triggerRect.left - tooltipRect.width < 0
};
var directionRight = collisions.right && !collisions.left;
var directionUp = collisions.bottom && !collisions.top;
return _extends({}, styles, {
left: directionRight ? triggerRect.right - tooltipRect.width + window.pageXOffset + "px" : triggerRect.left + window.pageXOffset + "px",
top: directionUp ? triggerRect.top - OFFSET - tooltipRect.height + window.pageYOffset + "px" : triggerRect.top + OFFSET + triggerRect.height + window.pageYOffset + "px"
});
};
/***/ }),
/***/ "../../node_modules/@reach/tooltip/styles.css":
/*!*********************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/@reach/tooltip/styles.css ***!
\*********************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../css-loader??ref--5-1!./styles.css */ "../../node_modules/css-loader/index.js?!../../node_modules/@reach/tooltip/styles.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../../node_modules/@reach/utils/es/index.js":
/*!********************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/@reach/utils/es/index.js ***!
\********************************************************************************/
/*! exports provided: checkStyles, wrapEvent, assignRef */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "checkStyles", function() { return checkStyles; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "wrapEvent", function() { return wrapEvent; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "assignRef", function() { return assignRef; });
var checkedPkgs = {};
var checkStyles = function checkStyles() {};
if (false) {}
var wrapEvent = function wrapEvent(theirHandler, ourHandler) {
return function (event) {
theirHandler && theirHandler(event);
if (!event.defaultPrevented) {
return ourHandler(event);
}
};
};
var assignRef = function assignRef(ref, value) {
if (ref == null) return;
if (typeof ref === "function") {
ref(value);
} else {
try {
ref.current = value;
} catch (error) {
throw new Error("Cannot assign value \"" + value + "\" to ref \"" + ref + "\"");
}
}
};
/***/ }),
/***/ "../../node_modules/@reach/visually-hidden/es/index.js":
/*!******************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/@reach/visually-hidden/es/index.js ***!
\******************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
var _extends = Object.assign || function (target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i];
for (var key in source) {
if (Object.prototype.hasOwnProperty.call(source, key)) {
target[key] = source[key];
}
}
}
return target;
};
var style = {
border: 0,
clip: "rect(0 0 0 0)",
height: "1px",
width: "1px",
margin: "-1px",
padding: 0,
overflow: "hidden",
position: "absolute"
};
/* harmony default export */ __webpack_exports__["default"] = (function (props) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", _extends({
style: style
}, props));
});
/***/ }),
/***/ "../../node_modules/@reach/window-size/es/index.js":
/*!**************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/@reach/window-size/es/index.js ***!
\**************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _reach_component_component__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @reach/component-component */ "../../node_modules/@reach/component-component/es/index.js");
/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! prop-types */ "../../node_modules/prop-types/index.js");
/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_2__);
var hasWindow = typeof window !== "undefined";
var didMount = function didMount(_ref) {
var refs = _ref.refs,
setState = _ref.setState;
var resize = function resize() {
return setState({
width: window.innerWidth,
height: window.innerHeight
});
};
window.addEventListener("resize", resize);
refs.removeEvent = function () {
window.removeEventListener("resize", resize);
};
};
var willUnmount = function willUnmount(_ref2) {
var refs = _ref2.refs;
refs.removeEvent();
};
var WindowSize = function WindowSize(_ref3) {
var children = _ref3.children;
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_reach_component_component__WEBPACK_IMPORTED_MODULE_1__["default"], {
refs: {
removeEvent: null
},
initialState: {
width: hasWindow && window.innerWidth,
height: hasWindow && window.innerHeight
},
didMount: didMount,
willUnmount: willUnmount,
render: function render(_ref4) {
var state = _ref4.state;
return children(state);
}
});
};
false ? undefined : void 0;
/* harmony default export */ __webpack_exports__["default"] = (WindowSize);
/***/ }),
/***/ "../../node_modules/clipboard-js/clipboard.js":
/*!*********************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/clipboard-js/clipboard.js ***!
\*********************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
/* WEBPACK VAR INJECTION */(function(setImmediate) {function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
// Import support https://stackoverflow.com/questions/13673346/supporting-both-commonjs-and-amd
(function (name, definition) {
if (true) {
module.exports = definition();
} else {}
})("clipboard", function () {
if (typeof document === 'undefined' || !document.addEventListener) {
return null;
}
var clipboard = {};
clipboard.copy = function () {
var _intercept = false;
var _data = null; // Map from data type (e.g. "text/html") to value.
var _bogusSelection = false;
function cleanup() {
_intercept = false;
_data = null;
if (_bogusSelection) {
window.getSelection().removeAllRanges();
}
_bogusSelection = false;
}
document.addEventListener("copy", function (e) {
if (_intercept) {
for (var key in _data) {
e.clipboardData.setData(key, _data[key]);
}
e.preventDefault();
}
}); // Workaround for Safari: https://bugs.webkit.org/show_bug.cgi?id=156529
function bogusSelect() {
var sel = document.getSelection(); // If "nothing" is selected...
if (!document.queryCommandEnabled("copy") && sel.isCollapsed) {
// ... temporarily select the entire body.
//
// We select the entire body because:
// - it's guaranteed to exist,
// - it works (unlike, say, document.head, or phantom element that is
// not inserted into the DOM),
// - it doesn't seem to flicker (due to the synchronous copy event), and
// - it avoids modifying the DOM (can trigger mutation observers).
//
// Because we can't do proper feature detection (we already checked
// document.queryCommandEnabled("copy") , which actually gives a false
// negative for Blink when nothing is selected) and UA sniffing is not
// reliable (a lot of UA strings contain "Safari"), this will also
// happen for some browsers other than Safari. :-()
var range = document.createRange();
range.selectNodeContents(document.body);
sel.removeAllRanges();
sel.addRange(range);
_bogusSelection = true;
}
}
;
return function (data) {
return new Promise(function (resolve, reject) {
_intercept = true;
if (typeof data === "string") {
_data = {
"text/plain": data
};
} else if (data instanceof Node) {
_data = {
"text/html": new XMLSerializer().serializeToString(data)
};
} else if (data instanceof Object) {
_data = data;
} else {
reject("Invalid data type. Must be string, DOM node, or an object mapping MIME types to strings.");
}
function triggerCopy(tryBogusSelect) {
try {
if (document.execCommand("copy")) {
// document.execCommand is synchronous: http://www.w3.org/TR/2015/WD-clipboard-apis-20150421/#integration-with-rich-text-editing-apis
// So we can call resolve() back here.
cleanup();
resolve();
} else {
if (!tryBogusSelect) {
bogusSelect();
triggerCopy(true);
} else {
cleanup();
throw new Error("Unable to copy. Perhaps it's not available in your browser?");
}
}
} catch (e) {
cleanup();
reject(e);
}
}
triggerCopy(false);
});
};
}();
clipboard.paste = function () {
var _intercept = false;
var _resolve;
var _dataType;
document.addEventListener("paste", function (e) {
if (_intercept) {
_intercept = false;
e.preventDefault();
var resolve = _resolve;
_resolve = null;
resolve(e.clipboardData.getData(_dataType));
}
});
return function (dataType) {
return new Promise(function (resolve, reject) {
_intercept = true;
_resolve = resolve;
_dataType = dataType || "text/plain";
try {
if (!document.execCommand("paste")) {
_intercept = false;
reject(new Error("Unable to paste. Pasting only works in Internet Explorer at the moment."));
}
} catch (e) {
_intercept = false;
reject(new Error(e));
}
});
};
}(); // Handle IE behaviour.
if (typeof ClipboardEvent === "undefined" && typeof window.clipboardData !== "undefined" && typeof window.clipboardData.setData !== "undefined") {
/*! promise-polyfill 2.0.1 */
(function (a) {
function b(a, b) {
return function () {
a.apply(b, arguments);
};
}
function c(a) {
if ("object" != _typeof(this)) throw new TypeError("Promises must be constructed via new");
if ("function" != typeof a) throw new TypeError("not a function");
this._state = null, this._value = null, this._deferreds = [], i(a, b(e, this), b(f, this));
}
function d(a) {
var b = this;
return null === this._state ? void this._deferreds.push(a) : void j(function () {
var c = b._state ? a.onFulfilled : a.onRejected;
if (null === c) return void (b._state ? a.resolve : a.reject)(b._value);
var d;
try {
d = c(b._value);
} catch (e) {
return void a.reject(e);
}
a.resolve(d);
});
}
function e(a) {
try {
if (a === this) throw new TypeError("A promise cannot be resolved with itself.");
if (a && ("object" == _typeof(a) || "function" == typeof a)) {
var c = a.then;
if ("function" == typeof c) return void i(b(c, a), b(e, this), b(f, this));
}
this._state = !0, this._value = a, g.call(this);
} catch (d) {
f.call(this, d);
}
}
function f(a) {
this._state = !1, this._value = a, g.call(this);
}
function g() {
for (var a = 0, b = this._deferreds.length; b > a; a++) {
d.call(this, this._deferreds[a]);
}
this._deferreds = null;
}
function h(a, b, c, d) {
this.onFulfilled = "function" == typeof a ? a : null, this.onRejected = "function" == typeof b ? b : null, this.resolve = c, this.reject = d;
}
function i(a, b, c) {
var d = !1;
try {
a(function (a) {
d || (d = !0, b(a));
}, function (a) {
d || (d = !0, c(a));
});
} catch (e) {
if (d) return;
d = !0, c(e);
}
}
var j = c.immediateFn || "function" == typeof setImmediate && setImmediate || function (a) {
setTimeout(a, 1);
},
k = Array.isArray || function (a) {
return "[object Array]" === Object.prototype.toString.call(a);
};
c.prototype["catch"] = function (a) {
return this.then(null, a);
}, c.prototype.then = function (a, b) {
var e = this;
return new c(function (c, f) {
d.call(e, new h(a, b, c, f));
});
}, c.all = function () {
var a = Array.prototype.slice.call(1 === arguments.length && k(arguments[0]) ? arguments[0] : arguments);
return new c(function (b, c) {
function d(f, g) {
try {
if (g && ("object" == _typeof(g) || "function" == typeof g)) {
var h = g.then;
if ("function" == typeof h) return void h.call(g, function (a) {
d(f, a);
}, c);
}
a[f] = g, 0 === --e && b(a);
} catch (i) {
c(i);
}
}
if (0 === a.length) return b([]);
for (var e = a.length, f = 0; f < a.length; f++) {
d(f, a[f]);
}
});
}, c.resolve = function (a) {
return a && "object" == _typeof(a) && a.constructor === c ? a : new c(function (b) {
b(a);
});
}, c.reject = function (a) {
return new c(function (b, c) {
c(a);
});
}, c.race = function (a) {
return new c(function (b, c) {
for (var d = 0, e = a.length; e > d; d++) {
a[d].then(b, c);
}
});
}, true && module.exports ? module.exports = c : a.Promise || (a.Promise = c);
})(this);
clipboard.copy = function (data) {
return new Promise(function (resolve, reject) {
// IE supports string and URL types: https://msdn.microsoft.com/en-us/library/ms536744(v=vs.85).aspx
// We only support the string type for now.
if (typeof data !== "string" && !("text/plain" in data)) {
throw new Error("You must provide a text/plain type.");
}
var strData = typeof data === "string" ? data : data["text/plain"];
var copySucceeded = window.clipboardData.setData("Text", strData);
if (copySucceeded) {
resolve();
} else {
reject(new Error("Copying was rejected."));
}
});
};
clipboard.paste = function () {
return new Promise(function (resolve, reject) {
var strData = window.clipboardData.getData("Text");
if (strData) {
resolve(strData);
} else {
// The user rejected the paste request.
reject(new Error("Pasting was rejected."));
}
});
};
}
return clipboard;
});
/* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./../webpack/node_modules/timers-browserify/main.js */ "../../node_modules/webpack/node_modules/timers-browserify/main.js").setImmediate))
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../../node_modules/@reach/menu-button/styles.css":
/*!**********************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!/Users/bvaughn/Documents/git/react/node_modules/@reach/menu-button/styles.css ***!
\**********************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, "/* Used to detect in JavaScript if apps have loaded styles or not. */\n:root {\n --reach-menu-button: 1;\n}\n\n[data-reach-menu] {\n font-family: sans-serif;\n display: block;\n position: absolute;\n}\n\n[data-reach-menu-list] {\n display: block;\n white-space: nowrap;\n border: solid 1px hsla(0, 0%, 0%, 0.25);\n background: hsla(0, 100%, 100%, 0.99);\n outline: none;\n padding: 1rem 0;\n font-size: 85%;\n}\n\n[data-reach-menu-item] {\n display: block;\n}\n\n/*\n The dom structure of a MenuLink is reach-menu-item > a,\n so to target all items we can use `data-reach-menu-item`\n*/\n[data-reach-menu-item] {\n /*\n These are styled in one rule instead of something like a[data-reach-menu-item]\n and li[data-reach-menu-item] so that apps don't have to fight specificity and\n can style both li and a menu items with one rule,\n ie: `[data-selected] { background: red; }`.\n Otherwise they'd have to define two styles, one for a and one for li.\n */\n\n /* reach-menu-item */\n cursor: pointer;\n\n /* a */\n display: block;\n color: inherit;\n font: inherit;\n text-decoration: initial;\n\n /* both */\n padding: 5px 20px;\n}\n\n/* pseudo pseudo selector */\n[data-reach-menu-item][data-selected] {\n background: hsl(211, 81%, 36%);\n color: white;\n outline: none;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/node_modules/@reach/menu-button/styles.css"],"names":[],"mappings":"AAAA,qEAAqE;AACrE;EACE,uBAAuB;CACxB;;AAED;EACE,wBAAwB;EACxB,eAAe;EACf,mBAAmB;CACpB;;AAED;EACE,eAAe;EACf,oBAAoB;EACpB,wCAAwC;EACxC,sCAAsC;EACtC,cAAc;EACd,gBAAgB;EAChB,eAAe;CAChB;;AAED;EACE,eAAe;CAChB;;AAED;;;EAGE;AACF;EACE;;;;;;IAME;;EAEF,qBAAqB;EACrB,gBAAgB;;EAEhB,OAAO;EACP,eAAe;EACf,eAAe;EACf,cAAc;EACd,yBAAyB;;EAEzB,UAAU;EACV,kBAAkB;CACnB;;AAED,4BAA4B;AAC5B;EACE,+BAA+B;EAC/B,aAAa;EACb,cAAc;CACf","file":"styles.css","sourcesContent":["/* Used to detect in JavaScript if apps have loaded styles or not. */\n:root {\n --reach-menu-button: 1;\n}\n\n[data-reach-menu] {\n font-family: sans-serif;\n display: block;\n position: absolute;\n}\n\n[data-reach-menu-list] {\n display: block;\n white-space: nowrap;\n border: solid 1px hsla(0, 0%, 0%, 0.25);\n background: hsla(0, 100%, 100%, 0.99);\n outline: none;\n padding: 1rem 0;\n font-size: 85%;\n}\n\n[data-reach-menu-item] {\n display: block;\n}\n\n/*\n The dom structure of a MenuLink is reach-menu-item > a,\n so to target all items we can use `data-reach-menu-item`\n*/\n[data-reach-menu-item] {\n /*\n These are styled in one rule instead of something like a[data-reach-menu-item]\n and li[data-reach-menu-item] so that apps don't have to fight specificity and\n can style both li and a menu items with one rule,\n ie: `[data-selected] { background: red; }`.\n Otherwise they'd have to define two styles, one for a and one for li.\n */\n\n /* reach-menu-item */\n cursor: pointer;\n\n /* a */\n display: block;\n color: inherit;\n font: inherit;\n text-decoration: initial;\n\n /* both */\n padding: 5px 20px;\n}\n\n/* pseudo pseudo selector */\n[data-reach-menu-item][data-selected] {\n background: hsl(211, 81%, 36%);\n color: white;\n outline: none;\n}\n"],"sourceRoot":""}]);
// exports
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../../node_modules/@reach/tooltip/styles.css":
/*!******************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!/Users/bvaughn/Documents/git/react/node_modules/@reach/tooltip/styles.css ***!
\******************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ":root {\n --reach-tooltip: 1;\n}\n\n[data-reach-tooltip] {\n z-index: 1;\n pointer-events: none;\n position: absolute;\n padding: 0.25em 0.5em;\n box-shadow: 2px 2px 10px hsla(0, 0%, 0%, 0.1);\n white-space: nowrap;\n font-size: 85%;\n background: #f0f0f0;\n color: #444;\n border: solid 1px #ccc;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/node_modules/@reach/tooltip/styles.css"],"names":[],"mappings":"AAAA;EACE,mBAAmB;CACpB;;AAED;EACE,WAAW;EACX,qBAAqB;EACrB,mBAAmB;EACnB,sBAAsB;EACtB,8CAA8C;EAC9C,oBAAoB;EACpB,eAAe;EACf,oBAAoB;EACpB,YAAY;EACZ,uBAAuB;CACxB","file":"styles.css","sourcesContent":[":root {\n --reach-tooltip: 1;\n}\n\n[data-reach-tooltip] {\n z-index: 1;\n pointer-events: none;\n position: absolute;\n padding: 0.25em 0.5em;\n box-shadow: 2px 2px 10px hsla(0, 0%, 0%, 0.1);\n white-space: nowrap;\n font-size: 85%;\n background: #f0f0f0;\n color: #444;\n border: solid 1px #ccc;\n}\n"],"sourceRoot":""}]);
// exports
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/ContextMenu/ContextMenu.css":
/*!**********************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/ContextMenu/ContextMenu.css ***!
\**********************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".ContextMenu___3Zn8W {\n position: absolute;\n background-color: var(--color-context-background);\n border-radius: 0.25rem;\n overflow: hidden;\n z-index: 10000002;\n}", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/ContextMenu/ContextMenu.css"],"names":[],"mappings":"AAAA;EACE,mBAAmB;EACnB,kDAAkD;EAClD,uBAAuB;EACvB,iBAAiB;EACjB,kBAAkB;CACnB","file":"ContextMenu.css","sourcesContent":[".ContextMenu {\n position: absolute;\n background-color: var(--color-context-background);\n border-radius: 0.25rem;\n overflow: hidden;\n z-index: 10000002;\n}"],"sourceRoot":""}]);
// exports
exports.locals = {
"ContextMenu": "ContextMenu___3Zn8W"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/ContextMenu/ContextMenuItem.css":
/*!**************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/ContextMenu/ContextMenuItem.css ***!
\**************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".ContextMenuItem___21C_r {\n display: flex;\n align-items: center;\n color: var(--color-context-text);\n padding: 0.5rem 0.75rem;\n cursor: default;\n border-top: 1px solid var(--color-context-border);\n font-family: var(--font-family-sans);\n font-size: var(--font-size-sans-normal);\n}\n.ContextMenuItem___21C_r:first-of-type {\n border-top: none;\n}\n.ContextMenuItem___21C_r:hover,\n.ContextMenuItem___21C_r:focus {\n outline: 0;\n background-color: var(--color-context-background-hover);\n}\n.ContextMenuItem___21C_r:active {\n background-color: var(--color-context-background-selected);\n color: var(--color-context-text-selected);\n}", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/ContextMenu/ContextMenuItem.css"],"names":[],"mappings":"AAAA;EACE,cAAc;EACd,oBAAoB;EACpB,iCAAiC;EACjC,wBAAwB;EACxB,gBAAgB;EAChB,kDAAkD;EAClD,qCAAqC;EACrC,wCAAwC;CACzC;AACD;EACE,iBAAiB;CAClB;AACD;;EAEE,WAAW;EACX,wDAAwD;CACzD;AACD;EACE,2DAA2D;EAC3D,0CAA0C;CAC3C","file":"ContextMenuItem.css","sourcesContent":[".ContextMenuItem {\n display: flex;\n align-items: center;\n color: var(--color-context-text);\n padding: 0.5rem 0.75rem;\n cursor: default;\n border-top: 1px solid var(--color-context-border);\n font-family: var(--font-family-sans);\n font-size: var(--font-size-sans-normal);\n}\n.ContextMenuItem:first-of-type {\n border-top: none;\n}\n.ContextMenuItem:hover,\n.ContextMenuItem:focus {\n outline: 0;\n background-color: var(--color-context-background-hover);\n}\n.ContextMenuItem:active {\n background-color: var(--color-context-background-selected);\n color: var(--color-context-text-selected);\n}"],"sourceRoot":""}]);
// exports
exports.locals = {
"ContextMenuItem": "ContextMenuItem___21C_r"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Button.css":
/*!***********************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Button.css ***!
\***********************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Button___1-PiG {\n border: none;\n background: var(--color-button-background);\n color: var(--color-button);\n padding: 0;\n border-radius: 0.25rem;\n flex: 0 0 auto;\n}\n.ButtonContent___2mZ9q {\n display: inline-flex;\n align-items: center;\n border-radius: 0.25rem;\n padding: 0.25rem;\n}\n\n.Button___1-PiG:hover {\n color: var(--color-button-hover);\n}\n.Button___1-PiG:active {\n color: var(--color-button-focus);\n outline: none;\n}\n.Button___1-PiG:focus,\n.ButtonContent___2mZ9q:focus {\n outline: none;\n}\n\n.Button___1-PiG:focus > .ButtonContent___2mZ9q {\n background: var(--color-button-background-focus);\n}\n\n.Button___1-PiG:disabled,\n.Button___1-PiG:disabled:active {\n background: var(--color-button-background);\n color: var(--color-button-disabled);\n cursor: default;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Button.css"],"names":[],"mappings":"AAAA;EACE,aAAa;EACb,2CAA2C;EAC3C,2BAA2B;EAC3B,WAAW;EACX,uBAAuB;EACvB,eAAe;CAChB;AACD;EACE,qBAAqB;EACrB,oBAAoB;EACpB,uBAAuB;EACvB,iBAAiB;CAClB;;AAED;EACE,iCAAiC;CAClC;AACD;EACE,iCAAiC;EACjC,cAAc;CACf;AACD;;EAEE,cAAc;CACf;;AAED;EACE,iDAAiD;CAClD;;AAED;;EAEE,2CAA2C;EAC3C,oCAAoC;EACpC,gBAAgB;CACjB","file":"Button.css","sourcesContent":[".Button {\n border: none;\n background: var(--color-button-background);\n color: var(--color-button);\n padding: 0;\n border-radius: 0.25rem;\n flex: 0 0 auto;\n}\n.ButtonContent {\n display: inline-flex;\n align-items: center;\n border-radius: 0.25rem;\n padding: 0.25rem;\n}\n\n.Button:hover {\n color: var(--color-button-hover);\n}\n.Button:active {\n color: var(--color-button-focus);\n outline: none;\n}\n.Button:focus,\n.ButtonContent:focus {\n outline: none;\n}\n\n.Button:focus > .ButtonContent {\n background: var(--color-button-background-focus);\n}\n\n.Button:disabled,\n.Button:disabled:active {\n background: var(--color-button-background);\n color: var(--color-button-disabled);\n cursor: default;\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"Button": "Button___1-PiG",
"ButtonContent": "ButtonContent___2mZ9q"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/ButtonIcon.css":
/*!***************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/ButtonIcon.css ***!
\***************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".ButtonIcon___1AgYV {\n width: 1rem;\n height: 1rem;\n fill: currentColor;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/ButtonIcon.css"],"names":[],"mappings":"AAAA;EACE,YAAY;EACZ,aAAa;EACb,mBAAmB;CACpB","file":"ButtonIcon.css","sourcesContent":[".ButtonIcon {\n width: 1rem;\n height: 1rem;\n fill: currentColor;\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"ButtonIcon": "ButtonIcon___1AgYV"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/Badge.css":
/*!*********************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Components/Badge.css ***!
\*********************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Badge___1D92d {\n display: inline-block;\n background-color: var(--color-component-badge-background);\n color: var(--color-text);\n padding: 0.125rem 0.25rem;\n line-height: normal;\n border-radius: 0.125rem;\n margin-right: 0.25rem;\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-small);\n}\n\n.ExtraLabel___ktyWc {\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-small);\n color: var(--color-component-badge-count);\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Components/Badge.css"],"names":[],"mappings":"AAAA;EACE,sBAAsB;EACtB,0DAA0D;EAC1D,yBAAyB;EACzB,0BAA0B;EAC1B,oBAAoB;EACpB,wBAAwB;EACxB,sBAAsB;EACtB,0CAA0C;EAC1C,4CAA4C;CAC7C;;AAED;EACE,0CAA0C;EAC1C,4CAA4C;EAC5C,0CAA0C;CAC3C","file":"Badge.css","sourcesContent":[".Badge {\n display: inline-block;\n background-color: var(--color-component-badge-background);\n color: var(--color-text);\n padding: 0.125rem 0.25rem;\n line-height: normal;\n border-radius: 0.125rem;\n margin-right: 0.25rem;\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-small);\n}\n\n.ExtraLabel {\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-small);\n color: var(--color-component-badge-count);\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"Badge": "Badge___1D92d",
"ExtraLabel": "ExtraLabel___ktyWc"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/Components.css":
/*!**************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Components/Components.css ***!
\**************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Components___MlQHS {\n position: relative;\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: row;\n background-color: var(--color-background);\n color: var(--color-text);\n font-family: var(--font-family-sans);\n}\n\n.TreeWrapper___2uPTC {\n flex: 0 0 65%;\n overflow: auto;\n}\n\n.SelectedElementWrapper___1wT_p {\n flex: 0 0 35%;\n overflow-x: hidden;\n overflow-y: auto;\n}\n\n@media screen and (max-width: 600px) {\n .Components___MlQHS {\n flex-direction: column;\n }\n\n .TreeWrapper___2uPTC {\n flex: 0 0 50%;\n }\n\n .SelectedElementWrapper___1wT_p {\n flex: 0 0 50%;\n }\n}\n\n.Loading___Slif- {\n height: 100%;\n padding-left: 0.5rem;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: var(--font-size-sans-large);\n color: var(--color-dim);\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Components/Components.css"],"names":[],"mappings":"AAAA;EACE,mBAAmB;EACnB,YAAY;EACZ,aAAa;EACb,cAAc;EACd,oBAAoB;EACpB,0CAA0C;EAC1C,yBAAyB;EACzB,qCAAqC;CACtC;;AAED;EACE,cAAc;EACd,eAAe;CAChB;;AAED;EACE,cAAc;EACd,mBAAmB;EACnB,iBAAiB;CAClB;;AAED;EACE;IACE,uBAAuB;GACxB;;EAED;IACE,cAAc;GACf;;EAED;IACE,cAAc;GACf;CACF;;AAED;EACE,aAAa;EACb,qBAAqB;EACrB,cAAc;EACd,oBAAoB;EACpB,wBAAwB;EACxB,uCAAuC;EACvC,wBAAwB;CACzB","file":"Components.css","sourcesContent":[".Components {\n position: relative;\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: row;\n background-color: var(--color-background);\n color: var(--color-text);\n font-family: var(--font-family-sans);\n}\n\n.TreeWrapper {\n flex: 0 0 65%;\n overflow: auto;\n}\n\n.SelectedElementWrapper {\n flex: 0 0 35%;\n overflow-x: hidden;\n overflow-y: auto;\n}\n\n@media screen and (max-width: 600px) {\n .Components {\n flex-direction: column;\n }\n\n .TreeWrapper {\n flex: 0 0 50%;\n }\n\n .SelectedElementWrapper {\n flex: 0 0 50%;\n }\n}\n\n.Loading {\n height: 100%;\n padding-left: 0.5rem;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: var(--font-size-sans-large);\n color: var(--color-dim);\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"Components": "Components___MlQHS",
"TreeWrapper": "TreeWrapper___2uPTC",
"SelectedElementWrapper": "SelectedElementWrapper___1wT_p",
"Loading": "Loading___Slif-"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/EditableName.css":
/*!****************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Components/EditableName.css ***!
\****************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Input___2v7pX {\n flex: 0 1 auto;\n padding: 1px;\n box-shadow: 0px 1px 3px transparent;\n color: var(--color-text);\n}\n.Input___2v7pX:focus {\n color: var(--color-text);\n box-shadow: 0px 1px 3px var(--color-shadow);\n}", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Components/EditableName.css"],"names":[],"mappings":"AAAA;EACE,eAAe;EACf,aAAa;EACb,oCAAoC;EACpC,yBAAyB;CAC1B;AACD;EACE,yBAAyB;EACzB,4CAA4C;CAC7C","file":"EditableName.css","sourcesContent":[".Input {\n flex: 0 1 auto;\n padding: 1px;\n box-shadow: 0px 1px 3px transparent;\n color: var(--color-text);\n}\n.Input:focus {\n color: var(--color-text);\n box-shadow: 0px 1px 3px var(--color-shadow);\n}"],"sourceRoot":""}]);
// exports
exports.locals = {
"Input": "Input___2v7pX"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/EditableValue.css":
/*!*****************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Components/EditableValue.css ***!
\*****************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".CheckboxLabel___vFDNi {\n flex: 1 1 100%;\n display: flex;\n}\n.CheckboxLabel___vFDNi:focus-within {\n background-color: var(--color-button-background-focus);\n}\n\n.Checkbox___S8zDe:focus {\n outline: none;\n}\n\n.Input___54okB {\n flex: 1 1;\n background: none;\n border: 1px solid transparent;\n color: var(--color-attribute-editable-value);\n border-radius: 0.125rem;\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-normal);\n}\n\n.Invalid___AR4Hd {\n flex: 1 1;\n background: none;\n border: 1px solid transparent;\n color: var(--color-attribute-editable-value);\n border-radius: 0.125rem;\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-normal);\n background-color: var(--color-background-invalid);\n color: var(--color-text-invalid);\n\n --color-border: var(--color-text-invalid);\n}\n\n.Input___54okB:focus,\n.Invalid___AR4Hd:focus {\n background-color: var(--color-button-background-focus);\n outline: none;\n}\n\n.ResetButton___k3gxk {\n flex: 0 0 auto;\n padding: 0 0.5rem;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Components/EditableValue.css"],"names":[],"mappings":"AAAA;EACE,eAAe;EACf,cAAc;CACf;AACD;EACE,uDAAuD;CACxD;;AAED;EACE,cAAc;CACf;;AAED;EACE,UAAU;EACV,iBAAiB;EACjB,8BAA8B;EAC9B,6CAA6C;EAC7C,wBAAwB;EACxB,0CAA0C;EAC1C,6CAA6C;CAC9C;;AAED;EACE,UAAU;EACV,iBAAiB;EACjB,8BAA8B;EAC9B,6CAA6C;EAC7C,wBAAwB;EACxB,0CAA0C;EAC1C,6CAA6C;EAC7C,kDAAkD;EAClD,iCAAiC;;EAEjC,0CAA0C;CAC3C;;AAED;;EAEE,uDAAuD;EACvD,cAAc;CACf;;AAED;EACE,eAAe;EACf,kBAAkB;CACnB","file":"EditableValue.css","sourcesContent":[".CheckboxLabel {\n flex: 1 1 100%;\n display: flex;\n}\n.CheckboxLabel:focus-within {\n background-color: var(--color-button-background-focus);\n}\n\n.Checkbox:focus {\n outline: none;\n}\n\n.Input {\n flex: 1 1;\n background: none;\n border: 1px solid transparent;\n color: var(--color-attribute-editable-value);\n border-radius: 0.125rem;\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-normal);\n}\n\n.Invalid {\n flex: 1 1;\n background: none;\n border: 1px solid transparent;\n color: var(--color-attribute-editable-value);\n border-radius: 0.125rem;\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-normal);\n background-color: var(--color-background-invalid);\n color: var(--color-text-invalid);\n\n --color-border: var(--color-text-invalid);\n}\n\n.Input:focus,\n.Invalid:focus {\n background-color: var(--color-button-background-focus);\n outline: none;\n}\n\n.ResetButton {\n flex: 0 0 auto;\n padding: 0 0.5rem;\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"CheckboxLabel": "CheckboxLabel___vFDNi",
"Checkbox": "Checkbox___S8zDe",
"Input": "Input___54okB",
"Invalid": "Invalid___AR4Hd",
"ResetButton": "ResetButton___k3gxk"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/Element.css":
/*!***********************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Components/Element.css ***!
\***********************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Element___1PGUo,\n.InactiveSelectedElement___3H2V0,\n.SelectedElement___2BZuq,\n.HoveredElement___4tCuC {\n color: var(--color-component-name);\n}\n.HoveredElement___4tCuC {\n background-color: var(--color-background-hover);\n}\n.InactiveSelectedElement___3H2V0 {\n background-color: var(--color-background-inactive);\n}\n\n.Wrapper___1kRcF {\n padding: 0 0.25rem;\n white-space: nowrap;\n height: var(--line-height-data);\n line-height: var(--line-height-data);\n display: inline-flex;\n align-items: center;\n cursor: default;\n user-select: none;\n}\n\n.ScrollAnchor___31Dc8 {\n height: 100%;\n width: 0;\n}\n\n.SelectedElement___2BZuq {\n background-color: var(--color-background-selected);\n color: var(--color-text-selected);\n\n /* Invert colors */\n --color-component-name: var(--color-component-name-inverted);\n --color-text: var(--color-text-selected);\n --color-component-badge-background: var(\n --color-component-badge-background-inverted\n );\n --color-component-badge-count: var(--color-component-badge-count-inverted);\n --color-attribute-name: var(--color-attribute-name-inverted);\n --color-attribute-value: var(--color-attribute-value-inverted);\n --color-expand-collapse-toggle: var(--color-component-name-inverted);\n}\n\n.KeyName___iOoVX {\n color: var(--color-attribute-name);\n}\n\n.KeyValue___2hQzO {\n color: var(--color-attribute-value);\n user-select: text;\n max-width: 100px;\n overflow-x: hidden;\n text-overflow: ellipsis;\n}\n\n.Highlight___OJ7Ox {\n background-color: var(--color-search-match);\n}\n.CurrentHighlight___3RWa2 {\n background-color: var(--color-search-match-current);\n}\n\n.ExpandCollapseToggle___3CxPD {\n display: inline-flex;\n width: 1rem;\n height: 1rem;\n flex: 0 0 1rem;\n color: var(--color-expand-collapse-toggle);\n}\n\n.Badge___36OB- {\n margin-left: 0.25rem;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Components/Element.css"],"names":[],"mappings":"AAAA;;;;EAIE,mCAAmC;CACpC;AACD;EACE,gDAAgD;CACjD;AACD;EACE,mDAAmD;CACpD;;AAED;EACE,mBAAmB;EACnB,oBAAoB;EACpB,gCAAgC;EAChC,qCAAqC;EACrC,qBAAqB;EACrB,oBAAoB;EACpB,gBAAgB;EAChB,kBAAkB;CACnB;;AAED;EACE,aAAa;EACb,SAAS;CACV;;AAED;EACE,mDAAmD;EACnD,kCAAkC;;EAElC,mBAAmB;EACnB,6DAA6D;EAC7D,yCAAyC;EACzC;;IAEE;EACF,2EAA2E;EAC3E,6DAA6D;EAC7D,+DAA+D;EAC/D,qEAAqE;CACtE;;AAED;EACE,mCAAmC;CACpC;;AAED;EACE,oCAAoC;EACpC,kBAAkB;EAClB,iBAAiB;EACjB,mBAAmB;EACnB,wBAAwB;CACzB;;AAED;EACE,4CAA4C;CAC7C;AACD;EACE,oDAAoD;CACrD;;AAED;EACE,qBAAqB;EACrB,YAAY;EACZ,aAAa;EACb,eAAe;EACf,2CAA2C;CAC5C;;AAED;EACE,qBAAqB;CACtB","file":"Element.css","sourcesContent":[".Element,\n.InactiveSelectedElement,\n.SelectedElement,\n.HoveredElement {\n color: var(--color-component-name);\n}\n.HoveredElement {\n background-color: var(--color-background-hover);\n}\n.InactiveSelectedElement {\n background-color: var(--color-background-inactive);\n}\n\n.Wrapper {\n padding: 0 0.25rem;\n white-space: nowrap;\n height: var(--line-height-data);\n line-height: var(--line-height-data);\n display: inline-flex;\n align-items: center;\n cursor: default;\n user-select: none;\n}\n\n.ScrollAnchor {\n height: 100%;\n width: 0;\n}\n\n.SelectedElement {\n background-color: var(--color-background-selected);\n color: var(--color-text-selected);\n\n /* Invert colors */\n --color-component-name: var(--color-component-name-inverted);\n --color-text: var(--color-text-selected);\n --color-component-badge-background: var(\n --color-component-badge-background-inverted\n );\n --color-component-badge-count: var(--color-component-badge-count-inverted);\n --color-attribute-name: var(--color-attribute-name-inverted);\n --color-attribute-value: var(--color-attribute-value-inverted);\n --color-expand-collapse-toggle: var(--color-component-name-inverted);\n}\n\n.KeyName {\n color: var(--color-attribute-name);\n}\n\n.KeyValue {\n color: var(--color-attribute-value);\n user-select: text;\n max-width: 100px;\n overflow-x: hidden;\n text-overflow: ellipsis;\n}\n\n.Highlight {\n background-color: var(--color-search-match);\n}\n.CurrentHighlight {\n background-color: var(--color-search-match-current);\n}\n\n.ExpandCollapseToggle {\n display: inline-flex;\n width: 1rem;\n height: 1rem;\n flex: 0 0 1rem;\n color: var(--color-expand-collapse-toggle);\n}\n\n.Badge {\n margin-left: 0.25rem;\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"Element": "Element___1PGUo",
"InactiveSelectedElement": "InactiveSelectedElement___3H2V0",
"SelectedElement": "SelectedElement___2BZuq",
"HoveredElement": "HoveredElement___4tCuC",
"Wrapper": "Wrapper___1kRcF",
"ScrollAnchor": "ScrollAnchor___31Dc8",
"KeyName": "KeyName___iOoVX",
"KeyValue": "KeyValue___2hQzO",
"Highlight": "Highlight___OJ7Ox",
"CurrentHighlight": "CurrentHighlight___3RWa2",
"ExpandCollapseToggle": "ExpandCollapseToggle___3CxPD",
"Badge": "Badge___36OB-"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/ExpandCollapseToggle.css":
/*!************************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Components/ExpandCollapseToggle.css ***!
\************************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".ExpandCollapseToggle___1eSq5 {\n flex: 0 0 1rem;\n width: 1rem;\n height: 1rem;\n padding: 0;\n color: var(--color-expand-collapse-toggle);\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Components/ExpandCollapseToggle.css"],"names":[],"mappings":"AAAA;EACE,eAAe;EACf,YAAY;EACZ,aAAa;EACb,WAAW;EACX,2CAA2C;CAC5C","file":"ExpandCollapseToggle.css","sourcesContent":[".ExpandCollapseToggle {\n flex: 0 0 1rem;\n width: 1rem;\n height: 1rem;\n padding: 0;\n color: var(--color-expand-collapse-toggle);\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"ExpandCollapseToggle": "ExpandCollapseToggle___1eSq5"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/HocBadges.css":
/*!*************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Components/HocBadges.css ***!
\*************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".HocBadges___3V-9f {\n padding: 0.125rem 0.25rem;\n user-select: none;\n}\n\n.Badge___yfw97 {\n display: inline-block;\n background-color: var(--color-component-badge-background);\n color: var(--color-text);\n padding: 0.125rem 0.25rem;\n line-height: normal;\n border-radius: 0.125rem;\n margin-right: 0.25rem;\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-small);\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Components/HocBadges.css"],"names":[],"mappings":"AAAA;EACE,0BAA0B;EAC1B,kBAAkB;CACnB;;AAED;EACE,sBAAsB;EACtB,0DAA0D;EAC1D,yBAAyB;EACzB,0BAA0B;EAC1B,oBAAoB;EACpB,wBAAwB;EACxB,sBAAsB;EACtB,0CAA0C;EAC1C,4CAA4C;CAC7C","file":"HocBadges.css","sourcesContent":[".HocBadges {\n padding: 0.125rem 0.25rem;\n user-select: none;\n}\n\n.Badge {\n display: inline-block;\n background-color: var(--color-component-badge-background);\n color: var(--color-text);\n padding: 0.125rem 0.25rem;\n line-height: normal;\n border-radius: 0.125rem;\n margin-right: 0.25rem;\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-small);\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"HocBadges": "HocBadges___3V-9f",
"Badge": "Badge___yfw97"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/HooksTree.css":
/*!*************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Components/HooksTree.css ***!
\*************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".HooksTreeView___1Fl2v {\n padding: 0.25rem;\n border-top: 1px solid var(--color-border);\n}\n\n.Hook___3YGvA {\n}\n\n.Children___czkVv {\n padding-left: 1rem;\n}\n\n.HeaderRow___2ys42 {\n display: flex;\n align-items: center;\n}\n\n.Header___1QK7j {\n flex: 1 1;\n font-family: var(--font-family-sans);\n}\n\n.NameValueRow___2wmen {\n display: flex;\n}\n\n.Name___2hzUF,\n.NameAnonymous___2bMmB {\n flex: 0 0 auto;\n cursor: default;\n}\n.Name___2hzUF {\n color: var(--color-dim);\n}\n.NameAnonymous___2bMmB {\n color: var(--color-dimmer);\n}\n\n.EditableName___3-YQT {\n color: var(--color-attribute-name);\n flex: 0 0 auto;\n cursor: default;\n}\n.EditableName___3-YQT:after,\n.Name___2hzUF:after {\n color: var(--color-text);\n content: ': ';\n margin-right: 0.5rem;\n}\n\n.Value___1cSv3 {\n color: var(--color-attribute-value);\n overflow: hidden;\n text-overflow: ellipsis;\n cursor: default;\n}\n\n.None___2tUHz {\n color: var(--color-dimmer);\n font-style: italic;\n}\n\n.TruncationIndicator___2crPv {\n color: var(--color-dimmer);\n}\n\n.ExpandCollapseToggleSpacer___1O9Og {\n flex: 0 0 1rem;\n width: 1rem;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Components/HooksTree.css"],"names":[],"mappings":"AAAA;EACE,iBAAiB;EACjB,0CAA0C;CAC3C;;AAED;CACC;;AAED;EACE,mBAAmB;CACpB;;AAED;EACE,cAAc;EACd,oBAAoB;CACrB;;AAED;EACE,UAAU;EACV,qCAAqC;CACtC;;AAED;EACE,cAAc;CACf;;AAED;;EAEE,eAAe;EACf,gBAAgB;CACjB;AACD;EACE,wBAAwB;CACzB;AACD;EACE,2BAA2B;CAC5B;;AAED;EACE,mCAAmC;EACnC,eAAe;EACf,gBAAgB;CACjB;AACD;;EAEE,yBAAyB;EACzB,cAAc;EACd,qBAAqB;CACtB;;AAED;EACE,oCAAoC;EACpC,iBAAiB;EACjB,wBAAwB;EACxB,gBAAgB;CACjB;;AAED;EACE,2BAA2B;EAC3B,mBAAmB;CACpB;;AAED;EACE,2BAA2B;CAC5B;;AAED;EACE,eAAe;EACf,YAAY;CACb","file":"HooksTree.css","sourcesContent":[".HooksTreeView {\n padding: 0.25rem;\n border-top: 1px solid var(--color-border);\n}\n\n.Hook {\n}\n\n.Children {\n padding-left: 1rem;\n}\n\n.HeaderRow {\n display: flex;\n align-items: center;\n}\n\n.Header {\n flex: 1 1;\n font-family: var(--font-family-sans);\n}\n\n.NameValueRow {\n display: flex;\n}\n\n.Name,\n.NameAnonymous {\n flex: 0 0 auto;\n cursor: default;\n}\n.Name {\n color: var(--color-dim);\n}\n.NameAnonymous {\n color: var(--color-dimmer);\n}\n\n.EditableName {\n color: var(--color-attribute-name);\n flex: 0 0 auto;\n cursor: default;\n}\n.EditableName:after,\n.Name:after {\n color: var(--color-text);\n content: ': ';\n margin-right: 0.5rem;\n}\n\n.Value {\n color: var(--color-attribute-value);\n overflow: hidden;\n text-overflow: ellipsis;\n cursor: default;\n}\n\n.None {\n color: var(--color-dimmer);\n font-style: italic;\n}\n\n.TruncationIndicator {\n color: var(--color-dimmer);\n}\n\n.ExpandCollapseToggleSpacer {\n flex: 0 0 1rem;\n width: 1rem;\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"HooksTreeView": "HooksTreeView___1Fl2v",
"Hook": "Hook___3YGvA",
"Children": "Children___czkVv",
"HeaderRow": "HeaderRow___2ys42",
"Header": "Header___1QK7j",
"NameValueRow": "NameValueRow___2wmen",
"Name": "Name___2hzUF",
"NameAnonymous": "NameAnonymous___2bMmB",
"EditableName": "EditableName___3-YQT",
"Value": "Value___1cSv3",
"None": "None___2tUHz",
"TruncationIndicator": "TruncationIndicator___2crPv",
"ExpandCollapseToggleSpacer": "ExpandCollapseToggleSpacer___1O9Og"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/InspectedElementTree.css":
/*!************************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Components/InspectedElementTree.css ***!
\************************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".InspectedElementTree___Tif5r {\n padding: 0.25rem;\n border-top: 1px solid var(--color-border);\n}\n.InspectedElementTree___Tif5r:first-of-type {\n border-top: none;\n}\n\n.HeaderRow___2wqh5 {\n display: flex;\n align-items: center;\n}\n\n.Header___32vgs {\n flex: 1 1;\n font-family: var(--font-family-sans);\n}\n\n.Item___1VriK {\n display: flex;\n}\n\n.Name___3xGyI {\n color: var(--color-attribute-name);\n flex: 0 0 auto;\n}\n.Name___3xGyI:after {\n content: ': ';\n color: var(--color-text);\n margin-right: 0.5rem;\n}\n\n.Value___2-EFH {\n color: var(--color-attribute-value);\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.None___1Nr1V {\n color: var(--color-dimmer);\n font-style: italic;\n}\n\n.Empty___3VMY5 {\n color: var(--color-dimmer);\n font-style: italic;\n padding-left: 0.75rem;\n}\n\n.AddEntry___2tQv9 {\n padding-left: 1rem;\n white-space: nowrap;\n display: flex;\n align-items: center;\n}\n\n.EditableValue___2wZwY {\n min-width: 1rem;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Components/InspectedElementTree.css"],"names":[],"mappings":"AAAA;EACE,iBAAiB;EACjB,0CAA0C;CAC3C;AACD;EACE,iBAAiB;CAClB;;AAED;EACE,cAAc;EACd,oBAAoB;CACrB;;AAED;EACE,UAAU;EACV,qCAAqC;CACtC;;AAED;EACE,cAAc;CACf;;AAED;EACE,mCAAmC;EACnC,eAAe;CAChB;AACD;EACE,cAAc;EACd,yBAAyB;EACzB,qBAAqB;CACtB;;AAED;EACE,oCAAoC;EACpC,iBAAiB;EACjB,wBAAwB;CACzB;;AAED;EACE,2BAA2B;EAC3B,mBAAmB;CACpB;;AAED;EACE,2BAA2B;EAC3B,mBAAmB;EACnB,sBAAsB;CACvB;;AAED;EACE,mBAAmB;EACnB,oBAAoB;EACpB,cAAc;EACd,oBAAoB;CACrB;;AAED;EACE,gBAAgB;CACjB","file":"InspectedElementTree.css","sourcesContent":[".InspectedElementTree {\n padding: 0.25rem;\n border-top: 1px solid var(--color-border);\n}\n.InspectedElementTree:first-of-type {\n border-top: none;\n}\n\n.HeaderRow {\n display: flex;\n align-items: center;\n}\n\n.Header {\n flex: 1 1;\n font-family: var(--font-family-sans);\n}\n\n.Item {\n display: flex;\n}\n\n.Name {\n color: var(--color-attribute-name);\n flex: 0 0 auto;\n}\n.Name:after {\n content: ': ';\n color: var(--color-text);\n margin-right: 0.5rem;\n}\n\n.Value {\n color: var(--color-attribute-value);\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.None {\n color: var(--color-dimmer);\n font-style: italic;\n}\n\n.Empty {\n color: var(--color-dimmer);\n font-style: italic;\n padding-left: 0.75rem;\n}\n\n.AddEntry {\n padding-left: 1rem;\n white-space: nowrap;\n display: flex;\n align-items: center;\n}\n\n.EditableValue {\n min-width: 1rem;\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"InspectedElementTree": "InspectedElementTree___Tif5r",
"HeaderRow": "HeaderRow___2wqh5",
"Header": "Header___32vgs",
"Item": "Item___1VriK",
"Name": "Name___3xGyI",
"Value": "Value___2-EFH",
"None": "None___1Nr1V",
"Empty": "Empty___3VMY5",
"AddEntry": "AddEntry___2tQv9",
"EditableValue": "EditableValue___2wZwY"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/KeyValue.css":
/*!************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Components/KeyValue.css ***!
\************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Item___2n2qv:not([hidden]) {\n display: flex;\n}\n\n.Name___3LSJX {\n color: var(--color-dim);\n flex: 0 0 auto;\n cursor: default;\n}\n.EditableName___2TyRo {\n color: var(--color-attribute-name);\n flex: 0 0 auto;\n cursor: default;\n}\n.EditableName___2TyRo:after,\n.Name___3LSJX:after {\n content: ': ';\n color: var(--color-text);\n margin-right: 0.5rem;\n}\n\n.Value___7p123 {\n color: var(--color-attribute-value);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n cursor: default;\n}\n\n.None___RYyex {\n color: var(--color-dimmer);\n font-style: italic;\n}\n\n.ExpandCollapseToggleSpacer___3KNWO {\n flex: 0 0 1rem;\n width: 1rem;\n}\n\n.Empty___1MaDj {\n color: var(--color-dimmer);\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Components/KeyValue.css"],"names":[],"mappings":"AAAA;EACE,cAAc;CACf;;AAED;EACE,wBAAwB;EACxB,eAAe;EACf,gBAAgB;CACjB;AACD;EACE,mCAAmC;EACnC,eAAe;EACf,gBAAgB;CACjB;AACD;;EAEE,cAAc;EACd,yBAAyB;EACzB,qBAAqB;CACtB;;AAED;EACE,oCAAoC;EACpC,oBAAoB;EACpB,iBAAiB;EACjB,wBAAwB;EACxB,gBAAgB;CACjB;;AAED;EACE,2BAA2B;EAC3B,mBAAmB;CACpB;;AAED;EACE,eAAe;EACf,YAAY;CACb;;AAED;EACE,2BAA2B;CAC5B","file":"KeyValue.css","sourcesContent":[".Item:not([hidden]) {\n display: flex;\n}\n\n.Name {\n color: var(--color-dim);\n flex: 0 0 auto;\n cursor: default;\n}\n.EditableName {\n color: var(--color-attribute-name);\n flex: 0 0 auto;\n cursor: default;\n}\n.EditableName:after,\n.Name:after {\n content: ': ';\n color: var(--color-text);\n margin-right: 0.5rem;\n}\n\n.Value {\n color: var(--color-attribute-value);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n cursor: default;\n}\n\n.None {\n color: var(--color-dimmer);\n font-style: italic;\n}\n\n.ExpandCollapseToggleSpacer {\n flex: 0 0 1rem;\n width: 1rem;\n}\n\n.Empty {\n color: var(--color-dimmer);\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"Item": "Item___2n2qv",
"Name": "Name___3LSJX",
"EditableName": "EditableName___2TyRo",
"Value": "Value___7p123",
"None": "None___RYyex",
"ExpandCollapseToggleSpacer": "ExpandCollapseToggleSpacer___3KNWO",
"Empty": "Empty___1MaDj"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/AutoSizeInput.css":
/*!***********************************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/AutoSizeInput.css ***!
\***********************************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Input___2Lqoc {\n width: 0;\n min-width: 0.5rem;\n flex: 1 1 auto;\n border: none;\n background: transparent;\n outline: none;\n padding: 0;\n border: none;\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-normal);\n}\n\n.Input___2Lqoc:focus {\n border-color: var(--color-border);\n}\n\n.HiddenDiv___32TVk {\n position: absolute;\n top: 0;\n left: 0;\n visibility: hidden;\n height: 0;\n overflow: scroll;\n white-space: pre;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/AutoSizeInput.css"],"names":[],"mappings":"AAAA;EACE,SAAS;EACT,kBAAkB;EAClB,eAAe;EACf,aAAa;EACb,wBAAwB;EACxB,cAAc;EACd,WAAW;EACX,aAAa;EACb,0CAA0C;EAC1C,6CAA6C;CAC9C;;AAED;EACE,kCAAkC;CACnC;;AAED;EACE,mBAAmB;EACnB,OAAO;EACP,QAAQ;EACR,mBAAmB;EACnB,UAAU;EACV,iBAAiB;EACjB,iBAAiB;CAClB","file":"AutoSizeInput.css","sourcesContent":[".Input {\n width: 0;\n min-width: 0.5rem;\n flex: 1 1 auto;\n border: none;\n background: transparent;\n outline: none;\n padding: 0;\n border: none;\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-normal);\n}\n\n.Input:focus {\n border-color: var(--color-border);\n}\n\n.HiddenDiv {\n position: absolute;\n top: 0;\n left: 0;\n visibility: hidden;\n height: 0;\n overflow: scroll;\n white-space: pre;\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"Input": "Input___2Lqoc",
"HiddenDiv": "HiddenDiv___32TVk"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/LayoutViewer.css":
/*!**********************************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/LayoutViewer.css ***!
\**********************************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".LayoutViewer___215Ad {\n padding: 0.25rem;\n border-top: 1px solid var(--color-border);\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-small);\n}\n\n.Header___YXSRg {\n font-family: var(--font-family-sans);\n}\n\n.DashedBox___i8dxS,\n.SolidBox___1W-UG {\n flex: 1 1 auto;\n display: flex;\n flex-direction: column;\n align-items: center;\n border-width: 1px;\n border-color: var(--color-dim);\n padding: 0.25rem;\n margin: 0.25rem;\n}\n.DashedBox___i8dxS {\n border-style: dashed;\n}\n.SolidBox___1W-UG {\n border-style: solid;\n}\n\n.LabelRow___2SQOh {\n width: 100%;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.Label___IskVY {\n position: absolute;\n left: 0.5rem;\n flex: 1 0 100px;\n color: var(--color-attribute-name);\n}\n\n.BoxRow___2_1as {\n width: 100%;\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/LayoutViewer.css"],"names":[],"mappings":"AAAA;EACE,iBAAiB;EACjB,0CAA0C;EAC1C,0CAA0C;EAC1C,4CAA4C;CAC7C;;AAED;EACE,qCAAqC;CACtC;;AAED;;EAEE,eAAe;EACf,cAAc;EACd,uBAAuB;EACvB,oBAAoB;EACpB,kBAAkB;EAClB,+BAA+B;EAC/B,iBAAiB;EACjB,gBAAgB;CACjB;AACD;EACE,qBAAqB;CACtB;AACD;EACE,oBAAoB;CACrB;;AAED;EACE,YAAY;EACZ,mBAAmB;EACnB,cAAc;EACd,oBAAoB;EACpB,wBAAwB;CACzB;;AAED;EACE,mBAAmB;EACnB,aAAa;EACb,gBAAgB;EAChB,mCAAmC;CACpC;;AAED;EACE,YAAY;EACZ,cAAc;EACd,oBAAoB;EACpB,oBAAoB;CACrB","file":"LayoutViewer.css","sourcesContent":[".LayoutViewer {\n padding: 0.25rem;\n border-top: 1px solid var(--color-border);\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-small);\n}\n\n.Header {\n font-family: var(--font-family-sans);\n}\n\n.DashedBox,\n.SolidBox {\n flex: 1 1 auto;\n display: flex;\n flex-direction: column;\n align-items: center;\n border-width: 1px;\n border-color: var(--color-dim);\n padding: 0.25rem;\n margin: 0.25rem;\n}\n.DashedBox {\n border-style: dashed;\n}\n.SolidBox {\n border-style: solid;\n}\n\n.LabelRow {\n width: 100%;\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.Label {\n position: absolute;\n left: 0.5rem;\n flex: 1 0 100px;\n color: var(--color-attribute-name);\n}\n\n.BoxRow {\n width: 100%;\n display: flex;\n flex-direction: row;\n align-items: center;\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"LayoutViewer": "LayoutViewer___215Ad",
"Header": "Header___YXSRg",
"DashedBox": "DashedBox___i8dxS",
"SolidBox": "SolidBox___1W-UG",
"LabelRow": "LabelRow___2SQOh",
"Label": "Label___IskVY",
"BoxRow": "BoxRow___2_1as"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/StyleEditor.css":
/*!*********************************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/StyleEditor.css ***!
\*********************************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".StyleEditor___1RvzE {\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-normal);\n padding: 0.25rem;\n border-top: 1px solid var(--color-border);\n}\n\n.HeaderRow___xyA6t {\n display: flex;\n align-items: center;\n}\n\n.Header___2SGfE {\n flex: 1 1;\n}\n\n.Brackets___2zA4K {\n font-family: var(--font-family-sans);\n font-size: var(--font-size-sans-small);\n}\n\n.Row___3v8mp {\n white-space: nowrap;\n padding-left: 1rem;\n display: flex;\n align-items: center;\n}\n\n.Invalid___3ogBH {\n background-color: var(--color-background-invalid);\n color: var(--color-text-invalid);\n\n --color-border: var(--color-text-invalid);\n}\n.Attribute___2yC0c {\n color: var(--color-attribute-name);\n}\n\n.Value___1yJUg {\n color: var(--color-attribute-value);\n}\n\n.Input___3Zdnf {\n flex: 0 1 auto;\n padding: 1px;\n box-shadow: 0px 1px 3px transparent;\n}\n.Input___3Zdnf:focus {\n color: var(--color-text);\n box-shadow: 0px 1px 3px var(--color-shadow);\n}\n\n.Empty___3Pi3w {\n color: var(--color-dimmer);\n font-style: italic;\n user-select: none;\n padding-left: 1rem;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/StyleEditor.css"],"names":[],"mappings":"AAAA;EACE,0CAA0C;EAC1C,6CAA6C;EAC7C,iBAAiB;EACjB,0CAA0C;CAC3C;;AAED;EACE,cAAc;EACd,oBAAoB;CACrB;;AAED;EACE,UAAU;CACX;;AAED;EACE,qCAAqC;EACrC,uCAAuC;CACxC;;AAED;EACE,oBAAoB;EACpB,mBAAmB;EACnB,cAAc;EACd,oBAAoB;CACrB;;AAED;EACE,kDAAkD;EAClD,iCAAiC;;EAEjC,0CAA0C;CAC3C;AACD;EACE,mCAAmC;CACpC;;AAED;EACE,oCAAoC;CACrC;;AAED;EACE,eAAe;EACf,aAAa;EACb,oCAAoC;CACrC;AACD;EACE,yBAAyB;EACzB,4CAA4C;CAC7C;;AAED;EACE,2BAA2B;EAC3B,mBAAmB;EACnB,kBAAkB;EAClB,mBAAmB;CACpB","file":"StyleEditor.css","sourcesContent":[".StyleEditor {\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-normal);\n padding: 0.25rem;\n border-top: 1px solid var(--color-border);\n}\n\n.HeaderRow {\n display: flex;\n align-items: center;\n}\n\n.Header {\n flex: 1 1;\n}\n\n.Brackets {\n font-family: var(--font-family-sans);\n font-size: var(--font-size-sans-small);\n}\n\n.Row {\n white-space: nowrap;\n padding-left: 1rem;\n display: flex;\n align-items: center;\n}\n\n.Invalid {\n background-color: var(--color-background-invalid);\n color: var(--color-text-invalid);\n\n --color-border: var(--color-text-invalid);\n}\n.Attribute {\n color: var(--color-attribute-name);\n}\n\n.Value {\n color: var(--color-attribute-value);\n}\n\n.Input {\n flex: 0 1 auto;\n padding: 1px;\n box-shadow: 0px 1px 3px transparent;\n}\n.Input:focus {\n color: var(--color-text);\n box-shadow: 0px 1px 3px var(--color-shadow);\n}\n\n.Empty {\n color: var(--color-dimmer);\n font-style: italic;\n user-select: none;\n padding-left: 1rem;\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"StyleEditor": "StyleEditor___1RvzE",
"HeaderRow": "HeaderRow___xyA6t",
"Header": "Header___2SGfE",
"Brackets": "Brackets___2zA4K",
"Row": "Row___3v8mp",
"Invalid": "Invalid___3ogBH",
"Attribute": "Attribute___2yC0c",
"Value": "Value___1yJUg",
"Input": "Input___3Zdnf",
"Empty": "Empty___3Pi3w"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/OwnersStack.css":
/*!***************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Components/OwnersStack.css ***!
\***************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".OwnerStack___32qwj {\n max-width: 100%;\n overflow-x: auto;\n flex: 1;\n display: flex;\n align-items: center;\n position: relative;\n}\n\n.Component___3e3s7,\n.Component___3e3s7[data-reach-menu-item] {\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-normal);\n user-select: none;\n white-space: nowrap;\n display: flex;\n align-items: center;\n}\n\n.Component___3e3s7[data-reach-menu-item][data-selected],\n.Component___3e3s7[data-reach-menu-item][data-selected]:hover {\n color: var(--color-text-selected);\n background: var(--color-background-selected);\n}\n.Component___3e3s7[data-reach-menu-item][data-selected]:focus {\n outline: none;\n}\n\n.Bar___3G3dX {\n display: flex;\n flex: 1 1 auto;\n overflow-x: auto;\n}\n\n.VRule___IJYKJ {\n flex: 0 0 auto;\n height: 20px;\n width: 1px;\n background-color: var(--color-border);\n margin: 0 0.5rem;\n}\n\n.MenuButton___3te3U {\n border-radius: 0.25rem;\n display: inline-flex;\n align-items: center;\n padding: 0;\n flex: 0 0 auto;\n border: none;\n background: var(--color-button-background);\n color: var(--color-button);\n}\n.MenuButtonContent___3VvHH {\n display: inline-flex;\n align-items: center;\n border-radius: 0.25rem;\n padding: 0.25rem;\n}\n.MenuButton___3te3U:hover {\n color: var(--color-button-hover);\n}\n.MenuButton___3te3U[aria-expanded='true'],\n.MenuButton___3te3U[aria-expanded='true']:active {\n color: var(--color-button-active);\n outline: none;\n}\n\n.MenuButton___3te3U:focus,\n.MenuButtonContent___3VvHH:focus {\n outline: none;\n}\n.MenuButton___3te3U:focus > .MenuButtonContent___3VvHH {\n background: var(--color-button-background-focus);\n}\n\n.Modal___8b8bs[data-reach-menu-list] {\n display: inline-flex;\n flex-direction: column;\n background-color: var(--color-background);\n color: var(--color-button);\n padding: 0.25rem 0;\n padding-right: 0;\n border: 1px solid var(--color-border);\n border-radius: 0.25rem;\n max-height: 10rem;\n overflow: auto;\n\n /* Make sure this is above the DevTools, which are above the Overlay */\n z-index: 10000002;\n position: relative;\n\n /* Reach UI tries to set its own :( */\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-normal);\n}\n\n.NotInStore___3Y2P2,\n.NotInStore___3Y2P2:hover {\n color: var(--color-dimmest);\n}\n\n.Badge___2E6aT {\n margin-left: 0.25rem;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Components/OwnersStack.css"],"names":[],"mappings":"AAAA;EACE,gBAAgB;EAChB,iBAAiB;EACjB,QAAQ;EACR,cAAc;EACd,oBAAoB;EACpB,mBAAmB;CACpB;;AAED;;EAEE,0CAA0C;EAC1C,6CAA6C;EAC7C,kBAAkB;EAClB,oBAAoB;EACpB,cAAc;EACd,oBAAoB;CACrB;;AAED;;EAEE,kCAAkC;EAClC,6CAA6C;CAC9C;AACD;EACE,cAAc;CACf;;AAED;EACE,cAAc;EACd,eAAe;EACf,iBAAiB;CAClB;;AAED;EACE,eAAe;EACf,aAAa;EACb,WAAW;EACX,sCAAsC;EACtC,iBAAiB;CAClB;;AAED;EACE,uBAAuB;EACvB,qBAAqB;EACrB,oBAAoB;EACpB,WAAW;EACX,eAAe;EACf,aAAa;EACb,2CAA2C;EAC3C,2BAA2B;CAC5B;AACD;EACE,qBAAqB;EACrB,oBAAoB;EACpB,uBAAuB;EACvB,iBAAiB;CAClB;AACD;EACE,iCAAiC;CAClC;AACD;;EAEE,kCAAkC;EAClC,cAAc;CACf;;AAED;;EAEE,cAAc;CACf;AACD;EACE,iDAAiD;CAClD;;AAED;EACE,qBAAqB;EACrB,uBAAuB;EACvB,0CAA0C;EAC1C,2BAA2B;EAC3B,mBAAmB;EACnB,iBAAiB;EACjB,sCAAsC;EACtC,uBAAuB;EACvB,kBAAkB;EAClB,eAAe;;EAEf,uEAAuE;EACvE,kBAAkB;EAClB,mBAAmB;;EAEnB,sCAAsC;EACtC,0CAA0C;EAC1C,6CAA6C;CAC9C;;AAED;;EAEE,4BAA4B;CAC7B;;AAED;EACE,qBAAqB;CACtB","file":"OwnersStack.css","sourcesContent":[".OwnerStack {\n max-width: 100%;\n overflow-x: auto;\n flex: 1;\n display: flex;\n align-items: center;\n position: relative;\n}\n\n.Component,\n.Component[data-reach-menu-item] {\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-normal);\n user-select: none;\n white-space: nowrap;\n display: flex;\n align-items: center;\n}\n\n.Component[data-reach-menu-item][data-selected],\n.Component[data-reach-menu-item][data-selected]:hover {\n color: var(--color-text-selected);\n background: var(--color-background-selected);\n}\n.Component[data-reach-menu-item][data-selected]:focus {\n outline: none;\n}\n\n.Bar {\n display: flex;\n flex: 1 1 auto;\n overflow-x: auto;\n}\n\n.VRule {\n flex: 0 0 auto;\n height: 20px;\n width: 1px;\n background-color: var(--color-border);\n margin: 0 0.5rem;\n}\n\n.MenuButton {\n border-radius: 0.25rem;\n display: inline-flex;\n align-items: center;\n padding: 0;\n flex: 0 0 auto;\n border: none;\n background: var(--color-button-background);\n color: var(--color-button);\n}\n.MenuButtonContent {\n display: inline-flex;\n align-items: center;\n border-radius: 0.25rem;\n padding: 0.25rem;\n}\n.MenuButton:hover {\n color: var(--color-button-hover);\n}\n.MenuButton[aria-expanded='true'],\n.MenuButton[aria-expanded='true']:active {\n color: var(--color-button-active);\n outline: none;\n}\n\n.MenuButton:focus,\n.MenuButtonContent:focus {\n outline: none;\n}\n.MenuButton:focus > .MenuButtonContent {\n background: var(--color-button-background-focus);\n}\n\n.Modal[data-reach-menu-list] {\n display: inline-flex;\n flex-direction: column;\n background-color: var(--color-background);\n color: var(--color-button);\n padding: 0.25rem 0;\n padding-right: 0;\n border: 1px solid var(--color-border);\n border-radius: 0.25rem;\n max-height: 10rem;\n overflow: auto;\n\n /* Make sure this is above the DevTools, which are above the Overlay */\n z-index: 10000002;\n position: relative;\n\n /* Reach UI tries to set its own :( */\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-normal);\n}\n\n.NotInStore,\n.NotInStore:hover {\n color: var(--color-dimmest);\n}\n\n.Badge {\n margin-left: 0.25rem;\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"OwnerStack": "OwnerStack___32qwj",
"Component": "Component___3e3s7",
"Bar": "Bar___3G3dX",
"VRule": "VRule___IJYKJ",
"MenuButton": "MenuButton___3te3U",
"MenuButtonContent": "MenuButtonContent___3VvHH",
"Modal": "Modal___8b8bs",
"NotInStore": "NotInStore___3Y2P2",
"Badge": "Badge___2E6aT"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/SearchInput.css":
/*!***************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Components/SearchInput.css ***!
\***************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".SearchInput___3_D7A {\n flex: 1 1;\n display: flex;\n align-items: center;\n}\n\n.Input___3Kf09 {\n flex: 1 1 100px;\n width: 100px;\n font-size: var(--font-size-sans-large);\n outline: none;\n border: none;\n background-color: var(--color-background);\n color: var(--color-text);\n padding-left: 1.5rem;\n margin-left: -1rem;\n}\n\n.InputIcon___1HrXN {\n pointer-events: none;\n z-index: 2;\n color: var(--color-dimmer);\n}\n\n.IndexLabel___2cd8c {\n color: var(--color-dim);\n font-size: var(--font-size-sans-normal);\n white-space: pre;\n}\n\n.LeftVRule___wcxjb,\n.RightVRule___cvpx8 {\n height: 20px;\n width: 1px;\n background-color: var(--color-border);\n}\n.LeftVRule___wcxjb {\n margin: 0 0.25rem 0 0.5rem;\n}\n.RightVRule___cvpx8 {\n margin: 0 0.5rem 0 0.25rem;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Components/SearchInput.css"],"names":[],"mappings":"AAAA;EACE,UAAU;EACV,cAAc;EACd,oBAAoB;CACrB;;AAED;EACE,gBAAgB;EAChB,aAAa;EACb,uCAAuC;EACvC,cAAc;EACd,aAAa;EACb,0CAA0C;EAC1C,yBAAyB;EACzB,qBAAqB;EACrB,mBAAmB;CACpB;;AAED;EACE,qBAAqB;EACrB,WAAW;EACX,2BAA2B;CAC5B;;AAED;EACE,wBAAwB;EACxB,wCAAwC;EACxC,iBAAiB;CAClB;;AAED;;EAEE,aAAa;EACb,WAAW;EACX,sCAAsC;CACvC;AACD;EACE,2BAA2B;CAC5B;AACD;EACE,2BAA2B;CAC5B","file":"SearchInput.css","sourcesContent":[".SearchInput {\n flex: 1 1;\n display: flex;\n align-items: center;\n}\n\n.Input {\n flex: 1 1 100px;\n width: 100px;\n font-size: var(--font-size-sans-large);\n outline: none;\n border: none;\n background-color: var(--color-background);\n color: var(--color-text);\n padding-left: 1.5rem;\n margin-left: -1rem;\n}\n\n.InputIcon {\n pointer-events: none;\n z-index: 2;\n color: var(--color-dimmer);\n}\n\n.IndexLabel {\n color: var(--color-dim);\n font-size: var(--font-size-sans-normal);\n white-space: pre;\n}\n\n.LeftVRule,\n.RightVRule {\n height: 20px;\n width: 1px;\n background-color: var(--color-border);\n}\n.LeftVRule {\n margin: 0 0.25rem 0 0.5rem;\n}\n.RightVRule {\n margin: 0 0.5rem 0 0.25rem;\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"SearchInput": "SearchInput___3_D7A",
"Input": "Input___3Kf09",
"InputIcon": "InputIcon___1HrXN",
"IndexLabel": "IndexLabel___2cd8c",
"LeftVRule": "LeftVRule___wcxjb",
"RightVRule": "RightVRule___cvpx8"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/SelectedElement.css":
/*!*******************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Components/SelectedElement.css ***!
\*******************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".SelectedElement___1BBE- {\n display: flex;\n flex-direction: column;\n height: 100%;\n width: 100%;\n border-left: 1px solid var(--color-border);\n border-top: 1px solid var(--color-border);\n}\n\n.TitleRow___3KXaU {\n flex: 0 0 42px;\n display: flex;\n align-items: center;\n font-size: var(--font-size-monospace-large);\n border-bottom: 1px solid var(--color-border);\n padding: 0.5rem;\n}\n\n.SelectedComponentName___fsoQf {\n flex: 1 1 auto;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.Owners___2TDn3 {\n padding: 0.25rem;\n border-top: 1px solid var(--color-border);\n}\n\n.OwnersHeader___1W8cp {\n font-family: var(--font-family-sans);\n}\n\n.Source___2Od53 {\n padding: 0.25rem;\n border-top: 1px solid var(--color-border);\n}\n\n.SourceHeaderRow___3osMX {\n display: flex;\n align-items: center;\n}\n\n.SourceHeader___31-ng {\n flex: 1 1;\n font-family: var(--font-family-sans);\n}\n\n.SourceOneLiner___3UyoL {\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-normal);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 100%;\n margin-left: 1rem;\n}\n\n.Component___3aCZ4,\n.Owner___ZV1NX {\n color: var(--color-component-name);\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-normal);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 100%;\n}\n\n.Component___3aCZ4 {\n flex: 1 1 auto;\n}\n\n.InspectedElement___OD3PD {\n overflow-x: hidden;\n overflow-y: auto;\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-normal);\n line-height: var(--line-height-data);\n}\n\n.Owner___ZV1NX {\n border-radius: 0.25rem;\n padding: 0.125rem 0.25rem;\n cursor: pointer;\n background: none;\n border: none;\n display: block;\n}\n.Owner___ZV1NX:focus {\n outline: none;\n background-color: var(--color-button-background-focus);\n}\n\n.Loading___14NUm {\n padding: 0.25rem;\n color: var(--color-dimmer);\n font-style: italic;\n}\n\n.CannotSuspendWarningMessage___3ycws {\n}\n\n.NotInStore___3Nvun {\n color: var(--color-dim);\n cursor: default;\n}\n\n.OwnerButton___2JyFR {\n display: flex;\n align-items: center;\n margin-left: 0.5rem;\n padding: 0;\n}\n\n.ContextMenuIcon___2FD5s {\n margin-right: 0.5rem;\n}", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Components/SelectedElement.css"],"names":[],"mappings":"AAAA;EACE,cAAc;EACd,uBAAuB;EACvB,aAAa;EACb,YAAY;EACZ,2CAA2C;EAC3C,0CAA0C;CAC3C;;AAED;EACE,eAAe;EACf,cAAc;EACd,oBAAoB;EACpB,4CAA4C;EAC5C,6CAA6C;EAC7C,gBAAgB;CACjB;;AAED;EACE,eAAe;EACf,iBAAiB;EACjB,wBAAwB;CACzB;;AAED;EACE,iBAAiB;EACjB,0CAA0C;CAC3C;;AAED;EACE,qCAAqC;CACtC;;AAED;EACE,iBAAiB;EACjB,0CAA0C;CAC3C;;AAED;EACE,cAAc;EACd,oBAAoB;CACrB;;AAED;EACE,UAAU;EACV,qCAAqC;CACtC;;AAED;EACE,0CAA0C;EAC1C,6CAA6C;EAC7C,oBAAoB;EACpB,iBAAiB;EACjB,wBAAwB;EACxB,gBAAgB;EAChB,kBAAkB;CACnB;;AAED;;EAEE,mCAAmC;EACnC,0CAA0C;EAC1C,6CAA6C;EAC7C,oBAAoB;EACpB,iBAAiB;EACjB,wBAAwB;EACxB,gBAAgB;CACjB;;AAED;EACE,eAAe;CAChB;;AAED;EACE,mBAAmB;EACnB,iBAAiB;EACjB,0CAA0C;EAC1C,6CAA6C;EAC7C,qCAAqC;CACtC;;AAED;EACE,uBAAuB;EACvB,0BAA0B;EAC1B,gBAAgB;EAChB,iBAAiB;EACjB,aAAa;EACb,eAAe;CAChB;AACD;EACE,cAAc;EACd,uDAAuD;CACxD;;AAED;EACE,iBAAiB;EACjB,2BAA2B;EAC3B,mBAAmB;CACpB;;AAED;CACC;;AAED;EACE,wBAAwB;EACxB,gBAAgB;CACjB;;AAED;EACE,cAAc;EACd,oBAAoB;EACpB,oBAAoB;EACpB,WAAW;CACZ;;AAED;EACE,qBAAqB;CACtB","file":"SelectedElement.css","sourcesContent":[".SelectedElement {\n display: flex;\n flex-direction: column;\n height: 100%;\n width: 100%;\n border-left: 1px solid var(--color-border);\n border-top: 1px solid var(--color-border);\n}\n\n.TitleRow {\n flex: 0 0 42px;\n display: flex;\n align-items: center;\n font-size: var(--font-size-monospace-large);\n border-bottom: 1px solid var(--color-border);\n padding: 0.5rem;\n}\n\n.SelectedComponentName {\n flex: 1 1 auto;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.Owners {\n padding: 0.25rem;\n border-top: 1px solid var(--color-border);\n}\n\n.OwnersHeader {\n font-family: var(--font-family-sans);\n}\n\n.Source {\n padding: 0.25rem;\n border-top: 1px solid var(--color-border);\n}\n\n.SourceHeaderRow {\n display: flex;\n align-items: center;\n}\n\n.SourceHeader {\n flex: 1 1;\n font-family: var(--font-family-sans);\n}\n\n.SourceOneLiner {\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-normal);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 100%;\n margin-left: 1rem;\n}\n\n.Component,\n.Owner {\n color: var(--color-component-name);\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-normal);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 100%;\n}\n\n.Component {\n flex: 1 1 auto;\n}\n\n.InspectedElement {\n overflow-x: hidden;\n overflow-y: auto;\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-normal);\n line-height: var(--line-height-data);\n}\n\n.Owner {\n border-radius: 0.25rem;\n padding: 0.125rem 0.25rem;\n cursor: pointer;\n background: none;\n border: none;\n display: block;\n}\n.Owner:focus {\n outline: none;\n background-color: var(--color-button-background-focus);\n}\n\n.Loading {\n padding: 0.25rem;\n color: var(--color-dimmer);\n font-style: italic;\n}\n\n.CannotSuspendWarningMessage {\n}\n\n.NotInStore {\n color: var(--color-dim);\n cursor: default;\n}\n\n.OwnerButton {\n display: flex;\n align-items: center;\n margin-left: 0.5rem;\n padding: 0;\n}\n\n.ContextMenuIcon {\n margin-right: 0.5rem;\n}"],"sourceRoot":""}]);
// exports
exports.locals = {
"SelectedElement": "SelectedElement___1BBE-",
"TitleRow": "TitleRow___3KXaU",
"SelectedComponentName": "SelectedComponentName___fsoQf",
"Owners": "Owners___2TDn3",
"OwnersHeader": "OwnersHeader___1W8cp",
"Source": "Source___2Od53",
"SourceHeaderRow": "SourceHeaderRow___3osMX",
"SourceHeader": "SourceHeader___31-ng",
"SourceOneLiner": "SourceOneLiner___3UyoL",
"Component": "Component___3aCZ4",
"Owner": "Owner___ZV1NX",
"InspectedElement": "InspectedElement___OD3PD",
"Loading": "Loading___14NUm",
"CannotSuspendWarningMessage": "CannotSuspendWarningMessage___3ycws",
"NotInStore": "NotInStore___3Nvun",
"OwnerButton": "OwnerButton___2JyFR",
"ContextMenuIcon": "ContextMenuIcon___2FD5s"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/SelectedTreeHighlight.css":
/*!*************************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Components/SelectedTreeHighlight.css ***!
\*************************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Active___3Y5D2,\n.Inactive___2Ddkx {\n position: absolute;\n left: 0;\n width: 100%;\n z-index: 0;\n pointer-events: none;\n}\n\n.Active___3Y5D2 {\n background-color: var(--color-selected-tree-highlight-active);\n}\n\n.Inactive___2Ddkx {\n background-color: var(--color-selected-tree-highlight-inactive);\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Components/SelectedTreeHighlight.css"],"names":[],"mappings":"AAAA;;EAEE,mBAAmB;EACnB,QAAQ;EACR,YAAY;EACZ,WAAW;EACX,qBAAqB;CACtB;;AAED;EACE,8DAA8D;CAC/D;;AAED;EACE,gEAAgE;CACjE","file":"SelectedTreeHighlight.css","sourcesContent":[".Active,\n.Inactive {\n position: absolute;\n left: 0;\n width: 100%;\n z-index: 0;\n pointer-events: none;\n}\n\n.Active {\n background-color: var(--color-selected-tree-highlight-active);\n}\n\n.Inactive {\n background-color: var(--color-selected-tree-highlight-inactive);\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"Active": "Active___3Y5D2",
"Inactive": "Inactive___2Ddkx"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/Tree.css":
/*!********************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Components/Tree.css ***!
\********************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Tree___3Pjje {\n position: relative;\n height: 100%;\n width: 100%;\n display: flex;\n flex-direction: column;\n border-top: 1px solid var(--color-border);\n\n /* Default size will be adjusted by Tree after scrolling */\n --indentation-size: 12px;\n}\n\n.List___qlOJG {\n overflow-x: hidden !important;\n}\n\n.InnerElementType___1csGF {\n overflow-x: hidden;\n}\n\n.SearchInput___1Q2I_ {\n flex: 0 0 42px;\n display: flex;\n align-items: center;\n border-bottom: 1px solid var(--color-border);\n padding: 0.5rem;\n}\n\n.AutoSizerWrapper___3IcMr {\n width: 100%;\n overflow: hidden;\n flex: 1 0 auto;\n}\n.AutoSizerWrapper___3IcMr:focus {\n outline: none;\n}\n\n.List___qlOJG {\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-normal);\n line-height: var(--line-height-data);\n}\n\n.VRule___3yG5q {\n height: 20px;\n width: 1px;\n margin: 0 0.5rem;\n background-color: var(--color-border);\n}\n\n.Loading___TrqnR {\n height: 100%;\n padding-left: 0.5rem;\n display: flex;\n align-items: center;\n flex: 1;\n justify-content: flex-start;\n font-size: var(--font-size-sans-large);\n color: var(--color-dim);\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Components/Tree.css"],"names":[],"mappings":"AAAA;EACE,mBAAmB;EACnB,aAAa;EACb,YAAY;EACZ,cAAc;EACd,uBAAuB;EACvB,0CAA0C;;EAE1C,2DAA2D;EAC3D,yBAAyB;CAC1B;;AAED;EACE,8BAA8B;CAC/B;;AAED;EACE,mBAAmB;CACpB;;AAED;EACE,eAAe;EACf,cAAc;EACd,oBAAoB;EACpB,6CAA6C;EAC7C,gBAAgB;CACjB;;AAED;EACE,YAAY;EACZ,iBAAiB;EACjB,eAAe;CAChB;AACD;EACE,cAAc;CACf;;AAED;EACE,0CAA0C;EAC1C,6CAA6C;EAC7C,qCAAqC;CACtC;;AAED;EACE,aAAa;EACb,WAAW;EACX,iBAAiB;EACjB,sCAAsC;CACvC;;AAED;EACE,aAAa;EACb,qBAAqB;EACrB,cAAc;EACd,oBAAoB;EACpB,QAAQ;EACR,4BAA4B;EAC5B,uCAAuC;EACvC,wBAAwB;CACzB","file":"Tree.css","sourcesContent":[".Tree {\n position: relative;\n height: 100%;\n width: 100%;\n display: flex;\n flex-direction: column;\n border-top: 1px solid var(--color-border);\n\n /* Default size will be adjusted by Tree after scrolling */\n --indentation-size: 12px;\n}\n\n.List {\n overflow-x: hidden !important;\n}\n\n.InnerElementType {\n overflow-x: hidden;\n}\n\n.SearchInput {\n flex: 0 0 42px;\n display: flex;\n align-items: center;\n border-bottom: 1px solid var(--color-border);\n padding: 0.5rem;\n}\n\n.AutoSizerWrapper {\n width: 100%;\n overflow: hidden;\n flex: 1 0 auto;\n}\n.AutoSizerWrapper:focus {\n outline: none;\n}\n\n.List {\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-normal);\n line-height: var(--line-height-data);\n}\n\n.VRule {\n height: 20px;\n width: 1px;\n margin: 0 0.5rem;\n background-color: var(--color-border);\n}\n\n.Loading {\n height: 100%;\n padding-left: 0.5rem;\n display: flex;\n align-items: center;\n flex: 1;\n justify-content: flex-start;\n font-size: var(--font-size-sans-large);\n color: var(--color-dim);\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"Tree": "Tree___3Pjje",
"List": "List___qlOJG",
"InnerElementType": "InnerElementType___1csGF",
"SearchInput": "SearchInput___1Q2I_",
"AutoSizerWrapper": "AutoSizerWrapper___3IcMr",
"VRule": "VRule___3yG5q",
"Loading": "Loading___TrqnR"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/DevTools.css":
/*!*************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/DevTools.css ***!
\*************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".DevTools___NAxvy {\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n background-color: var(--color-background);\n color: var(--color-text);\n}\n\n.TabBar___2aDHU {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n padding: 0 0.5rem;\n background-color: var(--color-background);\n border-top: 1px solid var(--color-border);\n font-family: var(--font-family-sans);\n font-size: var(--font-size-sans-large);\n user-select: none;\n\n /* Electron drag area */\n -webkit-app-region: drag;\n}\n\n.Spacer___1VPRF {\n flex: 1;\n}\n\n.TabContent___27Qz1 {\n flex: 1 1 100%;\n overflow: auto;\n -webkit-app-region: no-drag;\n}\n\n.DevToolsVersion___3_3UD {\n font-size: var(--font-size-sans-normal);\n margin-right: 0.5rem;\n}\n\n.DevToolsVersion___3_3UD:before {\n font-size: var(--font-size-sans-large);\n content: 'DevTools ';\n}\n\n@media screen and (max-width: 400px) {\n .DevToolsVersion___3_3UD:before {\n content: '';\n }\n}\n\n@media screen and (max-width: 300px) {\n .DevToolsVersion___3_3UD {\n display: none;\n }\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/DevTools.css"],"names":[],"mappings":"AAAA;EACE,YAAY;EACZ,aAAa;EACb,cAAc;EACd,uBAAuB;EACvB,0CAA0C;EAC1C,yBAAyB;CAC1B;;AAED;EACE,eAAe;EACf,cAAc;EACd,oBAAoB;EACpB,kBAAkB;EAClB,0CAA0C;EAC1C,0CAA0C;EAC1C,qCAAqC;EACrC,uCAAuC;EACvC,kBAAkB;;EAElB,wBAAwB;EACxB,yBAAyB;CAC1B;;AAED;EACE,QAAQ;CACT;;AAED;EACE,eAAe;EACf,eAAe;EACf,4BAA4B;CAC7B;;AAED;EACE,wCAAwC;EACxC,qBAAqB;CACtB;;AAED;EACE,uCAAuC;EACvC,qBAAqB;CACtB;;AAED;EACE;IACE,YAAY;GACb;CACF;;AAED;EACE;IACE,cAAc;GACf;CACF","file":"DevTools.css","sourcesContent":[".DevTools {\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n background-color: var(--color-background);\n color: var(--color-text);\n}\n\n.TabBar {\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n padding: 0 0.5rem;\n background-color: var(--color-background);\n border-top: 1px solid var(--color-border);\n font-family: var(--font-family-sans);\n font-size: var(--font-size-sans-large);\n user-select: none;\n\n /* Electron drag area */\n -webkit-app-region: drag;\n}\n\n.Spacer {\n flex: 1;\n}\n\n.TabContent {\n flex: 1 1 100%;\n overflow: auto;\n -webkit-app-region: no-drag;\n}\n\n.DevToolsVersion {\n font-size: var(--font-size-sans-normal);\n margin-right: 0.5rem;\n}\n\n.DevToolsVersion:before {\n font-size: var(--font-size-sans-large);\n content: 'DevTools ';\n}\n\n@media screen and (max-width: 400px) {\n .DevToolsVersion:before {\n content: '';\n }\n}\n\n@media screen and (max-width: 300px) {\n .DevToolsVersion {\n display: none;\n }\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"DevTools": "DevTools___NAxvy",
"TabBar": "TabBar___2aDHU",
"Spacer": "Spacer___1VPRF",
"TabContent": "TabContent___27Qz1",
"DevToolsVersion": "DevToolsVersion___3_3UD"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/ErrorBoundary.css":
/*!******************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/ErrorBoundary.css ***!
\******************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".ErrorBoundary___24NcV {\n height: 100%;\n width: 100%;\n background-color: white;\n color: red;\n padding: 0.5rem;\n overflow: auto;\n}\n\n.Header___8LGXN {\n font-size: var(--font-size-sans-large);\n font-weight: bold;\n}\n\n.Stack___3-PTh {\n margin-top: 0.5rem;\n white-space: pre-wrap;\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-small);\n background-color: hsl(0, 100%, 97%);\n border: 1px solid hsl(0, 100%, 92%);\n border-radius: 0.25rem;\n padding: 0.5rem;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/ErrorBoundary.css"],"names":[],"mappings":"AAAA;EACE,aAAa;EACb,YAAY;EACZ,wBAAwB;EACxB,WAAW;EACX,gBAAgB;EAChB,eAAe;CAChB;;AAED;EACE,uCAAuC;EACvC,kBAAkB;CACnB;;AAED;EACE,mBAAmB;EACnB,sBAAsB;EACtB,0CAA0C;EAC1C,4CAA4C;EAC5C,oCAAoC;EACpC,oCAAoC;EACpC,uBAAuB;EACvB,gBAAgB;CACjB","file":"ErrorBoundary.css","sourcesContent":[".ErrorBoundary {\n height: 100%;\n width: 100%;\n background-color: white;\n color: red;\n padding: 0.5rem;\n overflow: auto;\n}\n\n.Header {\n font-size: var(--font-size-sans-large);\n font-weight: bold;\n}\n\n.Stack {\n margin-top: 0.5rem;\n white-space: pre-wrap;\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-small);\n background-color: hsl(0, 100%, 97%);\n border: 1px solid hsl(0, 100%, 92%);\n border-radius: 0.25rem;\n padding: 0.5rem;\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"ErrorBoundary": "ErrorBoundary___24NcV",
"Header": "Header___8LGXN",
"Stack": "Stack___3-PTh"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Icon.css":
/*!*********************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Icon.css ***!
\*********************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Icon___v5HwN {\n width: 1rem;\n height: 1rem;\n fill: currentColor;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Icon.css"],"names":[],"mappings":"AAAA;EACE,YAAY;EACZ,aAAa;EACb,mBAAmB;CACpB","file":"Icon.css","sourcesContent":[".Icon {\n width: 1rem;\n height: 1rem;\n fill: currentColor;\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"Icon": "Icon___v5HwN"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/ModalDialog.css":
/*!****************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/ModalDialog.css ***!
\****************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Background___39iOi {\n position: absolute;\n width: 100%;\n height: 100%;\n display: flex;\n align-items: flex-start;\n justify-content: center;\n padding: 1rem;\n background-color: var(--color-modal-background);\n overflow: auto;\n}\n\n.Dialog___2XI77 {\n position: relative;\n z-index: 3;\n width: 25rem;\n min-width: 20rem;\n max-width: 100%;\n display: inline-block;\n background-color: var(--color-background);\n box-shadow: 0 2px 4px var(--color-shadow);\n padding: 0.5rem;\n border: 1px solid var(--color-border);\n border-radius: 0.25rem;\n font-size: var(--font-size-sans-normal);\n}\n\n.Title___1FtK3 {\n font-size: var(--font-size-sans-large);\n margin-bottom: 0.5rem;\n}\n\n.Buttons___3N6w8 {\n text-align: right;\n margin-top: 0.5rem;\n}\n\n.Button___3JNc2 {\n font-size: var(--font-size-sans-large);\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/ModalDialog.css"],"names":[],"mappings":"AAAA;EACE,mBAAmB;EACnB,YAAY;EACZ,aAAa;EACb,cAAc;EACd,wBAAwB;EACxB,wBAAwB;EACxB,cAAc;EACd,gDAAgD;EAChD,eAAe;CAChB;;AAED;EACE,mBAAmB;EACnB,WAAW;EACX,aAAa;EACb,iBAAiB;EACjB,gBAAgB;EAChB,sBAAsB;EACtB,0CAA0C;EAC1C,0CAA0C;EAC1C,gBAAgB;EAChB,sCAAsC;EACtC,uBAAuB;EACvB,wCAAwC;CACzC;;AAED;EACE,uCAAuC;EACvC,sBAAsB;CACvB;;AAED;EACE,kBAAkB;EAClB,mBAAmB;CACpB;;AAED;EACE,uCAAuC;CACxC","file":"ModalDialog.css","sourcesContent":[".Background {\n position: absolute;\n width: 100%;\n height: 100%;\n display: flex;\n align-items: flex-start;\n justify-content: center;\n padding: 1rem;\n background-color: var(--color-modal-background);\n overflow: auto;\n}\n\n.Dialog {\n position: relative;\n z-index: 3;\n width: 25rem;\n min-width: 20rem;\n max-width: 100%;\n display: inline-block;\n background-color: var(--color-background);\n box-shadow: 0 2px 4px var(--color-shadow);\n padding: 0.5rem;\n border: 1px solid var(--color-border);\n border-radius: 0.25rem;\n font-size: var(--font-size-sans-normal);\n}\n\n.Title {\n font-size: var(--font-size-sans-large);\n margin-bottom: 0.5rem;\n}\n\n.Buttons {\n text-align: right;\n margin-top: 0.5rem;\n}\n\n.Button {\n font-size: var(--font-size-sans-large);\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"Background": "Background___39iOi",
"Dialog": "Dialog___2XI77",
"Title": "Title___1FtK3",
"Buttons": "Buttons___3N6w8",
"Button": "Button___3JNc2"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/ChartNode.css":
/*!***********************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Profiler/ChartNode.css ***!
\***********************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Group___2hArG {\n transition: all ease-in-out 250ms;\n}\n\n.Rect___fBfs_ {\n cursor: pointer;\n stroke: var(--color-background);\n transition: all ease-in-out 250ms;\n}\n\n.ForeignObject___2EdVc {\n pointer-events: none;\n transition: all ease-in-out 250ms;\n}\n\n.Div___1Pgrm {\n pointer-events: none;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n font-family: var(--font-family-sans);\n font-size: var(--font-size-sans-normal);\n margin-left: 0.25rem;\n margin-right: 0.25rem;\n line-height: 1.5;\n padding: 0 0 0;\n font-weight: 400;\n color: var(--color-commit-gradient-text);\n text-align: left;\n transition: all ease-in-out 250ms;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Profiler/ChartNode.css"],"names":[],"mappings":"AAAA;EACE,kCAAkC;CACnC;;AAED;EACE,gBAAgB;EAChB,gCAAgC;EAChC,kCAAkC;CACnC;;AAED;EACE,qBAAqB;EACrB,kCAAkC;CACnC;;AAED;EACE,qBAAqB;EACrB,oBAAoB;EACpB,wBAAwB;EACxB,iBAAiB;EACjB,qCAAqC;EACrC,wCAAwC;EACxC,qBAAqB;EACrB,sBAAsB;EACtB,iBAAiB;EACjB,eAAe;EACf,iBAAiB;EACjB,yCAAyC;EACzC,iBAAiB;EACjB,kCAAkC;CACnC","file":"ChartNode.css","sourcesContent":[".Group {\n transition: all ease-in-out 250ms;\n}\n\n.Rect {\n cursor: pointer;\n stroke: var(--color-background);\n transition: all ease-in-out 250ms;\n}\n\n.ForeignObject {\n pointer-events: none;\n transition: all ease-in-out 250ms;\n}\n\n.Div {\n pointer-events: none;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n font-family: var(--font-family-sans);\n font-size: var(--font-size-sans-normal);\n margin-left: 0.25rem;\n margin-right: 0.25rem;\n line-height: 1.5;\n padding: 0 0 0;\n font-weight: 400;\n color: var(--color-commit-gradient-text);\n text-align: left;\n transition: all ease-in-out 250ms;\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"Group": "Group___2hArG",
"Rect": "Rect___fBfs_",
"ForeignObject": "ForeignObject___2EdVc",
"Div": "Div___1Pgrm"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/CommitFlamegraph.css":
/*!******************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Profiler/CommitFlamegraph.css ***!
\******************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Container___WYOTp {\n width: 100%;\n flex: 1;\n padding: 0.5rem;\n}\n\n.PatternPath___2kgd1 {\n stroke: var(--color-commit-did-not-render-pattern);\n stroke-width: 1;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Profiler/CommitFlamegraph.css"],"names":[],"mappings":"AAAA;EACE,YAAY;EACZ,QAAQ;EACR,gBAAgB;CACjB;;AAED;EACE,mDAAmD;EACnD,gBAAgB;CACjB","file":"CommitFlamegraph.css","sourcesContent":[".Container {\n width: 100%;\n flex: 1;\n padding: 0.5rem;\n}\n\n.PatternPath {\n stroke: var(--color-commit-did-not-render-pattern);\n stroke-width: 1;\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"Container": "Container___WYOTp",
"PatternPath": "PatternPath___2kgd1"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/CommitRanked.css":
/*!**************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Profiler/CommitRanked.css ***!
\**************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Container___2D32U {\n width: 100%;\n flex: 1;\n padding: 0.5rem;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Profiler/CommitRanked.css"],"names":[],"mappings":"AAAA;EACE,YAAY;EACZ,QAAQ;EACR,gBAAgB;CACjB","file":"CommitRanked.css","sourcesContent":[".Container {\n width: 100%;\n flex: 1;\n padding: 0.5rem;\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"Container": "Container___2D32U"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/InteractionListItem.css":
/*!*********************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Profiler/InteractionListItem.css ***!
\*********************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Interaction___1wkkK,\n.SelectedInteraction___7La_q {\n display: flex;\n align-items: center;\n padding: 0 0.25rem;\n border-bottom: 1px solid var(--color-border);\n}\n\n.Interaction___1wkkK:hover {\n background-color: var(--color-background-hover);\n}\n\n.SelectedInteraction___7La_q {\n background-color: var(--color-background-hover);\n}\n\n.Name___3dY_4 {\n white-space: nowrap;\n overflow-x: hidden;\n text-overflow: ellipsis;\n}\n\n.Timeline___O0RIy {\n position: relative;\n height: 100%;\n}\n\n.InteractionLine___r6F9K {\n position: absolute;\n height: 3px;\n background-color: var(--color-commit-did-not-render-fill);\n color: var(--color-commit-did-not-render-fill-text);\n border-radius: 0.125rem;\n}\n\n.CommitBox___2Ly_w {\n position: absolute;\n width: var(--interaction-commit-size);\n height: var(--interaction-commit-size);\n background-color: var(--color-commit-did-not-render-fill);\n color: var(--color-commit-did-not-render-fill-text);\n cursor: pointer;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Profiler/InteractionListItem.css"],"names":[],"mappings":"AAAA;;EAEE,cAAc;EACd,oBAAoB;EACpB,mBAAmB;EACnB,6CAA6C;CAC9C;;AAED;EACE,gDAAgD;CACjD;;AAED;EACE,gDAAgD;CACjD;;AAED;EACE,oBAAoB;EACpB,mBAAmB;EACnB,wBAAwB;CACzB;;AAED;EACE,mBAAmB;EACnB,aAAa;CACd;;AAED;EACE,mBAAmB;EACnB,YAAY;EACZ,0DAA0D;EAC1D,oDAAoD;EACpD,wBAAwB;CACzB;;AAED;EACE,mBAAmB;EACnB,sCAAsC;EACtC,uCAAuC;EACvC,0DAA0D;EAC1D,oDAAoD;EACpD,gBAAgB;CACjB","file":"InteractionListItem.css","sourcesContent":[".Interaction,\n.SelectedInteraction {\n display: flex;\n align-items: center;\n padding: 0 0.25rem;\n border-bottom: 1px solid var(--color-border);\n}\n\n.Interaction:hover {\n background-color: var(--color-background-hover);\n}\n\n.SelectedInteraction {\n background-color: var(--color-background-hover);\n}\n\n.Name {\n white-space: nowrap;\n overflow-x: hidden;\n text-overflow: ellipsis;\n}\n\n.Timeline {\n position: relative;\n height: 100%;\n}\n\n.InteractionLine {\n position: absolute;\n height: 3px;\n background-color: var(--color-commit-did-not-render-fill);\n color: var(--color-commit-did-not-render-fill-text);\n border-radius: 0.125rem;\n}\n\n.CommitBox {\n position: absolute;\n width: var(--interaction-commit-size);\n height: var(--interaction-commit-size);\n background-color: var(--color-commit-did-not-render-fill);\n color: var(--color-commit-did-not-render-fill-text);\n cursor: pointer;\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"Interaction": "Interaction___1wkkK",
"SelectedInteraction": "SelectedInteraction___7La_q",
"Name": "Name___3dY_4",
"Timeline": "Timeline___O0RIy",
"InteractionLine": "InteractionLine___r6F9K",
"CommitBox": "CommitBox___2Ly_w"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/Interactions.css":
/*!**************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Profiler/Interactions.css ***!
\**************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Container___1CyNc {\n width: 100%;\n flex: 1;\n padding: 0.5rem;\n}\n\n.FocusTarget___3WP7F:focus {\n outline: none;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Profiler/Interactions.css"],"names":[],"mappings":"AAAA;EACE,YAAY;EACZ,QAAQ;EACR,gBAAgB;CACjB;;AAED;EACE,cAAc;CACf","file":"Interactions.css","sourcesContent":[".Container {\n width: 100%;\n flex: 1;\n padding: 0.5rem;\n}\n\n.FocusTarget:focus {\n outline: none;\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"Container": "Container___1CyNc",
"FocusTarget": "FocusTarget___3WP7F"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/NoCommitData.css":
/*!**************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Profiler/NoCommitData.css ***!
\**************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".NoCommitData___2oJ_z {\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n}\n\n.Header___1oGeD {\n font-size: var(--font-size-sans-large);\n margin-bottom: 0.5rem;\n}\n\n.FilterMessage___1Yg5n {\n display: flex;\n align-items: center;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Profiler/NoCommitData.css"],"names":[],"mappings":"AAAA;EACE,YAAY;EACZ,aAAa;EACb,cAAc;EACd,uBAAuB;EACvB,oBAAoB;EACpB,wBAAwB;CACzB;;AAED;EACE,uCAAuC;EACvC,sBAAsB;CACvB;;AAED;EACE,cAAc;EACd,oBAAoB;CACrB","file":"NoCommitData.css","sourcesContent":[".NoCommitData {\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n}\n\n.Header {\n font-size: var(--font-size-sans-large);\n margin-bottom: 0.5rem;\n}\n\n.FilterMessage {\n display: flex;\n align-items: center;\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"NoCommitData": "NoCommitData___2oJ_z",
"Header": "Header___1oGeD",
"FilterMessage": "FilterMessage___1Yg5n"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/NoInteractions.css":
/*!****************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Profiler/NoInteractions.css ***!
\****************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".NoInteractions___1FQiN {\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n}\n\n.Header___26pfp {\n font-size: var(--font-size-sans-large);\n}\n\n.Link___1QIRe {\n color: var(--color-button);\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Profiler/NoInteractions.css"],"names":[],"mappings":"AAAA;EACE,YAAY;EACZ,aAAa;EACb,cAAc;EACd,uBAAuB;EACvB,oBAAoB;EACpB,wBAAwB;CACzB;;AAED;EACE,uCAAuC;CACxC;;AAED;EACE,2BAA2B;CAC5B","file":"NoInteractions.css","sourcesContent":[".NoInteractions {\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n}\n\n.Header {\n font-size: var(--font-size-sans-large);\n}\n\n.Link {\n color: var(--color-button);\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"NoInteractions": "NoInteractions___1FQiN",
"Header": "Header___26pfp",
"Link": "Link___1QIRe"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/Profiler.css":
/*!**********************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Profiler/Profiler.css ***!
\**********************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Profiler___20Ry4 {\n width: 100%;\n height: 100%;\n position: relative;\n display: flex;\n flex-direction: row;\n align-items: stretch;\n font-family: var(--font-family-sans);\n font-size: var(--font-size-sans-normal);\n background-color: var(--color-background);\n color: var(--color-text);\n}\n\n.LeftColumn___3I7-I {\n display: flex;\n flex-direction: column;\n flex: 2 1 200px;\n border-top: 1px solid var(--color-border);\n}\n\n.RightColumn___3smXD {\n display: flex;\n flex-direction: column;\n flex: 1 1 100px;\n max-width: 300px;\n overflow-x: hidden;\n border-left: 1px solid var(--color-border);\n border-top: 1px solid var(--color-border);\n}\n\n.Content___1LjDy {\n position: relative;\n flex: 1 1 auto;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n}\n\n.Column___3WWtw {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 0 1rem;\n}\n\n.Paragraph___1HLty {\n text-align: center;\n}\n\n.Row___1RpSu {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: center;\n}\n\n.Header___QyJw2 {\n font-size: var(--font-size-sans-large);\n margin-bottom: 0.5rem;\n}\n\n.Toolbar___30kHu {\n height: 2.25rem;\n padding: 0 0.25rem;\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n border-bottom: 1px solid var(--color-border);\n}\n\n.VRule___2y9G3 {\n height: 20px;\n width: 1px;\n border-left: 1px solid var(--color-border);\n padding-left: 0.25rem;\n margin-left: 0.25rem;\n}\n\n.Spacer___1sezP {\n flex: 1;\n}\n\n.StopRecordingButton___1-ElU {\n font-size: var(--font-size-sans-large);\n padding: 0.5rem;\n}\n\n.ContentFallback___2Ata2 {\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: var(--font-size-sans-large);\n color: var(--color-dim);\n}\n\n.SnapshotSelectorFallback___3fsFv {\n height: 100%;\n padding-left: 0.5rem;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: var(--font-size-sans-large);\n color: var(--color-dim);\n}\n\n.Link___mZ2LE {\n color: var(--color-button);\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Profiler/Profiler.css"],"names":[],"mappings":"AAAA;EACE,YAAY;EACZ,aAAa;EACb,mBAAmB;EACnB,cAAc;EACd,oBAAoB;EACpB,qBAAqB;EACrB,qCAAqC;EACrC,wCAAwC;EACxC,0CAA0C;EAC1C,yBAAyB;CAC1B;;AAED;EACE,cAAc;EACd,uBAAuB;EACvB,gBAAgB;EAChB,0CAA0C;CAC3C;;AAED;EACE,cAAc;EACd,uBAAuB;EACvB,gBAAgB;EAChB,iBAAiB;EACjB,mBAAmB;EACnB,2CAA2C;EAC3C,0CAA0C;CAC3C;;AAED;EACE,mBAAmB;EACnB,eAAe;EACf,cAAc;EACd,uBAAuB;EACvB,oBAAoB;EACpB,wBAAwB;CACzB;;AAED;EACE,cAAc;EACd,uBAAuB;EACvB,oBAAoB;EACpB,wBAAwB;EACxB,gBAAgB;CACjB;;AAED;EACE,mBAAmB;CACpB;;AAED;EACE,cAAc;EACd,oBAAoB;EACpB,oBAAoB;EACpB,wBAAwB;CACzB;;AAED;EACE,uCAAuC;EACvC,sBAAsB;CACvB;;AAED;EACE,gBAAgB;EAChB,mBAAmB;EACnB,eAAe;EACf,cAAc;EACd,oBAAoB;EACpB,6CAA6C;CAC9C;;AAED;EACE,aAAa;EACb,WAAW;EACX,2CAA2C;EAC3C,sBAAsB;EACtB,qBAAqB;CACtB;;AAED;EACE,QAAQ;CACT;;AAED;EACE,uCAAuC;EACvC,gBAAgB;CACjB;;AAED;EACE,YAAY;EACZ,aAAa;EACb,cAAc;EACd,oBAAoB;EACpB,wBAAwB;EACxB,uCAAuC;EACvC,wBAAwB;CACzB;;AAED;EACE,aAAa;EACb,qBAAqB;EACrB,cAAc;EACd,oBAAoB;EACpB,wBAAwB;EACxB,uCAAuC;EACvC,wBAAwB;CACzB;;AAED;EACE,2BAA2B;CAC5B","file":"Profiler.css","sourcesContent":[".Profiler {\n width: 100%;\n height: 100%;\n position: relative;\n display: flex;\n flex-direction: row;\n align-items: stretch;\n font-family: var(--font-family-sans);\n font-size: var(--font-size-sans-normal);\n background-color: var(--color-background);\n color: var(--color-text);\n}\n\n.LeftColumn {\n display: flex;\n flex-direction: column;\n flex: 2 1 200px;\n border-top: 1px solid var(--color-border);\n}\n\n.RightColumn {\n display: flex;\n flex-direction: column;\n flex: 1 1 100px;\n max-width: 300px;\n overflow-x: hidden;\n border-left: 1px solid var(--color-border);\n border-top: 1px solid var(--color-border);\n}\n\n.Content {\n position: relative;\n flex: 1 1 auto;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n}\n\n.Column {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 0 1rem;\n}\n\n.Paragraph {\n text-align: center;\n}\n\n.Row {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: center;\n}\n\n.Header {\n font-size: var(--font-size-sans-large);\n margin-bottom: 0.5rem;\n}\n\n.Toolbar {\n height: 2.25rem;\n padding: 0 0.25rem;\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n border-bottom: 1px solid var(--color-border);\n}\n\n.VRule {\n height: 20px;\n width: 1px;\n border-left: 1px solid var(--color-border);\n padding-left: 0.25rem;\n margin-left: 0.25rem;\n}\n\n.Spacer {\n flex: 1;\n}\n\n.StopRecordingButton {\n font-size: var(--font-size-sans-large);\n padding: 0.5rem;\n}\n\n.ContentFallback {\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: var(--font-size-sans-large);\n color: var(--color-dim);\n}\n\n.SnapshotSelectorFallback {\n height: 100%;\n padding-left: 0.5rem;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: var(--font-size-sans-large);\n color: var(--color-dim);\n}\n\n.Link {\n color: var(--color-button);\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"Profiler": "Profiler___20Ry4",
"LeftColumn": "LeftColumn___3I7-I",
"RightColumn": "RightColumn___3smXD",
"Content": "Content___1LjDy",
"Column": "Column___3WWtw",
"Paragraph": "Paragraph___1HLty",
"Row": "Row___1RpSu",
"Header": "Header___QyJw2",
"Toolbar": "Toolbar___30kHu",
"VRule": "VRule___2y9G3",
"Spacer": "Spacer___1sezP",
"StopRecordingButton": "StopRecordingButton___1-ElU",
"ContentFallback": "ContentFallback___2Ata2",
"SnapshotSelectorFallback": "SnapshotSelectorFallback___3fsFv",
"Link": "Link___mZ2LE"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/ProfilingImportExportButtons.css":
/*!******************************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Profiler/ProfilingImportExportButtons.css ***!
\******************************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".VRule___2XiHw {\n height: 20px;\n width: 1px;\n border-left: 1px solid var(--color-border);\n padding-left: 0.25rem;\n margin-left: 0.25rem;\n}\n\n/**\n * https://developer.mozilla.org/en-US/docs/Web/API/File/Using_files_from_web_applications\n */\n.Input___2GKA7 {\n position: absolute !important;\n height: 1px;\n width: 1px;\n overflow: hidden;\n clip: rect(1px, 1px, 1px, 1px);\n}\n\n.ErrorMessage___3yR0b {\n margin: 0.5rem 0;\n color: var(--color-dim);\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-normal);\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Profiler/ProfilingImportExportButtons.css"],"names":[],"mappings":"AAAA;EACE,aAAa;EACb,WAAW;EACX,2CAA2C;EAC3C,sBAAsB;EACtB,qBAAqB;CACtB;;AAED;;GAEG;AACH;EACE,8BAA8B;EAC9B,YAAY;EACZ,WAAW;EACX,iBAAiB;EACjB,+BAA+B;CAChC;;AAED;EACE,iBAAiB;EACjB,wBAAwB;EACxB,0CAA0C;EAC1C,6CAA6C;CAC9C","file":"ProfilingImportExportButtons.css","sourcesContent":[".VRule {\n height: 20px;\n width: 1px;\n border-left: 1px solid var(--color-border);\n padding-left: 0.25rem;\n margin-left: 0.25rem;\n}\n\n/**\n * https://developer.mozilla.org/en-US/docs/Web/API/File/Using_files_from_web_applications\n */\n.Input {\n position: absolute !important;\n height: 1px;\n width: 1px;\n overflow: hidden;\n clip: rect(1px, 1px, 1px, 1px);\n}\n\n.ErrorMessage {\n margin: 0.5rem 0;\n color: var(--color-dim);\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-normal);\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"VRule": "VRule___2XiHw",
"Input": "Input___2GKA7",
"ErrorMessage": "ErrorMessage___3yR0b"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/RecordToggle.css":
/*!**************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Profiler/RecordToggle.css ***!
\**************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".ActiveRecordToggle___1Cpcb {\n color: var(--color-record-active);\n}\n.ActiveRecordToggle___1Cpcb:hover {\n color: var(--color-record-active);\n}\n.ActiveRecordToggle___1Cpcb:focus {\n color: var(--color-record-active);\n}\n.ActiveRecordToggle___1Cpcb:active {\n color: var(--color-record-hover);\n}\n\n.InactiveRecordToggle___2CUtF {\n color: var(--color-record-inactive);\n}\n.InactiveRecordToggle___2CUtF:hover {\n color: var(--color-record-hover);\n}\n.InactiveRecordToggle___2CUtF:focus {\n color: var(--color-record-inactive);\n}\n.InactiveRecordToggle___2CUtF:active {\n color: var(--color-record-hover);\n}\n\n.DisabledRecordToggle___gcsbF {\n color: var(--color-button-disabled);\n}\n.DisabledRecordToggle___gcsbF:hover {\n color: var(--color-button-disabled);\n}\n.DisabledRecordToggle___gcsbF:focus {\n color: var(--color-button-disabled);\n}\n.DisabledRecordToggle___gcsbF:active {\n color: var(--color-button-disabled);\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Profiler/RecordToggle.css"],"names":[],"mappings":"AAAA;EACE,kCAAkC;CACnC;AACD;EACE,kCAAkC;CACnC;AACD;EACE,kCAAkC;CACnC;AACD;EACE,iCAAiC;CAClC;;AAED;EACE,oCAAoC;CACrC;AACD;EACE,iCAAiC;CAClC;AACD;EACE,oCAAoC;CACrC;AACD;EACE,iCAAiC;CAClC;;AAED;EACE,oCAAoC;CACrC;AACD;EACE,oCAAoC;CACrC;AACD;EACE,oCAAoC;CACrC;AACD;EACE,oCAAoC;CACrC","file":"RecordToggle.css","sourcesContent":[".ActiveRecordToggle {\n color: var(--color-record-active);\n}\n.ActiveRecordToggle:hover {\n color: var(--color-record-active);\n}\n.ActiveRecordToggle:focus {\n color: var(--color-record-active);\n}\n.ActiveRecordToggle:active {\n color: var(--color-record-hover);\n}\n\n.InactiveRecordToggle {\n color: var(--color-record-inactive);\n}\n.InactiveRecordToggle:hover {\n color: var(--color-record-hover);\n}\n.InactiveRecordToggle:focus {\n color: var(--color-record-inactive);\n}\n.InactiveRecordToggle:active {\n color: var(--color-record-hover);\n}\n\n.DisabledRecordToggle {\n color: var(--color-button-disabled);\n}\n.DisabledRecordToggle:hover {\n color: var(--color-button-disabled);\n}\n.DisabledRecordToggle:focus {\n color: var(--color-button-disabled);\n}\n.DisabledRecordToggle:active {\n color: var(--color-button-disabled);\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"ActiveRecordToggle": "ActiveRecordToggle___1Cpcb",
"InactiveRecordToggle": "InactiveRecordToggle___2CUtF",
"DisabledRecordToggle": "DisabledRecordToggle___gcsbF"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/RootSelector.css":
/*!**************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Profiler/RootSelector.css ***!
\**************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Spacer___1c3sH {\n flex: 1;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Profiler/RootSelector.css"],"names":[],"mappings":"AAAA;EACE,QAAQ;CACT","file":"RootSelector.css","sourcesContent":[".Spacer {\n flex: 1;\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"Spacer": "Spacer___1c3sH"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/SidebarCommitInfo.css":
/*!*******************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Profiler/SidebarCommitInfo.css ***!
\*******************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Toolbar___CuJgF {\n height: 2.25rem;\n padding: 0 0.5rem;\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n border-bottom: 1px solid var(--color-border);\n}\n\n.Content___2tGS0 {\n padding: 0.5rem;\n user-select: none;\n overflow: auto;\n}\n\n.List___2AC9R {\n list-style: none;\n margin: 0;\n padding: 0;\n}\n\n.ListItem___2wzT0 {\n margin: 0 0 0.5rem;\n}\n\n.NoInteractions___2-rNG {\n color: var(--color-dim);\n}\n\n.Interactions___2JjM3 {\n margin: 0 0 0.5rem;\n}\n.Interaction___2_WfJ {\n display: block;\n width: 100%;\n text-align: left;\n background: none;\n border: none;\n padding: 0.25rem 0.5rem;\n color: var(--color-text);\n}\n.Interaction___2_WfJ:focus,\n.Interaction___2_WfJ:hover {\n outline: none;\n background-color: var(--color-background-hover);\n}\n\n.Label___3KINM {\n overflow: hidden;\n text-overflow: ellipsis;\n font-weight: bold;\n}\n\n.Value___3wrFP {\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-normal);\n}\n\n.NothingSelected___2Sj9L {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n color: var(--color-dim);\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Profiler/SidebarCommitInfo.css"],"names":[],"mappings":"AAAA;EACE,gBAAgB;EAChB,kBAAkB;EAClB,eAAe;EACf,cAAc;EACd,oBAAoB;EACpB,6CAA6C;CAC9C;;AAED;EACE,gBAAgB;EAChB,kBAAkB;EAClB,eAAe;CAChB;;AAED;EACE,iBAAiB;EACjB,UAAU;EACV,WAAW;CACZ;;AAED;EACE,mBAAmB;CACpB;;AAED;EACE,wBAAwB;CACzB;;AAED;EACE,mBAAmB;CACpB;AACD;EACE,eAAe;EACf,YAAY;EACZ,iBAAiB;EACjB,iBAAiB;EACjB,aAAa;EACb,wBAAwB;EACxB,yBAAyB;CAC1B;AACD;;EAEE,cAAc;EACd,gDAAgD;CACjD;;AAED;EACE,iBAAiB;EACjB,wBAAwB;EACxB,kBAAkB;CACnB;;AAED;EACE,0CAA0C;EAC1C,6CAA6C;CAC9C;;AAED;EACE,cAAc;EACd,oBAAoB;EACpB,wBAAwB;EACxB,aAAa;EACb,wBAAwB;CACzB","file":"SidebarCommitInfo.css","sourcesContent":[".Toolbar {\n height: 2.25rem;\n padding: 0 0.5rem;\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n border-bottom: 1px solid var(--color-border);\n}\n\n.Content {\n padding: 0.5rem;\n user-select: none;\n overflow: auto;\n}\n\n.List {\n list-style: none;\n margin: 0;\n padding: 0;\n}\n\n.ListItem {\n margin: 0 0 0.5rem;\n}\n\n.NoInteractions {\n color: var(--color-dim);\n}\n\n.Interactions {\n margin: 0 0 0.5rem;\n}\n.Interaction {\n display: block;\n width: 100%;\n text-align: left;\n background: none;\n border: none;\n padding: 0.25rem 0.5rem;\n color: var(--color-text);\n}\n.Interaction:focus,\n.Interaction:hover {\n outline: none;\n background-color: var(--color-background-hover);\n}\n\n.Label {\n overflow: hidden;\n text-overflow: ellipsis;\n font-weight: bold;\n}\n\n.Value {\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-normal);\n}\n\n.NothingSelected {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n color: var(--color-dim);\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"Toolbar": "Toolbar___CuJgF",
"Content": "Content___2tGS0",
"List": "List___2AC9R",
"ListItem": "ListItem___2wzT0",
"NoInteractions": "NoInteractions___2-rNG",
"Interactions": "Interactions___2JjM3",
"Interaction": "Interaction___2_WfJ",
"Label": "Label___3KINM",
"Value": "Value___3wrFP",
"NothingSelected": "NothingSelected___2Sj9L"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/SidebarInteractions.css":
/*!*********************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Profiler/SidebarInteractions.css ***!
\*********************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Toolbar___14c8s {\n height: 2.25rem;\n padding: 0 0.5rem;\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n}\n\n.Content___2Br59 {\n padding: 0.5rem;\n user-select: none;\n border-top: 1px solid var(--color-border);\n overflow: auto;\n}\n\n.Name___y3sqj {\n font-size: var(--font-size-sans-large);\n white-space: nowrap;\n overflow-x: hidden;\n text-overflow: ellipsis;\n}\n\n.NothingSelected___LXwMm {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n color: var(--color-dim);\n}\n\n.Commits___3dPiw {\n font-weight: bold;\n}\n\n.List___1d-dx {\n list-style: none;\n margin: 0;\n padding: 0;\n}\n\n.ListItem___6d_7z {\n display: flex;\n flex-direction: row;\n align-items: center;\n padding: 0.25rem 0.5rem;\n}\n.ListItem___6d_7z:hover {\n background-color: var(--color-background-hover);\n}\n\n.CommitBox___5r9ed {\n width: 20px;\n height: 20px;\n margin-right: 0.5rem;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Profiler/SidebarInteractions.css"],"names":[],"mappings":"AAAA;EACE,gBAAgB;EAChB,kBAAkB;EAClB,eAAe;EACf,cAAc;EACd,oBAAoB;CACrB;;AAED;EACE,gBAAgB;EAChB,kBAAkB;EAClB,0CAA0C;EAC1C,eAAe;CAChB;;AAED;EACE,uCAAuC;EACvC,oBAAoB;EACpB,mBAAmB;EACnB,wBAAwB;CACzB;;AAED;EACE,cAAc;EACd,oBAAoB;EACpB,wBAAwB;EACxB,aAAa;EACb,wBAAwB;CACzB;;AAED;EACE,kBAAkB;CACnB;;AAED;EACE,iBAAiB;EACjB,UAAU;EACV,WAAW;CACZ;;AAED;EACE,cAAc;EACd,oBAAoB;EACpB,oBAAoB;EACpB,wBAAwB;CACzB;AACD;EACE,gDAAgD;CACjD;;AAED;EACE,YAAY;EACZ,aAAa;EACb,qBAAqB;CACtB","file":"SidebarInteractions.css","sourcesContent":[".Toolbar {\n height: 2.25rem;\n padding: 0 0.5rem;\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n}\n\n.Content {\n padding: 0.5rem;\n user-select: none;\n border-top: 1px solid var(--color-border);\n overflow: auto;\n}\n\n.Name {\n font-size: var(--font-size-sans-large);\n white-space: nowrap;\n overflow-x: hidden;\n text-overflow: ellipsis;\n}\n\n.NothingSelected {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n color: var(--color-dim);\n}\n\n.Commits {\n font-weight: bold;\n}\n\n.List {\n list-style: none;\n margin: 0;\n padding: 0;\n}\n\n.ListItem {\n display: flex;\n flex-direction: row;\n align-items: center;\n padding: 0.25rem 0.5rem;\n}\n.ListItem:hover {\n background-color: var(--color-background-hover);\n}\n\n.CommitBox {\n width: 20px;\n height: 20px;\n margin-right: 0.5rem;\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"Toolbar": "Toolbar___14c8s",
"Content": "Content___2Br59",
"Name": "Name___y3sqj",
"NothingSelected": "NothingSelected___LXwMm",
"Commits": "Commits___3dPiw",
"List": "List___1d-dx",
"ListItem": "ListItem___6d_7z",
"CommitBox": "CommitBox___5r9ed"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/SidebarSelectedFiberInfo.css":
/*!**************************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Profiler/SidebarSelectedFiberInfo.css ***!
\**************************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Toolbar___2uBS2 {\n height: 2.25rem;\n padding: 0 0.5rem;\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n border-bottom: 1px solid var(--color-border);\n}\n\n.Content___1WAA9 {\n padding: 0.5rem;\n user-select: none;\n overflow-y: auto;\n}\n\n.WhatChanged___3T3Sx {\n margin-bottom: 1rem;\n}\n\n.Component___1oc9o {\n flex: 1;\n color: var(--color-component-name);\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-normal);\n white-space: nowrap;\n overflow-x: hidden;\n text-overflow: ellipsis;\n}\n\n.Label___buTyu {\n font-weight: bold;\n margin-bottom: 0.5rem;\n}\n\n.CurrentCommit___2ZAl5,\n.Commit___2PAr5 {\n display: block;\n width: 100%;\n text-align: left;\n background: none;\n border: none;\n padding: 0.25rem 0.5rem;\n color: var(--color-text);\n}\n.Commit___2PAr5:focus,\n.Commit___2PAr5:hover {\n outline: none;\n background-color: var(--color-background-hover);\n}\n\n.CurrentCommit___2ZAl5 {\n background-color: var(--color-background-selected);\n color: var(--color-text-selected);\n}\n.CurrentCommit___2ZAl5:focus {\n outline: none;\n}\n\n.WhatChangedItem___2pe1a {\n margin-top: 0.25rem;\n}\n\n.WhatChangedKey___2XHw- {\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-small);\n line-height: 1;\n}\n.WhatChangedKey___2XHw-:first-of-type::before {\n content: ' (';\n}\n.WhatChangedKey___2XHw-::after {\n content: ', ';\n}\n.WhatChangedKey___2XHw-:last-of-type::after {\n content: ')';\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Profiler/SidebarSelectedFiberInfo.css"],"names":[],"mappings":"AAAA;EACE,gBAAgB;EAChB,kBAAkB;EAClB,eAAe;EACf,cAAc;EACd,oBAAoB;EACpB,6CAA6C;CAC9C;;AAED;EACE,gBAAgB;EAChB,kBAAkB;EAClB,iBAAiB;CAClB;;AAED;EACE,oBAAoB;CACrB;;AAED;EACE,QAAQ;EACR,mCAAmC;EACnC,0CAA0C;EAC1C,6CAA6C;EAC7C,oBAAoB;EACpB,mBAAmB;EACnB,wBAAwB;CACzB;;AAED;EACE,kBAAkB;EAClB,sBAAsB;CACvB;;AAED;;EAEE,eAAe;EACf,YAAY;EACZ,iBAAiB;EACjB,iBAAiB;EACjB,aAAa;EACb,wBAAwB;EACxB,yBAAyB;CAC1B;AACD;;EAEE,cAAc;EACd,gDAAgD;CACjD;;AAED;EACE,mDAAmD;EACnD,kCAAkC;CACnC;AACD;EACE,cAAc;CACf;;AAED;EACE,oBAAoB;CACrB;;AAED;EACE,0CAA0C;EAC1C,4CAA4C;EAC5C,eAAe;CAChB;AACD;EACE,cAAc;CACf;AACD;EACE,cAAc;CACf;AACD;EACE,aAAa;CACd","file":"SidebarSelectedFiberInfo.css","sourcesContent":[".Toolbar {\n height: 2.25rem;\n padding: 0 0.5rem;\n flex: 0 0 auto;\n display: flex;\n align-items: center;\n border-bottom: 1px solid var(--color-border);\n}\n\n.Content {\n padding: 0.5rem;\n user-select: none;\n overflow-y: auto;\n}\n\n.WhatChanged {\n margin-bottom: 1rem;\n}\n\n.Component {\n flex: 1;\n color: var(--color-component-name);\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-normal);\n white-space: nowrap;\n overflow-x: hidden;\n text-overflow: ellipsis;\n}\n\n.Label {\n font-weight: bold;\n margin-bottom: 0.5rem;\n}\n\n.CurrentCommit,\n.Commit {\n display: block;\n width: 100%;\n text-align: left;\n background: none;\n border: none;\n padding: 0.25rem 0.5rem;\n color: var(--color-text);\n}\n.Commit:focus,\n.Commit:hover {\n outline: none;\n background-color: var(--color-background-hover);\n}\n\n.CurrentCommit {\n background-color: var(--color-background-selected);\n color: var(--color-text-selected);\n}\n.CurrentCommit:focus {\n outline: none;\n}\n\n.WhatChangedItem {\n margin-top: 0.25rem;\n}\n\n.WhatChangedKey {\n font-family: var(--font-family-monospace);\n font-size: var(--font-size-monospace-small);\n line-height: 1;\n}\n.WhatChangedKey:first-of-type::before {\n content: ' (';\n}\n.WhatChangedKey::after {\n content: ', ';\n}\n.WhatChangedKey:last-of-type::after {\n content: ')';\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"Toolbar": "Toolbar___2uBS2",
"Content": "Content___1WAA9",
"WhatChanged": "WhatChanged___3T3Sx",
"Component": "Component___1oc9o",
"Label": "Label___buTyu",
"CurrentCommit": "CurrentCommit___2ZAl5",
"Commit": "Commit___2PAr5",
"WhatChangedItem": "WhatChangedItem___2pe1a",
"WhatChangedKey": "WhatChangedKey___2XHw-"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/SnapshotCommitList.css":
/*!********************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Profiler/SnapshotCommitList.css ***!
\********************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".List___1_Mwa {\n /**\n * The decision to suppress the default (horizontal) scroll bars is intentional.\n * The snapshot selector is small enough that the scrollbar renders it essentially useless.\n * There are two alternative navigation mechanisms (arrow keys and arrow buttons).\n * If necessary, we could also expand the click-and-drag mechanism to scroll.\n */\n overflow-x: hidden !important;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Profiler/SnapshotCommitList.css"],"names":[],"mappings":"AAAA;EACE;;;;;KAKG;EACH,8BAA8B;CAC/B","file":"SnapshotCommitList.css","sourcesContent":[".List {\n /**\n * The decision to suppress the default (horizontal) scroll bars is intentional.\n * The snapshot selector is small enough that the scrollbar renders it essentially useless.\n * There are two alternative navigation mechanisms (arrow keys and arrow buttons).\n * If necessary, we could also expand the click-and-drag mechanism to scroll.\n */\n overflow-x: hidden !important;\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"List": "List___1_Mwa"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/SnapshotCommitListItem.css":
/*!************************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Profiler/SnapshotCommitListItem.css ***!
\************************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Outer___2YMUU {\n user-select: none;\n cursor: pointer;\n border-bottom: 3px solid transparent;\n padding-top: 4px;\n padding-bottom: 1px;\n display: flex;\n align-items: flex-end;\n}\n\n.Inner___TFCLU {\n width: 100%;\n min-height: 5px;\n background-color: var(--color-commit-did-not-render-fill);\n color: var(--color-commit-did-not-render-fill-text);\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Profiler/SnapshotCommitListItem.css"],"names":[],"mappings":"AAAA;EACE,kBAAkB;EAClB,gBAAgB;EAChB,qCAAqC;EACrC,iBAAiB;EACjB,oBAAoB;EACpB,cAAc;EACd,sBAAsB;CACvB;;AAED;EACE,YAAY;EACZ,gBAAgB;EAChB,0DAA0D;EAC1D,oDAAoD;CACrD","file":"SnapshotCommitListItem.css","sourcesContent":[".Outer {\n user-select: none;\n cursor: pointer;\n border-bottom: 3px solid transparent;\n padding-top: 4px;\n padding-bottom: 1px;\n display: flex;\n align-items: flex-end;\n}\n\n.Inner {\n width: 100%;\n min-height: 5px;\n background-color: var(--color-commit-did-not-render-fill);\n color: var(--color-commit-did-not-render-fill-text);\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"Outer": "Outer___2YMUU",
"Inner": "Inner___TFCLU"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/SnapshotSelector.css":
/*!******************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Profiler/SnapshotSelector.css ***!
\******************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Button___7tgtJ {\n flex: 0 0 auto;\n margin-left: 0.25rem;\n}\n\n.Commits___2KF5W {\n height: 100%;\n min-width: 30px;\n margin-left: 0.25rem;\n overflow: hidden;\n}\n.Commits___2KF5W:focus {\n outline: none;\n background-color: var(--color-button-background-focus);\n}\n\n.IndexLabel___36CS7 {\n flex: 0 0 auto;\n white-space: nowrap;\n font-family: var(--font-family-monospace);\n margin-left: 0.25rem;\n}\n\n.NoCommits___3GzV1 {\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n color: var(--color-dim);\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Profiler/SnapshotSelector.css"],"names":[],"mappings":"AAAA;EACE,eAAe;EACf,qBAAqB;CACtB;;AAED;EACE,aAAa;EACb,gBAAgB;EAChB,qBAAqB;EACrB,iBAAiB;CAClB;AACD;EACE,cAAc;EACd,uDAAuD;CACxD;;AAED;EACE,eAAe;EACf,oBAAoB;EACpB,0CAA0C;EAC1C,qBAAqB;CACtB;;AAED;EACE,aAAa;EACb,cAAc;EACd,oBAAoB;EACpB,wBAAwB;EACxB,wBAAwB;CACzB","file":"SnapshotSelector.css","sourcesContent":[".Button {\n flex: 0 0 auto;\n margin-left: 0.25rem;\n}\n\n.Commits {\n height: 100%;\n min-width: 30px;\n margin-left: 0.25rem;\n overflow: hidden;\n}\n.Commits:focus {\n outline: none;\n background-color: var(--color-button-background-focus);\n}\n\n.IndexLabel {\n flex: 0 0 auto;\n white-space: nowrap;\n font-family: var(--font-family-monospace);\n margin-left: 0.25rem;\n}\n\n.NoCommits {\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n color: var(--color-dim);\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"Button": "Button___7tgtJ",
"Commits": "Commits___2KF5W",
"IndexLabel": "IndexLabel___36CS7",
"NoCommits": "NoCommits___3GzV1"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/ReactLogo.css":
/*!**************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/ReactLogo.css ***!
\**************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".ReactLogo___O8zf5 {\n width: 1.75rem;\n height: 1.75rem;\n margin: 0 0.75rem 0 0.25rem;\n color: var(--color-button-active);\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/ReactLogo.css"],"names":[],"mappings":"AAAA;EACE,eAAe;EACf,gBAAgB;EAChB,4BAA4B;EAC5B,kCAAkC;CACnC","file":"ReactLogo.css","sourcesContent":[".ReactLogo {\n width: 1.75rem;\n height: 1.75rem;\n margin: 0 0.75rem 0 0.25rem;\n color: var(--color-button-active);\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"ReactLogo": "ReactLogo___O8zf5"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Settings/SettingsModal.css":
/*!***************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Settings/SettingsModal.css ***!
\***************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Background___3ncIs {\n position: absolute;\n z-index: 3;\n width: 100%;\n top: 0;\n bottom: 0;\n background-color: var(--color-modal-background);\n display: flex;\n align-items: flex-start;\n justify-content: center;\n font-size: var(--font-size-sans-normal);\n padding: 1rem;\n}\n\n.Modal___rU10h {\n display: flex;\n flex-direction: column;\n flex: 0 1 auto;\n max-height: 100%;\n background-color: var(--color-background);\n border: 1px solid var(--color-border);\n box-shadow: 0 2px 4px var(--color-shadow);\n border-radius: 0.25rem;\n overflow: auto;\n width: 400px;\n max-width: 100%;\n}\n\n.Spacer___3_C0y {\n flex: 1;\n}\n\n.Tabs___3mQky {\n display: flex;\n flex-direction: row;\n border-bottom: 1px solid var(--color-border);\n padding-right: 0.25rem;\n flex: 0 0 auto;\n}\n\n.Content___2YU9A {\n padding: 0.5rem;\n flex: 0 1 auto;\n overflow: auto;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Settings/SettingsModal.css"],"names":[],"mappings":"AAAA;EACE,mBAAmB;EACnB,WAAW;EACX,YAAY;EACZ,OAAO;EACP,UAAU;EACV,gDAAgD;EAChD,cAAc;EACd,wBAAwB;EACxB,wBAAwB;EACxB,wCAAwC;EACxC,cAAc;CACf;;AAED;EACE,cAAc;EACd,uBAAuB;EACvB,eAAe;EACf,iBAAiB;EACjB,0CAA0C;EAC1C,sCAAsC;EACtC,0CAA0C;EAC1C,uBAAuB;EACvB,eAAe;EACf,aAAa;EACb,gBAAgB;CACjB;;AAED;EACE,QAAQ;CACT;;AAED;EACE,cAAc;EACd,oBAAoB;EACpB,6CAA6C;EAC7C,uBAAuB;EACvB,eAAe;CAChB;;AAED;EACE,gBAAgB;EAChB,eAAe;EACf,eAAe;CAChB","file":"SettingsModal.css","sourcesContent":[".Background {\n position: absolute;\n z-index: 3;\n width: 100%;\n top: 0;\n bottom: 0;\n background-color: var(--color-modal-background);\n display: flex;\n align-items: flex-start;\n justify-content: center;\n font-size: var(--font-size-sans-normal);\n padding: 1rem;\n}\n\n.Modal {\n display: flex;\n flex-direction: column;\n flex: 0 1 auto;\n max-height: 100%;\n background-color: var(--color-background);\n border: 1px solid var(--color-border);\n box-shadow: 0 2px 4px var(--color-shadow);\n border-radius: 0.25rem;\n overflow: auto;\n width: 400px;\n max-width: 100%;\n}\n\n.Spacer {\n flex: 1;\n}\n\n.Tabs {\n display: flex;\n flex-direction: row;\n border-bottom: 1px solid var(--color-border);\n padding-right: 0.25rem;\n flex: 0 0 auto;\n}\n\n.Content {\n padding: 0.5rem;\n flex: 0 1 auto;\n overflow: auto;\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"Background": "Background___3ncIs",
"Modal": "Modal___rU10h",
"Spacer": "Spacer___3_C0y",
"Tabs": "Tabs___3mQky",
"Content": "Content___2YU9A"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Settings/SettingsShared.css":
/*!****************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Settings/SettingsShared.css ***!
\****************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Settings___29B2k {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n justify-content: flex-start;\n font-family: var(--font-family-sans);\n font-size: var(--font-size-sans-normal);\n}\n\n.Setting___1NJgU {\n margin-bottom: 0.5rem;\n}\n.Setting___1NJgU:last-of-type {\n margin-bottom: 0;\n}\n\n.OptionGroup___2ZgHP {\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n user-select: none;\n margin: 0 1rem 0.5rem 0;\n}\n.OptionGroup___2ZgHP:last-of-type {\n margin-right: 0;\n}\n\n.RadioLabel___1oyOB {\n display: inline;\n margin-right: 0.5rem;\n}\n\n.Select___1otXV {\n}\n\n.CheckboxOption___2XWVZ {\n display: block;\n padding: 0 0 0.5rem;\n}\n\n.HRule___1h4ad {\n height: 1px;\n background-color: var(--color-border);\n width: 100%;\n border: none;\n margin: 0.5rem 0;\n}\n\n.Header___NGIlt {\n font-size: var(--font-size-sans-large);\n margin-top: 0.5rem;\n}\n\n.ButtonIcon___3ZAjp {\n margin-right: 0.25rem;\n}\n\n.NoFiltersCell___1WYR2 {\n padding: 0.25rem 0;\n color: var(--color-dim);\n}\n\n.Table___2srES {\n min-width: 20rem;\n margin-top: 0.5rem;\n border-spacing: 0;\n}\n\n.TableRow___3kYuW {\n padding-bottom: 0.5rem;\n}\n\n.TableCell___1yj52 {\n padding: 0;\n padding-right: 0.5rem;\n}\n.TableCell___1yj52:last-of-type {\n text-align: right;\n padding-right: 0;\n}\n\n.Input___I9AdA {\n border: 1px solid var(--color-border);\n border-radius: 0.125rem;\n padding: 0.125rem;\n}\n\n.InvalidRegExp___35lmE,\n.InvalidRegExp___35lmE:active,\n.InvalidRegExp___35lmE:focus,\n.InvalidRegExp___35lmE:hover {\n color: var(--color-value-invalid);\n}\n\n.ToggleOffInvalid___2Rg2K,\n.ToggleOnInvalid___1Kamt,\n.ToggleOff___3cr6E,\n.ToggleOn___3KAVB {\n border-radius: 0.75rem;\n width: 1rem;\n height: 0.625rem;\n display: flex;\n align-items: center;\n padding: 0.125rem;\n}\n.ToggleOffInvalid___2Rg2K {\n background-color: var(--color-toggle-background-invalid);\n justify-content: flex-start;\n}\n.ToggleOnInvalid___1Kamt {\n background-color: var(--color-toggle-background-invalid);\n justify-content: flex-end;\n}\n.ToggleOff___3cr6E {\n background-color: var(--color-toggle-background-off);\n justify-content: flex-start;\n}\n.ToggleOn___3KAVB {\n background-color: var(--color-toggle-background-on);\n justify-content: flex-end;\n}\n\n.ToggleInsideOff___1pXcm,\n.ToggleInsideOn___3kEsU {\n border-radius: 0.375rem;\n width: 0.375rem;\n height: 0.375rem;\n background-color: var(--color-toggle-text);\n}\n\n.ReleaseNotes___q8NY1 {\n width: 100%;\n background-color: var(--color-background-hover);\n padding: 0.25rem 0.5rem;\n border-radius: 0.25rem;\n}\n\n.ReleaseNotesLink___2gjE8 {\n color: var(--color-button-active);\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Settings/SettingsShared.css"],"names":[],"mappings":"AAAA;EACE,cAAc;EACd,uBAAuB;EACvB,wBAAwB;EACxB,4BAA4B;EAC5B,qCAAqC;EACrC,wCAAwC;CACzC;;AAED;EACE,sBAAsB;CACvB;AACD;EACE,iBAAiB;CAClB;;AAED;EACE,qBAAqB;EACrB,oBAAoB;EACpB,oBAAoB;EACpB,kBAAkB;EAClB,wBAAwB;CACzB;AACD;EACE,gBAAgB;CACjB;;AAED;EACE,gBAAgB;EAChB,qBAAqB;CACtB;;AAED;CACC;;AAED;EACE,eAAe;EACf,oBAAoB;CACrB;;AAED;EACE,YAAY;EACZ,sCAAsC;EACtC,YAAY;EACZ,aAAa;EACb,iBAAiB;CAClB;;AAED;EACE,uCAAuC;EACvC,mBAAmB;CACpB;;AAED;EACE,sBAAsB;CACvB;;AAED;EACE,mBAAmB;EACnB,wBAAwB;CACzB;;AAED;EACE,iBAAiB;EACjB,mBAAmB;EACnB,kBAAkB;CACnB;;AAED;EACE,uBAAuB;CACxB;;AAED;EACE,WAAW;EACX,sBAAsB;CACvB;AACD;EACE,kBAAkB;EAClB,iBAAiB;CAClB;;AAED;EACE,sCAAsC;EACtC,wBAAwB;EACxB,kBAAkB;CACnB;;AAED;;;;EAIE,kCAAkC;CACnC;;AAED;;;;EAIE,uBAAuB;EACvB,YAAY;EACZ,iBAAiB;EACjB,cAAc;EACd,oBAAoB;EACpB,kBAAkB;CACnB;AACD;EACE,yDAAyD;EACzD,4BAA4B;CAC7B;AACD;EACE,yDAAyD;EACzD,0BAA0B;CAC3B;AACD;EACE,qDAAqD;EACrD,4BAA4B;CAC7B;AACD;EACE,oDAAoD;EACpD,0BAA0B;CAC3B;;AAED;;EAEE,wBAAwB;EACxB,gBAAgB;EAChB,iBAAiB;EACjB,2CAA2C;CAC5C;;AAED;EACE,YAAY;EACZ,gDAAgD;EAChD,wBAAwB;EACxB,uBAAuB;CACxB;;AAED;EACE,kCAAkC;CACnC","file":"SettingsShared.css","sourcesContent":[".Settings {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n justify-content: flex-start;\n font-family: var(--font-family-sans);\n font-size: var(--font-size-sans-normal);\n}\n\n.Setting {\n margin-bottom: 0.5rem;\n}\n.Setting:last-of-type {\n margin-bottom: 0;\n}\n\n.OptionGroup {\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n user-select: none;\n margin: 0 1rem 0.5rem 0;\n}\n.OptionGroup:last-of-type {\n margin-right: 0;\n}\n\n.RadioLabel {\n display: inline;\n margin-right: 0.5rem;\n}\n\n.Select {\n}\n\n.CheckboxOption {\n display: block;\n padding: 0 0 0.5rem;\n}\n\n.HRule {\n height: 1px;\n background-color: var(--color-border);\n width: 100%;\n border: none;\n margin: 0.5rem 0;\n}\n\n.Header {\n font-size: var(--font-size-sans-large);\n margin-top: 0.5rem;\n}\n\n.ButtonIcon {\n margin-right: 0.25rem;\n}\n\n.NoFiltersCell {\n padding: 0.25rem 0;\n color: var(--color-dim);\n}\n\n.Table {\n min-width: 20rem;\n margin-top: 0.5rem;\n border-spacing: 0;\n}\n\n.TableRow {\n padding-bottom: 0.5rem;\n}\n\n.TableCell {\n padding: 0;\n padding-right: 0.5rem;\n}\n.TableCell:last-of-type {\n text-align: right;\n padding-right: 0;\n}\n\n.Input {\n border: 1px solid var(--color-border);\n border-radius: 0.125rem;\n padding: 0.125rem;\n}\n\n.InvalidRegExp,\n.InvalidRegExp:active,\n.InvalidRegExp:focus,\n.InvalidRegExp:hover {\n color: var(--color-value-invalid);\n}\n\n.ToggleOffInvalid,\n.ToggleOnInvalid,\n.ToggleOff,\n.ToggleOn {\n border-radius: 0.75rem;\n width: 1rem;\n height: 0.625rem;\n display: flex;\n align-items: center;\n padding: 0.125rem;\n}\n.ToggleOffInvalid {\n background-color: var(--color-toggle-background-invalid);\n justify-content: flex-start;\n}\n.ToggleOnInvalid {\n background-color: var(--color-toggle-background-invalid);\n justify-content: flex-end;\n}\n.ToggleOff {\n background-color: var(--color-toggle-background-off);\n justify-content: flex-start;\n}\n.ToggleOn {\n background-color: var(--color-toggle-background-on);\n justify-content: flex-end;\n}\n\n.ToggleInsideOff,\n.ToggleInsideOn {\n border-radius: 0.375rem;\n width: 0.375rem;\n height: 0.375rem;\n background-color: var(--color-toggle-text);\n}\n\n.ReleaseNotes {\n width: 100%;\n background-color: var(--color-background-hover);\n padding: 0.25rem 0.5rem;\n border-radius: 0.25rem;\n}\n\n.ReleaseNotesLink {\n color: var(--color-button-active);\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"Settings": "Settings___29B2k",
"Setting": "Setting___1NJgU",
"OptionGroup": "OptionGroup___2ZgHP",
"RadioLabel": "RadioLabel___1oyOB",
"Select": "Select___1otXV",
"CheckboxOption": "CheckboxOption___2XWVZ",
"HRule": "HRule___1h4ad",
"Header": "Header___NGIlt",
"ButtonIcon": "ButtonIcon___3ZAjp",
"NoFiltersCell": "NoFiltersCell___1WYR2",
"Table": "Table___2srES",
"TableRow": "TableRow___3kYuW",
"TableCell": "TableCell___1yj52",
"Input": "Input___I9AdA",
"InvalidRegExp": "InvalidRegExp___35lmE",
"ToggleOffInvalid": "ToggleOffInvalid___2Rg2K",
"ToggleOnInvalid": "ToggleOnInvalid___1Kamt",
"ToggleOff": "ToggleOff___3cr6E",
"ToggleOn": "ToggleOn___3KAVB",
"ToggleInsideOff": "ToggleInsideOff___1pXcm",
"ToggleInsideOn": "ToggleInsideOn___3kEsU",
"ReleaseNotes": "ReleaseNotes___q8NY1",
"ReleaseNotesLink": "ReleaseNotesLink___2gjE8"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/TabBar.css":
/*!***********************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/TabBar.css ***!
\***********************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Tab___20JoC,\n.TabCurrent___b4c3L,\n.TabDisabled___l1-ZF {\n height: 100%;\n display: flex;\n align-items: center;\n cursor: pointer;\n border-top: 3px solid transparent;\n border-bottom: 3px solid transparent;\n user-select: none;\n color: var(--color-text);\n\n /* Electron drag area */\n -webkit-app-region: no-drag;\n}\n.Tab___20JoC:hover,\n.TabCurrent___b4c3L:hover {\n background-color: var(--color-background-hover);\n}\n.Tab___20JoC:focus-within,\n.TabCurrent___b4c3L:focus-within {\n background-color: var(--color-background-hover);\n}\n\n.TabCurrent___b4c3L {\n border-bottom: 3px solid var(--color-tab-selected-border);\n}\n\n.TabDisabled___l1-ZF {\n color: var(--color-dim);\n cursor: default;\n}\n\n.TabSizeNavigation___2GG1g {\n font-size: var(--font-size-sans-large);\n padding: 0.5rem 1rem;\n}\n.TabSizeProfiler___2wFBf {\n font-size: var(--font-size-sans-normal);\n padding: 0.25rem 0.5rem;\n}\n.TabSizeSettings___3V4f9 {\n font-size: var(--font-size-sans-normal);\n padding: 0.25rem 0.5rem;\n}\n\n.Input___2unCl {\n width: 0;\n margin: 0;\n opacity: 0;\n}\n\n.IconSizeNavigation___mZIpl,\n.IconSizeProfiler___1jYXs,\n.IconSizeSettings___1HNRk {\n margin-right: 0.5rem;\n color: var(--color-button-active);\n}\n\n.IconDisabled___17Sd2 {\n color: var(--color-dim);\n}\n\n.IconSizeNavigation___mZIpl {\n width: 1.5rem;\n height: 1.5rem;\n}\n.IconSizeProfiler___1jYXs {\n width: 1rem;\n height: 1rem;\n}\n.IconSizeSettings___1HNRk {\n width: 1rem;\n height: 1rem;\n}\n\n.TabLabelNavigation___2q3j3,\n.TabLabelProfiler___2QHeh,\n.TabLabelSettings___1pDKr {\n}\n\n@media screen and (max-width: 525px) {\n .IconSizeNavigation___mZIpl {\n margin-right: 0;\n }\n\n .TabLabelNavigation___2q3j3 {\n display: none;\n }\n}\n\n@media screen and (max-width: 900px) {\n .TabLabelProfiler___2QHeh {\n display: none;\n }\n\n .IconSizeProfiler___1jYXs {\n margin-right: 0;\n }\n}\n\n@media screen and (max-width: 400px) {\n .TabLabelSettings___1pDKr {\n display: none;\n }\n\n .IconSizeSettings___1HNRk {\n margin-right: 0;\n }\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/TabBar.css"],"names":[],"mappings":"AAAA;;;EAGE,aAAa;EACb,cAAc;EACd,oBAAoB;EACpB,gBAAgB;EAChB,kCAAkC;EAClC,qCAAqC;EACrC,kBAAkB;EAClB,yBAAyB;;EAEzB,wBAAwB;EACxB,4BAA4B;CAC7B;AACD;;EAEE,gDAAgD;CACjD;AACD;;EAEE,gDAAgD;CACjD;;AAED;EACE,0DAA0D;CAC3D;;AAED;EACE,wBAAwB;EACxB,gBAAgB;CACjB;;AAED;EACE,uCAAuC;EACvC,qBAAqB;CACtB;AACD;EACE,wCAAwC;EACxC,wBAAwB;CACzB;AACD;EACE,wCAAwC;EACxC,wBAAwB;CACzB;;AAED;EACE,SAAS;EACT,UAAU;EACV,WAAW;CACZ;;AAED;;;EAGE,qBAAqB;EACrB,kCAAkC;CACnC;;AAED;EACE,wBAAwB;CACzB;;AAED;EACE,cAAc;EACd,eAAe;CAChB;AACD;EACE,YAAY;EACZ,aAAa;CACd;AACD;EACE,YAAY;EACZ,aAAa;CACd;;AAED;;;CAGC;;AAED;EACE;IACE,gBAAgB;GACjB;;EAED;IACE,cAAc;GACf;CACF;;AAED;EACE;IACE,cAAc;GACf;;EAED;IACE,gBAAgB;GACjB;CACF;;AAED;EACE;IACE,cAAc;GACf;;EAED;IACE,gBAAgB;GACjB;CACF","file":"TabBar.css","sourcesContent":[".Tab,\n.TabCurrent,\n.TabDisabled {\n height: 100%;\n display: flex;\n align-items: center;\n cursor: pointer;\n border-top: 3px solid transparent;\n border-bottom: 3px solid transparent;\n user-select: none;\n color: var(--color-text);\n\n /* Electron drag area */\n -webkit-app-region: no-drag;\n}\n.Tab:hover,\n.TabCurrent:hover {\n background-color: var(--color-background-hover);\n}\n.Tab:focus-within,\n.TabCurrent:focus-within {\n background-color: var(--color-background-hover);\n}\n\n.TabCurrent {\n border-bottom: 3px solid var(--color-tab-selected-border);\n}\n\n.TabDisabled {\n color: var(--color-dim);\n cursor: default;\n}\n\n.TabSizeNavigation {\n font-size: var(--font-size-sans-large);\n padding: 0.5rem 1rem;\n}\n.TabSizeProfiler {\n font-size: var(--font-size-sans-normal);\n padding: 0.25rem 0.5rem;\n}\n.TabSizeSettings {\n font-size: var(--font-size-sans-normal);\n padding: 0.25rem 0.5rem;\n}\n\n.Input {\n width: 0;\n margin: 0;\n opacity: 0;\n}\n\n.IconSizeNavigation,\n.IconSizeProfiler,\n.IconSizeSettings {\n margin-right: 0.5rem;\n color: var(--color-button-active);\n}\n\n.IconDisabled {\n color: var(--color-dim);\n}\n\n.IconSizeNavigation {\n width: 1.5rem;\n height: 1.5rem;\n}\n.IconSizeProfiler {\n width: 1rem;\n height: 1rem;\n}\n.IconSizeSettings {\n width: 1rem;\n height: 1rem;\n}\n\n.TabLabelNavigation,\n.TabLabelProfiler,\n.TabLabelSettings {\n}\n\n@media screen and (max-width: 525px) {\n .IconSizeNavigation {\n margin-right: 0;\n }\n\n .TabLabelNavigation {\n display: none;\n }\n}\n\n@media screen and (max-width: 900px) {\n .TabLabelProfiler {\n display: none;\n }\n\n .IconSizeProfiler {\n margin-right: 0;\n }\n}\n\n@media screen and (max-width: 400px) {\n .TabLabelSettings {\n display: none;\n }\n\n .IconSizeSettings {\n margin-right: 0;\n }\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"Tab": "Tab___20JoC",
"TabCurrent": "TabCurrent___b4c3L",
"TabDisabled": "TabDisabled___l1-ZF",
"TabSizeNavigation": "TabSizeNavigation___2GG1g",
"TabSizeProfiler": "TabSizeProfiler___2wFBf",
"TabSizeSettings": "TabSizeSettings___3V4f9",
"Input": "Input___2unCl",
"IconSizeNavigation": "IconSizeNavigation___mZIpl",
"IconSizeProfiler": "IconSizeProfiler___1jYXs",
"IconSizeSettings": "IconSizeSettings___1HNRk",
"IconDisabled": "IconDisabled___17Sd2",
"TabLabelNavigation": "TabLabelNavigation___2q3j3",
"TabLabelProfiler": "TabLabelProfiler___2QHeh",
"TabLabelSettings": "TabLabelSettings___1pDKr"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Toggle.css":
/*!***********************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Toggle.css ***!
\***********************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".ToggleDisabled___iQeZ3,\n.ToggleOn___3XJTo,\n.ToggleOff___142SC {\n background: var(--color-button-background);\n border: none;\n border-radius: 0.25rem;\n padding: 0;\n flex: 0 0 auto;\n}\n\n.ToggleContent___1C-vg {\n display: inline-flex;\n align-items: center;\n border-radius: 0.25rem;\n padding: 0.25rem;\n}\n\n.ToggleOff___142SC {\n border: none;\n background: var(--color-button-background);\n color: var(--color-button);\n}\n.ToggleOff___142SC:hover {\n color: var(--color-button-hover);\n}\n\n.ToggleOn___3XJTo,\n.ToggleOn___3XJTo:active {\n color: var(--color-button-active);\n outline: none;\n}\n\n.ToggleOn___3XJTo:focus,\n.ToggleOff___142SC:focus,\n.ToggleContent___1C-vg:focus {\n outline: none;\n}\n\n.ToggleOn___3XJTo:focus > .ToggleContent___1C-vg,\n.ToggleOff___142SC:focus > .ToggleContent___1C-vg {\n background: var(--color-button-background-focus);\n}\n\n.ToggleDisabled___iQeZ3 {\n background: var(--color-button-background);\n color: var(--color-button-disabled);\n cursor: default;\n}\n\n.Input___ESX-3 {\n width: 0;\n margin: 0;\n opacity: 0;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Toggle.css"],"names":[],"mappings":"AAAA;;;EAGE,2CAA2C;EAC3C,aAAa;EACb,uBAAuB;EACvB,WAAW;EACX,eAAe;CAChB;;AAED;EACE,qBAAqB;EACrB,oBAAoB;EACpB,uBAAuB;EACvB,iBAAiB;CAClB;;AAED;EACE,aAAa;EACb,2CAA2C;EAC3C,2BAA2B;CAC5B;AACD;EACE,iCAAiC;CAClC;;AAED;;EAEE,kCAAkC;EAClC,cAAc;CACf;;AAED;;;EAGE,cAAc;CACf;;AAED;;EAEE,iDAAiD;CAClD;;AAED;EACE,2CAA2C;EAC3C,oCAAoC;EACpC,gBAAgB;CACjB;;AAED;EACE,SAAS;EACT,UAAU;EACV,WAAW;CACZ","file":"Toggle.css","sourcesContent":[".ToggleDisabled,\n.ToggleOn,\n.ToggleOff {\n background: var(--color-button-background);\n border: none;\n border-radius: 0.25rem;\n padding: 0;\n flex: 0 0 auto;\n}\n\n.ToggleContent {\n display: inline-flex;\n align-items: center;\n border-radius: 0.25rem;\n padding: 0.25rem;\n}\n\n.ToggleOff {\n border: none;\n background: var(--color-button-background);\n color: var(--color-button);\n}\n.ToggleOff:hover {\n color: var(--color-button-hover);\n}\n\n.ToggleOn,\n.ToggleOn:active {\n color: var(--color-button-active);\n outline: none;\n}\n\n.ToggleOn:focus,\n.ToggleOff:focus,\n.ToggleContent:focus {\n outline: none;\n}\n\n.ToggleOn:focus > .ToggleContent,\n.ToggleOff:focus > .ToggleContent {\n background: var(--color-button-background-focus);\n}\n\n.ToggleDisabled {\n background: var(--color-button-background);\n color: var(--color-button-disabled);\n cursor: default;\n}\n\n.Input {\n width: 0;\n margin: 0;\n opacity: 0;\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"ToggleDisabled": "ToggleDisabled___iQeZ3",
"ToggleOn": "ToggleOn___3XJTo",
"ToggleOff": "ToggleOff___142SC",
"ToggleContent": "ToggleContent___1C-vg",
"Input": "Input___ESX-3"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Tooltip.css":
/*!************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/Tooltip.css ***!
\************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Tooltip___3QR8H {\n border: none;\n border-radius: 0.25rem;\n padding: 0.25rem 0.5rem;\n font-family: var(--font-family-sans);\n font-size: 12px;\n background-color: var(--color-tooltip-background);\n color: var(--color-tooltip-text);\n\n /* Make sure this is above the DevTools, which are above the Overlay */\n z-index: 10000002;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/Tooltip.css"],"names":[],"mappings":"AAAA;EACE,aAAa;EACb,uBAAuB;EACvB,wBAAwB;EACxB,qCAAqC;EACrC,gBAAgB;EAChB,kDAAkD;EAClD,iCAAiC;;EAEjC,uEAAuE;EACvE,kBAAkB;CACnB","file":"Tooltip.css","sourcesContent":[".Tooltip {\n border: none;\n border-radius: 0.25rem;\n padding: 0.25rem 0.5rem;\n font-family: var(--font-family-sans);\n font-size: 12px;\n background-color: var(--color-tooltip-background);\n color: var(--color-tooltip-text);\n\n /* Make sure this is above the DevTools, which are above the Overlay */\n z-index: 10000002;\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"Tooltip": "Tooltip___3QR8H"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/UnsupportedVersionDialog.css":
/*!*****************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/UnsupportedVersionDialog.css ***!
\*****************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Row___3IwJ6 { \n display: flex; \n flex-direction: row; \n align-items: center; \n} \n\n.Column___w9Fle { \n display: flex; \n flex-direction: column; \n align-items: center; \n} \n\n.Title___1PTyg { \n font-size: var(--font-size-sans-large); \n margin-bottom: 0.5rem; \n} \n\n.ReleaseNotesLink___2_Y38 { \n color: var(--color-button-active); \n}", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/UnsupportedVersionDialog.css"],"names":[],"mappings":"AAAA;EACE,cAAc;EACd,oBAAoB;EACpB,oBAAoB;CACrB;;AAED;EACE,cAAc;EACd,uBAAuB;EACvB,oBAAoB;CACrB;;AAED;EACE,uCAAuC;EACvC,sBAAsB;CACvB;;AAED;EACE,kCAAkC;CACnC","file":"UnsupportedVersionDialog.css","sourcesContent":[".Row { \n display: flex; \n flex-direction: row; \n align-items: center; \n} \n\n.Column { \n display: flex; \n flex-direction: column; \n align-items: center; \n} \n\n.Title { \n font-size: var(--font-size-sans-large); \n margin-bottom: 0.5rem; \n} \n\n.ReleaseNotesLink { \n color: var(--color-button-active); \n}"],"sourceRoot":""}]);
// exports
exports.locals = {
"Row": "Row___3IwJ6",
"Column": "Column___w9Fle",
"Title": "Title___1PTyg",
"ReleaseNotesLink": "ReleaseNotesLink___2_Y38"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/WarnIfLegacyBackendDetected.css":
/*!********************************************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/WarnIfLegacyBackendDetected.css ***!
\********************************************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ".Command___2iS3V {\n background-color: var(--color-dimmest);\n padding: 0.25rem 0.5rem;\n display: block;\n border-radius: 0.125rem;\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/WarnIfLegacyBackendDetected.css"],"names":[],"mappings":"AAAA;EACE,uCAAuC;EACvC,wBAAwB;EACxB,eAAe;EACf,wBAAwB;CACzB","file":"WarnIfLegacyBackendDetected.css","sourcesContent":[".Command {\n background-color: var(--color-dimmest);\n padding: 0.25rem 0.5rem;\n display: block;\n border-radius: 0.125rem;\n}\n"],"sourceRoot":""}]);
// exports
exports.locals = {
"Command": "Command___2iS3V"
};
/***/ }),
/***/ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/root.css":
/*!*********************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader??ref--5-1!../react-devtools-shared/src/devtools/views/root.css ***!
\*********************************************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
exports = module.exports = __webpack_require__(/*! ../../../../../node_modules/css-loader/lib/css-base.js */ "../../node_modules/css-loader/lib/css-base.js")(true);
// imports
// module
exports.push([module.i, ":root {\n /**\n * IMPORTANT: When new theme variables are added below– also add them to SettingsContext updateThemeVariables()\n */\n\n /* Light theme */\n --light-color-attribute-name: #ef6632;\n --light-color-attribute-name-inverted: rgba(255, 255, 255, 0.7);\n --light-color-attribute-value: #1a1aa6;\n --light-color-attribute-value-inverted: #ffffff;\n --light-color-attribute-editable-value: #1a1aa6;\n --light-color-background: #ffffff;\n --light-color-background-hover: rgba(0, 136, 250, 0.1);\n --light-color-background-inactive: #e5e5e5;\n --light-color-background-invalid: #fff0f0;\n --light-color-background-selected: #0088fa;\n --light-color-button-background: #ffffff;\n --light-color-button-background-focus: #ededed;\n --light-color-button: #5f6673;\n --light-color-button-disabled: #cfd1d5;\n --light-color-button-active: #0088fa;\n --light-color-button-focus: #23272f;\n --light-color-button-hover: #23272f;\n --light-color-border: #eeeeee;\n --light-color-commit-did-not-render-fill: #cfd1d5;\n --light-color-commit-did-not-render-fill-text: #000000;\n --light-color-commit-did-not-render-pattern: #cfd1d5;\n --light-color-commit-did-not-render-pattern-text: #333333;\n --light-color-commit-gradient-0: #37afa9;\n --light-color-commit-gradient-1: #63b19e;\n --light-color-commit-gradient-2: #80b393;\n --light-color-commit-gradient-3: #97b488;\n --light-color-commit-gradient-4: #abb67d;\n --light-color-commit-gradient-5: #beb771;\n --light-color-commit-gradient-6: #cfb965;\n --light-color-commit-gradient-7: #dfba57;\n --light-color-commit-gradient-8: #efbb49;\n --light-color-commit-gradient-9: #febc38;\n --light-color-commit-gradient-text: #000000;\n --light-color-component-name: #6a51b2;\n --light-color-component-name-inverted: #ffffff;\n --light-color-component-badge-background: rgba(0, 0, 0, 0.1);\n --light-color-component-badge-background-inverted: rgba(255, 255, 255, 0.25);\n --light-color-component-badge-count: #777d88;\n --light-color-component-badge-count-inverted: rgba(255, 255, 255, 0.7);\n --light-color-context-background: rgba(0,0,0,.9);\n --light-color-context-background-hover: rgba(255, 255, 255, 0.1);\n --light-color-context-background-selected: #178fb9;\n --light-color-context-border: #3d424a;\n --light-color-context-text: #ffffff;\n --light-color-context-text-selected: #ffffff;\n --light-color-dim: #777d88;\n --light-color-dimmer: #cfd1d5;\n --light-color-dimmest: #eff0f1;\n --light-color-expand-collapse-toggle: #777d88;\n --light-color-modal-background: rgba(255, 255, 255, 0.75);\n --light-color-record-active: #fc3a4b;\n --light-color-record-hover: #3578e5;\n --light-color-record-inactive: #0088fa;\n --light-color-scroll-thumb: #c2c2c2;\n --light-color-scroll-track: #fafafa;\n --light-color-search-match: yellow;\n --light-color-search-match-current: #f7923b;\n --light-color-selected-tree-highlight-active: rgba(0, 136, 250, 0.1);\n --light-color-selected-tree-highlight-inactive: rgba(0, 0, 0, 0.05);\n --light-color-shadow: rgba(0, 0, 0, 0.25);\n --light-color-tab-selected-border: #0088fa;\n --light-color-text: #000000;\n --light-color-text-invalid: #ff0000;\n --light-color-text-selected: #ffffff;\n --light-color-toggle-background-invalid: #fc3a4b;\n --light-color-toggle-background-on: #0088fa;\n --light-color-toggle-background-off: #cfd1d5;\n --light-color-toggle-text: #ffffff;\n --light-color-tooltip-background: rgba(0, 0, 0, 0.9);\n --light-color-tooltip-text: #ffffff;\n\n /* Dark theme */\n --dark-color-attribute-name: #9d87d2;\n --dark-color-attribute-name-inverted: #282828;\n --dark-color-attribute-value: #cedae0;\n --dark-color-attribute-value-inverted: #ffffff;\n --dark-color-attribute-editable-value: yellow;\n --dark-color-background: #282c34;\n --dark-color-background-hover: rgba(255, 255, 255, 0.1);\n --dark-color-background-inactive: #3d424a;\n --dark-color-background-invalid: #5c0000;\n --dark-color-background-selected: #178fb9;\n --dark-color-button-background: #282c34;\n --dark-color-button-background-focus: #3d424a;\n --dark-color-button: #afb3b9;\n --dark-color-button-active: #61dafb;\n --dark-color-button-disabled: #4f5766;\n --dark-color-button-focus: #a2e9fc;\n --dark-color-button-hover: #ededed;\n --dark-color-border: #3d424a;\n --dark-color-commit-did-not-render-fill: #777d88;\n --dark-color-commit-did-not-render-fill-text: #000000;\n --dark-color-commit-did-not-render-pattern: #666c77;\n --dark-color-commit-did-not-render-pattern-text: #ffffff;\n --dark-color-commit-gradient-0: #37afa9;\n --dark-color-commit-gradient-1: #63b19e;\n --dark-color-commit-gradient-2: #80b393;\n --dark-color-commit-gradient-3: #97b488;\n --dark-color-commit-gradient-4: #abb67d;\n --dark-color-commit-gradient-5: #beb771;\n --dark-color-commit-gradient-6: #cfb965;\n --dark-color-commit-gradient-7: #dfba57;\n --dark-color-commit-gradient-8: #efbb49;\n --dark-color-commit-gradient-9: #febc38;\n --dark-color-commit-gradient-text: #000000;\n --dark-color-component-name: #61dafb;\n --dark-color-component-name-inverted: #282828;\n --dark-color-component-badge-background: rgba(255, 255, 255, 0.25);\n --dark-color-component-badge-background-inverted: rgba(0, 0, 0, 0.25);\n --dark-color-component-badge-count: #8f949d;\n --dark-color-component-badge-count-inverted: rgba(255, 255, 255, 0.7);\n --dark-color-context-background: rgba(255,255,255,.9);\n --dark-color-context-background-hover: rgba(0, 136, 250, 0.1);\n --dark-color-context-background-selected: #0088fa;\n --dark-color-context-border: #eeeeee;\n --dark-color-context-text: #000000;\n --dark-color-context-text-selected: #ffffff;\n --dark-color-dim: #8f949d;\n --dark-color-dimmer: #777d88;\n --dark-color-dimmest: #4f5766;\n --dark-color-expand-collapse-toggle: #8f949d;\n --dark-color-modal-background: rgba(0, 0, 0, 0.75);\n --dark-color-record-active: #fc3a4b;\n --dark-color-record-hover: #a2e9fc;\n --dark-color-record-inactive: #61dafb;\n --dark-color-scroll-thumb: #afb3b9;\n --dark-color-scroll-track: #313640;\n --dark-color-search-match: yellow;\n --dark-color-search-match-current: #f7923b;\n --dark-color-selected-tree-highlight-active: rgba(23, 143, 185, 0.15);\n --dark-color-selected-tree-highlight-inactive: rgba(255, 255, 255, 0.05);\n --dark-color-shadow: rgba(0, 0, 0, 0.5);\n --dark-color-tab-selected-border: #178fb9;\n --dark-color-text: #ffffff;\n --dark-color-text-invalid: #ff8080;\n --dark-color-text-selected: #ffffff;\n --dark-color-toggle-background-invalid: #fc3a4b;\n --dark-color-toggle-background-on: #178fb9;\n --dark-color-toggle-background-off: #777d88;\n --dark-color-toggle-text: #ffffff;\n --dark-color-tooltip-background: rgba(255, 255, 255, 0.9);\n --dark-color-tooltip-text: #000000;\n\n /* Font smoothing */\n --light-font-smoothing: auto;\n --dark-font-smoothing: antialiased;\n --font-smoothing: auto;\n\n /* Compact density */\n --compact-font-size-monospace-small: 9px;\n --compact-font-size-monospace-normal: 11px;\n --compact-font-size-monospace-large: 15px;\n --compact-font-size-sans-small: 10px;\n --compact-font-size-sans-normal: 12px;\n --compact-font-size-sans-large: 14px;\n --compact-line-height-data: 18px;\n --compact-root-font-size: 16px;\n\n /* Comfortable density */\n --comfortable-font-size-monospace-small: 10px;\n --comfortable-font-size-monospace-normal: 13px;\n --comfortable-font-size-monospace-large: 17px;\n --comfortable-font-size-sans-small: 12px;\n --comfortable-font-size-sans-normal: 14px;\n --comfortable-font-size-sans-large: 16px;\n --comfortable-line-height-data: 22px;\n --comfortable-root-font-size: 20px;\n\n /* GitHub.com system fonts */\n --font-family-monospace: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo,\n Courier, monospace;\n --font-family-sans: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica,\n Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;\n\n /* Constant values shared between JS and CSS */\n --interaction-commit-size: 10px;\n --interaction-label-width: 200px;\n}\n\n* {\n box-sizing: border-box;\n\n -webkit-font-smoothing: var(--font-smoothing);\n}\n", "", {"version":3,"sources":["/Users/bvaughn/Documents/git/react/packages/react-devtools-shared/src/devtools/views/root.css"],"names":[],"mappings":"AAAA;EACE;;KAEG;;EAEH,iBAAiB;EACjB,sCAAsC;EACtC,gEAAgE;EAChE,uCAAuC;EACvC,gDAAgD;EAChD,gDAAgD;EAChD,kCAAkC;EAClC,uDAAuD;EACvD,2CAA2C;EAC3C,0CAA0C;EAC1C,2CAA2C;EAC3C,yCAAyC;EACzC,+CAA+C;EAC/C,8BAA8B;EAC9B,uCAAuC;EACvC,qCAAqC;EACrC,oCAAoC;EACpC,oCAAoC;EACpC,8BAA8B;EAC9B,kDAAkD;EAClD,uDAAuD;EACvD,qDAAqD;EACrD,0DAA0D;EAC1D,yCAAyC;EACzC,yCAAyC;EACzC,yCAAyC;EACzC,yCAAyC;EACzC,yCAAyC;EACzC,yCAAyC;EACzC,yCAAyC;EACzC,yCAAyC;EACzC,yCAAyC;EACzC,yCAAyC;EACzC,4CAA4C;EAC5C,sCAAsC;EACtC,+CAA+C;EAC/C,6DAA6D;EAC7D,6EAA6E;EAC7E,6CAA6C;EAC7C,uEAAuE;EACvE,iDAAiD;EACjD,iEAAiE;EACjE,mDAAmD;EACnD,sCAAsC;EACtC,oCAAoC;EACpC,6CAA6C;EAC7C,2BAA2B;EAC3B,8BAA8B;EAC9B,+BAA+B;EAC/B,8CAA8C;EAC9C,0DAA0D;EAC1D,qCAAqC;EACrC,oCAAoC;EACpC,uCAAuC;EACvC,oCAAoC;EACpC,oCAAoC;EACpC,mCAAmC;EACnC,4CAA4C;EAC5C,qEAAqE;EACrE,oEAAoE;EACpE,0CAA0C;EAC1C,2CAA2C;EAC3C,4BAA4B;EAC5B,oCAAoC;EACpC,qCAAqC;EACrC,iDAAiD;EACjD,4CAA4C;EAC5C,6CAA6C;EAC7C,mCAAmC;EACnC,qDAAqD;EACrD,oCAAoC;;EAEpC,gBAAgB;EAChB,qCAAqC;EACrC,8CAA8C;EAC9C,sCAAsC;EACtC,+CAA+C;EAC/C,8CAA8C;EAC9C,iCAAiC;EACjC,wDAAwD;EACxD,0CAA0C;EAC1C,yCAAyC;EACzC,0CAA0C;EAC1C,wCAAwC;EACxC,8CAA8C;EAC9C,6BAA6B;EAC7B,oCAAoC;EACpC,sCAAsC;EACtC,mCAAmC;EACnC,mCAAmC;EACnC,6BAA6B;EAC7B,iDAAiD;EACjD,sDAAsD;EACtD,oDAAoD;EACpD,yDAAyD;EACzD,wCAAwC;EACxC,wCAAwC;EACxC,wCAAwC;EACxC,wCAAwC;EACxC,wCAAwC;EACxC,wCAAwC;EACxC,wCAAwC;EACxC,wCAAwC;EACxC,wCAAwC;EACxC,wCAAwC;EACxC,2CAA2C;EAC3C,qCAAqC;EACrC,8CAA8C;EAC9C,mEAAmE;EACnE,sEAAsE;EACtE,4CAA4C;EAC5C,sEAAsE;EACtE,sDAAsD;EACtD,8DAA8D;EAC9D,kDAAkD;EAClD,qCAAqC;EACrC,mCAAmC;EACnC,4CAA4C;EAC5C,0BAA0B;EAC1B,6BAA6B;EAC7B,8BAA8B;EAC9B,6CAA6C;EAC7C,mDAAmD;EACnD,oCAAoC;EACpC,mCAAmC;EACnC,sCAAsC;EACtC,mCAAmC;EACnC,mCAAmC;EACnC,kCAAkC;EAClC,2CAA2C;EAC3C,sEAAsE;EACtE,yEAAyE;EACzE,wCAAwC;EACxC,0CAA0C;EAC1C,2BAA2B;EAC3B,mCAAmC;EACnC,oCAAoC;EACpC,gDAAgD;EAChD,2CAA2C;EAC3C,4CAA4C;EAC5C,kCAAkC;EAClC,0DAA0D;EAC1D,mCAAmC;;EAEnC,oBAAoB;EACpB,6BAA6B;EAC7B,mCAAmC;EACnC,uBAAuB;;EAEvB,qBAAqB;EACrB,yCAAyC;EACzC,2CAA2C;EAC3C,0CAA0C;EAC1C,qCAAqC;EACrC,sCAAsC;EACtC,qCAAqC;EACrC,iCAAiC;EACjC,+BAA+B;;EAE/B,yBAAyB;EACzB,8CAA8C;EAC9C,+CAA+C;EAC/C,8CAA8C;EAC9C,yCAAyC;EACzC,0CAA0C;EAC1C,yCAAyC;EACzC,qCAAqC;EACrC,mCAAmC;;EAEnC,6BAA6B;EAC7B;uBACqB;EACrB;0EACwE;;EAExE,+CAA+C;EAC/C,gCAAgC;EAChC,iCAAiC;CAClC;;AAED;EACE,uBAAuB;;EAEvB,8CAA8C;CAC/C","file":"root.css","sourcesContent":[":root {\n /**\n * IMPORTANT: When new theme variables are added below– also add them to SettingsContext updateThemeVariables()\n */\n\n /* Light theme */\n --light-color-attribute-name: #ef6632;\n --light-color-attribute-name-inverted: rgba(255, 255, 255, 0.7);\n --light-color-attribute-value: #1a1aa6;\n --light-color-attribute-value-inverted: #ffffff;\n --light-color-attribute-editable-value: #1a1aa6;\n --light-color-background: #ffffff;\n --light-color-background-hover: rgba(0, 136, 250, 0.1);\n --light-color-background-inactive: #e5e5e5;\n --light-color-background-invalid: #fff0f0;\n --light-color-background-selected: #0088fa;\n --light-color-button-background: #ffffff;\n --light-color-button-background-focus: #ededed;\n --light-color-button: #5f6673;\n --light-color-button-disabled: #cfd1d5;\n --light-color-button-active: #0088fa;\n --light-color-button-focus: #23272f;\n --light-color-button-hover: #23272f;\n --light-color-border: #eeeeee;\n --light-color-commit-did-not-render-fill: #cfd1d5;\n --light-color-commit-did-not-render-fill-text: #000000;\n --light-color-commit-did-not-render-pattern: #cfd1d5;\n --light-color-commit-did-not-render-pattern-text: #333333;\n --light-color-commit-gradient-0: #37afa9;\n --light-color-commit-gradient-1: #63b19e;\n --light-color-commit-gradient-2: #80b393;\n --light-color-commit-gradient-3: #97b488;\n --light-color-commit-gradient-4: #abb67d;\n --light-color-commit-gradient-5: #beb771;\n --light-color-commit-gradient-6: #cfb965;\n --light-color-commit-gradient-7: #dfba57;\n --light-color-commit-gradient-8: #efbb49;\n --light-color-commit-gradient-9: #febc38;\n --light-color-commit-gradient-text: #000000;\n --light-color-component-name: #6a51b2;\n --light-color-component-name-inverted: #ffffff;\n --light-color-component-badge-background: rgba(0, 0, 0, 0.1);\n --light-color-component-badge-background-inverted: rgba(255, 255, 255, 0.25);\n --light-color-component-badge-count: #777d88;\n --light-color-component-badge-count-inverted: rgba(255, 255, 255, 0.7);\n --light-color-context-background: rgba(0,0,0,.9);\n --light-color-context-background-hover: rgba(255, 255, 255, 0.1);\n --light-color-context-background-selected: #178fb9;\n --light-color-context-border: #3d424a;\n --light-color-context-text: #ffffff;\n --light-color-context-text-selected: #ffffff;\n --light-color-dim: #777d88;\n --light-color-dimmer: #cfd1d5;\n --light-color-dimmest: #eff0f1;\n --light-color-expand-collapse-toggle: #777d88;\n --light-color-modal-background: rgba(255, 255, 255, 0.75);\n --light-color-record-active: #fc3a4b;\n --light-color-record-hover: #3578e5;\n --light-color-record-inactive: #0088fa;\n --light-color-scroll-thumb: #c2c2c2;\n --light-color-scroll-track: #fafafa;\n --light-color-search-match: yellow;\n --light-color-search-match-current: #f7923b;\n --light-color-selected-tree-highlight-active: rgba(0, 136, 250, 0.1);\n --light-color-selected-tree-highlight-inactive: rgba(0, 0, 0, 0.05);\n --light-color-shadow: rgba(0, 0, 0, 0.25);\n --light-color-tab-selected-border: #0088fa;\n --light-color-text: #000000;\n --light-color-text-invalid: #ff0000;\n --light-color-text-selected: #ffffff;\n --light-color-toggle-background-invalid: #fc3a4b;\n --light-color-toggle-background-on: #0088fa;\n --light-color-toggle-background-off: #cfd1d5;\n --light-color-toggle-text: #ffffff;\n --light-color-tooltip-background: rgba(0, 0, 0, 0.9);\n --light-color-tooltip-text: #ffffff;\n\n /* Dark theme */\n --dark-color-attribute-name: #9d87d2;\n --dark-color-attribute-name-inverted: #282828;\n --dark-color-attribute-value: #cedae0;\n --dark-color-attribute-value-inverted: #ffffff;\n --dark-color-attribute-editable-value: yellow;\n --dark-color-background: #282c34;\n --dark-color-background-hover: rgba(255, 255, 255, 0.1);\n --dark-color-background-inactive: #3d424a;\n --dark-color-background-invalid: #5c0000;\n --dark-color-background-selected: #178fb9;\n --dark-color-button-background: #282c34;\n --dark-color-button-background-focus: #3d424a;\n --dark-color-button: #afb3b9;\n --dark-color-button-active: #61dafb;\n --dark-color-button-disabled: #4f5766;\n --dark-color-button-focus: #a2e9fc;\n --dark-color-button-hover: #ededed;\n --dark-color-border: #3d424a;\n --dark-color-commit-did-not-render-fill: #777d88;\n --dark-color-commit-did-not-render-fill-text: #000000;\n --dark-color-commit-did-not-render-pattern: #666c77;\n --dark-color-commit-did-not-render-pattern-text: #ffffff;\n --dark-color-commit-gradient-0: #37afa9;\n --dark-color-commit-gradient-1: #63b19e;\n --dark-color-commit-gradient-2: #80b393;\n --dark-color-commit-gradient-3: #97b488;\n --dark-color-commit-gradient-4: #abb67d;\n --dark-color-commit-gradient-5: #beb771;\n --dark-color-commit-gradient-6: #cfb965;\n --dark-color-commit-gradient-7: #dfba57;\n --dark-color-commit-gradient-8: #efbb49;\n --dark-color-commit-gradient-9: #febc38;\n --dark-color-commit-gradient-text: #000000;\n --dark-color-component-name: #61dafb;\n --dark-color-component-name-inverted: #282828;\n --dark-color-component-badge-background: rgba(255, 255, 255, 0.25);\n --dark-color-component-badge-background-inverted: rgba(0, 0, 0, 0.25);\n --dark-color-component-badge-count: #8f949d;\n --dark-color-component-badge-count-inverted: rgba(255, 255, 255, 0.7);\n --dark-color-context-background: rgba(255,255,255,.9);\n --dark-color-context-background-hover: rgba(0, 136, 250, 0.1);\n --dark-color-context-background-selected: #0088fa;\n --dark-color-context-border: #eeeeee;\n --dark-color-context-text: #000000;\n --dark-color-context-text-selected: #ffffff;\n --dark-color-dim: #8f949d;\n --dark-color-dimmer: #777d88;\n --dark-color-dimmest: #4f5766;\n --dark-color-expand-collapse-toggle: #8f949d;\n --dark-color-modal-background: rgba(0, 0, 0, 0.75);\n --dark-color-record-active: #fc3a4b;\n --dark-color-record-hover: #a2e9fc;\n --dark-color-record-inactive: #61dafb;\n --dark-color-scroll-thumb: #afb3b9;\n --dark-color-scroll-track: #313640;\n --dark-color-search-match: yellow;\n --dark-color-search-match-current: #f7923b;\n --dark-color-selected-tree-highlight-active: rgba(23, 143, 185, 0.15);\n --dark-color-selected-tree-highlight-inactive: rgba(255, 255, 255, 0.05);\n --dark-color-shadow: rgba(0, 0, 0, 0.5);\n --dark-color-tab-selected-border: #178fb9;\n --dark-color-text: #ffffff;\n --dark-color-text-invalid: #ff8080;\n --dark-color-text-selected: #ffffff;\n --dark-color-toggle-background-invalid: #fc3a4b;\n --dark-color-toggle-background-on: #178fb9;\n --dark-color-toggle-background-off: #777d88;\n --dark-color-toggle-text: #ffffff;\n --dark-color-tooltip-background: rgba(255, 255, 255, 0.9);\n --dark-color-tooltip-text: #000000;\n\n /* Font smoothing */\n --light-font-smoothing: auto;\n --dark-font-smoothing: antialiased;\n --font-smoothing: auto;\n\n /* Compact density */\n --compact-font-size-monospace-small: 9px;\n --compact-font-size-monospace-normal: 11px;\n --compact-font-size-monospace-large: 15px;\n --compact-font-size-sans-small: 10px;\n --compact-font-size-sans-normal: 12px;\n --compact-font-size-sans-large: 14px;\n --compact-line-height-data: 18px;\n --compact-root-font-size: 16px;\n\n /* Comfortable density */\n --comfortable-font-size-monospace-small: 10px;\n --comfortable-font-size-monospace-normal: 13px;\n --comfortable-font-size-monospace-large: 17px;\n --comfortable-font-size-sans-small: 12px;\n --comfortable-font-size-sans-normal: 14px;\n --comfortable-font-size-sans-large: 16px;\n --comfortable-line-height-data: 22px;\n --comfortable-root-font-size: 20px;\n\n /* GitHub.com system fonts */\n --font-family-monospace: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo,\n Courier, monospace;\n --font-family-sans: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica,\n Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;\n\n /* Constant values shared between JS and CSS */\n --interaction-commit-size: 10px;\n --interaction-label-width: 200px;\n}\n\n* {\n box-sizing: border-box;\n\n -webkit-font-smoothing: var(--font-smoothing);\n}\n"],"sourceRoot":""}]);
// exports
/***/ }),
/***/ "../../node_modules/css-loader/lib/css-base.js":
/*!**********************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/css-loader/lib/css-base.js ***!
\**********************************************************************************/
/*! no static exports found */
/***/ (function(module, exports) {
/*
MIT License http://www.opensource.org/licenses/mit-license.php
Author Tobias Koppers @sokra
*/
// css base code, injected by the css-loader
module.exports = function (useSourceMap) {
var list = []; // return the list of modules as css string
list.toString = function toString() {
return this.map(function (item) {
var content = cssWithMappingToString(item, useSourceMap);
if (item[2]) {
return "@media " + item[2] + "{" + content + "}";
} else {
return content;
}
}).join("");
}; // import a list of modules into the list
list.i = function (modules, mediaQuery) {
if (typeof modules === "string") modules = [[null, modules, ""]];
var alreadyImportedModules = {};
for (var i = 0; i < this.length; i++) {
var id = this[i][0];
if (typeof id === "number") alreadyImportedModules[id] = true;
}
for (i = 0; i < modules.length; i++) {
var item = modules[i]; // skip already imported module
// this implementation is not 100% perfect for weird media query combinations
// when a module is imported multiple times with different media queries.
// I hope this will never occur (Hey this way we have smaller bundles)
if (typeof item[0] !== "number" || !alreadyImportedModules[item[0]]) {
if (mediaQuery && !item[2]) {
item[2] = mediaQuery;
} else if (mediaQuery) {
item[2] = "(" + item[2] + ") and (" + mediaQuery + ")";
}
list.push(item);
}
}
};
return list;
};
function cssWithMappingToString(item, useSourceMap) {
var content = item[1] || '';
var cssMapping = item[3];
if (!cssMapping) {
return content;
}
if (useSourceMap && typeof btoa === 'function') {
var sourceMapping = toComment(cssMapping);
var sourceURLs = cssMapping.sources.map(function (source) {
return '/*# sourceURL=' + cssMapping.sourceRoot + source + ' */';
});
return [content].concat(sourceURLs).concat([sourceMapping]).join('\n');
}
return [content].join('\n');
} // Adapted from convert-source-map (MIT)
function toComment(sourceMap) {
// eslint-disable-next-line no-undef
var base64 = btoa(unescape(encodeURIComponent(JSON.stringify(sourceMap))));
var data = 'sourceMappingURL=data:application/json;charset=utf-8;base64,' + base64;
return '/*# ' + data + ' */';
}
/***/ }),
/***/ "../../node_modules/d/index.js":
/*!******************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/d/index.js ***!
\******************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var isValue = __webpack_require__(/*! type/value/is */ "../../node_modules/type/value/is.js"),
isPlainFunction = __webpack_require__(/*! type/plain-function/is */ "../../node_modules/type/plain-function/is.js"),
assign = __webpack_require__(/*! es5-ext/object/assign */ "../../node_modules/es5-ext/object/assign/index.js"),
normalizeOpts = __webpack_require__(/*! es5-ext/object/normalize-options */ "../../node_modules/es5-ext/object/normalize-options.js"),
contains = __webpack_require__(/*! es5-ext/string/#/contains */ "../../node_modules/es5-ext/string/#/contains/index.js");
var d = module.exports = function (dscr, value
/*, options*/
) {
var c, e, w, options, desc;
if (arguments.length < 2 || typeof dscr !== "string") {
options = value;
value = dscr;
dscr = null;
} else {
options = arguments[2];
}
if (isValue(dscr)) {
c = contains.call(dscr, "c");
e = contains.call(dscr, "e");
w = contains.call(dscr, "w");
} else {
c = w = true;
e = false;
}
desc = {
value: value,
configurable: c,
enumerable: e,
writable: w
};
return !options ? desc : assign(normalizeOpts(options), desc);
};
d.gs = function (dscr, get, set
/*, options*/
) {
var c, e, options, desc;
if (typeof dscr !== "string") {
options = set;
set = get;
get = dscr;
dscr = null;
} else {
options = arguments[3];
}
if (!isValue(get)) {
get = undefined;
} else if (!isPlainFunction(get)) {
options = get;
get = set = undefined;
} else if (!isValue(set)) {
set = undefined;
} else if (!isPlainFunction(set)) {
options = set;
set = undefined;
}
if (isValue(dscr)) {
c = contains.call(dscr, "c");
e = contains.call(dscr, "e");
} else {
c = true;
e = false;
}
desc = {
get: get,
set: set,
configurable: c,
enumerable: e
};
return !options ? desc : assign(normalizeOpts(options), desc);
};
/***/ }),
/***/ "../../node_modules/es5-ext/function/noop.js":
/*!********************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/es5-ext/function/noop.js ***!
\********************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
// eslint-disable-next-line no-empty-function
module.exports = function () {};
/***/ }),
/***/ "../../node_modules/es5-ext/object/assign/index.js":
/*!**************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/es5-ext/object/assign/index.js ***!
\**************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
module.exports = __webpack_require__(/*! ./is-implemented */ "../../node_modules/es5-ext/object/assign/is-implemented.js")() ? Object.assign : __webpack_require__(/*! ./shim */ "../../node_modules/es5-ext/object/assign/shim.js");
/***/ }),
/***/ "../../node_modules/es5-ext/object/assign/is-implemented.js":
/*!***********************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/es5-ext/object/assign/is-implemented.js ***!
\***********************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
module.exports = function () {
var assign = Object.assign,
obj;
if (typeof assign !== "function") return false;
obj = {
foo: "raz"
};
assign(obj, {
bar: "dwa"
}, {
trzy: "trzy"
});
return obj.foo + obj.bar + obj.trzy === "razdwatrzy";
};
/***/ }),
/***/ "../../node_modules/es5-ext/object/assign/shim.js":
/*!*************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/es5-ext/object/assign/shim.js ***!
\*************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var keys = __webpack_require__(/*! ../keys */ "../../node_modules/es5-ext/object/keys/index.js"),
value = __webpack_require__(/*! ../valid-value */ "../../node_modules/es5-ext/object/valid-value.js"),
max = Math.max;
module.exports = function (dest, src
/*, …srcn*/
) {
var error,
i,
length = max(arguments.length, 2),
assign;
dest = Object(value(dest));
assign = function assign(key) {
try {
dest[key] = src[key];
} catch (e) {
if (!error) error = e;
}
};
for (i = 1; i < length; ++i) {
src = arguments[i];
keys(src).forEach(assign);
}
if (error !== undefined) throw error;
return dest;
};
/***/ }),
/***/ "../../node_modules/es5-ext/object/is-value.js":
/*!**********************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/es5-ext/object/is-value.js ***!
\**********************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var _undefined = __webpack_require__(/*! ../function/noop */ "../../node_modules/es5-ext/function/noop.js")(); // Support ES3 engines
module.exports = function (val) {
return val !== _undefined && val !== null;
};
/***/ }),
/***/ "../../node_modules/es5-ext/object/keys/index.js":
/*!************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/es5-ext/object/keys/index.js ***!
\************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
module.exports = __webpack_require__(/*! ./is-implemented */ "../../node_modules/es5-ext/object/keys/is-implemented.js")() ? Object.keys : __webpack_require__(/*! ./shim */ "../../node_modules/es5-ext/object/keys/shim.js");
/***/ }),
/***/ "../../node_modules/es5-ext/object/keys/is-implemented.js":
/*!*********************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/es5-ext/object/keys/is-implemented.js ***!
\*********************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
module.exports = function () {
try {
Object.keys("primitive");
return true;
} catch (e) {
return false;
}
};
/***/ }),
/***/ "../../node_modules/es5-ext/object/keys/shim.js":
/*!***********************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/es5-ext/object/keys/shim.js ***!
\***********************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var isValue = __webpack_require__(/*! ../is-value */ "../../node_modules/es5-ext/object/is-value.js");
var keys = Object.keys;
module.exports = function (object) {
return keys(isValue(object) ? Object(object) : object);
};
/***/ }),
/***/ "../../node_modules/es5-ext/object/normalize-options.js":
/*!*******************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/es5-ext/object/normalize-options.js ***!
\*******************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var isValue = __webpack_require__(/*! ./is-value */ "../../node_modules/es5-ext/object/is-value.js");
var forEach = Array.prototype.forEach,
create = Object.create;
var process = function process(src, obj) {
var key;
for (key in src) {
obj[key] = src[key];
}
}; // eslint-disable-next-line no-unused-vars
module.exports = function (opts1
/*, …options*/
) {
var result = create(null);
forEach.call(arguments, function (options) {
if (!isValue(options)) return;
process(Object(options), result);
});
return result;
};
/***/ }),
/***/ "../../node_modules/es5-ext/object/valid-value.js":
/*!*************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/es5-ext/object/valid-value.js ***!
\*************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var isValue = __webpack_require__(/*! ./is-value */ "../../node_modules/es5-ext/object/is-value.js");
module.exports = function (value) {
if (!isValue(value)) throw new TypeError("Cannot use null or undefined");
return value;
};
/***/ }),
/***/ "../../node_modules/es5-ext/string/#/contains/index.js":
/*!******************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/es5-ext/string/#/contains/index.js ***!
\******************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
module.exports = __webpack_require__(/*! ./is-implemented */ "../../node_modules/es5-ext/string/#/contains/is-implemented.js")() ? String.prototype.contains : __webpack_require__(/*! ./shim */ "../../node_modules/es5-ext/string/#/contains/shim.js");
/***/ }),
/***/ "../../node_modules/es5-ext/string/#/contains/is-implemented.js":
/*!***************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/es5-ext/string/#/contains/is-implemented.js ***!
\***************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var str = "razdwatrzy";
module.exports = function () {
if (typeof str.contains !== "function") return false;
return str.contains("dwa") === true && str.contains("foo") === false;
};
/***/ }),
/***/ "../../node_modules/es5-ext/string/#/contains/shim.js":
/*!*****************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/es5-ext/string/#/contains/shim.js ***!
\*****************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var indexOf = String.prototype.indexOf;
module.exports = function (searchString
/*, position*/
) {
return indexOf.call(this, searchString, arguments[1]) > -1;
};
/***/ }),
/***/ "../../node_modules/es6-symbol/index.js":
/*!***************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/es6-symbol/index.js ***!
\***************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
module.exports = __webpack_require__(/*! ./is-implemented */ "../../node_modules/es6-symbol/is-implemented.js")() ? Symbol : __webpack_require__(/*! ./polyfill */ "../../node_modules/es6-symbol/polyfill.js");
/***/ }),
/***/ "../../node_modules/es6-symbol/is-implemented.js":
/*!************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/es6-symbol/is-implemented.js ***!
\************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
var validTypes = {
object: true,
symbol: true
};
module.exports = function () {
var symbol;
if (typeof Symbol !== 'function') return false;
symbol = Symbol('test symbol');
try {
String(symbol);
} catch (e) {
return false;
} // Return 'true' also for polyfills
if (!validTypes[_typeof(Symbol.iterator)]) return false;
if (!validTypes[_typeof(Symbol.toPrimitive)]) return false;
if (!validTypes[_typeof(Symbol.toStringTag)]) return false;
return true;
};
/***/ }),
/***/ "../../node_modules/es6-symbol/is-symbol.js":
/*!*******************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/es6-symbol/is-symbol.js ***!
\*******************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
module.exports = function (x) {
if (!x) return false;
if (_typeof(x) === 'symbol') return true;
if (!x.constructor) return false;
if (x.constructor.name !== 'Symbol') return false;
return x[x.constructor.toStringTag] === 'Symbol';
};
/***/ }),
/***/ "../../node_modules/es6-symbol/polyfill.js":
/*!******************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/es6-symbol/polyfill.js ***!
\******************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
// ES2015 Symbol polyfill for environments that do not (or partially) support it
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
var d = __webpack_require__(/*! d */ "../../node_modules/d/index.js"),
validateSymbol = __webpack_require__(/*! ./validate-symbol */ "../../node_modules/es6-symbol/validate-symbol.js"),
create = Object.create,
defineProperties = Object.defineProperties,
defineProperty = Object.defineProperty,
objPrototype = Object.prototype,
NativeSymbol,
SymbolPolyfill,
HiddenSymbol,
globalSymbols = create(null),
isNativeSafe;
if (typeof Symbol === 'function') {
NativeSymbol = Symbol;
try {
String(NativeSymbol());
isNativeSafe = true;
} catch (ignore) {}
}
var generateName = function () {
var created = create(null);
return function (desc) {
var postfix = 0,
name,
ie11BugWorkaround;
while (created[desc + (postfix || '')]) {
++postfix;
}
desc += postfix || '';
created[desc] = true;
name = '@@' + desc;
defineProperty(objPrototype, name, d.gs(null, function (value) {
// For IE11 issue see:
// https://connect.microsoft.com/IE/feedbackdetail/view/1928508/
// ie11-broken-getters-on-dom-objects
// https://github.com/medikoo/es6-symbol/issues/12
if (ie11BugWorkaround) return;
ie11BugWorkaround = true;
defineProperty(this, name, d(value));
ie11BugWorkaround = false;
}));
return name;
};
}(); // Internal constructor (not one exposed) for creating Symbol instances.
// This one is used to ensure that `someSymbol instanceof Symbol` always return false
HiddenSymbol = function _Symbol(description) {
if (this instanceof HiddenSymbol) throw new TypeError('Symbol is not a constructor');
return SymbolPolyfill(description);
}; // Exposed `Symbol` constructor
// (returns instances of HiddenSymbol)
module.exports = SymbolPolyfill = function _Symbol2(description) {
var symbol;
if (this instanceof _Symbol2) throw new TypeError('Symbol is not a constructor');
if (isNativeSafe) return NativeSymbol(description);
symbol = create(HiddenSymbol.prototype);
description = description === undefined ? '' : String(description);
return defineProperties(symbol, {
__description__: d('', description),
__name__: d('', generateName(description))
});
};
defineProperties(SymbolPolyfill, {
for: d(function (key) {
if (globalSymbols[key]) return globalSymbols[key];
return globalSymbols[key] = SymbolPolyfill(String(key));
}),
keyFor: d(function (s) {
var key;
validateSymbol(s);
for (key in globalSymbols) {
if (globalSymbols[key] === s) return key;
}
}),
// To ensure proper interoperability with other native functions (e.g. Array.from)
// fallback to eventual native implementation of given symbol
hasInstance: d('', NativeSymbol && NativeSymbol.hasInstance || SymbolPolyfill('hasInstance')),
isConcatSpreadable: d('', NativeSymbol && NativeSymbol.isConcatSpreadable || SymbolPolyfill('isConcatSpreadable')),
iterator: d('', NativeSymbol && NativeSymbol.iterator || SymbolPolyfill('iterator')),
match: d('', NativeSymbol && NativeSymbol.match || SymbolPolyfill('match')),
replace: d('', NativeSymbol && NativeSymbol.replace || SymbolPolyfill('replace')),
search: d('', NativeSymbol && NativeSymbol.search || SymbolPolyfill('search')),
species: d('', NativeSymbol && NativeSymbol.species || SymbolPolyfill('species')),
split: d('', NativeSymbol && NativeSymbol.split || SymbolPolyfill('split')),
toPrimitive: d('', NativeSymbol && NativeSymbol.toPrimitive || SymbolPolyfill('toPrimitive')),
toStringTag: d('', NativeSymbol && NativeSymbol.toStringTag || SymbolPolyfill('toStringTag')),
unscopables: d('', NativeSymbol && NativeSymbol.unscopables || SymbolPolyfill('unscopables'))
}); // Internal tweaks for real symbol producer
defineProperties(HiddenSymbol.prototype, {
constructor: d(SymbolPolyfill),
toString: d('', function () {
return this.__name__;
})
}); // Proper implementation of methods exposed on Symbol.prototype
// They won't be accessible on produced symbol instances as they derive from HiddenSymbol.prototype
defineProperties(SymbolPolyfill.prototype, {
toString: d(function () {
return 'Symbol (' + validateSymbol(this).__description__ + ')';
}),
valueOf: d(function () {
return validateSymbol(this);
})
});
defineProperty(SymbolPolyfill.prototype, SymbolPolyfill.toPrimitive, d('', function () {
var symbol = validateSymbol(this);
if (_typeof(symbol) === 'symbol') return symbol;
return symbol.toString();
}));
defineProperty(SymbolPolyfill.prototype, SymbolPolyfill.toStringTag, d('c', 'Symbol')); // Proper implementaton of toPrimitive and toStringTag for returned symbol instances
defineProperty(HiddenSymbol.prototype, SymbolPolyfill.toStringTag, d('c', SymbolPolyfill.prototype[SymbolPolyfill.toStringTag])); // Note: It's important to define `toPrimitive` as last one, as some implementations
// implement `toPrimitive` natively without implementing `toStringTag` (or other specified symbols)
// And that may invoke error in definition flow:
// See: https://github.com/medikoo/es6-symbol/issues/13#issuecomment-164146149
defineProperty(HiddenSymbol.prototype, SymbolPolyfill.toPrimitive, d('c', SymbolPolyfill.prototype[SymbolPolyfill.toPrimitive]));
/***/ }),
/***/ "../../node_modules/es6-symbol/validate-symbol.js":
/*!*************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/es6-symbol/validate-symbol.js ***!
\*************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var isSymbol = __webpack_require__(/*! ./is-symbol */ "../../node_modules/es6-symbol/is-symbol.js");
module.exports = function (value) {
if (!isSymbol(value)) throw new TypeError(value + " is not a symbol");
return value;
};
/***/ }),
/***/ "../../node_modules/escape-string-regexp/index.js":
/*!*************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/escape-string-regexp/index.js ***!
\*************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var matchOperatorsRe = /[|\\{}()[\]^$+*?.]/g;
module.exports = function (str) {
if (typeof str !== 'string') {
throw new TypeError('Expected a string');
}
return str.replace(matchOperatorsRe, '\\$&');
};
/***/ }),
/***/ "../../node_modules/events/events.js":
/*!************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/events/events.js ***!
\************************************************************************/
/*! no static exports found */
/***/ (function(module, exports) {
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
// Copyright Joyent, Inc. and other Node contributors.
//
// Permission is hereby granted, free of charge, to any person obtaining a
// copy of this software and associated documentation files (the
// "Software"), to deal in the Software without restriction, including
// without limitation the rights to use, copy, modify, merge, publish,
// distribute, sublicense, and/or sell copies of the Software, and to permit
// persons to whom the Software is furnished to do so, subject to the
// following conditions:
//
// The above copyright notice and this permission notice shall be included
// in all copies or substantial portions of the Software.
//
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
// OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
// MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN
// NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM,
// DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR
// OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE
// USE OR OTHER DEALINGS IN THE SOFTWARE.
function EventEmitter() {
this._events = this._events || {};
this._maxListeners = this._maxListeners || undefined;
}
module.exports = EventEmitter; // Backwards-compat with node 0.10.x
EventEmitter.EventEmitter = EventEmitter;
EventEmitter.prototype._events = undefined;
EventEmitter.prototype._maxListeners = undefined; // By default EventEmitters will print a warning if more than 10 listeners are
// added to it. This is a useful default which helps finding memory leaks.
EventEmitter.defaultMaxListeners = 10; // Obviously not all Emitters should be limited to 10. This function allows
// that to be increased. Set to zero for unlimited.
EventEmitter.prototype.setMaxListeners = function (n) {
if (!isNumber(n) || n < 0 || isNaN(n)) throw TypeError('n must be a positive number');
this._maxListeners = n;
return this;
};
EventEmitter.prototype.emit = function (type) {
var er, handler, len, args, i, listeners;
if (!this._events) this._events = {}; // If there is no 'error' event listener then throw.
if (type === 'error') {
if (!this._events.error || isObject(this._events.error) && !this._events.error.length) {
er = arguments[1];
if (er instanceof Error) {
throw er; // Unhandled 'error' event
} else {
// At least give some kind of context to the user
var err = new Error('Uncaught, unspecified "error" event. (' + er + ')');
err.context = er;
throw err;
}
}
}
handler = this._events[type];
if (isUndefined(handler)) return false;
if (isFunction(handler)) {
switch (arguments.length) {
// fast cases
case 1:
handler.call(this);
break;
case 2:
handler.call(this, arguments[1]);
break;
case 3:
handler.call(this, arguments[1], arguments[2]);
break;
// slower
default:
args = Array.prototype.slice.call(arguments, 1);
handler.apply(this, args);
}
} else if (isObject(handler)) {
args = Array.prototype.slice.call(arguments, 1);
listeners = handler.slice();
len = listeners.length;
for (i = 0; i < len; i++) {
listeners[i].apply(this, args);
}
}
return true;
};
EventEmitter.prototype.addListener = function (type, listener) {
var m;
if (!isFunction(listener)) throw TypeError('listener must be a function');
if (!this._events) this._events = {}; // To avoid recursion in the case that type === "newListener"! Before
// adding it to the listeners, first emit "newListener".
if (this._events.newListener) this.emit('newListener', type, isFunction(listener.listener) ? listener.listener : listener);
if (!this._events[type]) // Optimize the case of one listener. Don't need the extra array object.
this._events[type] = listener;else if (isObject(this._events[type])) // If we've already got an array, just append.
this._events[type].push(listener);else // Adding the second element, need to change to array.
this._events[type] = [this._events[type], listener]; // Check for listener leak
if (isObject(this._events[type]) && !this._events[type].warned) {
if (!isUndefined(this._maxListeners)) {
m = this._maxListeners;
} else {
m = EventEmitter.defaultMaxListeners;
}
if (m && m > 0 && this._events[type].length > m) {
this._events[type].warned = true;
console.error('(node) warning: possible EventEmitter memory ' + 'leak detected. %d listeners added. ' + 'Use emitter.setMaxListeners() to increase limit.', this._events[type].length);
if (typeof console.trace === 'function') {
// not supported in IE 10
console.trace();
}
}
}
return this;
};
EventEmitter.prototype.on = EventEmitter.prototype.addListener;
EventEmitter.prototype.once = function (type, listener) {
if (!isFunction(listener)) throw TypeError('listener must be a function');
var fired = false;
function g() {
this.removeListener(type, g);
if (!fired) {
fired = true;
listener.apply(this, arguments);
}
}
g.listener = listener;
this.on(type, g);
return this;
}; // emits a 'removeListener' event iff the listener was removed
EventEmitter.prototype.removeListener = function (type, listener) {
var list, position, length, i;
if (!isFunction(listener)) throw TypeError('listener must be a function');
if (!this._events || !this._events[type]) return this;
list = this._events[type];
length = list.length;
position = -1;
if (list === listener || isFunction(list.listener) && list.listener === listener) {
delete this._events[type];
if (this._events.removeListener) this.emit('removeListener', type, listener);
} else if (isObject(list)) {
for (i = length; i-- > 0;) {
if (list[i] === listener || list[i].listener && list[i].listener === listener) {
position = i;
break;
}
}
if (position < 0) return this;
if (list.length === 1) {
list.length = 0;
delete this._events[type];
} else {
list.splice(position, 1);
}
if (this._events.removeListener) this.emit('removeListener', type, listener);
}
return this;
};
EventEmitter.prototype.removeAllListeners = function (type) {
var key, listeners;
if (!this._events) return this; // not listening for removeListener, no need to emit
if (!this._events.removeListener) {
if (arguments.length === 0) this._events = {};else if (this._events[type]) delete this._events[type];
return this;
} // emit removeListener for all listeners on all events
if (arguments.length === 0) {
for (key in this._events) {
if (key === 'removeListener') continue;
this.removeAllListeners(key);
}
this.removeAllListeners('removeListener');
this._events = {};
return this;
}
listeners = this._events[type];
if (isFunction(listeners)) {
this.removeListener(type, listeners);
} else if (listeners) {
// LIFO order
while (listeners.length) {
this.removeListener(type, listeners[listeners.length - 1]);
}
}
delete this._events[type];
return this;
};
EventEmitter.prototype.listeners = function (type) {
var ret;
if (!this._events || !this._events[type]) ret = [];else if (isFunction(this._events[type])) ret = [this._events[type]];else ret = this._events[type].slice();
return ret;
};
EventEmitter.prototype.listenerCount = function (type) {
if (this._events) {
var evlistener = this._events[type];
if (isFunction(evlistener)) return 1;else if (evlistener) return evlistener.length;
}
return 0;
};
EventEmitter.listenerCount = function (emitter, type) {
return emitter.listenerCount(type);
};
function isFunction(arg) {
return typeof arg === 'function';
}
function isNumber(arg) {
return typeof arg === 'number';
}
function isObject(arg) {
return _typeof(arg) === 'object' && arg !== null;
}
function isUndefined(arg) {
return arg === void 0;
}
/***/ }),
/***/ "../../node_modules/lodash.throttle/index.js":
/*!********************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/lodash.throttle/index.js ***!
\********************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
/* WEBPACK VAR INJECTION */(function(global) {function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
/**
* lodash (Custom Build) <https://lodash.com/>
* Build: `lodash modularize exports="npm" -o ./`
* Copyright jQuery Foundation and other contributors <https://jquery.org/>
* Released under MIT license <https://lodash.com/license>
* Based on Underscore.js 1.8.3 <http://underscorejs.org/LICENSE>
* Copyright Jeremy Ashkenas, DocumentCloud and Investigative Reporters & Editors
*/
/** Used as the `TypeError` message for "Functions" methods. */
var FUNC_ERROR_TEXT = 'Expected a function';
/** Used as references for various `Number` constants. */
var NAN = 0 / 0;
/** `Object#toString` result references. */
var symbolTag = '[object Symbol]';
/** Used to match leading and trailing whitespace. */
var reTrim = /^\s+|\s+$/g;
/** Used to detect bad signed hexadecimal string values. */
var reIsBadHex = /^[-+]0x[0-9a-f]+$/i;
/** Used to detect binary string values. */
var reIsBinary = /^0b[01]+$/i;
/** Used to detect octal string values. */
var reIsOctal = /^0o[0-7]+$/i;
/** Built-in method references without a dependency on `root`. */
var freeParseInt = parseInt;
/** Detect free variable `global` from Node.js. */
var freeGlobal = (typeof global === "undefined" ? "undefined" : _typeof(global)) == 'object' && global && global.Object === Object && global;
/** Detect free variable `self`. */
var freeSelf = (typeof self === "undefined" ? "undefined" : _typeof(self)) == 'object' && self && self.Object === Object && self;
/** Used as a reference to the global object. */
var root = freeGlobal || freeSelf || Function('return this')();
/** Used for built-in method references. */
var objectProto = Object.prototype;
/**
* Used to resolve the
* [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)
* of values.
*/
var objectToString = objectProto.toString;
/* Built-in method references for those with the same name as other `lodash` methods. */
var nativeMax = Math.max,
nativeMin = Math.min;
/**
* Gets the timestamp of the number of milliseconds that have elapsed since
* the Unix epoch (1 January 1970 00:00:00 UTC).
*
* @static
* @memberOf _
* @since 2.4.0
* @category Date
* @returns {number} Returns the timestamp.
* @example
*
* _.defer(function(stamp) {
* console.log(_.now() - stamp);
* }, _.now());
* // => Logs the number of milliseconds it took for the deferred invocation.
*/
var now = function now() {
return root.Date.now();
};
/**
* Creates a debounced function that delays invoking `func` until after `wait`
* milliseconds have elapsed since the last time the debounced function was
* invoked. The debounced function comes with a `cancel` method to cancel
* delayed `func` invocations and a `flush` method to immediately invoke them.
* Provide `options` to indicate whether `func` should be invoked on the
* leading and/or trailing edge of the `wait` timeout. The `func` is invoked
* with the last arguments provided to the debounced function. Subsequent
* calls to the debounced function return the result of the last `func`
* invocation.
*
* **Note:** If `leading` and `trailing` options are `true`, `func` is
* invoked on the trailing edge of the timeout only if the debounced function
* is invoked more than once during the `wait` timeout.
*
* If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
* until to the next tick, similar to `setTimeout` with a timeout of `0`.
*
* See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)
* for details over the differences between `_.debounce` and `_.throttle`.
*
* @static
* @memberOf _
* @since 0.1.0
* @category Function
* @param {Function} func The function to debounce.
* @param {number} [wait=0] The number of milliseconds to delay.
* @param {Object} [options={}] The options object.
* @param {boolean} [options.leading=false]
* Specify invoking on the leading edge of the timeout.
* @param {number} [options.maxWait]
* The maximum time `func` is allowed to be delayed before it's invoked.
* @param {boolean} [options.trailing=true]
* Specify invoking on the trailing edge of the timeout.
* @returns {Function} Returns the new debounced function.
* @example
*
* // Avoid costly calculations while the window size is in flux.
* jQuery(window).on('resize', _.debounce(calculateLayout, 150));
*
* // Invoke `sendMail` when clicked, debouncing subsequent calls.
* jQuery(element).on('click', _.debounce(sendMail, 300, {
* 'leading': true,
* 'trailing': false
* }));
*
* // Ensure `batchLog` is invoked once after 1 second of debounced calls.
* var debounced = _.debounce(batchLog, 250, { 'maxWait': 1000 });
* var source = new EventSource('/stream');
* jQuery(source).on('message', debounced);
*
* // Cancel the trailing debounced invocation.
* jQuery(window).on('popstate', debounced.cancel);
*/
function debounce(func, wait, options) {
var lastArgs,
lastThis,
maxWait,
result,
timerId,
lastCallTime,
lastInvokeTime = 0,
leading = false,
maxing = false,
trailing = true;
if (typeof func != 'function') {
throw new TypeError(FUNC_ERROR_TEXT);
}
wait = toNumber(wait) || 0;
if (isObject(options)) {
leading = !!options.leading;
maxing = 'maxWait' in options;
maxWait = maxing ? nativeMax(toNumber(options.maxWait) || 0, wait) : maxWait;
trailing = 'trailing' in options ? !!options.trailing : trailing;
}
function invokeFunc(time) {
var args = lastArgs,
thisArg = lastThis;
lastArgs = lastThis = undefined;
lastInvokeTime = time;
result = func.apply(thisArg, args);
return result;
}
function leadingEdge(time) {
// Reset any `maxWait` timer.
lastInvokeTime = time; // Start the timer for the trailing edge.
timerId = setTimeout(timerExpired, wait); // Invoke the leading edge.
return leading ? invokeFunc(time) : result;
}
function remainingWait(time) {
var timeSinceLastCall = time - lastCallTime,
timeSinceLastInvoke = time - lastInvokeTime,
result = wait - timeSinceLastCall;
return maxing ? nativeMin(result, maxWait - timeSinceLastInvoke) : result;
}
function shouldInvoke(time) {
var timeSinceLastCall = time - lastCallTime,
timeSinceLastInvoke = time - lastInvokeTime; // Either this is the first call, activity has stopped and we're at the
// trailing edge, the system time has gone backwards and we're treating
// it as the trailing edge, or we've hit the `maxWait` limit.
return lastCallTime === undefined || timeSinceLastCall >= wait || timeSinceLastCall < 0 || maxing && timeSinceLastInvoke >= maxWait;
}
function timerExpired() {
var time = now();
if (shouldInvoke(time)) {
return trailingEdge(time);
} // Restart the timer.
timerId = setTimeout(timerExpired, remainingWait(time));
}
function trailingEdge(time) {
timerId = undefined; // Only invoke if we have `lastArgs` which means `func` has been
// debounced at least once.
if (trailing && lastArgs) {
return invokeFunc(time);
}
lastArgs = lastThis = undefined;
return result;
}
function cancel() {
if (timerId !== undefined) {
clearTimeout(timerId);
}
lastInvokeTime = 0;
lastArgs = lastCallTime = lastThis = timerId = undefined;
}
function flush() {
return timerId === undefined ? result : trailingEdge(now());
}
function debounced() {
var time = now(),
isInvoking = shouldInvoke(time);
lastArgs = arguments;
lastThis = this;
lastCallTime = time;
if (isInvoking) {
if (timerId === undefined) {
return leadingEdge(lastCallTime);
}
if (maxing) {
// Handle invocations in a tight loop.
timerId = setTimeout(timerExpired, wait);
return invokeFunc(lastCallTime);
}
}
if (timerId === undefined) {
timerId = setTimeout(timerExpired, wait);
}
return result;
}
debounced.cancel = cancel;
debounced.flush = flush;
return debounced;
}
/**
* Creates a throttled function that only invokes `func` at most once per
* every `wait` milliseconds. The throttled function comes with a `cancel`
* method to cancel delayed `func` invocations and a `flush` method to
* immediately invoke them. Provide `options` to indicate whether `func`
* should be invoked on the leading and/or trailing edge of the `wait`
* timeout. The `func` is invoked with the last arguments provided to the
* throttled function. Subsequent calls to the throttled function return the
* result of the last `func` invocation.
*
* **Note:** If `leading` and `trailing` options are `true`, `func` is
* invoked on the trailing edge of the timeout only if the throttled function
* is invoked more than once during the `wait` timeout.
*
* If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
* until to the next tick, similar to `setTimeout` with a timeout of `0`.
*
* See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)
* for details over the differences between `_.throttle` and `_.debounce`.
*
* @static
* @memberOf _
* @since 0.1.0
* @category Function
* @param {Function} func The function to throttle.
* @param {number} [wait=0] The number of milliseconds to throttle invocations to.
* @param {Object} [options={}] The options object.
* @param {boolean} [options.leading=true]
* Specify invoking on the leading edge of the timeout.
* @param {boolean} [options.trailing=true]
* Specify invoking on the trailing edge of the timeout.
* @returns {Function} Returns the new throttled function.
* @example
*
* // Avoid excessively updating the position while scrolling.
* jQuery(window).on('scroll', _.throttle(updatePosition, 100));
*
* // Invoke `renewToken` when the click event is fired, but not more than once every 5 minutes.
* var throttled = _.throttle(renewToken, 300000, { 'trailing': false });
* jQuery(element).on('click', throttled);
*
* // Cancel the trailing throttled invocation.
* jQuery(window).on('popstate', throttled.cancel);
*/
function throttle(func, wait, options) {
var leading = true,
trailing = true;
if (typeof func != 'function') {
throw new TypeError(FUNC_ERROR_TEXT);
}
if (isObject(options)) {
leading = 'leading' in options ? !!options.leading : leading;
trailing = 'trailing' in options ? !!options.trailing : trailing;
}
return debounce(func, wait, {
'leading': leading,
'maxWait': wait,
'trailing': trailing
});
}
/**
* Checks if `value` is the
* [language type](http://www.ecma-international.org/ecma-262/7.0/#sec-ecmascript-language-types)
* of `Object`. (e.g. arrays, functions, objects, regexes, `new Number(0)`, and `new String('')`)
*
* @static
* @memberOf _
* @since 0.1.0
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is an object, else `false`.
* @example
*
* _.isObject({});
* // => true
*
* _.isObject([1, 2, 3]);
* // => true
*
* _.isObject(_.noop);
* // => true
*
* _.isObject(null);
* // => false
*/
function isObject(value) {
var type = _typeof(value);
return !!value && (type == 'object' || type == 'function');
}
/**
* Checks if `value` is object-like. A value is object-like if it's not `null`
* and has a `typeof` result of "object".
*
* @static
* @memberOf _
* @since 4.0.0
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is object-like, else `false`.
* @example
*
* _.isObjectLike({});
* // => true
*
* _.isObjectLike([1, 2, 3]);
* // => true
*
* _.isObjectLike(_.noop);
* // => false
*
* _.isObjectLike(null);
* // => false
*/
function isObjectLike(value) {
return !!value && _typeof(value) == 'object';
}
/**
* Checks if `value` is classified as a `Symbol` primitive or object.
*
* @static
* @memberOf _
* @since 4.0.0
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is a symbol, else `false`.
* @example
*
* _.isSymbol(Symbol.iterator);
* // => true
*
* _.isSymbol('abc');
* // => false
*/
function isSymbol(value) {
return _typeof(value) == 'symbol' || isObjectLike(value) && objectToString.call(value) == symbolTag;
}
/**
* Converts `value` to a number.
*
* @static
* @memberOf _
* @since 4.0.0
* @category Lang
* @param {*} value The value to process.
* @returns {number} Returns the number.
* @example
*
* _.toNumber(3.2);
* // => 3.2
*
* _.toNumber(Number.MIN_VALUE);
* // => 5e-324
*
* _.toNumber(Infinity);
* // => Infinity
*
* _.toNumber('3.2');
* // => 3.2
*/
function toNumber(value) {
if (typeof value == 'number') {
return value;
}
if (isSymbol(value)) {
return NAN;
}
if (isObject(value)) {
var other = typeof value.valueOf == 'function' ? value.valueOf() : value;
value = isObject(other) ? other + '' : other;
}
if (typeof value != 'string') {
return value === 0 ? value : +value;
}
value = value.replace(reTrim, '');
var isBinary = reIsBinary.test(value);
return isBinary || reIsOctal.test(value) ? freeParseInt(value.slice(2), isBinary ? 2 : 8) : reIsBadHex.test(value) ? NAN : +value;
}
module.exports = throttle;
/* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./../webpack/buildin/global.js */ "../../node_modules/webpack/buildin/global.js")))
/***/ }),
/***/ "../../node_modules/lru-cache/index.js":
/*!**************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/lru-cache/index.js ***!
\**************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
/* WEBPACK VAR INJECTION */(function(process) {
module.exports = LRUCache; // This will be a proper iterable 'Map' in engines that support it,
// or a fakey-fake PseudoMap in older versions.
var Map = __webpack_require__(/*! pseudomap */ "../../node_modules/pseudomap/map.js");
var util = __webpack_require__(/*! util */ "../../node_modules/util/util.js"); // A linked list to keep track of recently-used-ness
var Yallist = __webpack_require__(/*! yallist */ "../../node_modules/lru-cache/node_modules/yallist/yallist.js"); // use symbols if possible, otherwise just _props
var hasSymbol = typeof Symbol === 'function' && process.env._nodeLRUCacheForceNoSymbol !== '1';
var makeSymbol;
if (hasSymbol) {
makeSymbol = function makeSymbol(key) {
return Symbol(key);
};
} else {
makeSymbol = function makeSymbol(key) {
return '_' + key;
};
}
var MAX = makeSymbol('max');
var LENGTH = makeSymbol('length');
var LENGTH_CALCULATOR = makeSymbol('lengthCalculator');
var ALLOW_STALE = makeSymbol('allowStale');
var MAX_AGE = makeSymbol('maxAge');
var DISPOSE = makeSymbol('dispose');
var NO_DISPOSE_ON_SET = makeSymbol('noDisposeOnSet');
var LRU_LIST = makeSymbol('lruList');
var CACHE = makeSymbol('cache');
function naiveLength() {
return 1;
} // lruList is a yallist where the head is the youngest
// item, and the tail is the oldest. the list contains the Hit
// objects as the entries.
// Each Hit object has a reference to its Yallist.Node. This
// never changes.
//
// cache is a Map (or PseudoMap) that matches the keys to
// the Yallist.Node object.
function LRUCache(options) {
if (!(this instanceof LRUCache)) {
return new LRUCache(options);
}
if (typeof options === 'number') {
options = {
max: options
};
}
if (!options) {
options = {};
}
var max = this[MAX] = options.max; // Kind of weird to have a default max of Infinity, but oh well.
if (!max || !(typeof max === 'number') || max <= 0) {
this[MAX] = Infinity;
}
var lc = options.length || naiveLength;
if (typeof lc !== 'function') {
lc = naiveLength;
}
this[LENGTH_CALCULATOR] = lc;
this[ALLOW_STALE] = options.stale || false;
this[MAX_AGE] = options.maxAge || 0;
this[DISPOSE] = options.dispose;
this[NO_DISPOSE_ON_SET] = options.noDisposeOnSet || false;
this.reset();
} // resize the cache when the max changes.
Object.defineProperty(LRUCache.prototype, 'max', {
set: function set(mL) {
if (!mL || !(typeof mL === 'number') || mL <= 0) {
mL = Infinity;
}
this[MAX] = mL;
trim(this);
},
get: function get() {
return this[MAX];
},
enumerable: true
});
Object.defineProperty(LRUCache.prototype, 'allowStale', {
set: function set(allowStale) {
this[ALLOW_STALE] = !!allowStale;
},
get: function get() {
return this[ALLOW_STALE];
},
enumerable: true
});
Object.defineProperty(LRUCache.prototype, 'maxAge', {
set: function set(mA) {
if (!mA || !(typeof mA === 'number') || mA < 0) {
mA = 0;
}
this[MAX_AGE] = mA;
trim(this);
},
get: function get() {
return this[MAX_AGE];
},
enumerable: true
}); // resize the cache when the lengthCalculator changes.
Object.defineProperty(LRUCache.prototype, 'lengthCalculator', {
set: function set(lC) {
if (typeof lC !== 'function') {
lC = naiveLength;
}
if (lC !== this[LENGTH_CALCULATOR]) {
this[LENGTH_CALCULATOR] = lC;
this[LENGTH] = 0;
this[LRU_LIST].forEach(function (hit) {
hit.length = this[LENGTH_CALCULATOR](hit.value, hit.key);
this[LENGTH] += hit.length;
}, this);
}
trim(this);
},
get: function get() {
return this[LENGTH_CALCULATOR];
},
enumerable: true
});
Object.defineProperty(LRUCache.prototype, 'length', {
get: function get() {
return this[LENGTH];
},
enumerable: true
});
Object.defineProperty(LRUCache.prototype, 'itemCount', {
get: function get() {
return this[LRU_LIST].length;
},
enumerable: true
});
LRUCache.prototype.rforEach = function (fn, thisp) {
thisp = thisp || this;
for (var walker = this[LRU_LIST].tail; walker !== null;) {
var prev = walker.prev;
forEachStep(this, fn, walker, thisp);
walker = prev;
}
};
function forEachStep(self, fn, node, thisp) {
var hit = node.value;
if (isStale(self, hit)) {
del(self, node);
if (!self[ALLOW_STALE]) {
hit = undefined;
}
}
if (hit) {
fn.call(thisp, hit.value, hit.key, self);
}
}
LRUCache.prototype.forEach = function (fn, thisp) {
thisp = thisp || this;
for (var walker = this[LRU_LIST].head; walker !== null;) {
var next = walker.next;
forEachStep(this, fn, walker, thisp);
walker = next;
}
};
LRUCache.prototype.keys = function () {
return this[LRU_LIST].toArray().map(function (k) {
return k.key;
}, this);
};
LRUCache.prototype.values = function () {
return this[LRU_LIST].toArray().map(function (k) {
return k.value;
}, this);
};
LRUCache.prototype.reset = function () {
if (this[DISPOSE] && this[LRU_LIST] && this[LRU_LIST].length) {
this[LRU_LIST].forEach(function (hit) {
this[DISPOSE](hit.key, hit.value);
}, this);
}
this[CACHE] = new Map(); // hash of items by key
this[LRU_LIST] = new Yallist(); // list of items in order of use recency
this[LENGTH] = 0; // length of items in the list
};
LRUCache.prototype.dump = function () {
return this[LRU_LIST].map(function (hit) {
if (!isStale(this, hit)) {
return {
k: hit.key,
v: hit.value,
e: hit.now + (hit.maxAge || 0)
};
}
}, this).toArray().filter(function (h) {
return h;
});
};
LRUCache.prototype.dumpLru = function () {
return this[LRU_LIST];
};
/* istanbul ignore next */
LRUCache.prototype.inspect = function (n, opts) {
var str = 'LRUCache {';
var extras = false;
var as = this[ALLOW_STALE];
if (as) {
str += '\n allowStale: true';
extras = true;
}
var max = this[MAX];
if (max && max !== Infinity) {
if (extras) {
str += ',';
}
str += '\n max: ' + util.inspect(max, opts);
extras = true;
}
var maxAge = this[MAX_AGE];
if (maxAge) {
if (extras) {
str += ',';
}
str += '\n maxAge: ' + util.inspect(maxAge, opts);
extras = true;
}
var lc = this[LENGTH_CALCULATOR];
if (lc && lc !== naiveLength) {
if (extras) {
str += ',';
}
str += '\n length: ' + util.inspect(this[LENGTH], opts);
extras = true;
}
var didFirst = false;
this[LRU_LIST].forEach(function (item) {
if (didFirst) {
str += ',\n ';
} else {
if (extras) {
str += ',\n';
}
didFirst = true;
str += '\n ';
}
var key = util.inspect(item.key).split('\n').join('\n ');
var val = {
value: item.value
};
if (item.maxAge !== maxAge) {
val.maxAge = item.maxAge;
}
if (lc !== naiveLength) {
val.length = item.length;
}
if (isStale(this, item)) {
val.stale = true;
}
val = util.inspect(val, opts).split('\n').join('\n ');
str += key + ' => ' + val;
});
if (didFirst || extras) {
str += '\n';
}
str += '}';
return str;
};
LRUCache.prototype.set = function (key, value, maxAge) {
maxAge = maxAge || this[MAX_AGE];
var now = maxAge ? Date.now() : 0;
var len = this[LENGTH_CALCULATOR](value, key);
if (this[CACHE].has(key)) {
if (len > this[MAX]) {
del(this, this[CACHE].get(key));
return false;
}
var node = this[CACHE].get(key);
var item = node.value; // dispose of the old one before overwriting
// split out into 2 ifs for better coverage tracking
if (this[DISPOSE]) {
if (!this[NO_DISPOSE_ON_SET]) {
this[DISPOSE](key, item.value);
}
}
item.now = now;
item.maxAge = maxAge;
item.value = value;
this[LENGTH] += len - item.length;
item.length = len;
this.get(key);
trim(this);
return true;
}
var hit = new Entry(key, value, len, now, maxAge); // oversized objects fall out of cache automatically.
if (hit.length > this[MAX]) {
if (this[DISPOSE]) {
this[DISPOSE](key, value);
}
return false;
}
this[LENGTH] += hit.length;
this[LRU_LIST].unshift(hit);
this[CACHE].set(key, this[LRU_LIST].head);
trim(this);
return true;
};
LRUCache.prototype.has = function (key) {
if (!this[CACHE].has(key)) return false;
var hit = this[CACHE].get(key).value;
if (isStale(this, hit)) {
return false;
}
return true;
};
LRUCache.prototype.get = function (key) {
return get(this, key, true);
};
LRUCache.prototype.peek = function (key) {
return get(this, key, false);
};
LRUCache.prototype.pop = function () {
var node = this[LRU_LIST].tail;
if (!node) return null;
del(this, node);
return node.value;
};
LRUCache.prototype.del = function (key) {
del(this, this[CACHE].get(key));
};
LRUCache.prototype.load = function (arr) {
// reset the cache
this.reset();
var now = Date.now(); // A previous serialized cache has the most recent items first
for (var l = arr.length - 1; l >= 0; l--) {
var hit = arr[l];
var expiresAt = hit.e || 0;
if (expiresAt === 0) {
// the item was created without expiration in a non aged cache
this.set(hit.k, hit.v);
} else {
var maxAge = expiresAt - now; // dont add already expired items
if (maxAge > 0) {
this.set(hit.k, hit.v, maxAge);
}
}
}
};
LRUCache.prototype.prune = function () {
var self = this;
this[CACHE].forEach(function (value, key) {
get(self, key, false);
});
};
function get(self, key, doUse) {
var node = self[CACHE].get(key);
if (node) {
var hit = node.value;
if (isStale(self, hit)) {
del(self, node);
if (!self[ALLOW_STALE]) hit = undefined;
} else {
if (doUse) {
self[LRU_LIST].unshiftNode(node);
}
}
if (hit) hit = hit.value;
}
return hit;
}
function isStale(self, hit) {
if (!hit || !hit.maxAge && !self[MAX_AGE]) {
return false;
}
var stale = false;
var diff = Date.now() - hit.now;
if (hit.maxAge) {
stale = diff > hit.maxAge;
} else {
stale = self[MAX_AGE] && diff > self[MAX_AGE];
}
return stale;
}
function trim(self) {
if (self[LENGTH] > self[MAX]) {
for (var walker = self[LRU_LIST].tail; self[LENGTH] > self[MAX] && walker !== null;) {
// We know that we're about to delete this one, and also
// what the next least recently used key will be, so just
// go ahead and set it now.
var prev = walker.prev;
del(self, walker);
walker = prev;
}
}
}
function del(self, node) {
if (node) {
var hit = node.value;
if (self[DISPOSE]) {
self[DISPOSE](hit.key, hit.value);
}
self[LENGTH] -= hit.length;
self[CACHE].delete(hit.key);
self[LRU_LIST].removeNode(node);
}
} // classy, since V8 prefers predictable objects.
function Entry(key, value, length, now, maxAge) {
this.key = key;
this.value = value;
this.length = length;
this.now = now;
this.maxAge = maxAge || 0;
}
/* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./../process/browser.js */ "../../node_modules/process/browser.js")))
/***/ }),
/***/ "../../node_modules/lru-cache/node_modules/yallist/yallist.js":
/*!*************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/lru-cache/node_modules/yallist/yallist.js ***!
\*************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports) {
module.exports = Yallist;
Yallist.Node = Node;
Yallist.create = Yallist;
function Yallist(list) {
var self = this;
if (!(self instanceof Yallist)) {
self = new Yallist();
}
self.tail = null;
self.head = null;
self.length = 0;
if (list && typeof list.forEach === 'function') {
list.forEach(function (item) {
self.push(item);
});
} else if (arguments.length > 0) {
for (var i = 0, l = arguments.length; i < l; i++) {
self.push(arguments[i]);
}
}
return self;
}
Yallist.prototype.removeNode = function (node) {
if (node.list !== this) {
throw new Error('removing node which does not belong to this list');
}
var next = node.next;
var prev = node.prev;
if (next) {
next.prev = prev;
}
if (prev) {
prev.next = next;
}
if (node === this.head) {
this.head = next;
}
if (node === this.tail) {
this.tail = prev;
}
node.list.length--;
node.next = null;
node.prev = null;
node.list = null;
};
Yallist.prototype.unshiftNode = function (node) {
if (node === this.head) {
return;
}
if (node.list) {
node.list.removeNode(node);
}
var head = this.head;
node.list = this;
node.next = head;
if (head) {
head.prev = node;
}
this.head = node;
if (!this.tail) {
this.tail = node;
}
this.length++;
};
Yallist.prototype.pushNode = function (node) {
if (node === this.tail) {
return;
}
if (node.list) {
node.list.removeNode(node);
}
var tail = this.tail;
node.list = this;
node.prev = tail;
if (tail) {
tail.next = node;
}
this.tail = node;
if (!this.head) {
this.head = node;
}
this.length++;
};
Yallist.prototype.push = function () {
for (var i = 0, l = arguments.length; i < l; i++) {
push(this, arguments[i]);
}
return this.length;
};
Yallist.prototype.unshift = function () {
for (var i = 0, l = arguments.length; i < l; i++) {
unshift(this, arguments[i]);
}
return this.length;
};
Yallist.prototype.pop = function () {
if (!this.tail) {
return undefined;
}
var res = this.tail.value;
this.tail = this.tail.prev;
if (this.tail) {
this.tail.next = null;
} else {
this.head = null;
}
this.length--;
return res;
};
Yallist.prototype.shift = function () {
if (!this.head) {
return undefined;
}
var res = this.head.value;
this.head = this.head.next;
if (this.head) {
this.head.prev = null;
} else {
this.tail = null;
}
this.length--;
return res;
};
Yallist.prototype.forEach = function (fn, thisp) {
thisp = thisp || this;
for (var walker = this.head, i = 0; walker !== null; i++) {
fn.call(thisp, walker.value, i, this);
walker = walker.next;
}
};
Yallist.prototype.forEachReverse = function (fn, thisp) {
thisp = thisp || this;
for (var walker = this.tail, i = this.length - 1; walker !== null; i--) {
fn.call(thisp, walker.value, i, this);
walker = walker.prev;
}
};
Yallist.prototype.get = function (n) {
for (var i = 0, walker = this.head; walker !== null && i < n; i++) {
// abort out of the list early if we hit a cycle
walker = walker.next;
}
if (i === n && walker !== null) {
return walker.value;
}
};
Yallist.prototype.getReverse = function (n) {
for (var i = 0, walker = this.tail; walker !== null && i < n; i++) {
// abort out of the list early if we hit a cycle
walker = walker.prev;
}
if (i === n && walker !== null) {
return walker.value;
}
};
Yallist.prototype.map = function (fn, thisp) {
thisp = thisp || this;
var res = new Yallist();
for (var walker = this.head; walker !== null;) {
res.push(fn.call(thisp, walker.value, this));
walker = walker.next;
}
return res;
};
Yallist.prototype.mapReverse = function (fn, thisp) {
thisp = thisp || this;
var res = new Yallist();
for (var walker = this.tail; walker !== null;) {
res.push(fn.call(thisp, walker.value, this));
walker = walker.prev;
}
return res;
};
Yallist.prototype.reduce = function (fn, initial) {
var acc;
var walker = this.head;
if (arguments.length > 1) {
acc = initial;
} else if (this.head) {
walker = this.head.next;
acc = this.head.value;
} else {
throw new TypeError('Reduce of empty list with no initial value');
}
for (var i = 0; walker !== null; i++) {
acc = fn(acc, walker.value, i);
walker = walker.next;
}
return acc;
};
Yallist.prototype.reduceReverse = function (fn, initial) {
var acc;
var walker = this.tail;
if (arguments.length > 1) {
acc = initial;
} else if (this.tail) {
walker = this.tail.prev;
acc = this.tail.value;
} else {
throw new TypeError('Reduce of empty list with no initial value');
}
for (var i = this.length - 1; walker !== null; i--) {
acc = fn(acc, walker.value, i);
walker = walker.prev;
}
return acc;
};
Yallist.prototype.toArray = function () {
var arr = new Array(this.length);
for (var i = 0, walker = this.head; walker !== null; i++) {
arr[i] = walker.value;
walker = walker.next;
}
return arr;
};
Yallist.prototype.toArrayReverse = function () {
var arr = new Array(this.length);
for (var i = 0, walker = this.tail; walker !== null; i++) {
arr[i] = walker.value;
walker = walker.prev;
}
return arr;
};
Yallist.prototype.slice = function (from, to) {
to = to || this.length;
if (to < 0) {
to += this.length;
}
from = from || 0;
if (from < 0) {
from += this.length;
}
var ret = new Yallist();
if (to < from || to < 0) {
return ret;
}
if (from < 0) {
from = 0;
}
if (to > this.length) {
to = this.length;
}
for (var i = 0, walker = this.head; walker !== null && i < from; i++) {
walker = walker.next;
}
for (; walker !== null && i < to; i++, walker = walker.next) {
ret.push(walker.value);
}
return ret;
};
Yallist.prototype.sliceReverse = function (from, to) {
to = to || this.length;
if (to < 0) {
to += this.length;
}
from = from || 0;
if (from < 0) {
from += this.length;
}
var ret = new Yallist();
if (to < from || to < 0) {
return ret;
}
if (from < 0) {
from = 0;
}
if (to > this.length) {
to = this.length;
}
for (var i = this.length, walker = this.tail; walker !== null && i > to; i--) {
walker = walker.prev;
}
for (; walker !== null && i > from; i--, walker = walker.prev) {
ret.push(walker.value);
}
return ret;
};
Yallist.prototype.reverse = function () {
var head = this.head;
var tail = this.tail;
for (var walker = head; walker !== null; walker = walker.prev) {
var p = walker.prev;
walker.prev = walker.next;
walker.next = p;
}
this.head = tail;
this.tail = head;
return this;
};
function push(self, item) {
self.tail = new Node(item, self.tail, null, self);
if (!self.head) {
self.head = self.tail;
}
self.length++;
}
function unshift(self, item) {
self.head = new Node(item, null, self.head, self);
if (!self.tail) {
self.tail = self.head;
}
self.length++;
}
function Node(value, prev, next, list) {
if (!(this instanceof Node)) {
return new Node(value, prev, next, list);
}
this.list = list;
this.value = value;
if (prev) {
prev.next = this;
this.prev = prev;
} else {
this.prev = null;
}
if (next) {
next.prev = this;
this.next = next;
} else {
this.next = null;
}
}
/***/ }),
/***/ "../../node_modules/memoize-one/esm/index.js":
/*!********************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/memoize-one/esm/index.js ***!
\********************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
var simpleIsEqual = function simpleIsEqual(a, b) {
return a === b;
};
/* harmony default export */ __webpack_exports__["default"] = (function (resultFn) {
var isEqual = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : simpleIsEqual;
var lastThis = void 0;
var lastArgs = [];
var lastResult = void 0;
var calledOnce = false;
var isNewArgEqualToLast = function isNewArgEqualToLast(newArg, index) {
return isEqual(newArg, lastArgs[index]);
};
var result = function result() {
for (var _len = arguments.length, newArgs = Array(_len), _key = 0; _key < _len; _key++) {
newArgs[_key] = arguments[_key];
}
if (calledOnce && lastThis === this && newArgs.length === lastArgs.length && newArgs.every(isNewArgEqualToLast)) {
return lastResult;
}
calledOnce = true;
lastThis = this;
lastArgs = newArgs;
lastResult = resultFn.apply(this, newArgs);
return lastResult;
};
return result;
});
/***/ }),
/***/ "../../node_modules/process/browser.js":
/*!**************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/process/browser.js ***!
\**************************************************************************/
/*! no static exports found */
/***/ (function(module, exports) {
// shim for using process in browser
var process = module.exports = {}; // cached from whatever global is present so that test runners that stub it
// don't break things. But we need to wrap it in a try catch in case it is
// wrapped in strict mode code which doesn't define any globals. It's inside a
// function because try/catches deoptimize in certain engines.
var cachedSetTimeout;
var cachedClearTimeout;
function defaultSetTimout() {
throw new Error('setTimeout has not been defined');
}
function defaultClearTimeout() {
throw new Error('clearTimeout has not been defined');
}
(function () {
try {
if (typeof setTimeout === 'function') {
cachedSetTimeout = setTimeout;
} else {
cachedSetTimeout = defaultSetTimout;
}
} catch (e) {
cachedSetTimeout = defaultSetTimout;
}
try {
if (typeof clearTimeout === 'function') {
cachedClearTimeout = clearTimeout;
} else {
cachedClearTimeout = defaultClearTimeout;
}
} catch (e) {
cachedClearTimeout = defaultClearTimeout;
}
})();
function runTimeout(fun) {
if (cachedSetTimeout === setTimeout) {
//normal enviroments in sane situations
return setTimeout(fun, 0);
} // if setTimeout wasn't available but was latter defined
if ((cachedSetTimeout === defaultSetTimout || !cachedSetTimeout) && setTimeout) {
cachedSetTimeout = setTimeout;
return setTimeout(fun, 0);
}
try {
// when when somebody has screwed with setTimeout but no I.E. maddness
return cachedSetTimeout(fun, 0);
} catch (e) {
try {
// When we are in I.E. but the script has been evaled so I.E. doesn't trust the global object when called normally
return cachedSetTimeout.call(null, fun, 0);
} catch (e) {
// same as above but when it's a version of I.E. that must have the global object for 'this', hopfully our context correct otherwise it will throw a global error
return cachedSetTimeout.call(this, fun, 0);
}
}
}
function runClearTimeout(marker) {
if (cachedClearTimeout === clearTimeout) {
//normal enviroments in sane situations
return clearTimeout(marker);
} // if clearTimeout wasn't available but was latter defined
if ((cachedClearTimeout === defaultClearTimeout || !cachedClearTimeout) && clearTimeout) {
cachedClearTimeout = clearTimeout;
return clearTimeout(marker);
}
try {
// when when somebody has screwed with setTimeout but no I.E. maddness
return cachedClearTimeout(marker);
} catch (e) {
try {
// When we are in I.E. but the script has been evaled so I.E. doesn't trust the global object when called normally
return cachedClearTimeout.call(null, marker);
} catch (e) {
// same as above but when it's a version of I.E. that must have the global object for 'this', hopfully our context correct otherwise it will throw a global error.
// Some versions of I.E. have different rules for clearTimeout vs setTimeout
return cachedClearTimeout.call(this, marker);
}
}
}
var queue = [];
var draining = false;
var currentQueue;
var queueIndex = -1;
function cleanUpNextTick() {
if (!draining || !currentQueue) {
return;
}
draining = false;
if (currentQueue.length) {
queue = currentQueue.concat(queue);
} else {
queueIndex = -1;
}
if (queue.length) {
drainQueue();
}
}
function drainQueue() {
if (draining) {
return;
}
var timeout = runTimeout(cleanUpNextTick);
draining = true;
var len = queue.length;
while (len) {
currentQueue = queue;
queue = [];
while (++queueIndex < len) {
if (currentQueue) {
currentQueue[queueIndex].run();
}
}
queueIndex = -1;
len = queue.length;
}
currentQueue = null;
draining = false;
runClearTimeout(timeout);
}
process.nextTick = function (fun) {
var args = new Array(arguments.length - 1);
if (arguments.length > 1) {
for (var i = 1; i < arguments.length; i++) {
args[i - 1] = arguments[i];
}
}
queue.push(new Item(fun, args));
if (queue.length === 1 && !draining) {
runTimeout(drainQueue);
}
}; // v8 likes predictible objects
function Item(fun, array) {
this.fun = fun;
this.array = array;
}
Item.prototype.run = function () {
this.fun.apply(null, this.array);
};
process.title = 'browser';
process.browser = true;
process.env = {};
process.argv = [];
process.version = ''; // empty string to avoid regexp issues
process.versions = {};
function noop() {}
process.on = noop;
process.addListener = noop;
process.once = noop;
process.off = noop;
process.removeListener = noop;
process.removeAllListeners = noop;
process.emit = noop;
process.prependListener = noop;
process.prependOnceListener = noop;
process.listeners = function (name) {
return [];
};
process.binding = function (name) {
throw new Error('process.binding is not supported');
};
process.cwd = function () {
return '/';
};
process.chdir = function (dir) {
throw new Error('process.chdir is not supported');
};
process.umask = function () {
return 0;
};
/***/ }),
/***/ "../../node_modules/prop-types/factoryWithThrowingShims.js":
/*!**********************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/prop-types/factoryWithThrowingShims.js ***!
\**********************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
/**
* Copyright (c) 2013-present, Facebook, Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
var ReactPropTypesSecret = __webpack_require__(/*! ./lib/ReactPropTypesSecret */ "../../node_modules/prop-types/lib/ReactPropTypesSecret.js");
function emptyFunction() {}
function emptyFunctionWithReset() {}
emptyFunctionWithReset.resetWarningCache = emptyFunction;
module.exports = function () {
function shim(props, propName, componentName, location, propFullName, secret) {
if (secret === ReactPropTypesSecret) {
// It is still safe when called from React.
return;
}
var err = new Error('Calling PropTypes validators directly is not supported by the `prop-types` package. ' + 'Use PropTypes.checkPropTypes() to call them. ' + 'Read more at http://fb.me/use-check-prop-types');
err.name = 'Invariant Violation';
throw err;
}
;
shim.isRequired = shim;
function getShim() {
return shim;
}
; // Important!
// Keep this list in sync with production version in `./factoryWithTypeCheckers.js`.
var ReactPropTypes = {
array: shim,
bool: shim,
func: shim,
number: shim,
object: shim,
string: shim,
symbol: shim,
any: shim,
arrayOf: getShim,
element: shim,
elementType: shim,
instanceOf: getShim,
node: shim,
objectOf: getShim,
oneOf: getShim,
oneOfType: getShim,
shape: getShim,
exact: getShim,
checkPropTypes: emptyFunctionWithReset,
resetWarningCache: emptyFunction
};
ReactPropTypes.PropTypes = ReactPropTypes;
return ReactPropTypes;
};
/***/ }),
/***/ "../../node_modules/prop-types/index.js":
/*!***************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/prop-types/index.js ***!
\***************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
/**
* Copyright (c) 2013-present, Facebook, Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
if (false) { var throwOnDirectAccess, ReactIs; } else {
// By explicitly using `prop-types` you are opting into new production behavior.
// http://fb.me/prop-types-in-prod
module.exports = __webpack_require__(/*! ./factoryWithThrowingShims */ "../../node_modules/prop-types/factoryWithThrowingShims.js")();
}
/***/ }),
/***/ "../../node_modules/prop-types/lib/ReactPropTypesSecret.js":
/*!**********************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/prop-types/lib/ReactPropTypesSecret.js ***!
\**********************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
/**
* Copyright (c) 2013-present, Facebook, Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
var ReactPropTypesSecret = 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED';
module.exports = ReactPropTypesSecret;
/***/ }),
/***/ "../../node_modules/pseudomap/map.js":
/*!************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/pseudomap/map.js ***!
\************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
/* WEBPACK VAR INJECTION */(function(process) {if (process.env.npm_package_name === 'pseudomap' && process.env.npm_lifecycle_script === 'test') process.env.TEST_PSEUDOMAP = 'true';
if (typeof Map === 'function' && !process.env.TEST_PSEUDOMAP) {
module.exports = Map;
} else {
module.exports = __webpack_require__(/*! ./pseudomap */ "../../node_modules/pseudomap/pseudomap.js");
}
/* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./../process/browser.js */ "../../node_modules/process/browser.js")))
/***/ }),
/***/ "../../node_modules/pseudomap/pseudomap.js":
/*!******************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/pseudomap/pseudomap.js ***!
\******************************************************************************/
/*! no static exports found */
/***/ (function(module, exports) {
var hasOwnProperty = Object.prototype.hasOwnProperty;
module.exports = PseudoMap;
function PseudoMap(set) {
if (!(this instanceof PseudoMap)) // whyyyyyyy
throw new TypeError("Constructor PseudoMap requires 'new'");
this.clear();
if (set) {
if (set instanceof PseudoMap || typeof Map === 'function' && set instanceof Map) set.forEach(function (value, key) {
this.set(key, value);
}, this);else if (Array.isArray(set)) set.forEach(function (kv) {
this.set(kv[0], kv[1]);
}, this);else throw new TypeError('invalid argument');
}
}
PseudoMap.prototype.forEach = function (fn, thisp) {
thisp = thisp || this;
Object.keys(this._data).forEach(function (k) {
if (k !== 'size') fn.call(thisp, this._data[k].value, this._data[k].key);
}, this);
};
PseudoMap.prototype.has = function (k) {
return !!find(this._data, k);
};
PseudoMap.prototype.get = function (k) {
var res = find(this._data, k);
return res && res.value;
};
PseudoMap.prototype.set = function (k, v) {
set(this._data, k, v);
};
PseudoMap.prototype.delete = function (k) {
var res = find(this._data, k);
if (res) {
delete this._data[res._index];
this._data.size--;
}
};
PseudoMap.prototype.clear = function () {
var data = Object.create(null);
data.size = 0;
Object.defineProperty(this, '_data', {
value: data,
enumerable: false,
configurable: true,
writable: false
});
};
Object.defineProperty(PseudoMap.prototype, 'size', {
get: function get() {
return this._data.size;
},
set: function set(n) {},
enumerable: true,
configurable: true
});
PseudoMap.prototype.values = PseudoMap.prototype.keys = PseudoMap.prototype.entries = function () {
throw new Error('iterators are not implemented in this version');
}; // Either identical, or both NaN
function same(a, b) {
return a === b || a !== a && b !== b;
}
function Entry(k, v, i) {
this.key = k;
this.value = v;
this._index = i;
}
function find(data, k) {
for (var i = 0, s = '_' + k, key = s; hasOwnProperty.call(data, key); key = s + i++) {
if (same(data[key].key, k)) return data[key];
}
}
function set(data, k, v) {
for (var i = 0, s = '_' + k, key = s; hasOwnProperty.call(data, key); key = s + i++) {
if (same(data[key].key, k)) {
data[key].value = v;
return;
}
}
data.size++;
data[key] = new Entry(k, v, key);
}
/***/ }),
/***/ "../../node_modules/raw-loader/dist/cjs.js!../react-devtools-shared/src/devtools/views/root.css":
/*!***********************************************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/raw-loader/dist/cjs.js!../react-devtools-shared/src/devtools/views/root.css ***!
\***********************************************************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony default export */ __webpack_exports__["default"] = (":root {\n /**\n * IMPORTANT: When new theme variables are added below– also add them to SettingsContext updateThemeVariables()\n */\n\n /* Light theme */\n --light-color-attribute-name: #ef6632;\n --light-color-attribute-name-inverted: rgba(255, 255, 255, 0.7);\n --light-color-attribute-value: #1a1aa6;\n --light-color-attribute-value-inverted: #ffffff;\n --light-color-attribute-editable-value: #1a1aa6;\n --light-color-background: #ffffff;\n --light-color-background-hover: rgba(0, 136, 250, 0.1);\n --light-color-background-inactive: #e5e5e5;\n --light-color-background-invalid: #fff0f0;\n --light-color-background-selected: #0088fa;\n --light-color-button-background: #ffffff;\n --light-color-button-background-focus: #ededed;\n --light-color-button: #5f6673;\n --light-color-button-disabled: #cfd1d5;\n --light-color-button-active: #0088fa;\n --light-color-button-focus: #23272f;\n --light-color-button-hover: #23272f;\n --light-color-border: #eeeeee;\n --light-color-commit-did-not-render-fill: #cfd1d5;\n --light-color-commit-did-not-render-fill-text: #000000;\n --light-color-commit-did-not-render-pattern: #cfd1d5;\n --light-color-commit-did-not-render-pattern-text: #333333;\n --light-color-commit-gradient-0: #37afa9;\n --light-color-commit-gradient-1: #63b19e;\n --light-color-commit-gradient-2: #80b393;\n --light-color-commit-gradient-3: #97b488;\n --light-color-commit-gradient-4: #abb67d;\n --light-color-commit-gradient-5: #beb771;\n --light-color-commit-gradient-6: #cfb965;\n --light-color-commit-gradient-7: #dfba57;\n --light-color-commit-gradient-8: #efbb49;\n --light-color-commit-gradient-9: #febc38;\n --light-color-commit-gradient-text: #000000;\n --light-color-component-name: #6a51b2;\n --light-color-component-name-inverted: #ffffff;\n --light-color-component-badge-background: rgba(0, 0, 0, 0.1);\n --light-color-component-badge-background-inverted: rgba(255, 255, 255, 0.25);\n --light-color-component-badge-count: #777d88;\n --light-color-component-badge-count-inverted: rgba(255, 255, 255, 0.7);\n --light-color-context-background: rgba(0,0,0,.9);\n --light-color-context-background-hover: rgba(255, 255, 255, 0.1);\n --light-color-context-background-selected: #178fb9;\n --light-color-context-border: #3d424a;\n --light-color-context-text: #ffffff;\n --light-color-context-text-selected: #ffffff;\n --light-color-dim: #777d88;\n --light-color-dimmer: #cfd1d5;\n --light-color-dimmest: #eff0f1;\n --light-color-expand-collapse-toggle: #777d88;\n --light-color-modal-background: rgba(255, 255, 255, 0.75);\n --light-color-record-active: #fc3a4b;\n --light-color-record-hover: #3578e5;\n --light-color-record-inactive: #0088fa;\n --light-color-scroll-thumb: #c2c2c2;\n --light-color-scroll-track: #fafafa;\n --light-color-search-match: yellow;\n --light-color-search-match-current: #f7923b;\n --light-color-selected-tree-highlight-active: rgba(0, 136, 250, 0.1);\n --light-color-selected-tree-highlight-inactive: rgba(0, 0, 0, 0.05);\n --light-color-shadow: rgba(0, 0, 0, 0.25);\n --light-color-tab-selected-border: #0088fa;\n --light-color-text: #000000;\n --light-color-text-invalid: #ff0000;\n --light-color-text-selected: #ffffff;\n --light-color-toggle-background-invalid: #fc3a4b;\n --light-color-toggle-background-on: #0088fa;\n --light-color-toggle-background-off: #cfd1d5;\n --light-color-toggle-text: #ffffff;\n --light-color-tooltip-background: rgba(0, 0, 0, 0.9);\n --light-color-tooltip-text: #ffffff;\n\n /* Dark theme */\n --dark-color-attribute-name: #9d87d2;\n --dark-color-attribute-name-inverted: #282828;\n --dark-color-attribute-value: #cedae0;\n --dark-color-attribute-value-inverted: #ffffff;\n --dark-color-attribute-editable-value: yellow;\n --dark-color-background: #282c34;\n --dark-color-background-hover: rgba(255, 255, 255, 0.1);\n --dark-color-background-inactive: #3d424a;\n --dark-color-background-invalid: #5c0000;\n --dark-color-background-selected: #178fb9;\n --dark-color-button-background: #282c34;\n --dark-color-button-background-focus: #3d424a;\n --dark-color-button: #afb3b9;\n --dark-color-button-active: #61dafb;\n --dark-color-button-disabled: #4f5766;\n --dark-color-button-focus: #a2e9fc;\n --dark-color-button-hover: #ededed;\n --dark-color-border: #3d424a;\n --dark-color-commit-did-not-render-fill: #777d88;\n --dark-color-commit-did-not-render-fill-text: #000000;\n --dark-color-commit-did-not-render-pattern: #666c77;\n --dark-color-commit-did-not-render-pattern-text: #ffffff;\n --dark-color-commit-gradient-0: #37afa9;\n --dark-color-commit-gradient-1: #63b19e;\n --dark-color-commit-gradient-2: #80b393;\n --dark-color-commit-gradient-3: #97b488;\n --dark-color-commit-gradient-4: #abb67d;\n --dark-color-commit-gradient-5: #beb771;\n --dark-color-commit-gradient-6: #cfb965;\n --dark-color-commit-gradient-7: #dfba57;\n --dark-color-commit-gradient-8: #efbb49;\n --dark-color-commit-gradient-9: #febc38;\n --dark-color-commit-gradient-text: #000000;\n --dark-color-component-name: #61dafb;\n --dark-color-component-name-inverted: #282828;\n --dark-color-component-badge-background: rgba(255, 255, 255, 0.25);\n --dark-color-component-badge-background-inverted: rgba(0, 0, 0, 0.25);\n --dark-color-component-badge-count: #8f949d;\n --dark-color-component-badge-count-inverted: rgba(255, 255, 255, 0.7);\n --dark-color-context-background: rgba(255,255,255,.9);\n --dark-color-context-background-hover: rgba(0, 136, 250, 0.1);\n --dark-color-context-background-selected: #0088fa;\n --dark-color-context-border: #eeeeee;\n --dark-color-context-text: #000000;\n --dark-color-context-text-selected: #ffffff;\n --dark-color-dim: #8f949d;\n --dark-color-dimmer: #777d88;\n --dark-color-dimmest: #4f5766;\n --dark-color-expand-collapse-toggle: #8f949d;\n --dark-color-modal-background: rgba(0, 0, 0, 0.75);\n --dark-color-record-active: #fc3a4b;\n --dark-color-record-hover: #a2e9fc;\n --dark-color-record-inactive: #61dafb;\n --dark-color-scroll-thumb: #afb3b9;\n --dark-color-scroll-track: #313640;\n --dark-color-search-match: yellow;\n --dark-color-search-match-current: #f7923b;\n --dark-color-selected-tree-highlight-active: rgba(23, 143, 185, 0.15);\n --dark-color-selected-tree-highlight-inactive: rgba(255, 255, 255, 0.05);\n --dark-color-shadow: rgba(0, 0, 0, 0.5);\n --dark-color-tab-selected-border: #178fb9;\n --dark-color-text: #ffffff;\n --dark-color-text-invalid: #ff8080;\n --dark-color-text-selected: #ffffff;\n --dark-color-toggle-background-invalid: #fc3a4b;\n --dark-color-toggle-background-on: #178fb9;\n --dark-color-toggle-background-off: #777d88;\n --dark-color-toggle-text: #ffffff;\n --dark-color-tooltip-background: rgba(255, 255, 255, 0.9);\n --dark-color-tooltip-text: #000000;\n\n /* Font smoothing */\n --light-font-smoothing: auto;\n --dark-font-smoothing: antialiased;\n --font-smoothing: auto;\n\n /* Compact density */\n --compact-font-size-monospace-small: 9px;\n --compact-font-size-monospace-normal: 11px;\n --compact-font-size-monospace-large: 15px;\n --compact-font-size-sans-small: 10px;\n --compact-font-size-sans-normal: 12px;\n --compact-font-size-sans-large: 14px;\n --compact-line-height-data: 18px;\n --compact-root-font-size: 16px;\n\n /* Comfortable density */\n --comfortable-font-size-monospace-small: 10px;\n --comfortable-font-size-monospace-normal: 13px;\n --comfortable-font-size-monospace-large: 17px;\n --comfortable-font-size-sans-small: 12px;\n --comfortable-font-size-sans-normal: 14px;\n --comfortable-font-size-sans-large: 16px;\n --comfortable-line-height-data: 22px;\n --comfortable-root-font-size: 20px;\n\n /* GitHub.com system fonts */\n --font-family-monospace: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo,\n Courier, monospace;\n --font-family-sans: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica,\n Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;\n\n /* Constant values shared between JS and CSS */\n --interaction-commit-size: 10px;\n --interaction-label-width: 200px;\n}\n\n* {\n box-sizing: border-box;\n\n -webkit-font-smoothing: var(--font-smoothing);\n}\n");
/***/ }),
/***/ "../../node_modules/react-virtualized-auto-sizer/dist/index.esm.js":
/*!******************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/react-virtualized-auto-sizer/dist/index.esm.js ***!
\******************************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* WEBPACK VAR INJECTION */(function(global) {/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
/**
* Detect Element Resize.
* https://github.com/sdecima/javascript-detect-element-resize
* Sebastian Decima
*
* Forked from version 0.5.3; includes the following modifications:
* 1) Guard against unsafe 'window' and 'document' references (to support SSR).
* 2) Defer initialization code via a top-level function wrapper (to support SSR).
* 3) Avoid unnecessary reflows by not measuring size for scroll events bubbling from children.
* 4) Add nonce for style element.
**/
function createDetectElementResize(nonce) {
// Check `document` and `window` in case of server-side rendering
var _window;
if (typeof window !== 'undefined') {
_window = window;
} else if (typeof self !== 'undefined') {
_window = self;
} else {
_window = global;
}
var attachEvent = typeof document !== 'undefined' && document.attachEvent;
if (!attachEvent) {
var requestFrame = function () {
var raf = _window.requestAnimationFrame || _window.mozRequestAnimationFrame || _window.webkitRequestAnimationFrame || function (fn) {
return _window.setTimeout(fn, 20);
};
return function (fn) {
return raf(fn);
};
}();
var cancelFrame = function () {
var cancel = _window.cancelAnimationFrame || _window.mozCancelAnimationFrame || _window.webkitCancelAnimationFrame || _window.clearTimeout;
return function (id) {
return cancel(id);
};
}();
var resetTriggers = function resetTriggers(element) {
var triggers = element.__resizeTriggers__,
expand = triggers.firstElementChild,
contract = triggers.lastElementChild,
expandChild = expand.firstElementChild;
contract.scrollLeft = contract.scrollWidth;
contract.scrollTop = contract.scrollHeight;
expandChild.style.width = expand.offsetWidth + 1 + 'px';
expandChild.style.height = expand.offsetHeight + 1 + 'px';
expand.scrollLeft = expand.scrollWidth;
expand.scrollTop = expand.scrollHeight;
};
var checkTriggers = function checkTriggers(element) {
return element.offsetWidth != element.__resizeLast__.width || element.offsetHeight != element.__resizeLast__.height;
};
var scrollListener = function scrollListener(e) {
// Don't measure (which forces) reflow for scrolls that happen inside of children!
if (e.target.className.indexOf('contract-trigger') < 0 && e.target.className.indexOf('expand-trigger') < 0) {
return;
}
var element = this;
resetTriggers(this);
if (this.__resizeRAF__) {
cancelFrame(this.__resizeRAF__);
}
this.__resizeRAF__ = requestFrame(function () {
if (checkTriggers(element)) {
element.__resizeLast__.width = element.offsetWidth;
element.__resizeLast__.height = element.offsetHeight;
element.__resizeListeners__.forEach(function (fn) {
fn.call(element, e);
});
}
});
};
/* Detect CSS Animations support to detect element display/re-attach */
var animation = false,
keyframeprefix = '',
animationstartevent = 'animationstart',
domPrefixes = 'Webkit Moz O ms'.split(' '),
startEvents = 'webkitAnimationStart animationstart oAnimationStart MSAnimationStart'.split(' '),
pfx = '';
{
var elm = document.createElement('fakeelement');
if (elm.style.animationName !== undefined) {
animation = true;
}
if (animation === false) {
for (var i = 0; i < domPrefixes.length; i++) {
if (elm.style[domPrefixes[i] + 'AnimationName'] !== undefined) {
pfx = domPrefixes[i];
keyframeprefix = '-' + pfx.toLowerCase() + '-';
animationstartevent = startEvents[i];
animation = true;
break;
}
}
}
}
var animationName = 'resizeanim';
var animationKeyframes = '@' + keyframeprefix + 'keyframes ' + animationName + ' { from { opacity: 0; } to { opacity: 0; } } ';
var animationStyle = keyframeprefix + 'animation: 1ms ' + animationName + '; ';
}
var createStyles = function createStyles(doc) {
if (!doc.getElementById('detectElementResize')) {
//opacity:0 works around a chrome bug https://code.google.com/p/chromium/issues/detail?id=286360
var css = (animationKeyframes ? animationKeyframes : '') + '.resize-triggers { ' + (animationStyle ? animationStyle : '') + 'visibility: hidden; opacity: 0; } ' + '.resize-triggers, .resize-triggers > div, .contract-trigger:before { content: " "; display: block; position: absolute; top: 0; left: 0; height: 100%; width: 100%; overflow: hidden; z-index: -1; } .resize-triggers > div { background: #eee; overflow: auto; } .contract-trigger:before { width: 200%; height: 200%; }',
head = doc.head || doc.getElementsByTagName('head')[0],
style = doc.createElement('style');
style.id = 'detectElementResize';
style.type = 'text/css';
if (nonce != null) {
style.setAttribute('nonce', nonce);
}
if (style.styleSheet) {
style.styleSheet.cssText = css;
} else {
style.appendChild(doc.createTextNode(css));
}
head.appendChild(style);
}
};
var addResizeListener = function addResizeListener(element, fn) {
if (attachEvent) {
element.attachEvent('onresize', fn);
} else {
if (!element.__resizeTriggers__) {
var doc = element.ownerDocument;
var elementStyle = _window.getComputedStyle(element);
if (elementStyle && elementStyle.position == 'static') {
element.style.position = 'relative';
}
createStyles(doc);
element.__resizeLast__ = {};
element.__resizeListeners__ = [];
(element.__resizeTriggers__ = doc.createElement('div')).className = 'resize-triggers';
element.__resizeTriggers__.innerHTML = '<div class="expand-trigger"><div></div></div>' + '<div class="contract-trigger"></div>';
element.appendChild(element.__resizeTriggers__);
resetTriggers(element);
element.addEventListener('scroll', scrollListener, true);
/* Listen for a css animation to detect element display/re-attach */
if (animationstartevent) {
element.__resizeTriggers__.__animationListener__ = function animationListener(e) {
if (e.animationName == animationName) {
resetTriggers(element);
}
};
element.__resizeTriggers__.addEventListener(animationstartevent, element.__resizeTriggers__.__animationListener__);
}
}
element.__resizeListeners__.push(fn);
}
};
var removeResizeListener = function removeResizeListener(element, fn) {
if (attachEvent) {
element.detachEvent('onresize', fn);
} else {
element.__resizeListeners__.splice(element.__resizeListeners__.indexOf(fn), 1);
if (!element.__resizeListeners__.length) {
element.removeEventListener('scroll', scrollListener, true);
if (element.__resizeTriggers__.__animationListener__) {
element.__resizeTriggers__.removeEventListener(animationstartevent, element.__resizeTriggers__.__animationListener__);
element.__resizeTriggers__.__animationListener__ = null;
}
try {
element.__resizeTriggers__ = !element.removeChild(element.__resizeTriggers__);
} catch (e) {// Preact compat; see developit/preact-compat/issues/228
}
}
}
};
return {
addResizeListener: addResizeListener,
removeResizeListener: removeResizeListener
};
}
var classCallCheck = function classCallCheck(instance, Constructor) {
if (!(instance instanceof Constructor)) {
throw new TypeError("Cannot call a class as a function");
}
};
var createClass = function () {
function defineProperties(target, props) {
for (var i = 0; i < props.length; i++) {
var descriptor = props[i];
descriptor.enumerable = descriptor.enumerable || false;
descriptor.configurable = true;
if ("value" in descriptor) descriptor.writable = true;
Object.defineProperty(target, descriptor.key, descriptor);
}
}
return function (Constructor, protoProps, staticProps) {
if (protoProps) defineProperties(Constructor.prototype, protoProps);
if (staticProps) defineProperties(Constructor, staticProps);
return Constructor;
};
}();
var _extends = Object.assign || function (target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i];
for (var key in source) {
if (Object.prototype.hasOwnProperty.call(source, key)) {
target[key] = source[key];
}
}
}
return target;
};
var inherits = function inherits(subClass, superClass) {
if (typeof superClass !== "function" && superClass !== null) {
throw new TypeError("Super expression must either be null or a function, not " + _typeof(superClass));
}
subClass.prototype = Object.create(superClass && superClass.prototype, {
constructor: {
value: subClass,
enumerable: false,
writable: true,
configurable: true
}
});
if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;
};
var possibleConstructorReturn = function possibleConstructorReturn(self, call) {
if (!self) {
throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
}
return call && (_typeof(call) === "object" || typeof call === "function") ? call : self;
};
var AutoSizer = function (_React$PureComponent) {
inherits(AutoSizer, _React$PureComponent);
function AutoSizer() {
var _ref;
var _temp, _this, _ret;
classCallCheck(this, AutoSizer);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = possibleConstructorReturn(this, (_ref = AutoSizer.__proto__ || Object.getPrototypeOf(AutoSizer)).call.apply(_ref, [this].concat(args))), _this), _this.state = {
height: _this.props.defaultHeight || 0,
width: _this.props.defaultWidth || 0
}, _this._onResize = function () {
var _this$props = _this.props,
disableHeight = _this$props.disableHeight,
disableWidth = _this$props.disableWidth,
onResize = _this$props.onResize;
if (_this._parentNode) {
// Guard against AutoSizer component being removed from the DOM immediately after being added.
// This can result in invalid style values which can result in NaN values if we don't handle them.
// See issue #150 for more context.
var _height = _this._parentNode.offsetHeight || 0;
var _width = _this._parentNode.offsetWidth || 0;
var _style = window.getComputedStyle(_this._parentNode) || {};
var paddingLeft = parseInt(_style.paddingLeft, 10) || 0;
var paddingRight = parseInt(_style.paddingRight, 10) || 0;
var paddingTop = parseInt(_style.paddingTop, 10) || 0;
var paddingBottom = parseInt(_style.paddingBottom, 10) || 0;
var newHeight = _height - paddingTop - paddingBottom;
var newWidth = _width - paddingLeft - paddingRight;
if (!disableHeight && _this.state.height !== newHeight || !disableWidth && _this.state.width !== newWidth) {
_this.setState({
height: _height - paddingTop - paddingBottom,
width: _width - paddingLeft - paddingRight
});
onResize({
height: _height,
width: _width
});
}
}
}, _this._setRef = function (autoSizer) {
_this._autoSizer = autoSizer;
}, _temp), possibleConstructorReturn(_this, _ret);
}
createClass(AutoSizer, [{
key: 'componentDidMount',
value: function componentDidMount() {
var nonce = this.props.nonce;
if (this._autoSizer && this._autoSizer.parentNode && this._autoSizer.parentNode.ownerDocument && this._autoSizer.parentNode.ownerDocument.defaultView && this._autoSizer.parentNode instanceof this._autoSizer.parentNode.ownerDocument.defaultView.HTMLElement) {
// Delay access of parentNode until mount.
// This handles edge-cases where the component has already been unmounted before its ref has been set,
// As well as libraries like react-lite which have a slightly different lifecycle.
this._parentNode = this._autoSizer.parentNode; // Defer requiring resize handler in order to support server-side rendering.
// See issue #41
this._detectElementResize = createDetectElementResize(nonce);
this._detectElementResize.addResizeListener(this._parentNode, this._onResize);
this._onResize();
}
}
}, {
key: 'componentWillUnmount',
value: function componentWillUnmount() {
if (this._detectElementResize && this._parentNode) {
this._detectElementResize.removeResizeListener(this._parentNode, this._onResize);
}
}
}, {
key: 'render',
value: function render() {
var _props = this.props,
children = _props.children,
className = _props.className,
disableHeight = _props.disableHeight,
disableWidth = _props.disableWidth,
style = _props.style;
var _state = this.state,
height = _state.height,
width = _state.width; // Outer div should not force width/height since that may prevent containers from shrinking.
// Inner component should overflow and use calculated width/height.
// See issue #68 for more information.
var outerStyle = {
overflow: 'visible'
};
var childParams = {}; // Avoid rendering children before the initial measurements have been collected.
// At best this would just be wasting cycles.
var bailoutOnChildren = false;
if (!disableHeight) {
if (height === 0) {
bailoutOnChildren = true;
}
outerStyle.height = 0;
childParams.height = height;
}
if (!disableWidth) {
if (width === 0) {
bailoutOnChildren = true;
}
outerStyle.width = 0;
childParams.width = width;
}
return Object(react__WEBPACK_IMPORTED_MODULE_0__["createElement"])('div', {
className: className,
ref: this._setRef,
style: _extends({}, outerStyle, style)
}, !bailoutOnChildren && children(childParams));
}
}]);
return AutoSizer;
}(react__WEBPACK_IMPORTED_MODULE_0__["PureComponent"]);
AutoSizer.defaultProps = {
onResize: function onResize() {},
disableHeight: false,
disableWidth: false,
style: {}
};
/* harmony default export */ __webpack_exports__["default"] = (AutoSizer);
/* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./../../webpack/buildin/global.js */ "../../node_modules/webpack/buildin/global.js")))
/***/ }),
/***/ "../../node_modules/setimmediate/setImmediate.js":
/*!************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/setimmediate/setImmediate.js ***!
\************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
/* WEBPACK VAR INJECTION */(function(global, process) {(function (global, undefined) {
"use strict";
if (global.setImmediate) {
return;
}
var nextHandle = 1; // Spec says greater than zero
var tasksByHandle = {};
var currentlyRunningATask = false;
var doc = global.document;
var registerImmediate;
function setImmediate(callback) {
// Callback can either be a function or a string
if (typeof callback !== "function") {
callback = new Function("" + callback);
} // Copy function arguments
var args = new Array(arguments.length - 1);
for (var i = 0; i < args.length; i++) {
args[i] = arguments[i + 1];
} // Store and register the task
var task = {
callback: callback,
args: args
};
tasksByHandle[nextHandle] = task;
registerImmediate(nextHandle);
return nextHandle++;
}
function clearImmediate(handle) {
delete tasksByHandle[handle];
}
function run(task) {
var callback = task.callback;
var args = task.args;
switch (args.length) {
case 0:
callback();
break;
case 1:
callback(args[0]);
break;
case 2:
callback(args[0], args[1]);
break;
case 3:
callback(args[0], args[1], args[2]);
break;
default:
callback.apply(undefined, args);
break;
}
}
function runIfPresent(handle) {
// From the spec: "Wait until any invocations of this algorithm started before this one have completed."
// So if we're currently running a task, we'll need to delay this invocation.
if (currentlyRunningATask) {
// Delay by doing a setTimeout. setImmediate was tried instead, but in Firefox 7 it generated a
// "too much recursion" error.
setTimeout(runIfPresent, 0, handle);
} else {
var task = tasksByHandle[handle];
if (task) {
currentlyRunningATask = true;
try {
run(task);
} finally {
clearImmediate(handle);
currentlyRunningATask = false;
}
}
}
}
function installNextTickImplementation() {
registerImmediate = function registerImmediate(handle) {
process.nextTick(function () {
runIfPresent(handle);
});
};
}
function canUsePostMessage() {
// The test against `importScripts` prevents this implementation from being installed inside a web worker,
// where `global.postMessage` means something completely different and can't be used for this purpose.
if (global.postMessage && !global.importScripts) {
var postMessageIsAsynchronous = true;
var oldOnMessage = global.onmessage;
global.onmessage = function () {
postMessageIsAsynchronous = false;
};
global.postMessage("", "*");
global.onmessage = oldOnMessage;
return postMessageIsAsynchronous;
}
}
function installPostMessageImplementation() {
// Installs an event handler on `global` for the `message` event: see
// * https://developer.mozilla.org/en/DOM/window.postMessage
// * http://www.whatwg.org/specs/web-apps/current-work/multipage/comms.html#crossDocumentMessages
var messagePrefix = "setImmediate$" + Math.random() + "$";
var onGlobalMessage = function onGlobalMessage(event) {
if (event.source === global && typeof event.data === "string" && event.data.indexOf(messagePrefix) === 0) {
runIfPresent(+event.data.slice(messagePrefix.length));
}
};
if (global.addEventListener) {
global.addEventListener("message", onGlobalMessage, false);
} else {
global.attachEvent("onmessage", onGlobalMessage);
}
registerImmediate = function registerImmediate(handle) {
global.postMessage(messagePrefix + handle, "*");
};
}
function installMessageChannelImplementation() {
var channel = new MessageChannel();
channel.port1.onmessage = function (event) {
var handle = event.data;
runIfPresent(handle);
};
registerImmediate = function registerImmediate(handle) {
channel.port2.postMessage(handle);
};
}
function installReadyStateChangeImplementation() {
var html = doc.documentElement;
registerImmediate = function registerImmediate(handle) {
// Create a <script> element; its readystatechange event will be fired asynchronously once it is inserted
// into the document. Do so, thus queuing up the task. Remember to clean up once it's been called.
var script = doc.createElement("script");
script.onreadystatechange = function () {
runIfPresent(handle);
script.onreadystatechange = null;
html.removeChild(script);
script = null;
};
html.appendChild(script);
};
}
function installSetTimeoutImplementation() {
registerImmediate = function registerImmediate(handle) {
setTimeout(runIfPresent, 0, handle);
};
} // If supported, we should attach to the prototype of global, since that is where setTimeout et al. live.
var attachTo = Object.getPrototypeOf && Object.getPrototypeOf(global);
attachTo = attachTo && attachTo.setTimeout ? attachTo : global; // Don't get fooled by e.g. browserify environments.
if ({}.toString.call(global.process) === "[object process]") {
// For Node.js before 0.9
installNextTickImplementation();
} else if (canUsePostMessage()) {
// For non-IE10 modern browsers
installPostMessageImplementation();
} else if (global.MessageChannel) {
// For web workers, where supported
installMessageChannelImplementation();
} else if (doc && "onreadystatechange" in doc.createElement("script")) {
// For IE 6–8
installReadyStateChangeImplementation();
} else {
// For older browsers
installSetTimeoutImplementation();
}
attachTo.setImmediate = setImmediate;
attachTo.clearImmediate = clearImmediate;
})(typeof self === "undefined" ? typeof global === "undefined" ? this : global : self);
/* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./../webpack/buildin/global.js */ "../../node_modules/webpack/buildin/global.js"), __webpack_require__(/*! ./../process/browser.js */ "../../node_modules/process/browser.js")))
/***/ }),
/***/ "../../node_modules/style-loader/lib/addStyles.js":
/*!*************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/style-loader/lib/addStyles.js ***!
\*************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
/*
MIT License http://www.opensource.org/licenses/mit-license.php
Author Tobias Koppers @sokra
*/
var stylesInDom = {};
var memoize = function (fn) {
var memo;
return function () {
if (typeof memo === "undefined") memo = fn.apply(this, arguments);
return memo;
};
};
var isOldIE = memoize(function () {
// Test for IE <= 9 as proposed by Browserhacks
// @see http://browserhacks.com/#hack-e71d8692f65334173fee715c222cb805
// Tests for existence of standard globals is to allow style-loader
// to operate correctly into non-standard environments
// @see https://github.com/webpack-contrib/style-loader/issues/177
return window && document && document.all && !window.atob;
});
var getTarget = function (target, parent) {
if (parent){
return parent.querySelector(target);
}
return document.querySelector(target);
};
var getElement = (function (fn) {
var memo = {};
return function(target, parent) {
// If passing function in options, then use it for resolve "head" element.
// Useful for Shadow Root style i.e
// {
// insertInto: function () { return document.querySelector("#foo").shadowRoot }
// }
if (typeof target === 'function') {
return target();
}
if (typeof memo[target] === "undefined") {
var styleTarget = getTarget.call(this, target, parent);
// Special case to return head of iframe instead of iframe itself
if (window.HTMLIFrameElement && styleTarget instanceof window.HTMLIFrameElement) {
try {
// This will throw an exception if access to iframe is blocked
// due to cross-origin restrictions
styleTarget = styleTarget.contentDocument.head;
} catch(e) {
styleTarget = null;
}
}
memo[target] = styleTarget;
}
return memo[target]
};
})();
var singleton = null;
var singletonCounter = 0;
var stylesInsertedAtTop = [];
var fixUrls = __webpack_require__(/*! ./urls */ "../../node_modules/style-loader/lib/urls.js");
module.exports = function(list, options) {
if (typeof DEBUG !== "undefined" && DEBUG) {
if (typeof document !== "object") throw new Error("The style-loader cannot be used in a non-browser environment");
}
options = options || {};
options.attrs = typeof options.attrs === "object" ? options.attrs : {};
// Force single-tag solution on IE6-9, which has a hard limit on the # of <style>
// tags it will allow on a page
if (!options.singleton && typeof options.singleton !== "boolean") options.singleton = isOldIE();
// By default, add <style> tags to the <head> element
if (!options.insertInto) options.insertInto = "head";
// By default, add <style> tags to the bottom of the target
if (!options.insertAt) options.insertAt = "bottom";
var styles = listToStyles(list, options);
addStylesToDom(styles, options);
return function update (newList) {
var mayRemove = [];
for (var i = 0; i < styles.length; i++) {
var item = styles[i];
var domStyle = stylesInDom[item.id];
domStyle.refs--;
mayRemove.push(domStyle);
}
if(newList) {
var newStyles = listToStyles(newList, options);
addStylesToDom(newStyles, options);
}
for (var i = 0; i < mayRemove.length; i++) {
var domStyle = mayRemove[i];
if(domStyle.refs === 0) {
for (var j = 0; j < domStyle.parts.length; j++) domStyle.parts[j]();
delete stylesInDom[domStyle.id];
}
}
};
};
function addStylesToDom (styles, options) {
for (var i = 0; i < styles.length; i++) {
var item = styles[i];
var domStyle = stylesInDom[item.id];
if(domStyle) {
domStyle.refs++;
for(var j = 0; j < domStyle.parts.length; j++) {
domStyle.parts[j](item.parts[j]);
}
for(; j < item.parts.length; j++) {
domStyle.parts.push(addStyle(item.parts[j], options));
}
} else {
var parts = [];
for(var j = 0; j < item.parts.length; j++) {
parts.push(addStyle(item.parts[j], options));
}
stylesInDom[item.id] = {id: item.id, refs: 1, parts: parts};
}
}
}
function listToStyles (list, options) {
var styles = [];
var newStyles = {};
for (var i = 0; i < list.length; i++) {
var item = list[i];
var id = options.base ? item[0] + options.base : item[0];
var css = item[1];
var media = item[2];
var sourceMap = item[3];
var part = {css: css, media: media, sourceMap: sourceMap};
if(!newStyles[id]) styles.push(newStyles[id] = {id: id, parts: [part]});
else newStyles[id].parts.push(part);
}
return styles;
}
function insertStyleElement (options, style) {
var target = getElement(options.insertInto)
if (!target) {
throw new Error("Couldn't find a style target. This probably means that the value for the 'insertInto' parameter is invalid.");
}
var lastStyleElementInsertedAtTop = stylesInsertedAtTop[stylesInsertedAtTop.length - 1];
if (options.insertAt === "top") {
if (!lastStyleElementInsertedAtTop) {
target.insertBefore(style, target.firstChild);
} else if (lastStyleElementInsertedAtTop.nextSibling) {
target.insertBefore(style, lastStyleElementInsertedAtTop.nextSibling);
} else {
target.appendChild(style);
}
stylesInsertedAtTop.push(style);
} else if (options.insertAt === "bottom") {
target.appendChild(style);
} else if (typeof options.insertAt === "object" && options.insertAt.before) {
var nextSibling = getElement(options.insertAt.before, target);
target.insertBefore(style, nextSibling);
} else {
throw new Error("[Style Loader]\n\n Invalid value for parameter 'insertAt' ('options.insertAt') found.\n Must be 'top', 'bottom', or Object.\n (https://github.com/webpack-contrib/style-loader#insertat)\n");
}
}
function removeStyleElement (style) {
if (style.parentNode === null) return false;
style.parentNode.removeChild(style);
var idx = stylesInsertedAtTop.indexOf(style);
if(idx >= 0) {
stylesInsertedAtTop.splice(idx, 1);
}
}
function createStyleElement (options) {
var style = document.createElement("style");
if(options.attrs.type === undefined) {
options.attrs.type = "text/css";
}
if(options.attrs.nonce === undefined) {
var nonce = getNonce();
if (nonce) {
options.attrs.nonce = nonce;
}
}
addAttrs(style, options.attrs);
insertStyleElement(options, style);
return style;
}
function createLinkElement (options) {
var link = document.createElement("link");
if(options.attrs.type === undefined) {
options.attrs.type = "text/css";
}
options.attrs.rel = "stylesheet";
addAttrs(link, options.attrs);
insertStyleElement(options, link);
return link;
}
function addAttrs (el, attrs) {
Object.keys(attrs).forEach(function (key) {
el.setAttribute(key, attrs[key]);
});
}
function getNonce() {
if (false) {}
return __webpack_require__.nc;
}
function addStyle (obj, options) {
var style, update, remove, result;
// If a transform function was defined, run it on the css
if (options.transform && obj.css) {
result = typeof options.transform === 'function'
? options.transform(obj.css)
: options.transform.default(obj.css);
if (result) {
// If transform returns a value, use that instead of the original css.
// This allows running runtime transformations on the css.
obj.css = result;
} else {
// If the transform function returns a falsy value, don't add this css.
// This allows conditional loading of css
return function() {
// noop
};
}
}
if (options.singleton) {
var styleIndex = singletonCounter++;
style = singleton || (singleton = createStyleElement(options));
update = applyToSingletonTag.bind(null, style, styleIndex, false);
remove = applyToSingletonTag.bind(null, style, styleIndex, true);
} else if (
obj.sourceMap &&
typeof URL === "function" &&
typeof URL.createObjectURL === "function" &&
typeof URL.revokeObjectURL === "function" &&
typeof Blob === "function" &&
typeof btoa === "function"
) {
style = createLinkElement(options);
update = updateLink.bind(null, style, options);
remove = function () {
removeStyleElement(style);
if(style.href) URL.revokeObjectURL(style.href);
};
} else {
style = createStyleElement(options);
update = applyToTag.bind(null, style);
remove = function () {
removeStyleElement(style);
};
}
update(obj);
return function updateStyle (newObj) {
if (newObj) {
if (
newObj.css === obj.css &&
newObj.media === obj.media &&
newObj.sourceMap === obj.sourceMap
) {
return;
}
update(obj = newObj);
} else {
remove();
}
};
}
var replaceText = (function () {
var textStore = [];
return function (index, replacement) {
textStore[index] = replacement;
return textStore.filter(Boolean).join('\n');
};
})();
function applyToSingletonTag (style, index, remove, obj) {
var css = remove ? "" : obj.css;
if (style.styleSheet) {
style.styleSheet.cssText = replaceText(index, css);
} else {
var cssNode = document.createTextNode(css);
var childNodes = style.childNodes;
if (childNodes[index]) style.removeChild(childNodes[index]);
if (childNodes.length) {
style.insertBefore(cssNode, childNodes[index]);
} else {
style.appendChild(cssNode);
}
}
}
function applyToTag (style, obj) {
var css = obj.css;
var media = obj.media;
if(media) {
style.setAttribute("media", media)
}
if(style.styleSheet) {
style.styleSheet.cssText = css;
} else {
while(style.firstChild) {
style.removeChild(style.firstChild);
}
style.appendChild(document.createTextNode(css));
}
}
function updateLink (link, options, obj) {
var css = obj.css;
var sourceMap = obj.sourceMap;
/*
If convertToAbsoluteUrls isn't defined, but sourcemaps are enabled
and there is no publicPath defined then lets turn convertToAbsoluteUrls
on by default. Otherwise default to the convertToAbsoluteUrls option
directly
*/
var autoFixUrls = options.convertToAbsoluteUrls === undefined && sourceMap;
if (options.convertToAbsoluteUrls || autoFixUrls) {
css = fixUrls(css);
}
if (sourceMap) {
// http://stackoverflow.com/a/26603875
css += "\n/*# sourceMappingURL=data:application/json;base64," + btoa(unescape(encodeURIComponent(JSON.stringify(sourceMap)))) + " */";
}
var blob = new Blob([css], { type: "text/css" });
var oldSrc = link.href;
link.href = URL.createObjectURL(blob);
if(oldSrc) URL.revokeObjectURL(oldSrc);
}
/***/ }),
/***/ "../../node_modules/style-loader/lib/urls.js":
/*!********************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/style-loader/lib/urls.js ***!
\********************************************************************************/
/*! no static exports found */
/***/ (function(module, exports) {
/**
* When source maps are enabled, `style-loader` uses a link element with a data-uri to
* embed the css on the page. This breaks all relative urls because now they are relative to a
* bundle instead of the current page.
*
* One solution is to only use full urls, but that may be impossible.
*
* Instead, this function "fixes" the relative urls to be absolute according to the current page location.
*
* A rudimentary test suite is located at `test/fixUrls.js` and can be run via the `npm test` command.
*
*/
module.exports = function (css) {
// get current location
var location = typeof window !== "undefined" && window.location;
if (!location) {
throw new Error("fixUrls requires window.location");
} // blank or null?
if (!css || typeof css !== "string") {
return css;
}
var baseUrl = location.protocol + "//" + location.host;
var currentDir = baseUrl + location.pathname.replace(/\/[^\/]*$/, "/"); // convert each url(...)
/*
This regular expression is just a way to recursively match brackets within
a string.
/url\s*\( = Match on the word "url" with any whitespace after it and then a parens
( = Start a capturing group
(?: = Start a non-capturing group
[^)(] = Match anything that isn't a parentheses
| = OR
\( = Match a start parentheses
(?: = Start another non-capturing groups
[^)(]+ = Match anything that isn't a parentheses
| = OR
\( = Match a start parentheses
[^)(]* = Match anything that isn't a parentheses
\) = Match a end parentheses
) = End Group
*\) = Match anything and then a close parens
) = Close non-capturing group
* = Match anything
) = Close capturing group
\) = Match a close parens
/gi = Get all matches, not the first. Be case insensitive.
*/
var fixedCss = css.replace(/url\s*\(((?:[^)(]|\((?:[^)(]+|\([^)(]*\))*\))*)\)/gi, function (fullMatch, origUrl) {
// strip quotes (if they exist)
var unquotedOrigUrl = origUrl.trim().replace(/^"(.*)"$/, function (o, $1) {
return $1;
}).replace(/^'(.*)'$/, function (o, $1) {
return $1;
}); // already a full url? no change
if (/^(#|data:|http:\/\/|https:\/\/|file:\/\/\/|\s*$)/i.test(unquotedOrigUrl)) {
return fullMatch;
} // convert the url to a full url
var newUrl;
if (unquotedOrigUrl.indexOf("//") === 0) {
//TODO: should we add protocol?
newUrl = unquotedOrigUrl;
} else if (unquotedOrigUrl.indexOf("/") === 0) {
// path should be relative to the base url
newUrl = baseUrl + unquotedOrigUrl; // already starts with '/'
} else {
// path should be relative to current directory
newUrl = currentDir + unquotedOrigUrl.replace(/^\.\//, ""); // Strip leading './'
} // send back the fixed url(...)
return "url(" + JSON.stringify(newUrl) + ")";
}); // send back the fixed css
return fixedCss;
};
/***/ }),
/***/ "../../node_modules/type/function/is.js":
/*!***************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/type/function/is.js ***!
\***************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var isPrototype = __webpack_require__(/*! ../prototype/is */ "../../node_modules/type/prototype/is.js");
module.exports = function (value) {
if (typeof value !== "function") return false;
if (!hasOwnProperty.call(value, "length")) return false;
try {
if (typeof value.length !== "number") return false;
if (typeof value.call !== "function") return false;
if (typeof value.apply !== "function") return false;
} catch (error) {
return false;
}
return !isPrototype(value);
};
/***/ }),
/***/ "../../node_modules/type/object/is.js":
/*!*************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/type/object/is.js ***!
\*************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
var isValue = __webpack_require__(/*! ../value/is */ "../../node_modules/type/value/is.js"); // prettier-ignore
var possibleTypes = {
"object": true,
"function": true,
"undefined": true
/* document.all */
};
module.exports = function (value) {
if (!isValue(value)) return false;
return hasOwnProperty.call(possibleTypes, _typeof(value));
};
/***/ }),
/***/ "../../node_modules/type/plain-function/is.js":
/*!*********************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/type/plain-function/is.js ***!
\*********************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var isFunction = __webpack_require__(/*! ../function/is */ "../../node_modules/type/function/is.js");
var classRe = /^\s*class[\s{/}]/,
functionToString = Function.prototype.toString;
module.exports = function (value) {
if (!isFunction(value)) return false;
if (classRe.test(functionToString.call(value))) return false;
return true;
};
/***/ }),
/***/ "../../node_modules/type/prototype/is.js":
/*!****************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/type/prototype/is.js ***!
\****************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var isObject = __webpack_require__(/*! ../object/is */ "../../node_modules/type/object/is.js");
module.exports = function (value) {
if (!isObject(value)) return false;
try {
if (!value.constructor) return false;
return value.constructor.prototype === value;
} catch (error) {
return false;
}
};
/***/ }),
/***/ "../../node_modules/type/value/is.js":
/*!************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/type/value/is.js ***!
\************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
// ES3 safe
var _undefined = void 0;
module.exports = function (value) {
return value !== _undefined && value !== null;
};
/***/ }),
/***/ "../../node_modules/util/node_modules/inherits/inherits_browser.js":
/*!******************************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/util/node_modules/inherits/inherits_browser.js ***!
\******************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports) {
if (typeof Object.create === 'function') {
// implementation from standard node.js 'util' module
module.exports = function inherits(ctor, superCtor) {
ctor.super_ = superCtor;
ctor.prototype = Object.create(superCtor.prototype, {
constructor: {
value: ctor,
enumerable: false,
writable: true,
configurable: true
}
});
};
} else {
// old school shim for old browsers
module.exports = function inherits(ctor, superCtor) {
ctor.super_ = superCtor;
var TempCtor = function TempCtor() {};
TempCtor.prototype = superCtor.prototype;
ctor.prototype = new TempCtor();
ctor.prototype.constructor = ctor;
};
}
/***/ }),
/***/ "../../node_modules/util/support/isBufferBrowser.js":
/*!***************************************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/util/support/isBufferBrowser.js ***!
\***************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports) {
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
module.exports = function isBuffer(arg) {
return arg && _typeof(arg) === 'object' && typeof arg.copy === 'function' && typeof arg.fill === 'function' && typeof arg.readUInt8 === 'function';
};
/***/ }),
/***/ "../../node_modules/util/util.js":
/*!********************************************************************!*\
!*** /Users/bvaughn/Documents/git/react/node_modules/util/util.js ***!
\********************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
/* WEBPACK VAR INJECTION */(function(process) {function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
// Copyright Joyent, Inc. and other Node contributors.
//
// Permission is hereby granted, free of charge, to any person obtaining a
// copy of this software and associated documentation files (the
// "Software"), to deal in the Software without restriction, including
// without limitation the rights to use, copy, modify, merge, publish,
// distribute, sublicense, and/or sell copies of the Software, and to permit
// persons to whom the Software is furnished to do so, subject to the
// following conditions:
//
// The above copyright notice and this permission notice shall be included
// in all copies or substantial portions of the Software.
//
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
// OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
// MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN
// NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM,
// DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR
// OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE
// USE OR OTHER DEALINGS IN THE SOFTWARE.
var getOwnPropertyDescriptors = Object.getOwnPropertyDescriptors || function getOwnPropertyDescriptors(obj) {
var keys = Object.keys(obj);
var descriptors = {};
for (var i = 0; i < keys.length; i++) {
descriptors[keys[i]] = Object.getOwnPropertyDescriptor(obj, keys[i]);
}
return descriptors;
};
var formatRegExp = /%[sdj%]/g;
exports.format = function (f) {
if (!isString(f)) {
var objects = [];
for (var i = 0; i < arguments.length; i++) {
objects.push(inspect(arguments[i]));
}
return objects.join(' ');
}
var i = 1;
var args = arguments;
var len = args.length;
var str = String(f).replace(formatRegExp, function (x) {
if (x === '%%') return '%';
if (i >= len) return x;
switch (x) {
case '%s':
return String(args[i++]);
case '%d':
return Number(args[i++]);
case '%j':
try {
return JSON.stringify(args[i++]);
} catch (_) {
return '[Circular]';
}
default:
return x;
}
});
for (var x = args[i]; i < len; x = args[++i]) {
if (isNull(x) || !isObject(x)) {
str += ' ' + x;
} else {
str += ' ' + inspect(x);
}
}
return str;
}; // Mark that a method should not be used.
// Returns a modified function which warns once by default.
// If --no-deprecation is set, then it is a no-op.
exports.deprecate = function (fn, msg) {
if (typeof process !== 'undefined' && process.noDeprecation === true) {
return fn;
} // Allow for deprecating things in the process of starting up.
if (typeof process === 'undefined') {
return function () {
return exports.deprecate(fn, msg).apply(this, arguments);
};
}
var warned = false;
function deprecated() {
if (!warned) {
if (process.throwDeprecation) {
throw new Error(msg);
} else if (process.traceDeprecation) {
console.trace(msg);
} else {
console.error(msg);
}
warned = true;
}
return fn.apply(this, arguments);
}
return deprecated;
};
var debugs = {};
var debugEnviron;
exports.debuglog = function (set) {
if (isUndefined(debugEnviron)) debugEnviron = process.env.NODE_DEBUG || '';
set = set.toUpperCase();
if (!debugs[set]) {
if (new RegExp('\\b' + set + '\\b', 'i').test(debugEnviron)) {
var pid = process.pid;
debugs[set] = function () {
var msg = exports.format.apply(exports, arguments);
console.error('%s %d: %s', set, pid, msg);
};
} else {
debugs[set] = function () {};
}
}
return debugs[set];
};
/**
* Echos the value of a value. Trys to print the value out
* in the best way possible given the different types.
*
* @param {Object} obj The object to print out.
* @param {Object} opts Optional options object that alters the output.
*/
/* legacy: obj, showHidden, depth, colors*/
function inspect(obj, opts) {
// default options
var ctx = {
seen: [],
stylize: stylizeNoColor
}; // legacy...
if (arguments.length >= 3) ctx.depth = arguments[2];
if (arguments.length >= 4) ctx.colors = arguments[3];
if (isBoolean(opts)) {
// legacy...
ctx.showHidden = opts;
} else if (opts) {
// got an "options" object
exports._extend(ctx, opts);
} // set default options
if (isUndefined(ctx.showHidden)) ctx.showHidden = false;
if (isUndefined(ctx.depth)) ctx.depth = 2;
if (isUndefined(ctx.colors)) ctx.colors = false;
if (isUndefined(ctx.customInspect)) ctx.customInspect = true;
if (ctx.colors) ctx.stylize = stylizeWithColor;
return formatValue(ctx, obj, ctx.depth);
}
exports.inspect = inspect; // http://en.wikipedia.org/wiki/ANSI_escape_code#graphics
inspect.colors = {
'bold': [1, 22],
'italic': [3, 23],
'underline': [4, 24],
'inverse': [7, 27],
'white': [37, 39],
'grey': [90, 39],
'black': [30, 39],
'blue': [34, 39],
'cyan': [36, 39],
'green': [32, 39],
'magenta': [35, 39],
'red': [31, 39],
'yellow': [33, 39]
}; // Don't use 'blue' not visible on cmd.exe
inspect.styles = {
'special': 'cyan',
'number': 'yellow',
'boolean': 'yellow',
'undefined': 'grey',
'null': 'bold',
'string': 'green',
'date': 'magenta',
// "name": intentionally not styling
'regexp': 'red'
};
function stylizeWithColor(str, styleType) {
var style = inspect.styles[styleType];
if (style) {
return "\x1B[" + inspect.colors[style][0] + 'm' + str + "\x1B[" + inspect.colors[style][1] + 'm';
} else {
return str;
}
}
function stylizeNoColor(str, styleType) {
return str;
}
function arrayToHash(array) {
var hash = {};
array.forEach(function (val, idx) {
hash[val] = true;
});
return hash;
}
function formatValue(ctx, value, recurseTimes) {
// Provide a hook for user-specified inspect functions.
// Check that value is an object with an inspect function on it
if (ctx.customInspect && value && isFunction(value.inspect) && // Filter out the util module, it's inspect function is special
value.inspect !== exports.inspect && // Also filter out any prototype objects using the circular check.
!(value.constructor && value.constructor.prototype === value)) {
var ret = value.inspect(recurseTimes, ctx);
if (!isString(ret)) {
ret = formatValue(ctx, ret, recurseTimes);
}
return ret;
} // Primitive types cannot have properties
var primitive = formatPrimitive(ctx, value);
if (primitive) {
return primitive;
} // Look up the keys of the object.
var keys = Object.keys(value);
var visibleKeys = arrayToHash(keys);
if (ctx.showHidden) {
keys = Object.getOwnPropertyNames(value);
} // IE doesn't make error fields non-enumerable
// http://msdn.microsoft.com/en-us/library/ie/dww52sbt(v=vs.94).aspx
if (isError(value) && (keys.indexOf('message') >= 0 || keys.indexOf('description') >= 0)) {
return formatError(value);
} // Some type of object without properties can be shortcutted.
if (keys.length === 0) {
if (isFunction(value)) {
var name = value.name ? ': ' + value.name : '';
return ctx.stylize('[Function' + name + ']', 'special');
}
if (isRegExp(value)) {
return ctx.stylize(RegExp.prototype.toString.call(value), 'regexp');
}
if (isDate(value)) {
return ctx.stylize(Date.prototype.toString.call(value), 'date');
}
if (isError(value)) {
return formatError(value);
}
}
var base = '',
array = false,
braces = ['{', '}']; // Make Array say that they are Array
if (isArray(value)) {
array = true;
braces = ['[', ']'];
} // Make functions say that they are functions
if (isFunction(value)) {
var n = value.name ? ': ' + value.name : '';
base = ' [Function' + n + ']';
} // Make RegExps say that they are RegExps
if (isRegExp(value)) {
base = ' ' + RegExp.prototype.toString.call(value);
} // Make dates with properties first say the date
if (isDate(value)) {
base = ' ' + Date.prototype.toUTCString.call(value);
} // Make error with message first say the error
if (isError(value)) {
base = ' ' + formatError(value);
}
if (keys.length === 0 && (!array || value.length == 0)) {
return braces[0] + base + braces[1];
}
if (recurseTimes < 0) {
if (isRegExp(value)) {
return ctx.stylize(RegExp.prototype.toString.call(value), 'regexp');
} else {
return ctx.stylize('[Object]', 'special');
}
}
ctx.seen.push(value);
var output;
if (array) {
output = formatArray(ctx, value, recurseTimes, visibleKeys, keys);
} else {
output = keys.map(function (key) {
return formatProperty(ctx, value, recurseTimes, visibleKeys, key, array);
});
}
ctx.seen.pop();
return reduceToSingleString(output, base, braces);
}
function formatPrimitive(ctx, value) {
if (isUndefined(value)) return ctx.stylize('undefined', 'undefined');
if (isString(value)) {
var simple = '\'' + JSON.stringify(value).replace(/^"|"$/g, '').replace(/'/g, "\\'").replace(/\\"/g, '"') + '\'';
return ctx.stylize(simple, 'string');
}
if (isNumber(value)) return ctx.stylize('' + value, 'number');
if (isBoolean(value)) return ctx.stylize('' + value, 'boolean'); // For some reason typeof null is "object", so special case here.
if (isNull(value)) return ctx.stylize('null', 'null');
}
function formatError(value) {
return '[' + Error.prototype.toString.call(value) + ']';
}
function formatArray(ctx, value, recurseTimes, visibleKeys, keys) {
var output = [];
for (var i = 0, l = value.length; i < l; ++i) {
if (hasOwnProperty(value, String(i))) {
output.push(formatProperty(ctx, value, recurseTimes, visibleKeys, String(i), true));
} else {
output.push('');
}
}
keys.forEach(function (key) {
if (!key.match(/^\d+$/)) {
output.push(formatProperty(ctx, value, recurseTimes, visibleKeys, key, true));
}
});
return output;
}
function formatProperty(ctx, value, recurseTimes, visibleKeys, key, array) {
var name, str, desc;
desc = Object.getOwnPropertyDescriptor(value, key) || {
value: value[key]
};
if (desc.get) {
if (desc.set) {
str = ctx.stylize('[Getter/Setter]', 'special');
} else {
str = ctx.stylize('[Getter]', 'special');
}
} else {
if (desc.set) {
str = ctx.stylize('[Setter]', 'special');
}
}
if (!hasOwnProperty(visibleKeys, key)) {
name = '[' + key + ']';
}
if (!str) {
if (ctx.seen.indexOf(desc.value) < 0) {
if (isNull(recurseTimes)) {
str = formatValue(ctx, desc.value, null);
} else {
str = formatValue(ctx, desc.value, recurseTimes - 1);
}
if (str.indexOf('\n') > -1) {
if (array) {
str = str.split('\n').map(function (line) {
return ' ' + line;
}).join('\n').substr(2);
} else {
str = '\n' + str.split('\n').map(function (line) {
return ' ' + line;
}).join('\n');
}
}
} else {
str = ctx.stylize('[Circular]', 'special');
}
}
if (isUndefined(name)) {
if (array && key.match(/^\d+$/)) {
return str;
}
name = JSON.stringify('' + key);
if (name.match(/^"([a-zA-Z_][a-zA-Z_0-9]*)"$/)) {
name = name.substr(1, name.length - 2);
name = ctx.stylize(name, 'name');
} else {
name = name.replace(/'/g, "\\'").replace(/\\"/g, '"').replace(/(^"|"$)/g, "'");
name = ctx.stylize(name, 'string');
}
}
return name + ': ' + str;
}
function reduceToSingleString(output, base, braces) {
var numLinesEst = 0;
var length = output.reduce(function (prev, cur) {
numLinesEst++;
if (cur.indexOf('\n') >= 0) numLinesEst++;
return prev + cur.replace(/\u001b\[\d\d?m/g, '').length + 1;
}, 0);
if (length > 60) {
return braces[0] + (base === '' ? '' : base + '\n ') + ' ' + output.join(',\n ') + ' ' + braces[1];
}
return braces[0] + base + ' ' + output.join(', ') + ' ' + braces[1];
} // NOTE: These type checking functions intentionally don't use `instanceof`
// because it is fragile and can be easily faked with `Object.create()`.
function isArray(ar) {
return Array.isArray(ar);
}
exports.isArray = isArray;
function isBoolean(arg) {
return typeof arg === 'boolean';
}
exports.isBoolean = isBoolean;
function isNull(arg) {
return arg === null;
}
exports.isNull = isNull;
function isNullOrUndefined(arg) {
return arg == null;
}
exports.isNullOrUndefined = isNullOrUndefined;
function isNumber(arg) {
return typeof arg === 'number';
}
exports.isNumber = isNumber;
function isString(arg) {
return typeof arg === 'string';
}
exports.isString = isString;
function isSymbol(arg) {
return _typeof(arg) === 'symbol';
}
exports.isSymbol = isSymbol;
function isUndefined(arg) {
return arg === void 0;
}
exports.isUndefined = isUndefined;
function isRegExp(re) {
return isObject(re) && objectToString(re) === '[object RegExp]';
}
exports.isRegExp = isRegExp;
function isObject(arg) {
return _typeof(arg) === 'object' && arg !== null;
}
exports.isObject = isObject;
function isDate(d) {
return isObject(d) && objectToString(d) === '[object Date]';
}
exports.isDate = isDate;
function isError(e) {
return isObject(e) && (objectToString(e) === '[object Error]' || e instanceof Error);
}
exports.isError = isError;
function isFunction(arg) {
return typeof arg === 'function';
}
exports.isFunction = isFunction;
function isPrimitive(arg) {
return arg === null || typeof arg === 'boolean' || typeof arg === 'number' || typeof arg === 'string' || _typeof(arg) === 'symbol' || // ES6 symbol
typeof arg === 'undefined';
}
exports.isPrimitive = isPrimitive;
exports.isBuffer = __webpack_require__(/*! ./support/isBuffer */ "../../node_modules/util/support/isBufferBrowser.js");
function objectToString(o) {
return Object.prototype.toString.call(o);
}
function pad(n) {
return n < 10 ? '0' + n.toString(10) : n.toString(10);
}
var months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']; // 26 Feb 16:19:34
function timestamp() {
var d = new Date();
var time = [pad(d.getHours()), pad(d.getMinutes()), pad(d.getSeconds())].join(':');
return [d.getDate(), months[d.getMonth()], time].join(' ');
} // log is just a thin wrapper to console.log that prepends a timestamp
exports.log = function () {
console.log('%s - %s', timestamp(), exports.format.apply(exports, arguments));
};
/**
* Inherit the prototype methods from one constructor into another.
*
* The Function.prototype.inherits from lang.js rewritten as a standalone
* function (not on Function.prototype). NOTE: If this file is to be loaded
* during bootstrapping this function needs to be rewritten using some native
* functions as prototype setup using normal JavaScript does not work as
* expected during bootstrapping (see mirror.js in r114903).
*
* @param {function} ctor Constructor function which needs to inherit the
* prototype.
* @param {function} superCtor Constructor function to inherit prototype from.
*/
exports.inherits = __webpack_require__(/*! inherits */ "../../node_modules/util/node_modules/inherits/inherits_browser.js");
exports._extend = function (origin, add) {
// Don't do anything if add isn't an object
if (!add || !isObject(add)) return origin;
var keys = Object.keys(add);
var i = keys.length;
while (i--) {
origin[keys[i]] = add[keys[i]];
}
return origin;
};
function hasOwnProperty(obj, prop) {
return Object.prototype.hasOwnProperty.call(obj, prop);
}
var kCustomPromisifiedSymbol = typeof Symbol !== 'undefined' ? Symbol('util.promisify.custom') : undefined;
exports.promisify = function promisify(original) {
if (typeof original !== 'function') throw new TypeError('The "original" argument must be of type Function');
if (kCustomPromisifiedSymbol && original[kCustomPromisifiedSymbol]) {
var fn = original[kCustomPromisifiedSymbol];
if (typeof fn !== 'function') {
throw new TypeError('The "util.promisify.custom" argument must be of type Function');
}
Object.defineProperty(fn, kCustomPromisifiedSymbol, {
value: fn,
enumerable: false,
writable: false,
configurable: true
});
return fn;
}
function fn() {
var promiseResolve, promiseReject;
var promise = new Promise(function (resolve, reject) {
promiseResolve = resolve;
promiseReject = reject;
});
var args = [];
for (var i = 0; i < arguments.length; i++) {
args.push(arguments[i]);
}
args.push(function (err, value) {
if (err) {
promiseReject(err);
} else {
promiseResolve(value);
}
});
try {
original.apply(this, args);
} catch (err) {
promiseReject(err);
}
return promise;
}
Object.setPrototypeOf(fn, Object.getPrototypeOf(original));
if (kCustomPromisifiedSymbol) Object.defineProperty(fn, kCustomPromisifiedSymbol, {
value: fn,
enumerable: false,
writable: false,
configurable: true
});
return Object.defineProperties(fn, getOwnPropertyDescriptors(original));
};
exports.promisify.custom = kCustomPromisifiedSymbol;
function callbackifyOnRejected(reason, cb) {
// `!reason` guard inspired by bluebird (Ref: https://goo.gl/t5IS6M).
// Because `null` is a special error value in callbacks which means "no error
// occurred", we error-wrap so the callback consumer can distinguish between
// "the promise rejected with null" or "the promise fulfilled with undefined".
if (!reason) {
var newReason = new Error('Promise was rejected with a falsy value');
newReason.reason = reason;
reason = newReason;
}
return cb(reason);
}
function callbackify(original) {
if (typeof original !== 'function') {
throw new TypeError('The "original" argument must be of type Function');
} // We DO NOT return the promise as it gives the user a false sense that
// the promise is actually somehow related to the callback's execution
// and that the callback throwing will reject the promise.
function callbackified() {
var args = [];
for (var i = 0; i < arguments.length; i++) {
args.push(arguments[i]);
}
var maybeCb = args.pop();
if (typeof maybeCb !== 'function') {
throw new TypeError('The last argument must be of type Function');
}
var self = this;
var cb = function cb() {
return maybeCb.apply(self, arguments);
}; // In true node style we process the callback on `nextTick` with all the
// implications (stack, `uncaughtException`, `async_hooks`)
original.apply(this, args).then(function (ret) {
process.nextTick(cb, null, ret);
}, function (rej) {
process.nextTick(callbackifyOnRejected, rej, cb);
});
}
Object.setPrototypeOf(callbackified, Object.getPrototypeOf(original));
Object.defineProperties(callbackified, getOwnPropertyDescriptors(original));
return callbackified;
}
exports.callbackify = callbackify;
/* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./../process/browser.js */ "../../node_modules/process/browser.js")))
/***/ }),
/***/ "../../node_modules/webpack/buildin/global.js":
/*!***********************************!*\
!*** (webpack)/buildin/global.js ***!
\***********************************/
/*! no static exports found */
/***/ (function(module, exports) {
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
var g; // This works in non-strict mode
g = function () {
return this;
}();
try {
// This works if eval is allowed (see CSP)
g = g || new Function("return this")();
} catch (e) {
// This works if the window reference is available
if ((typeof window === "undefined" ? "undefined" : _typeof(window)) === "object") g = window;
} // g can still be undefined, but nothing to do about it...
// We return undefined, instead of nothing here, so it's
// easier to handle this case. if(!global) { ...}
module.exports = g;
/***/ }),
/***/ "../../node_modules/webpack/node_modules/timers-browserify/main.js":
/*!********************************************************!*\
!*** (webpack)/node_modules/timers-browserify/main.js ***!
\********************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
/* WEBPACK VAR INJECTION */(function(global) {var scope = typeof global !== "undefined" && global || typeof self !== "undefined" && self || window;
var apply = Function.prototype.apply; // DOM APIs, for completeness
exports.setTimeout = function () {
return new Timeout(apply.call(setTimeout, scope, arguments), clearTimeout);
};
exports.setInterval = function () {
return new Timeout(apply.call(setInterval, scope, arguments), clearInterval);
};
exports.clearTimeout = exports.clearInterval = function (timeout) {
if (timeout) {
timeout.close();
}
};
function Timeout(id, clearFn) {
this._id = id;
this._clearFn = clearFn;
}
Timeout.prototype.unref = Timeout.prototype.ref = function () {};
Timeout.prototype.close = function () {
this._clearFn.call(scope, this._id);
}; // Does not start the time, just sets up the members needed.
exports.enroll = function (item, msecs) {
clearTimeout(item._idleTimeoutId);
item._idleTimeout = msecs;
};
exports.unenroll = function (item) {
clearTimeout(item._idleTimeoutId);
item._idleTimeout = -1;
};
exports._unrefActive = exports.active = function (item) {
clearTimeout(item._idleTimeoutId);
var msecs = item._idleTimeout;
if (msecs >= 0) {
item._idleTimeoutId = setTimeout(function onTimeout() {
if (item._onTimeout) item._onTimeout();
}, msecs);
}
}; // setimmediate attaches itself to the global object
__webpack_require__(/*! setimmediate */ "../../node_modules/setimmediate/setImmediate.js"); // On some exotic environments, it's not clear which object `setimmediate` was
// able to install onto. Search each possibility in the same order as the
// `setimmediate` library.
exports.setImmediate = typeof self !== "undefined" && self.setImmediate || typeof global !== "undefined" && global.setImmediate || this && this.setImmediate;
exports.clearImmediate = typeof self !== "undefined" && self.clearImmediate || typeof global !== "undefined" && global.clearImmediate || this && this.clearImmediate;
/* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./../../buildin/global.js */ "../../node_modules/webpack/buildin/global.js")))
/***/ }),
/***/ "../react-devtools-shared/src/bridge.js":
/*!**********************************************!*\
!*** ../react-devtools-shared/src/bridge.js ***!
\**********************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var events__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! events */ "../../node_modules/events/events.js");
/* harmony import */ var events__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(events__WEBPACK_IMPORTED_MODULE_0__);
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }
function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
var BATCH_DURATION = 100;
var Bridge =
/*#__PURE__*/
function (_EventEmitter) {
_inherits(Bridge, _EventEmitter);
function Bridge(wall) {
var _this;
_classCallCheck(this, Bridge);
_this = _possibleConstructorReturn(this, _getPrototypeOf(Bridge).call(this));
_defineProperty(_assertThisInitialized(_this), "_isShutdown", false);
_defineProperty(_assertThisInitialized(_this), "_messageQueue", []);
_defineProperty(_assertThisInitialized(_this), "_timeoutID", null);
_defineProperty(_assertThisInitialized(_this), "_wallUnlisten", null);
_defineProperty(_assertThisInitialized(_this), "_flush", function () {
// This method is used after the bridge is marked as destroyed in shutdown sequence,
// so we do not bail out if the bridge marked as destroyed.
// It is a private method that the bridge ensures is only called at the right times.
if (_this._timeoutID !== null) {
clearTimeout(_this._timeoutID);
_this._timeoutID = null;
}
if (_this._messageQueue.length) {
for (var i = 0; i < _this._messageQueue.length; i += 2) {
var _this$_wall;
(_this$_wall = _this._wall).send.apply(_this$_wall, [_this._messageQueue[i]].concat(_toConsumableArray(_this._messageQueue[i + 1])));
}
_this._messageQueue.length = 0; // Check again for queued messages in BATCH_DURATION ms. This will keep
// flushing in a loop as long as messages continue to be added. Once no
// more are, the timer expires.
_this._timeoutID = setTimeout(_this._flush, BATCH_DURATION);
}
});
_this._wall = wall;
_this._wallUnlisten = wall.listen(function (message) {
_assertThisInitialized(_this).emit(message.event, message.payload);
}) || null;
return _this;
} // Listening directly to the wall isn't advised.
// It can be used to listen for legacy (v3) messages (since they use a different format).
_createClass(Bridge, [{
key: "send",
value: function send(event) {
if (this._isShutdown) {
console.warn("Cannot send message \"".concat(event, "\" through a Bridge that has been shutdown."));
return;
} // When we receive a message:
// - we add it to our queue of messages to be sent
// - if there hasn't been a message recently, we set a timer for 0 ms in
// the future, allowing all messages created in the same tick to be sent
// together
// - if there *has* been a message flushed in the last BATCH_DURATION ms
// (or we're waiting for our setTimeout-0 to fire), then _timeoutID will
// be set, and we'll simply add to the queue and wait for that
for (var _len = arguments.length, payload = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
payload[_key - 1] = arguments[_key];
}
this._messageQueue.push(event, payload);
if (!this._timeoutID) {
this._timeoutID = setTimeout(this._flush, 0);
}
}
}, {
key: "shutdown",
value: function shutdown() {
if (this._isShutdown) {
console.warn('Bridge was already shutdown.');
return;
} // Queue the shutdown outgoing message for subscribers.
this.send('shutdown'); // Mark this bridge as destroyed, i.e. disable its public API.
this._isShutdown = true; // Disable the API inherited from EventEmitter that can add more listeners and send more messages.
// $FlowFixMe This property is not writable.
this.addListener = function () {}; // $FlowFixMe This property is not writable.
this.emit = function () {}; // NOTE: There's also EventEmitter API like `on` and `prependListener` that we didn't add to our Flow type of EventEmitter.
// Unsubscribe this bridge incoming message listeners to be sure, and so they don't have to do that.
this.removeAllListeners(); // Stop accepting and emitting incoming messages from the wall.
var wallUnlisten = this._wallUnlisten;
if (wallUnlisten) {
wallUnlisten();
} // Synchronously flush all queued outgoing messages.
// At this step the subscribers' code may run in this call stack.
do {
this._flush();
} while (this._messageQueue.length); // Make sure once again that there is no dangling timer.
if (this._timeoutID !== null) {
clearTimeout(this._timeoutID);
this._timeoutID = null;
}
}
}, {
key: "wall",
get: function get() {
return this._wall;
}
}]);
return Bridge;
}(events__WEBPACK_IMPORTED_MODULE_0___default.a);
/* harmony default export */ __webpack_exports__["default"] = (Bridge);
/***/ }),
/***/ "../react-devtools-shared/src/constants.js":
/*!*************************************************!*\
!*** ../react-devtools-shared/src/constants.js ***!
\*************************************************/
/*! exports provided: __DEBUG__, TREE_OPERATION_ADD, TREE_OPERATION_REMOVE, TREE_OPERATION_REORDER_CHILDREN, TREE_OPERATION_UPDATE_TREE_BASE_DURATION, LOCAL_STORAGE_FILTER_PREFERENCES_KEY, SESSION_STORAGE_LAST_SELECTION_KEY, SESSION_STORAGE_RECORD_CHANGE_DESCRIPTIONS_KEY, SESSION_STORAGE_RELOAD_AND_PROFILE_KEY, LOCAL_STORAGE_SHOULD_PATCH_CONSOLE_KEY, LOCAL_STORAGE_TRACE_UPDATES_ENABLED_KEY, PROFILER_EXPORT_VERSION, CHANGE_LOG_URL, UNSUPPORTED_VERSION_URL, COMFORTABLE_LINE_HEIGHT, COMPACT_LINE_HEIGHT */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "__DEBUG__", function() { return __DEBUG__; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "TREE_OPERATION_ADD", function() { return TREE_OPERATION_ADD; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "TREE_OPERATION_REMOVE", function() { return TREE_OPERATION_REMOVE; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "TREE_OPERATION_REORDER_CHILDREN", function() { return TREE_OPERATION_REORDER_CHILDREN; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "TREE_OPERATION_UPDATE_TREE_BASE_DURATION", function() { return TREE_OPERATION_UPDATE_TREE_BASE_DURATION; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "LOCAL_STORAGE_FILTER_PREFERENCES_KEY", function() { return LOCAL_STORAGE_FILTER_PREFERENCES_KEY; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "SESSION_STORAGE_LAST_SELECTION_KEY", function() { return SESSION_STORAGE_LAST_SELECTION_KEY; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "SESSION_STORAGE_RECORD_CHANGE_DESCRIPTIONS_KEY", function() { return SESSION_STORAGE_RECORD_CHANGE_DESCRIPTIONS_KEY; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "SESSION_STORAGE_RELOAD_AND_PROFILE_KEY", function() { return SESSION_STORAGE_RELOAD_AND_PROFILE_KEY; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "LOCAL_STORAGE_SHOULD_PATCH_CONSOLE_KEY", function() { return LOCAL_STORAGE_SHOULD_PATCH_CONSOLE_KEY; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "LOCAL_STORAGE_TRACE_UPDATES_ENABLED_KEY", function() { return LOCAL_STORAGE_TRACE_UPDATES_ENABLED_KEY; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "PROFILER_EXPORT_VERSION", function() { return PROFILER_EXPORT_VERSION; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "CHANGE_LOG_URL", function() { return CHANGE_LOG_URL; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "UNSUPPORTED_VERSION_URL", function() { return UNSUPPORTED_VERSION_URL; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "COMFORTABLE_LINE_HEIGHT", function() { return COMFORTABLE_LINE_HEIGHT; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "COMPACT_LINE_HEIGHT", function() { return COMPACT_LINE_HEIGHT; });
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
// Flip this flag to true to enable verbose console debug logging.
var __DEBUG__ = false;
var TREE_OPERATION_ADD = 1;
var TREE_OPERATION_REMOVE = 2;
var TREE_OPERATION_REORDER_CHILDREN = 3;
var TREE_OPERATION_UPDATE_TREE_BASE_DURATION = 4;
var LOCAL_STORAGE_FILTER_PREFERENCES_KEY = 'React::DevTools::componentFilters';
var SESSION_STORAGE_LAST_SELECTION_KEY = 'React::DevTools::lastSelection';
var SESSION_STORAGE_RECORD_CHANGE_DESCRIPTIONS_KEY = 'React::DevTools::recordChangeDescriptions';
var SESSION_STORAGE_RELOAD_AND_PROFILE_KEY = 'React::DevTools::reloadAndProfile';
var LOCAL_STORAGE_SHOULD_PATCH_CONSOLE_KEY = 'React::DevTools::appendComponentStack';
var LOCAL_STORAGE_TRACE_UPDATES_ENABLED_KEY = 'React::DevTools::traceUpdatesEnabled';
var PROFILER_EXPORT_VERSION = 4;
var CHANGE_LOG_URL = 'https://github.com/facebook/react/blob/master/packages/react-devtools/CHANGELOG.md';
var UNSUPPORTED_VERSION_URL = 'https://reactjs.org/blog/2019/08/15/new-react-devtools.html#how-do-i-get-the-old-version-back'; // HACK
//
// Extracting during build time avoids a temporarily invalid state for the inline target.
// Sometimes the inline target is rendered before root styles are applied,
// which would result in e.g. NaN itemSize being passed to react-window list.
//
var COMFORTABLE_LINE_HEIGHT;
var COMPACT_LINE_HEIGHT;
try {
// $FlowFixMe
var rawStyleString = __webpack_require__(/*! !raw-loader!react-devtools-shared/src/devtools/views/root.css */ "../../node_modules/raw-loader/dist/cjs.js!../react-devtools-shared/src/devtools/views/root.css").default;
var extractVar = function extractVar(varName) {
var regExp = new RegExp("".concat(varName, ": ([0-9]+)"));
var match = rawStyleString.match(regExp);
return parseInt(match[1], 10);
};
COMFORTABLE_LINE_HEIGHT = extractVar('comfortable-line-height-data');
COMPACT_LINE_HEIGHT = extractVar('compact-line-height-data');
} catch (error) {
// We can't use the Webpack loader syntax in the context of Jest,
// so tests need some reasonably meaningful fallback value.
COMFORTABLE_LINE_HEIGHT = 15;
COMPACT_LINE_HEIGHT = 10;
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/ContextMenu/ContextMenu.css":
/*!*************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/ContextMenu/ContextMenu.css ***!
\*************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../node_modules/css-loader??ref--5-1!./ContextMenu.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/ContextMenu/ContextMenu.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/ContextMenu/ContextMenu.js":
/*!************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/ContextMenu/ContextMenu.js ***!
\************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return ContextMenu; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ "react-dom");
/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _Contexts__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Contexts */ "../react-devtools-shared/src/devtools/ContextMenu/Contexts.js");
/* harmony import */ var _ContextMenu_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./ContextMenu.css */ "../react-devtools-shared/src/devtools/ContextMenu/ContextMenu.css");
/* harmony import */ var _ContextMenu_css__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_ContextMenu_css__WEBPACK_IMPORTED_MODULE_3__);
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function respositionToFit(element, pageX, pageY) {
var ownerWindow = element.ownerDocument.defaultView;
if (element !== null) {
if (pageY + element.offsetHeight >= ownerWindow.innerHeight) {
if (pageY - element.offsetHeight > 0) {
element.style.top = "".concat(pageY - element.offsetHeight, "px");
} else {
element.style.top = '0px';
}
} else {
element.style.top = "".concat(pageY, "px");
}
if (pageX + element.offsetWidth >= ownerWindow.innerWidth) {
if (pageX - element.offsetWidth > 0) {
element.style.left = "".concat(pageX - element.offsetWidth, "px");
} else {
element.style.left = '0px';
}
} else {
element.style.left = "".concat(pageX, "px");
}
}
}
var HIDDEN_STATE = {
data: null,
isVisible: false,
pageX: 0,
pageY: 0
};
function ContextMenu(_ref) {
var children = _ref.children,
id = _ref.id;
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_Contexts__WEBPACK_IMPORTED_MODULE_2__["RegistryContext"]),
registerMenu = _useContext.registerMenu;
var _useState = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(HIDDEN_STATE),
_useState2 = _slicedToArray(_useState, 2),
state = _useState2[0],
setState = _useState2[1];
var bodyAccessorRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(null);
var containerRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(null);
var menuRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(null);
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
var ownerDocument = bodyAccessorRef.current.ownerDocument;
containerRef.current = ownerDocument.createElement('div');
ownerDocument.body.appendChild(containerRef.current);
return function () {
ownerDocument.body.removeChild(containerRef.current);
};
}, []);
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
var showMenu = function showMenu(_ref2) {
var data = _ref2.data,
pageX = _ref2.pageX,
pageY = _ref2.pageY;
setState({
data: data,
isVisible: true,
pageX: pageX,
pageY: pageY
});
};
var hideMenu = function hideMenu() {
return setState(HIDDEN_STATE);
};
return registerMenu(id, showMenu, hideMenu);
}, [id]);
Object(react__WEBPACK_IMPORTED_MODULE_0__["useLayoutEffect"])(function () {
if (!state.isVisible) {
return;
}
var menu = menuRef.current;
var hideUnlessContains = function hideUnlessContains(event) {
if (!menu.contains(event.target)) {
setState(HIDDEN_STATE);
}
};
var hide = function hide(event) {
setState(HIDDEN_STATE);
};
var ownerDocument = containerRef.current.ownerDocument;
ownerDocument.addEventListener('mousedown', hideUnlessContains);
ownerDocument.addEventListener('touchstart', hideUnlessContains);
ownerDocument.addEventListener('keydown', hideUnlessContains);
var ownerWindow = ownerDocument.defaultView;
ownerWindow.addEventListener('resize', hide);
respositionToFit(menu, state.pageX, state.pageY);
return function () {
ownerDocument.removeEventListener('mousedown', hideUnlessContains);
ownerDocument.removeEventListener('touchstart', hideUnlessContains);
ownerDocument.removeEventListener('keydown', hideUnlessContains);
ownerWindow.removeEventListener('resize', hide);
};
}, [state]);
if (!state.isVisible) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
ref: bodyAccessorRef
});
} else {
return Object(react_dom__WEBPACK_IMPORTED_MODULE_1__["createPortal"])(react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
ref: menuRef,
className: _ContextMenu_css__WEBPACK_IMPORTED_MODULE_3___default.a.ContextMenu
}, children(state.data)), containerRef.current);
}
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/ContextMenu/ContextMenuItem.css":
/*!*****************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/ContextMenu/ContextMenuItem.css ***!
\*****************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../node_modules/css-loader??ref--5-1!./ContextMenuItem.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/ContextMenu/ContextMenuItem.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/ContextMenu/ContextMenuItem.js":
/*!****************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/ContextMenu/ContextMenuItem.js ***!
\****************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return ContextMenuItem; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _Contexts__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Contexts */ "../react-devtools-shared/src/devtools/ContextMenu/Contexts.js");
/* harmony import */ var _ContextMenuItem_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./ContextMenuItem.css */ "../react-devtools-shared/src/devtools/ContextMenu/ContextMenuItem.css");
/* harmony import */ var _ContextMenuItem_css__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_ContextMenuItem_css__WEBPACK_IMPORTED_MODULE_2__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function ContextMenuItem(_ref) {
var children = _ref.children,
onClick = _ref.onClick,
title = _ref.title;
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_Contexts__WEBPACK_IMPORTED_MODULE_1__["RegistryContext"]),
hideMenu = _useContext.hideMenu;
var handleClick = function handleClick(event) {
onClick();
hideMenu();
};
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _ContextMenuItem_css__WEBPACK_IMPORTED_MODULE_2___default.a.ContextMenuItem,
onClick: handleClick,
onTouchEnd: handleClick
}, children);
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/ContextMenu/Contexts.js":
/*!*********************************************************************!*\
!*** ../react-devtools-shared/src/devtools/ContextMenu/Contexts.js ***!
\*********************************************************************/
/*! exports provided: RegistryContext */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "RegistryContext", function() { return RegistryContext; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
var idToShowFnMap = new Map();
var idToHideFnMap = new Map();
var currentHideFn = null;
function hideMenu() {
if (typeof currentHideFn === 'function') {
currentHideFn();
}
}
function showMenu(_ref) {
var data = _ref.data,
id = _ref.id,
pageX = _ref.pageX,
pageY = _ref.pageY;
var showFn = idToShowFnMap.get(id);
if (typeof showFn === 'function') {
currentHideFn = idToHideFnMap.get(id);
showFn({
data: data,
pageX: pageX,
pageY: pageY
});
}
}
function registerMenu(id, showFn, hideFn) {
if (idToShowFnMap.has(id)) {
throw Error("Context menu with id \"".concat(id, "\" already registered."));
}
idToShowFnMap.set(id, showFn);
idToHideFnMap.set(id, hideFn);
return function unregisterMenu() {
idToShowFnMap.delete(id);
idToHideFnMap.delete(id);
};
}
var RegistryContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["createContext"])({
hideMenu: hideMenu,
showMenu: showMenu,
registerMenu: registerMenu
});
/***/ }),
/***/ "../react-devtools-shared/src/devtools/ContextMenu/useContextMenu.js":
/*!***************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/ContextMenu/useContextMenu.js ***!
\***************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return useContextMenu; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _Contexts__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Contexts */ "../react-devtools-shared/src/devtools/ContextMenu/Contexts.js");
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function useContextMenu(_ref) {
var data = _ref.data,
id = _ref.id,
ref = _ref.ref;
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_Contexts__WEBPACK_IMPORTED_MODULE_1__["RegistryContext"]),
showMenu = _useContext.showMenu;
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
if (ref.current !== null) {
var handleContextMenu = function handleContextMenu(event) {
event.preventDefault();
event.stopPropagation();
var pageX = event.pageX || event.touches && event.touches[0].pageX;
var pageY = event.pageY || event.touches && event.touches[0].pageY;
showMenu({
data: data,
id: id,
pageX: pageX,
pageY: pageY
});
};
var trigger = ref.current;
trigger.addEventListener('contextmenu', handleContextMenu);
return function () {
trigger.removeEventListener('contextmenu', handleContextMenu);
};
}
}, [data, id, showMenu]);
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/ProfilerStore.js":
/*!**************************************************************!*\
!*** ../react-devtools-shared/src/devtools/ProfilerStore.js ***!
\**************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return ProfilerStore; });
/* harmony import */ var events__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! events */ "../../node_modules/events/events.js");
/* harmony import */ var events__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(events__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _views_Profiler_utils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./views/Profiler/utils */ "../react-devtools-shared/src/devtools/views/Profiler/utils.js");
/* harmony import */ var _ProfilingCache__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./ProfilingCache */ "../react-devtools-shared/src/devtools/ProfilingCache.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./store */ "../react-devtools-shared/src/devtools/store.js");
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
var ProfilerStore =
/*#__PURE__*/
function (_EventEmitter) {
_inherits(ProfilerStore, _EventEmitter);
// Suspense cache for lazily calculating derived profiling data.
// Temporary store of profiling data from the backend renderer(s).
// This data will be converted to the ProfilingDataFrontend format after being collected from all renderers.
// Data from the most recently completed profiling session,
// or data that has been imported from a previously exported session.
// This object contains all necessary data to drive the Profiler UI interface,
// even though some of it is lazily parsed/derived via the ProfilingCache.
// Snapshot of all attached renderer IDs.
// Once profiling is finished, this snapshot will be used to query renderers for profiling data.
//
// This map is initialized when profiling starts and updated when a new root is added while profiling;
// Upon completion, it is converted into the exportable ProfilingDataFrontend format.
// Snapshot of the state of the main Store (including all roots) when profiling started.
// Once profiling is finished, this snapshot can be used along with "operations" messages emitted during profiling,
// to reconstruct the state of each root for each commit.
// It's okay to use a single root to store this information because node IDs are unique across all roots.
//
// This map is initialized when profiling starts and updated when a new root is added while profiling;
// Upon completion, it is converted into the exportable ProfilingDataFrontend format.
// Map of root (id) to a list of tree mutation that occur during profiling.
// Once profiling is finished, these mutations can be used, along with the initial tree snapshots,
// to reconstruct the state of each root for each commit.
//
// This map is only updated while profiling is in progress;
// Upon completion, it is converted into the exportable ProfilingDataFrontend format.
// The backend is currently profiling.
// When profiling is in progress, operations are stored so that we can later reconstruct past commit trees.
// Tracks whether a specific renderer logged any profiling data during the most recent session.
// After profiling, data is requested from each attached renderer using this queue.
// So long as this queue is not empty, the store is retrieving and processing profiling data from the backend.
function ProfilerStore(bridge, store, defaultIsProfiling) {
var _this;
_classCallCheck(this, ProfilerStore);
_this = _possibleConstructorReturn(this, _getPrototypeOf(ProfilerStore).call(this));
_defineProperty(_assertThisInitialized(_this), "_dataBackends", []);
_defineProperty(_assertThisInitialized(_this), "_dataFrontend", null);
_defineProperty(_assertThisInitialized(_this), "_initialRendererIDs", new Set());
_defineProperty(_assertThisInitialized(_this), "_initialSnapshotsByRootID", new Map());
_defineProperty(_assertThisInitialized(_this), "_inProgressOperationsByRootID", new Map());
_defineProperty(_assertThisInitialized(_this), "_isProfiling", false);
_defineProperty(_assertThisInitialized(_this), "_rendererIDsThatReportedProfilingData", new Set());
_defineProperty(_assertThisInitialized(_this), "_rendererQueue", new Set());
_defineProperty(_assertThisInitialized(_this), "_takeProfilingSnapshotRecursive", function (elementID, profilingSnapshots) {
var element = _this._store.getElementByID(elementID);
if (element !== null) {
var snapshotNode = {
id: elementID,
children: element.children.slice(0),
displayName: element.displayName,
key: element.key,
type: element.type
};
profilingSnapshots.set(elementID, snapshotNode);
element.children.forEach(function (childID) {
return _this._takeProfilingSnapshotRecursive(childID, profilingSnapshots);
});
}
});
_defineProperty(_assertThisInitialized(_this), "onBridgeOperations", function (operations) {
// The first two values are always rendererID and rootID
var rendererID = operations[0];
var rootID = operations[1];
if (_this._isProfiling) {
var profilingOperations = _this._inProgressOperationsByRootID.get(rootID);
if (profilingOperations == null) {
profilingOperations = [operations];
_this._inProgressOperationsByRootID.set(rootID, profilingOperations);
} else {
profilingOperations.push(operations);
}
if (!_this._initialRendererIDs.has(rendererID)) {
_this._initialRendererIDs.add(rendererID);
}
if (!_this._initialSnapshotsByRootID.has(rootID)) {
_this._initialSnapshotsByRootID.set(rootID, new Map());
}
_this._rendererIDsThatReportedProfilingData.add(rendererID);
}
});
_defineProperty(_assertThisInitialized(_this), "onBridgeProfilingData", function (dataBackend) {
if (_this._isProfiling) {
// This should never happen, but if it does- ignore previous profiling data.
return;
}
var rendererID = dataBackend.rendererID;
if (!_this._rendererQueue.has(rendererID)) {
throw Error("Unexpected profiling data update from renderer \"".concat(rendererID, "\""));
}
_this._dataBackends.push(dataBackend);
_this._rendererQueue.delete(rendererID);
if (_this._rendererQueue.size === 0) {
_this._dataFrontend = Object(_views_Profiler_utils__WEBPACK_IMPORTED_MODULE_1__["prepareProfilingDataFrontendFromBackendAndStore"])(_this._dataBackends, _this._inProgressOperationsByRootID, _this._initialSnapshotsByRootID);
_this._dataBackends.splice(0);
_this.emit('isProcessingData');
}
});
_defineProperty(_assertThisInitialized(_this), "onBridgeShutdown", function () {
_this._bridge.removeListener('operations', _this.onBridgeOperations);
_this._bridge.removeListener('profilingData', _this.onBridgeProfilingData);
_this._bridge.removeListener('profilingStatus', _this.onProfilingStatus);
_this._bridge.removeListener('shutdown', _this.onBridgeShutdown);
});
_defineProperty(_assertThisInitialized(_this), "onProfilingStatus", function (isProfiling) {
if (isProfiling) {
_this._dataBackends.splice(0);
_this._dataFrontend = null;
_this._initialRendererIDs.clear();
_this._initialSnapshotsByRootID.clear();
_this._inProgressOperationsByRootID.clear();
_this._rendererIDsThatReportedProfilingData.clear();
_this._rendererQueue.clear(); // Record all renderer IDs initially too (in case of unmount)
// eslint-disable-next-line no-for-of-loops/no-for-of-loops
var _iteratorNormalCompletion = true;
var _didIteratorError = false;
var _iteratorError = undefined;
try {
for (var _iterator = _this._store.rootIDToRendererID.values()[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
var rendererID = _step.value;
if (!_this._initialRendererIDs.has(rendererID)) {
_this._initialRendererIDs.add(rendererID);
}
} // Record snapshot of tree at the time profiling is started.
// This info is required to handle cases of e.g. nodes being removed during profiling.
} catch (err) {
_didIteratorError = true;
_iteratorError = err;
} finally {
try {
if (!_iteratorNormalCompletion && _iterator.return != null) {
_iterator.return();
}
} finally {
if (_didIteratorError) {
throw _iteratorError;
}
}
}
_this._store.roots.forEach(function (rootID) {
var profilingSnapshots = new Map();
_this._initialSnapshotsByRootID.set(rootID, profilingSnapshots);
_this._takeProfilingSnapshotRecursive(rootID, profilingSnapshots);
});
}
if (_this._isProfiling !== isProfiling) {
_this._isProfiling = isProfiling; // Invalidate suspense cache if profiling data is being (re-)recorded.
// Note that we clear again, in case any views read from the cache while profiling.
// (That would have resolved a now-stale value without any profiling data.)
_this._cache.invalidate();
_this.emit('isProfiling'); // If we've just finished a profiling session, we need to fetch data stored in each renderer interface
// and re-assemble it on the front-end into a format (ProfilingDataFrontend) that can power the Profiler UI.
// During this time, DevTools UI should probably not be interactive.
if (!isProfiling) {
_this._dataBackends.splice(0);
_this._rendererQueue.clear(); // Only request data from renderers that actually logged it.
// This avoids unnecessary bridge requests and also avoids edge case mixed renderer bugs.
// (e.g. when v15 and v16 are both present)
_this._rendererIDsThatReportedProfilingData.forEach(function (rendererID) {
if (!_this._rendererQueue.has(rendererID)) {
_this._rendererQueue.add(rendererID);
_this._bridge.send('getProfilingData', {
rendererID: rendererID
});
}
});
_this.emit('isProcessingData');
}
}
});
_this._bridge = bridge;
_this._isProfiling = defaultIsProfiling;
_this._store = store;
bridge.addListener('operations', _this.onBridgeOperations);
bridge.addListener('profilingData', _this.onBridgeProfilingData);
bridge.addListener('profilingStatus', _this.onProfilingStatus);
bridge.addListener('shutdown', _this.onBridgeShutdown); // It's possible that profiling has already started (e.g. "reload and start profiling")
// so the frontend needs to ask the backend for its status after mounting.
bridge.send('getProfilingStatus');
_this._cache = new _ProfilingCache__WEBPACK_IMPORTED_MODULE_2__["default"](_assertThisInitialized(_this));
return _this;
}
_createClass(ProfilerStore, [{
key: "getCommitData",
value: function getCommitData(rootID, commitIndex) {
if (this._dataFrontend !== null) {
var dataForRoot = this._dataFrontend.dataForRoots.get(rootID);
if (dataForRoot != null) {
var commitDatum = dataForRoot.commitData[commitIndex];
if (commitDatum != null) {
return commitDatum;
}
}
}
throw Error("Could not find commit data for root \"".concat(rootID, "\" and commit ").concat(commitIndex));
}
}, {
key: "getDataForRoot",
value: function getDataForRoot(rootID) {
if (this._dataFrontend !== null) {
var dataForRoot = this._dataFrontend.dataForRoots.get(rootID);
if (dataForRoot != null) {
return dataForRoot;
}
}
throw Error("Could not find commit data for root \"".concat(rootID, "\""));
} // Profiling data has been recorded for at least one root.
}, {
key: "clear",
value: function clear() {
this._dataBackends.splice(0);
this._dataFrontend = null;
this._initialRendererIDs.clear();
this._initialSnapshotsByRootID.clear();
this._inProgressOperationsByRootID.clear();
this._rendererQueue.clear(); // Invalidate suspense cache if profiling data is being (re-)recorded.
// Note that we clear now because any existing data is "stale".
this._cache.invalidate();
this.emit('profilingData');
}
}, {
key: "startProfiling",
value: function startProfiling() {
this._bridge.send('startProfiling', this._store.recordChangeDescriptions); // Don't actually update the local profiling boolean yet!
// Wait for onProfilingStatus() to confirm the status has changed.
// This ensures the frontend and backend are in sync wrt which commits were profiled.
// We do this to avoid mismatches on e.g. CommitTreeBuilder that would cause errors.
}
}, {
key: "stopProfiling",
value: function stopProfiling() {
this._bridge.send('stopProfiling'); // Don't actually update the local profiling boolean yet!
// Wait for onProfilingStatus() to confirm the status has changed.
// This ensures the frontend and backend are in sync wrt which commits were profiled.
// We do this to avoid mismatches on e.g. CommitTreeBuilder that would cause errors.
}
}, {
key: "didRecordCommits",
get: function get() {
return this._dataFrontend !== null && this._dataFrontend.dataForRoots.size > 0;
}
}, {
key: "isProcessingData",
get: function get() {
return this._rendererQueue.size > 0 || this._dataBackends.length > 0;
}
}, {
key: "isProfiling",
get: function get() {
return this._isProfiling;
}
}, {
key: "profilingCache",
get: function get() {
return this._cache;
}
}, {
key: "profilingData",
get: function get() {
return this._dataFrontend;
},
set: function set(value) {
if (this._isProfiling) {
console.warn('Profiling data cannot be updated while profiling is in progress.');
return;
}
this._dataBackends.splice(0);
this._dataFrontend = value;
this._initialRendererIDs.clear();
this._initialSnapshotsByRootID.clear();
this._inProgressOperationsByRootID.clear();
this._cache.invalidate();
this.emit('profilingData');
}
}]);
return ProfilerStore;
}(events__WEBPACK_IMPORTED_MODULE_0___default.a);
/***/ }),
/***/ "../react-devtools-shared/src/devtools/ProfilingCache.js":
/*!***************************************************************!*\
!*** ../react-devtools-shared/src/devtools/ProfilingCache.js ***!
\***************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return ProfilingCache; });
/* harmony import */ var _ProfilerStore__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./ProfilerStore */ "../react-devtools-shared/src/devtools/ProfilerStore.js");
/* harmony import */ var react_devtools_shared_src_devtools_views_Profiler_CommitTreeBuilder__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-devtools-shared/src/devtools/views/Profiler/CommitTreeBuilder */ "../react-devtools-shared/src/devtools/views/Profiler/CommitTreeBuilder.js");
/* harmony import */ var react_devtools_shared_src_devtools_views_Profiler_FlamegraphChartBuilder__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-devtools-shared/src/devtools/views/Profiler/FlamegraphChartBuilder */ "../react-devtools-shared/src/devtools/views/Profiler/FlamegraphChartBuilder.js");
/* harmony import */ var react_devtools_shared_src_devtools_views_Profiler_InteractionsChartBuilder__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react-devtools-shared/src/devtools/views/Profiler/InteractionsChartBuilder */ "../react-devtools-shared/src/devtools/views/Profiler/InteractionsChartBuilder.js");
/* harmony import */ var react_devtools_shared_src_devtools_views_Profiler_RankedChartBuilder__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react-devtools-shared/src/devtools/views/Profiler/RankedChartBuilder */ "../react-devtools-shared/src/devtools/views/Profiler/RankedChartBuilder.js");
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
var ProfilingCache =
/*#__PURE__*/
function () {
function ProfilingCache(profilerStore) {
var _this = this;
_classCallCheck(this, ProfilingCache);
_defineProperty(this, "_fiberCommits", new Map());
_defineProperty(this, "getCommitTree", function (_ref) {
var commitIndex = _ref.commitIndex,
rootID = _ref.rootID;
return Object(react_devtools_shared_src_devtools_views_Profiler_CommitTreeBuilder__WEBPACK_IMPORTED_MODULE_1__["getCommitTree"])({
commitIndex: commitIndex,
profilerStore: _this._profilerStore,
rootID: rootID
});
});
_defineProperty(this, "getFiberCommits", function (_ref2) {
var fiberID = _ref2.fiberID,
rootID = _ref2.rootID;
var cachedFiberCommits = _this._fiberCommits.get(fiberID);
if (cachedFiberCommits != null) {
return cachedFiberCommits;
}
var fiberCommits = [];
var dataForRoot = _this._profilerStore.getDataForRoot(rootID);
dataForRoot.commitData.forEach(function (commitDatum, commitIndex) {
if (commitDatum.fiberActualDurations.has(fiberID)) {
fiberCommits.push(commitIndex);
}
});
_this._fiberCommits.set(fiberID, fiberCommits);
return fiberCommits;
});
_defineProperty(this, "getFlamegraphChartData", function (_ref3) {
var commitIndex = _ref3.commitIndex,
commitTree = _ref3.commitTree,
rootID = _ref3.rootID;
return Object(react_devtools_shared_src_devtools_views_Profiler_FlamegraphChartBuilder__WEBPACK_IMPORTED_MODULE_2__["getChartData"])({
commitIndex: commitIndex,
commitTree: commitTree,
profilerStore: _this._profilerStore,
rootID: rootID
});
});
_defineProperty(this, "getInteractionsChartData", function (_ref4) {
var rootID = _ref4.rootID;
return Object(react_devtools_shared_src_devtools_views_Profiler_InteractionsChartBuilder__WEBPACK_IMPORTED_MODULE_3__["getChartData"])({
profilerStore: _this._profilerStore,
rootID: rootID
});
});
_defineProperty(this, "getRankedChartData", function (_ref5) {
var commitIndex = _ref5.commitIndex,
commitTree = _ref5.commitTree,
rootID = _ref5.rootID;
return Object(react_devtools_shared_src_devtools_views_Profiler_RankedChartBuilder__WEBPACK_IMPORTED_MODULE_4__["getChartData"])({
commitIndex: commitIndex,
commitTree: commitTree,
profilerStore: _this._profilerStore,
rootID: rootID
});
});
this._profilerStore = profilerStore;
}
_createClass(ProfilingCache, [{
key: "invalidate",
value: function invalidate() {
this._fiberCommits.clear();
Object(react_devtools_shared_src_devtools_views_Profiler_CommitTreeBuilder__WEBPACK_IMPORTED_MODULE_1__["invalidateCommitTrees"])();
Object(react_devtools_shared_src_devtools_views_Profiler_FlamegraphChartBuilder__WEBPACK_IMPORTED_MODULE_2__["invalidateChartData"])();
Object(react_devtools_shared_src_devtools_views_Profiler_InteractionsChartBuilder__WEBPACK_IMPORTED_MODULE_3__["invalidateChartData"])();
Object(react_devtools_shared_src_devtools_views_Profiler_RankedChartBuilder__WEBPACK_IMPORTED_MODULE_4__["invalidateChartData"])();
}
}]);
return ProfilingCache;
}();
/***/ }),
/***/ "../react-devtools-shared/src/devtools/cache.js":
/*!******************************************************!*\
!*** ../react-devtools-shared/src/devtools/cache.js ***!
\******************************************************/
/*! exports provided: createResource, invalidateResources */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "createResource", function() { return createResource; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "invalidateResources", function() { return invalidateResources; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
// Cache implementation was forked from the React repo:
// https://github.com/facebook/react/blob/master/packages/react-cache/src/ReactCache.js
//
// This cache is simpler than react-cache in that:
// 1. Individual items don't need to be invalidated.
// Profiling data is invalidated as a whole.
// 2. We didn't need the added overhead of an LRU cache.
// The size of this cache is bounded by how many renders were profiled,
// and it will be fully reset between profiling sessions.
var Pending = 0;
var Resolved = 1;
var Rejected = 2;
var ReactCurrentDispatcher = react__WEBPACK_IMPORTED_MODULE_0___default.a.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentDispatcher;
function readContext(Context, observedBits) {
var dispatcher = ReactCurrentDispatcher.current;
if (dispatcher === null) {
throw new Error('react-cache: read and preload may only be called from within a ' + "component's render. They are not supported in event handlers or " + 'lifecycle methods.');
}
return dispatcher.readContext(Context, observedBits);
}
var CacheContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["createContext"])(null);
var entries = new Map();
var resourceConfigs = new Map();
function getEntriesForResource(resource) {
var entriesForResource = entries.get(resource);
if (entriesForResource === undefined) {
var config = resourceConfigs.get(resource);
entriesForResource = config !== undefined && config.useWeakMap ? new WeakMap() : new Map();
entries.set(resource, entriesForResource);
}
return entriesForResource;
}
function accessResult(resource, fetch, input, key) {
var entriesForResource = getEntriesForResource(resource);
var entry = entriesForResource.get(key);
if (entry === undefined) {
var thenable = fetch(input);
thenable.then(function (value) {
if (newResult.status === Pending) {
var resolvedResult = newResult;
resolvedResult.status = Resolved;
resolvedResult.value = value;
}
}, function (error) {
if (newResult.status === Pending) {
var rejectedResult = newResult;
rejectedResult.status = Rejected;
rejectedResult.value = error;
}
});
var newResult = {
status: Pending,
value: thenable
};
entriesForResource.set(key, newResult);
return newResult;
} else {
return entry;
}
}
function createResource(fetch, hashInput) {
var config = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
var resource = {
clear: function clear() {
entries.delete(resource);
},
invalidate: function invalidate(key) {
var entriesForResource = getEntriesForResource(resource);
entriesForResource.delete(key);
},
read: function read(input) {
// Prevent access outside of render.
readContext(CacheContext);
var key = hashInput(input);
var result = accessResult(resource, fetch, input, key);
switch (result.status) {
case Pending:
{
var suspender = result.value;
throw suspender;
}
case Resolved:
{
var value = result.value;
return value;
}
case Rejected:
{
var error = result.value;
throw error;
}
default:
// Should be unreachable
return undefined;
}
},
preload: function preload(input) {
// Prevent access outside of render.
readContext(CacheContext);
var key = hashInput(input);
accessResult(resource, fetch, input, key);
},
write: function write(key, value) {
var entriesForResource = getEntriesForResource(resource);
var resolvedResult = {
status: Resolved,
value: value
};
entriesForResource.set(key, resolvedResult);
}
};
resourceConfigs.set(resource, config);
return resource;
}
function invalidateResources() {
entries.clear();
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/store.js":
/*!******************************************************!*\
!*** ../react-devtools-shared/src/devtools/store.js ***!
\******************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return Store; });
/* harmony import */ var events__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! events */ "../../node_modules/events/events.js");
/* harmony import */ var events__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(events__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var util__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! util */ "../../node_modules/util/util.js");
/* harmony import */ var util__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(util__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../constants */ "../react-devtools-shared/src/constants.js");
/* harmony import */ var _types__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../types */ "../react-devtools-shared/src/types.js");
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../utils */ "../react-devtools-shared/src/utils.js");
/* harmony import */ var _storage__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../storage */ "../react-devtools-shared/src/storage.js");
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./utils */ "../react-devtools-shared/src/devtools/utils.js");
/* harmony import */ var _ProfilerStore__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./ProfilerStore */ "../react-devtools-shared/src/devtools/ProfilerStore.js");
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(source, true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
var debug = function debug(methodName) {
if (_constants__WEBPACK_IMPORTED_MODULE_2__["__DEBUG__"]) {
var _console;
for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
args[_key - 1] = arguments[_key];
}
(_console = console).log.apply(_console, ["%cStore %c".concat(methodName), 'color: green; font-weight: bold;', 'font-weight: bold;'].concat(args));
}
};
var LOCAL_STORAGE_COLLAPSE_ROOTS_BY_DEFAULT_KEY = 'React::DevTools::collapseNodesByDefault';
var LOCAL_STORAGE_RECORD_CHANGE_DESCRIPTIONS_KEY = 'React::DevTools::recordChangeDescriptions';
/**
* The store is the single source of truth for updates from the backend.
* ContextProviders can subscribe to the Store for specific things they want to provide.
*/
var Store =
/*#__PURE__*/
function (_EventEmitter) {
_inherits(Store, _EventEmitter);
// Should new nodes be collapsed by default when added to the tree?
// At least one of the injected renderers contains (DEV only) owner metadata.
// Map of ID to (mutable) Element.
// Elements are mutated to avoid excessive cloning during tree updates.
// The InspectedElementContext also relies on this mutability for its WeakMap usage.
// Should the React Native style editor panel be shown?
// Can the backend use the Storage API (e.g. localStorage)?
// If not, features like reload-and-profile will not work correctly and must be disabled.
// Map of element (id) to the set of elements (ids) it owns.
// This map enables getOwnersListForElement() to avoid traversing the entire tree.
// Incremented each time the store is mutated.
// This enables a passive effect to detect a mutation between render and commit phase.
// This Array must be treated as immutable!
// Passive effects will check it for changes between render and mount.
// Renderer ID is needed to support inspection fiber props, state, and hooks.
// These options may be initially set by a confiugraiton option when constructing the Store.
// In the case of "supportsProfiling", the option may be updated based on the injected renderers.
// Total number of visible elements (within all roots).
// Used for windowing purposes.
function Store(bridge, config) {
var _this;
_classCallCheck(this, Store);
_this = _possibleConstructorReturn(this, _getPrototypeOf(Store).call(this));
_defineProperty(_assertThisInitialized(_this), "_collapseNodesByDefault", true);
_defineProperty(_assertThisInitialized(_this), "_hasOwnerMetadata", false);
_defineProperty(_assertThisInitialized(_this), "_idToElement", new Map());
_defineProperty(_assertThisInitialized(_this), "_isNativeStyleEditorSupported", false);
_defineProperty(_assertThisInitialized(_this), "_isBackendStorageAPISupported", false);
_defineProperty(_assertThisInitialized(_this), "_nativeStyleEditorValidAttributes", null);
_defineProperty(_assertThisInitialized(_this), "_ownersMap", new Map());
_defineProperty(_assertThisInitialized(_this), "_recordChangeDescriptions", false);
_defineProperty(_assertThisInitialized(_this), "_revision", 0);
_defineProperty(_assertThisInitialized(_this), "_roots", []);
_defineProperty(_assertThisInitialized(_this), "_rootIDToCapabilities", new Map());
_defineProperty(_assertThisInitialized(_this), "_rootIDToRendererID", new Map());
_defineProperty(_assertThisInitialized(_this), "_supportsNativeInspection", true);
_defineProperty(_assertThisInitialized(_this), "_supportsProfiling", false);
_defineProperty(_assertThisInitialized(_this), "_supportsReloadAndProfile", false);
_defineProperty(_assertThisInitialized(_this), "_supportsTraceUpdates", false);
_defineProperty(_assertThisInitialized(_this), "_unsupportedRendererVersionDetected", false);
_defineProperty(_assertThisInitialized(_this), "_weightAcrossRoots", 0);
_defineProperty(_assertThisInitialized(_this), "_adjustParentTreeWeight", function (parentElement, weightDelta) {
var isInsideCollapsedSubTree = false;
while (parentElement != null) {
parentElement.weight += weightDelta; // Additions and deletions within a collapsed subtree should not bubble beyond the collapsed parent.
// Their weight will bubble up when the parent is expanded.
if (parentElement.isCollapsed) {
isInsideCollapsedSubTree = true;
break;
}
parentElement = _this._idToElement.get(parentElement.parentID);
} // Additions and deletions within a collapsed subtree should not affect the overall number of elements.
if (!isInsideCollapsedSubTree) {
_this._weightAcrossRoots += weightDelta;
}
});
_defineProperty(_assertThisInitialized(_this), "onBridgeNativeStyleEditorSupported", function (_ref) {
var isSupported = _ref.isSupported,
validAttributes = _ref.validAttributes;
_this._isNativeStyleEditorSupported = isSupported;
_this._nativeStyleEditorValidAttributes = validAttributes || null;
_this.emit('supportsNativeStyleEditor');
});
_defineProperty(_assertThisInitialized(_this), "onBridgeOperations", function (operations) {
if (_constants__WEBPACK_IMPORTED_MODULE_2__["__DEBUG__"]) {
console.groupCollapsed('onBridgeOperations');
debug('onBridgeOperations', operations.join(','));
}
var haveRootsChanged = false; // The first two values are always rendererID and rootID
var rendererID = operations[0];
var addedElementIDs = []; // This is a mapping of removed ID -> parent ID:
var removedElementIDs = new Map(); // We'll use the parent ID to adjust selection if it gets deleted.
var i = 2; // Reassemble the string table.
var stringTable = [null];
var stringTableSize = operations[i++];
var stringTableEnd = i + stringTableSize;
while (i < stringTableEnd) {
var nextLength = operations[i++];
var nextString = Object(_utils__WEBPACK_IMPORTED_MODULE_4__["utfDecodeString"])(operations.slice(i, i + nextLength));
stringTable.push(nextString);
i += nextLength;
}
while (i < operations.length) {
var operation = operations[i];
switch (operation) {
case _constants__WEBPACK_IMPORTED_MODULE_2__["TREE_OPERATION_ADD"]:
{
var id = operations[i + 1];
var type = operations[i + 2];
i += 3;
if (_this._idToElement.has(id)) {
throw Error("Cannot add node ".concat(id, " because a node with that id is already in the Store."));
}
var ownerID = 0;
var parentID = null;
if (type === _types__WEBPACK_IMPORTED_MODULE_3__["ElementTypeRoot"]) {
if (_constants__WEBPACK_IMPORTED_MODULE_2__["__DEBUG__"]) {
debug('Add', "new root node ".concat(id));
}
var supportsProfiling = operations[i] > 0;
i++;
var hasOwnerMetadata = operations[i] > 0;
i++;
_this._roots = _this._roots.concat(id);
_this._rootIDToRendererID.set(id, rendererID);
_this._rootIDToCapabilities.set(id, {
hasOwnerMetadata: hasOwnerMetadata,
supportsProfiling: supportsProfiling
});
_this._idToElement.set(id, {
children: [],
depth: -1,
displayName: null,
hocDisplayNames: null,
id: id,
isCollapsed: false,
// Never collapse roots; it would hide the entire tree.
key: null,
ownerID: 0,
parentID: 0,
type: type,
weight: 0
});
haveRootsChanged = true;
} else {
parentID = operations[i];
i++;
ownerID = operations[i];
i++;
var displayNameStringID = operations[i];
var displayName = stringTable[displayNameStringID];
i++;
var keyStringID = operations[i];
var key = stringTable[keyStringID];
i++;
if (_constants__WEBPACK_IMPORTED_MODULE_2__["__DEBUG__"]) {
debug('Add', "node ".concat(id, " (").concat(displayName || 'null', ") as child of ").concat(parentID));
}
if (!_this._idToElement.has(parentID)) {
throw Error("Cannot add child ".concat(id, " to parent ").concat(parentID, " because parent node was not found in the Store."));
}
var parentElement = _this._idToElement.get(parentID);
parentElement.children.push(id);
var _separateDisplayNameA = Object(_utils__WEBPACK_IMPORTED_MODULE_4__["separateDisplayNameAndHOCs"])(displayName, type),
_separateDisplayNameA2 = _slicedToArray(_separateDisplayNameA, 2),
displayNameWithoutHOCs = _separateDisplayNameA2[0],
hocDisplayNames = _separateDisplayNameA2[1];
var element = {
children: [],
depth: parentElement.depth + 1,
displayName: displayNameWithoutHOCs,
hocDisplayNames: hocDisplayNames,
id: id,
isCollapsed: _this._collapseNodesByDefault,
key: key,
ownerID: ownerID,
parentID: parentElement.id,
type: type,
weight: 1
};
_this._idToElement.set(id, element);
addedElementIDs.push(id);
_this._adjustParentTreeWeight(parentElement, 1);
if (ownerID > 0) {
var set = _this._ownersMap.get(ownerID);
if (set === undefined) {
set = new Set();
_this._ownersMap.set(ownerID, set);
}
set.add(id);
}
}
break;
}
case _constants__WEBPACK_IMPORTED_MODULE_2__["TREE_OPERATION_REMOVE"]:
{
var removeLength = operations[i + 1];
i += 2;
var _loop = function _loop(removeIndex) {
var id = operations[i];
if (!_this._idToElement.has(id)) {
throw Error("Cannot remove node ".concat(id, " because no matching node was found in the Store."));
}
i += 1;
var element = _this._idToElement.get(id);
var children = element.children,
ownerID = element.ownerID,
parentID = element.parentID,
weight = element.weight;
if (children.length > 0) {
throw new Error("Node ".concat(id, " was removed before its children."));
}
_this._idToElement.delete(id);
var parentElement = null;
if (parentID === 0) {
if (_constants__WEBPACK_IMPORTED_MODULE_2__["__DEBUG__"]) {
debug('Remove', "node ".concat(id, " root"));
}
_this._roots = _this._roots.filter(function (rootID) {
return rootID !== id;
});
_this._rootIDToRendererID.delete(id);
_this._rootIDToCapabilities.delete(id);
haveRootsChanged = true;
} else {
if (_constants__WEBPACK_IMPORTED_MODULE_2__["__DEBUG__"]) {
debug('Remove', "node ".concat(id, " from parent ").concat(parentID));
}
parentElement = _this._idToElement.get(parentID);
if (parentElement === undefined) {
throw Error("Cannot remove node ".concat(id, " from parent ").concat(parentID, " because no matching node was found in the Store."));
}
var index = parentElement.children.indexOf(id);
parentElement.children.splice(index, 1);
}
_this._adjustParentTreeWeight(parentElement, -weight);
removedElementIDs.set(id, parentID);
_this._ownersMap.delete(id);
if (ownerID > 0) {
var _set = _this._ownersMap.get(ownerID);
if (_set !== undefined) {
_set.delete(id);
}
}
};
for (var removeIndex = 0; removeIndex < removeLength; removeIndex++) {
_loop(removeIndex);
}
break;
}
case _constants__WEBPACK_IMPORTED_MODULE_2__["TREE_OPERATION_REORDER_CHILDREN"]:
{
var _id = operations[i + 1];
var numChildren = operations[i + 2];
i += 3;
if (!_this._idToElement.has(_id)) {
throw Error("Cannot reorder children for node ".concat(_id, " because no matching node was found in the Store."));
}
var _element = _this._idToElement.get(_id);
var children = _element.children;
if (children.length !== numChildren) {
throw Error("Children cannot be added or removed during a reorder operation.");
}
for (var j = 0; j < numChildren; j++) {
var childID = operations[i + j];
children[j] = childID;
if (true) {
// This check is more expensive so it's gated by __DEV__.
var childElement = _this._idToElement.get(childID);
if (childElement == null || childElement.parentID !== _id) {
console.error("Children cannot be added or removed during a reorder operation.");
}
}
}
i += numChildren;
if (_constants__WEBPACK_IMPORTED_MODULE_2__["__DEBUG__"]) {
debug('Re-order', "Node ".concat(_id, " children ").concat(children.join(',')));
}
break;
}
case _constants__WEBPACK_IMPORTED_MODULE_2__["TREE_OPERATION_UPDATE_TREE_BASE_DURATION"]:
// Base duration updates are only sent while profiling is in progress.
// We can ignore them at this point.
// The profiler UI uses them lazily in order to generate the tree.
i += 3;
break;
default:
throw Error("Unsupported Bridge operation ".concat(operation));
}
}
_this._revision++;
if (haveRootsChanged) {
var prevSupportsProfiling = _this._supportsProfiling;
_this._hasOwnerMetadata = false;
_this._supportsProfiling = false;
_this._rootIDToCapabilities.forEach(function (_ref2) {
var hasOwnerMetadata = _ref2.hasOwnerMetadata,
supportsProfiling = _ref2.supportsProfiling;
if (hasOwnerMetadata) {
_this._hasOwnerMetadata = true;
}
if (supportsProfiling) {
_this._supportsProfiling = true;
}
});
_this.emit('roots');
if (_this._supportsProfiling !== prevSupportsProfiling) {
_this.emit('supportsProfiling');
}
}
if (_constants__WEBPACK_IMPORTED_MODULE_2__["__DEBUG__"]) {
console.log(Object(_utils__WEBPACK_IMPORTED_MODULE_6__["printStore"])(_assertThisInitialized(_this), true));
console.groupEnd();
}
_this.emit('mutated', [addedElementIDs, removedElementIDs]);
});
_defineProperty(_assertThisInitialized(_this), "onBridgeOverrideComponentFilters", function (componentFilters) {
_this._componentFilters = componentFilters;
Object(_utils__WEBPACK_IMPORTED_MODULE_4__["saveComponentFilters"])(componentFilters);
});
_defineProperty(_assertThisInitialized(_this), "onBridgeShutdown", function () {
if (_constants__WEBPACK_IMPORTED_MODULE_2__["__DEBUG__"]) {
debug('onBridgeShutdown', 'unsubscribing from Bridge');
}
_this._bridge.removeListener('operations', _this.onBridgeOperations);
_this._bridge.removeListener('shutdown', _this.onBridgeShutdown);
_this._bridge.removeListener('isBackendStorageAPISupported', _this.onBridgeStorageSupported);
});
_defineProperty(_assertThisInitialized(_this), "onBridgeStorageSupported", function (isBackendStorageAPISupported) {
_this._isBackendStorageAPISupported = isBackendStorageAPISupported;
_this.emit('supportsReloadAndProfile');
});
_defineProperty(_assertThisInitialized(_this), "onBridgeUnsupportedRendererVersion", function () {
_this._unsupportedRendererVersionDetected = true;
_this.emit('unsupportedRendererVersionDetected');
});
if (_constants__WEBPACK_IMPORTED_MODULE_2__["__DEBUG__"]) {
debug('constructor', 'subscribing to Bridge');
}
_this._collapseNodesByDefault = Object(_storage__WEBPACK_IMPORTED_MODULE_5__["localStorageGetItem"])(LOCAL_STORAGE_COLLAPSE_ROOTS_BY_DEFAULT_KEY) === 'true';
_this._recordChangeDescriptions = Object(_storage__WEBPACK_IMPORTED_MODULE_5__["localStorageGetItem"])(LOCAL_STORAGE_RECORD_CHANGE_DESCRIPTIONS_KEY) === 'true';
_this._componentFilters = Object(_utils__WEBPACK_IMPORTED_MODULE_4__["getSavedComponentFilters"])();
var isProfiling = false;
if (config != null) {
isProfiling = config.isProfiling === true;
var supportsNativeInspection = config.supportsNativeInspection,
supportsProfiling = config.supportsProfiling,
supportsReloadAndProfile = config.supportsReloadAndProfile,
supportsTraceUpdates = config.supportsTraceUpdates;
_this._supportsNativeInspection = supportsNativeInspection !== false;
if (supportsProfiling) {
_this._supportsProfiling = true;
}
if (supportsReloadAndProfile) {
_this._supportsReloadAndProfile = true;
}
if (supportsTraceUpdates) {
_this._supportsTraceUpdates = true;
}
}
_this._bridge = bridge;
bridge.addListener('operations', _this.onBridgeOperations);
bridge.addListener('overrideComponentFilters', _this.onBridgeOverrideComponentFilters);
bridge.addListener('shutdown', _this.onBridgeShutdown);
bridge.addListener('isBackendStorageAPISupported', _this.onBridgeStorageSupported);
bridge.addListener('isNativeStyleEditorSupported', _this.onBridgeNativeStyleEditorSupported);
bridge.addListener('unsupportedRendererVersion', _this.onBridgeUnsupportedRendererVersion);
_this._profilerStore = new _ProfilerStore__WEBPACK_IMPORTED_MODULE_7__["default"](bridge, _assertThisInitialized(_this), isProfiling);
return _this;
} // This is only used in tests to avoid memory leaks.
_createClass(Store, [{
key: "assertExpectedRootMapSizes",
value: function assertExpectedRootMapSizes() {
if (this.roots.length === 0) {
// The only safe time to assert these maps are empty is when the store is empty.
this.assertMapSizeMatchesRootCount(this._idToElement, '_idToElement');
this.assertMapSizeMatchesRootCount(this._ownersMap, '_ownersMap');
} // These maps should always be the same size as the number of roots
this.assertMapSizeMatchesRootCount(this._rootIDToCapabilities, '_rootIDToCapabilities');
this.assertMapSizeMatchesRootCount(this._rootIDToRendererID, '_rootIDToRendererID');
} // This is only used in tests to avoid memory leaks.
}, {
key: "assertMapSizeMatchesRootCount",
value: function assertMapSizeMatchesRootCount(map, mapName) {
var expectedSize = this.roots.length;
if (map.size !== expectedSize) {
throw new Error("Expected ".concat(mapName, " to contain ").concat(expectedSize, " items, but it contains ").concat(map.size, " items\n\n").concat(Object(util__WEBPACK_IMPORTED_MODULE_1__["inspect"])(map, {
depth: 20
})));
}
}
}, {
key: "containsElement",
value: function containsElement(id) {
return this._idToElement.get(id) != null;
}
}, {
key: "getElementAtIndex",
value: function getElementAtIndex(index) {
if (index < 0 || index >= this.numElements) {
console.warn("Invalid index ".concat(index, " specified; store contains ").concat(this.numElements, " items."));
return null;
} // Find wich root this element is in...
var rootID;
var root;
var rootWeight = 0;
for (var i = 0; i < this._roots.length; i++) {
rootID = this._roots[i];
root = this._idToElement.get(rootID);
if (root.children.length === 0) {
continue;
} else if (rootWeight + root.weight > index) {
break;
} else {
rootWeight += root.weight;
}
} // Find the element in the tree using the weight of each node...
// Skip over the root itself, because roots aren't visible in the Elements tree.
var currentElement = root;
var currentWeight = rootWeight - 1;
while (index !== currentWeight) {
var numChildren = currentElement.children.length;
for (var _i2 = 0; _i2 < numChildren; _i2++) {
var childID = currentElement.children[_i2];
var child = this._idToElement.get(childID);
var childWeight = child.isCollapsed ? 1 : child.weight;
if (index <= currentWeight + childWeight) {
currentWeight++;
currentElement = child;
break;
} else {
currentWeight += childWeight;
}
}
}
return currentElement || null;
}
}, {
key: "getElementIDAtIndex",
value: function getElementIDAtIndex(index) {
var element = this.getElementAtIndex(index);
return element === null ? null : element.id;
}
}, {
key: "getElementByID",
value: function getElementByID(id) {
var element = this._idToElement.get(id);
if (element == null) {
console.warn("No element found with id \"".concat(id, "\""));
return null;
}
return element;
}
}, {
key: "getIndexOfElementID",
value: function getIndexOfElementID(id) {
var element = this.getElementByID(id);
if (element === null || element.parentID === 0) {
return null;
} // Walk up the tree to the root.
// Increment the index by one for each node we encounter,
// and by the weight of all nodes to the left of the current one.
// This should be a relatively fast way of determining the index of a node within the tree.
var previousID = id;
var currentID = element.parentID;
var index = 0;
while (true) {
var current = this._idToElement.get(currentID);
var children = current.children;
for (var i = 0; i < children.length; i++) {
var childID = children[i];
if (childID === previousID) {
break;
}
var child = this._idToElement.get(childID);
index += child.isCollapsed ? 1 : child.weight;
}
if (current.parentID === 0) {
// We found the root; stop crawling.
break;
}
index++;
previousID = current.id;
currentID = current.parentID;
} // At this point, the current ID is a root (from the previous loop).
// We also need to offset the index by previous root weights.
for (var _i3 = 0; _i3 < this._roots.length; _i3++) {
var rootID = this._roots[_i3];
if (rootID === currentID) {
break;
}
var root = this._idToElement.get(rootID);
index += root.weight;
}
return index;
}
}, {
key: "getOwnersListForElement",
value: function getOwnersListForElement(ownerID) {
var _this2 = this;
var list = [];
var element = this._idToElement.get(ownerID);
if (element != null) {
list.push(_objectSpread({}, element, {
depth: 0
}));
var unsortedIDs = this._ownersMap.get(ownerID);
if (unsortedIDs !== undefined) {
var depthMap = new Map([[ownerID, 0]]); // Items in a set are ordered based on insertion.
// This does not correlate with their order in the tree.
// So first we need to order them.
// I wish we could avoid this sorting operation; we could sort at insertion time,
// but then we'd have to pay sorting costs even if the owners list was never used.
// Seems better to defer the cost, since the set of ids is probably pretty small.
var sortedIDs = Array.from(unsortedIDs).sort(function (idA, idB) {
return _this2.getIndexOfElementID(idA) - _this2.getIndexOfElementID(idB);
}); // Next we need to determine the appropriate depth for each element in the list.
// The depth in the list may not correspond to the depth in the tree,
// because the list has been filtered to remove intermediate components.
// Perhaps the easiest way to do this is to walk up the tree until we reach either:
// (1) another node that's already in the tree, or (2) the root (owner)
// at which point, our depth is just the depth of that node plus one.
sortedIDs.forEach(function (id) {
var innerElement = _this2._idToElement.get(id);
if (innerElement != null) {
var parentID = innerElement.parentID;
var depth = 0;
while (parentID > 0) {
if (parentID === ownerID || unsortedIDs.has(parentID)) {
depth = depthMap.get(parentID) + 1;
depthMap.set(id, depth);
break;
}
var parent = _this2._idToElement.get(parentID);
if (parent == null) {
break;
}
parentID = parent.parentID;
}
if (depth === 0) {
throw Error('Invalid owners list');
}
list.push(_objectSpread({}, innerElement, {
depth: depth
}));
}
});
}
}
return list;
}
}, {
key: "getRendererIDForElement",
value: function getRendererIDForElement(id) {
var current = this._idToElement.get(id);
while (current != null) {
if (current.parentID === 0) {
var rendererID = this._rootIDToRendererID.get(current.id);
return rendererID == null ? null : rendererID;
} else {
current = this._idToElement.get(current.parentID);
}
}
return null;
}
}, {
key: "getRootIDForElement",
value: function getRootIDForElement(id) {
var current = this._idToElement.get(id);
while (current != null) {
if (current.parentID === 0) {
return current.id;
} else {
current = this._idToElement.get(current.parentID);
}
}
return null;
}
}, {
key: "isInsideCollapsedSubTree",
value: function isInsideCollapsedSubTree(id) {
var current = this._idToElement.get(id);
while (current != null) {
if (current.parentID === 0) {
return false;
} else {
current = this._idToElement.get(current.parentID);
if (current != null && current.isCollapsed) {
return true;
}
}
}
return false;
} // TODO Maybe split this into two methods: expand() and collapse()
}, {
key: "toggleIsCollapsed",
value: function toggleIsCollapsed(id, isCollapsed) {
var _this3 = this;
var didMutate = false;
var element = this.getElementByID(id);
if (element !== null) {
if (isCollapsed) {
if (element.type === _types__WEBPACK_IMPORTED_MODULE_3__["ElementTypeRoot"]) {
throw Error('Root nodes cannot be collapsed');
}
if (!element.isCollapsed) {
didMutate = true;
element.isCollapsed = true;
var weightDelta = 1 - element.weight;
var parentElement = this._idToElement.get(element.parentID);
while (parentElement != null) {
// We don't need to break on a collapsed parent in the same way as the expand case below.
// That's because collapsing a node doesn't "bubble" and affect its parents.
parentElement.weight += weightDelta;
parentElement = this._idToElement.get(parentElement.parentID);
}
}
} else {
var currentElement = element;
while (currentElement != null) {
var oldWeight = currentElement.isCollapsed ? 1 : currentElement.weight;
if (currentElement.isCollapsed) {
didMutate = true;
currentElement.isCollapsed = false;
var newWeight = currentElement.isCollapsed ? 1 : currentElement.weight;
var _weightDelta = newWeight - oldWeight;
var _parentElement = this._idToElement.get(currentElement.parentID);
while (_parentElement != null) {
_parentElement.weight += _weightDelta;
if (_parentElement.isCollapsed) {
// It's important to break on a collapsed parent when expanding nodes.
// That's because expanding a node "bubbles" up and expands all parents as well.
// Breaking in this case prevents us from over-incrementing the expanded weights.
break;
}
_parentElement = this._idToElement.get(_parentElement.parentID);
}
}
currentElement = currentElement.parentID !== 0 ? this.getElementByID(currentElement.parentID) : null;
}
} // Only re-calculate weights and emit an "update" event if the store was mutated.
if (didMutate) {
var weightAcrossRoots = 0;
this._roots.forEach(function (rootID) {
var _ref3 = _this3.getElementByID(rootID),
weight = _ref3.weight;
weightAcrossRoots += weight;
});
this._weightAcrossRoots = weightAcrossRoots; // The Tree context's search reducer expects an explicit list of ids for nodes that were added or removed.
// In this case, we can pass it empty arrays since nodes in a collapsed tree are still there (just hidden).
// Updating the selected search index later may require auto-expanding a collapsed subtree though.
this.emit('mutated', [[], new Map()]);
}
}
}
}, {
key: "collapseNodesByDefault",
get: function get() {
return this._collapseNodesByDefault;
},
set: function set(value) {
this._collapseNodesByDefault = value;
Object(_storage__WEBPACK_IMPORTED_MODULE_5__["localStorageSetItem"])(LOCAL_STORAGE_COLLAPSE_ROOTS_BY_DEFAULT_KEY, value ? 'true' : 'false');
this.emit('collapseNodesByDefault');
}
}, {
key: "componentFilters",
get: function get() {
return this._componentFilters;
},
set: function set(value) {
if (this._profilerStore.isProfiling) {
// Re-mounting a tree while profiling is in progress might break a lot of assumptions.
// If necessary, we could support this- but it doesn't seem like a necessary use case.
throw Error('Cannot modify filter preferences while profiling');
} // Filter updates are expensive to apply (since they impact the entire tree).
// Let's determine if they've changed and avoid doing this work if they haven't.
var prevEnabledComponentFilters = this._componentFilters.filter(function (filter) {
return filter.isEnabled;
});
var nextEnabledComponentFilters = value.filter(function (filter) {
return filter.isEnabled;
});
var haveEnabledFiltersChanged = prevEnabledComponentFilters.length !== nextEnabledComponentFilters.length;
if (!haveEnabledFiltersChanged) {
for (var i = 0; i < nextEnabledComponentFilters.length; i++) {
var prevFilter = prevEnabledComponentFilters[i];
var nextFilter = nextEnabledComponentFilters[i];
if (Object(_utils__WEBPACK_IMPORTED_MODULE_4__["shallowDiffers"])(prevFilter, nextFilter)) {
haveEnabledFiltersChanged = true;
break;
}
}
}
this._componentFilters = value; // Update persisted filter preferences stored in localStorage.
Object(_utils__WEBPACK_IMPORTED_MODULE_4__["saveComponentFilters"])(value); // Notify the renderer that filter prefernces have changed.
// This is an expensive opreation; it unmounts and remounts the entire tree,
// so only do it if the set of enabled component filters has changed.
if (haveEnabledFiltersChanged) {
this._bridge.send('updateComponentFilters', value);
}
this.emit('componentFilters');
}
}, {
key: "hasOwnerMetadata",
get: function get() {
return this._hasOwnerMetadata;
}
}, {
key: "nativeStyleEditorValidAttributes",
get: function get() {
return this._nativeStyleEditorValidAttributes;
}
}, {
key: "numElements",
get: function get() {
return this._weightAcrossRoots;
}
}, {
key: "profilerStore",
get: function get() {
return this._profilerStore;
}
}, {
key: "recordChangeDescriptions",
get: function get() {
return this._recordChangeDescriptions;
},
set: function set(value) {
this._recordChangeDescriptions = value;
Object(_storage__WEBPACK_IMPORTED_MODULE_5__["localStorageSetItem"])(LOCAL_STORAGE_RECORD_CHANGE_DESCRIPTIONS_KEY, value ? 'true' : 'false');
this.emit('recordChangeDescriptions');
}
}, {
key: "revision",
get: function get() {
return this._revision;
}
}, {
key: "rootIDToRendererID",
get: function get() {
return this._rootIDToRendererID;
}
}, {
key: "roots",
get: function get() {
return this._roots;
}
}, {
key: "supportsNativeInspection",
get: function get() {
return this._supportsNativeInspection;
}
}, {
key: "supportsNativeStyleEditor",
get: function get() {
return this._isNativeStyleEditorSupported;
}
}, {
key: "supportsProfiling",
get: function get() {
return this._supportsProfiling;
}
}, {
key: "supportsReloadAndProfile",
get: function get() {
// Does the DevTools shell support reloading and eagerly injecting the renderer interface?
// And if so, can the backend use the localStorage API?
// Both of these are required for the reload-and-profile feature to work.
return this._supportsReloadAndProfile && this._isBackendStorageAPISupported;
}
}, {
key: "supportsTraceUpdates",
get: function get() {
return this._supportsTraceUpdates;
}
}, {
key: "unsupportedRendererVersionDetected",
get: function get() {
return this._unsupportedRendererVersionDetected;
}
}]);
return Store;
}(events__WEBPACK_IMPORTED_MODULE_0___default.a);
/***/ }),
/***/ "../react-devtools-shared/src/devtools/utils.js":
/*!******************************************************!*\
!*** ../react-devtools-shared/src/devtools/utils.js ***!
\******************************************************/
/*! exports provided: printElement, printOwnersList, printStore, sanitizeForParse, smartParse, smartStringify */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "printElement", function() { return printElement; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "printOwnersList", function() { return printOwnersList; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "printStore", function() { return printStore; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "sanitizeForParse", function() { return sanitizeForParse; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "smartParse", function() { return smartParse; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "smartStringify", function() { return smartStringify; });
/* harmony import */ var react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react-devtools-shared/src/types */ "../react-devtools-shared/src/types.js");
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }
function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function printElement(element) {
var includeWeight = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
var prefix = ' ';
if (element.children.length > 0) {
prefix = element.isCollapsed ? '▸' : '▾';
}
var key = '';
if (element.key !== null) {
key = " key=\"".concat(element.key, "\"");
}
var hocDisplayNames = null;
if (element.hocDisplayNames !== null) {
hocDisplayNames = _toConsumableArray(element.hocDisplayNames);
}
if (element.type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_0__["ElementTypeMemo"]) {
if (hocDisplayNames === null) {
hocDisplayNames = ['Memo'];
} else {
hocDisplayNames.push('Memo');
}
} else if (element.type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_0__["ElementTypeForwardRef"]) {
if (hocDisplayNames === null) {
hocDisplayNames = ['ForwardRef'];
} else {
hocDisplayNames.push('ForwardRef');
}
}
var hocs = hocDisplayNames === null ? '' : " [".concat(hocDisplayNames.join(']['), "]");
var suffix = '';
if (includeWeight) {
suffix = " (".concat(element.isCollapsed ? 1 : element.weight, ")");
}
return "".concat(' '.repeat(element.depth + 1)).concat(prefix, " <").concat(element.displayName || 'null').concat(key, ">").concat(hocs).concat(suffix);
}
function printOwnersList(elements) {
var includeWeight = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
return elements.map(function (element) {
return printElement(element, includeWeight);
}).join('\n');
}
function printStore(store) {
var includeWeight = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
var snapshotLines = [];
var rootWeight = 0;
store.roots.forEach(function (rootID) {
var _ref = store.getElementByID(rootID),
weight = _ref.weight;
snapshotLines.push('[root]' + (includeWeight ? " (".concat(weight, ")") : ''));
for (var i = rootWeight; i < rootWeight + weight; i++) {
var element = store.getElementAtIndex(i);
if (element == null) {
throw Error("Could not find element at index ".concat(i));
}
snapshotLines.push(printElement(element, includeWeight));
}
rootWeight += weight;
}); // Make sure the pretty-printed test align with the Store's reported number of total rows.
if (rootWeight !== store.numElements) {
throw Error("Inconsistent Store state. Individual root weights (".concat(rootWeight, ") do not match total weight (").concat(store.numElements, ")"));
} // If roots have been unmounted, verify that they've been removed from maps.
// This helps ensure the Store doesn't leak memory.
store.assertExpectedRootMapSizes();
return snapshotLines.join('\n');
} // We use JSON.parse to parse string values
// e.g. 'foo' is not valid JSON but it is a valid string
// so this method replaces e.g. 'foo' with "foo"
function sanitizeForParse(value) {
if (typeof value === 'string') {
if (value.length >= 2 && value.charAt(0) === "'" && value.charAt(value.length - 1) === "'") {
return '"' + value.substr(1, value.length - 2) + '"';
}
}
return value;
}
function smartParse(value) {
switch (value) {
case 'Infinity':
return Infinity;
case 'NaN':
return NaN;
case 'undefined':
return undefined;
default:
return JSON.parse(sanitizeForParse(value));
}
}
function smartStringify(value) {
if (typeof value === 'number') {
if (Number.isNaN(value)) {
return 'NaN';
} else if (!Number.isFinite(value)) {
return 'Infinity';
}
} else if (value === undefined) {
return 'undefined';
}
return JSON.stringify(value);
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Button.css":
/*!**************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Button.css ***!
\**************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../node_modules/css-loader??ref--5-1!./Button.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Button.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Button.js":
/*!*************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Button.js ***!
\*************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return Button; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _reach_tooltip__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @reach/tooltip */ "../../node_modules/@reach/tooltip/es/index.js");
/* harmony import */ var _Button_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Button.css */ "../react-devtools-shared/src/devtools/views/Button.css");
/* harmony import */ var _Button_css__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_Button_css__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _Tooltip_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./Tooltip.css */ "../react-devtools-shared/src/devtools/views/Tooltip.css");
/* harmony import */ var _Tooltip_css__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_Tooltip_css__WEBPACK_IMPORTED_MODULE_3__);
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function Button(_ref) {
var children = _ref.children,
_ref$className = _ref.className,
className = _ref$className === void 0 ? '' : _ref$className,
_ref$title = _ref.title,
title = _ref$title === void 0 ? '' : _ref$title,
rest = _objectWithoutProperties(_ref, ["children", "className", "title"]);
var button = react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("button", _extends({
className: "".concat(_Button_css__WEBPACK_IMPORTED_MODULE_2___default.a.Button, " ").concat(className)
}, rest), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("span", {
className: "".concat(_Button_css__WEBPACK_IMPORTED_MODULE_2___default.a.ButtonContent, " ").concat(className),
tabIndex: -1
}, children));
if (title) {
button = react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_reach_tooltip__WEBPACK_IMPORTED_MODULE_1__["default"], {
className: _Tooltip_css__WEBPACK_IMPORTED_MODULE_3___default.a.Tooltip,
label: title
}, button);
}
return button;
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/ButtonIcon.css":
/*!******************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/ButtonIcon.css ***!
\******************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../node_modules/css-loader??ref--5-1!./ButtonIcon.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/ButtonIcon.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/ButtonIcon.js":
/*!*****************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/ButtonIcon.js ***!
\*****************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return ButtonIcon; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _ButtonIcon_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./ButtonIcon.css */ "../react-devtools-shared/src/devtools/views/ButtonIcon.css");
/* harmony import */ var _ButtonIcon_css__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_ButtonIcon_css__WEBPACK_IMPORTED_MODULE_1__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function ButtonIcon(_ref) {
var _ref$className = _ref.className,
className = _ref$className === void 0 ? '' : _ref$className,
type = _ref.type;
var pathData = null;
switch (type) {
case 'add':
pathData = PATH_ADD;
break;
case 'cancel':
pathData = PATH_CANCEL;
break;
case 'clear':
pathData = PATH_CLEAR;
break;
case 'close':
pathData = PATH_CLOSE;
break;
case 'collapsed':
pathData = PATH_COLLAPSED;
break;
case 'copy':
pathData = PATH_COPY;
break;
case 'delete':
pathData = PATH_DELETE;
break;
case 'down':
pathData = PATH_DOWN;
break;
case 'expanded':
pathData = PATH_EXPANDED;
break;
case 'export':
pathData = PATH_EXPORT;
break;
case 'filter':
pathData = PATH_FILTER;
break;
case 'import':
pathData = PATH_IMPORT;
break;
case 'log-data':
pathData = PATH_LOG_DATA;
break;
case 'more':
pathData = PATH_MORE;
break;
case 'next':
pathData = PATH_NEXT;
break;
case 'previous':
pathData = PATH_PREVIOUS;
break;
case 'record':
pathData = PATH_RECORD;
break;
case 'reload':
pathData = PATH_RELOAD;
break;
case 'save':
pathData = PATH_SAVE;
break;
case 'search':
pathData = PATH_SEARCH;
break;
case 'settings':
pathData = PATH_SETTINGS;
break;
case 'suspend':
pathData = PATH_SUSPEND;
break;
case 'undo':
pathData = PATH_UNDO;
break;
case 'up':
pathData = PATH_UP;
break;
case 'view-dom':
pathData = PATH_VIEW_DOM;
break;
case 'view-source':
pathData = PATH_VIEW_SOURCE;
break;
default:
console.warn("Unsupported type \"".concat(type, "\" specified for ButtonIcon"));
break;
}
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("svg", {
xmlns: "http://www.w3.org/2000/svg",
className: "".concat(_ButtonIcon_css__WEBPACK_IMPORTED_MODULE_1___default.a.ButtonIcon, " ").concat(className),
width: "24",
height: "24",
viewBox: "0 0 24 24"
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("path", {
d: "M0 0h24v24H0z",
fill: "none"
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("path", {
fill: "currentColor",
d: pathData
}));
}
var PATH_ADD = 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm5 11h-4v4h-2v-4H7v-2h4V7h2v4h4v2z';
var PATH_CANCEL = "\n M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\n";
var PATH_CLEAR = "\n M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zM4 12c0-4.42 3.58-8 8-8 1.85 0 3.55.63 4.9 1.69L5.69\n 16.9C4.63 15.55 4 13.85 4 12zm8 8c-1.85 0-3.55-.63-4.9-1.69L18.31 7.1C19.37 8.45 20 10.15 20 12c0 4.42-3.58 8-8 8z\n";
var PATH_CLOSE = 'M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z';
var PATH_COLLAPSED = 'M10 17l5-5-5-5v10z';
var PATH_COPY = "\n M3 13h2v-2H3v2zm0 4h2v-2H3v2zm2 4v-2H3a2 2 0 0 0 2 2zM3 9h2V7H3v2zm12 12h2v-2h-2v2zm4-18H9a2 2 0 0 0-2\n 2v10a2 2 0 0 0 2 2h10c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 12H9V5h10v10zm-8 6h2v-2h-2v2zm-4 0h2v-2H7v2z\n";
var PATH_DELETE = "\n M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13.59L15.59 17 12\n 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z\n";
var PATH_DOWN = 'M7.41 8.59L12 13.17l4.59-4.58L18 10l-6 6-6-6 1.41-1.41z';
var PATH_EXPANDED = 'M7 10l5 5 5-5z';
var PATH_EXPORT = 'M15.82,2.14v7H21l-9,9L3,9.18H8.18v-7ZM3,20.13H21v1.73H3Z';
var PATH_FILTER = 'M10 18h4v-2h-4v2zM3 6v2h18V6H3zm3 7h12v-2H6v2z';
var PATH_IMPORT = 'M8.18,18.13v-7H3l9-8.95,9,9H15.82v7ZM3,20.13H21v1.73H3Z';
var PATH_LOG_DATA = "\n M20 8h-2.81c-.45-.78-1.07-1.45-1.82-1.96L17 4.41 15.59 3l-2.17 2.17C12.96 5.06 12.49 5 12 5c-.49 0-.96.06-1.41.17L8.41\n 3 7 4.41l1.62 1.63C7.88 6.55 7.26 7.22 6.81 8H4v2h2.09c-.05.33-.09.66-.09 1v1H4v2h2v1c0 .34.04.67.09 1H4v2h2.81c1.04\n 1.79 2.97 3 5.19 3s4.15-1.21 5.19-3H20v-2h-2.09c.05-.33.09-.66.09-1v-1h2v-2h-2v-1c0-.34-.04-.67-.09-1H20V8zm-6\n 8h-4v-2h4v2zm0-4h-4v-2h4v2z\n";
var PATH_MORE = "\n M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 \n 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z\n";
var PATH_NEXT = 'M12 4l-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z';
var PATH_PREVIOUS = 'M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z';
var PATH_RECORD = 'M4,12a8,8 0 1,0 16,0a8,8 0 1,0 -16,0';
var PATH_RELOAD = "\n M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0\n 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0\n 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z\n";
var PATH_SAVE = "\n M17 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V7l-4-4zm-5 16c-1.66 0-3-1.34-3-3s1.34-3 3-3 3 1.34 3 3-1.34 3-3 3zm3-10H5V5h10v4z\n";
var PATH_SEARCH = "\n M8.5,22H3.7l-1.4-1.5V3.8l1.3-1.5h17.2l1,1.5v4.9h-1.3V4.3l-0.4-0.6H4.2L3.6,4.3V20l0.7,0.7h4.2V22z\n M23,13.9l-4.6,3.6l4.6,4.6l-1.1,1.1l-4.7-4.4l-3.3,4.4l-3.2-12.3L23,13.9z\n";
var PATH_SETTINGS = "\n M19.43 12.98c.04-.32.07-.64.07-.98s-.03-.66-.07-.98l2.11-1.65c.19-.15.24-.42.12-.64l-2-3.46c-.12-.22-.39-.3-.61-.22l-2.49\n 1c-.52-.4-1.08-.73-1.69-.98l-.38-2.65C14.46 2.18 14.25 2 14 2h-4c-.25 0-.46.18-.49.42l-.38\n 2.65c-.61.25-1.17.59-1.69.98l-2.49-1c-.23-.09-.49 0-.61.22l-2 3.46c-.13.22-.07.49.12.64l2.11\n 1.65c-.04.32-.07.65-.07.98s.03.66.07.98l-2.11 1.65c-.19.15-.24.42-.12.64l2 3.46c.12.22.39.3.61.22l2.49-1c.52.4\n 1.08.73 1.69.98l.38 2.65c.03.24.24.42.49.42h4c.25 0 .46-.18.49-.42l.38-2.65c.61-.25 1.17-.59 1.69-.98l2.49\n 1c.23.09.49 0 .61-.22l2-3.46c.12-.22.07-.49-.12-.64l-2.11-1.65zM12 15.5c-1.93 0-3.5-1.57-3.5-3.5s1.57-3.5\n 3.5-3.5 3.5 1.57 3.5 3.5-1.57 3.5-3.5 3.5z\n";
var PATH_SUSPEND = "\n M15 1H9v2h6V1zm-4 13h2V8h-2v6zm8.03-6.61l1.42-1.42c-.43-.51-.9-.99-1.41-1.41l-1.42 1.42C16.07 4.74 14.12 4 12 4c-4.97\n 0-9 4.03-9 9s4.02 9 9 9 9-4.03 9-9c0-2.12-.74-4.07-1.97-5.61zM12 20c-3.87 0-7-3.13-7-7s3.13-7 7-7 7 3.13 7 7-3.13 7-7 7z\n";
var PATH_UNDO = "\n M12.5 8c-2.65 0-5.05.99-6.9 2.6L2 7v9h9l-3.62-3.62c1.39-1.16 3.16-1.88 5.12-1.88\n 3.54 0 6.55 2.31 7.6 5.5l2.37-.78C21.08 11.03 17.15 8 12.5 8z\n";
var PATH_UP = 'M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z';
var PATH_VIEW_DOM = "\n M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5zM12\n 17c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5zm0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3\n 3-1.34 3-3-1.34-3-3-3z\n";
var PATH_VIEW_SOURCE = "\n M9.4 16.6L4.8 12l4.6-4.6L8 6l-6 6 6 6 1.4-1.4zm5.2 0l4.6-4.6-4.6-4.6L16 6l6 6-6 6-1.4-1.4z\n ";
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/Badge.css":
/*!************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/Badge.css ***!
\************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./Badge.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/Badge.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/Badge.js":
/*!***********************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/Badge.js ***!
\***********************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return Badge; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-devtools-shared/src/types */ "../react-devtools-shared/src/types.js");
/* harmony import */ var _Badge_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Badge.css */ "../react-devtools-shared/src/devtools/views/Components/Badge.css");
/* harmony import */ var _Badge_css__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_Badge_css__WEBPACK_IMPORTED_MODULE_2__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function Badge(_ref) {
var className = _ref.className,
hocDisplayNames = _ref.hocDisplayNames,
type = _ref.type;
var hocDisplayName = null;
var totalBadgeCount = 0;
var typeLabel = null;
if (hocDisplayNames !== null) {
hocDisplayName = hocDisplayNames[0];
totalBadgeCount += hocDisplayNames.length;
}
if (type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_1__["ElementTypeMemo"]) {
typeLabel = 'Memo';
totalBadgeCount++;
} else if (type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_1__["ElementTypeForwardRef"]) {
typeLabel = 'ForwardRef';
totalBadgeCount++;
}
if (hocDisplayNames === null && typeLabel === null) {
return null;
}
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: "".concat(_Badge_css__WEBPACK_IMPORTED_MODULE_2___default.a.Badge, " ").concat(className || '')
}, hocDisplayName || typeLabel), totalBadgeCount > 1 && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Badge_css__WEBPACK_IMPORTED_MODULE_2___default.a.ExtraLabel
}, "+", totalBadgeCount - 1));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/Components.css":
/*!*****************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/Components.css ***!
\*****************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./Components.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/Components.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/Components.js":
/*!****************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/Components.js ***!
\****************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _Tree__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Tree */ "../react-devtools-shared/src/devtools/views/Components/Tree.js");
/* harmony import */ var _SelectedElement__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./SelectedElement */ "../react-devtools-shared/src/devtools/views/Components/SelectedElement.js");
/* harmony import */ var _InspectedElementContext__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./InspectedElementContext */ "../react-devtools-shared/src/devtools/views/Components/InspectedElementContext.js");
/* harmony import */ var _NativeStyleEditor_context__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./NativeStyleEditor/context */ "../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/context.js");
/* harmony import */ var _OwnersListContext__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./OwnersListContext */ "../react-devtools-shared/src/devtools/views/Components/OwnersListContext.js");
/* harmony import */ var _portaledContent__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../portaledContent */ "../react-devtools-shared/src/devtools/views/portaledContent.js");
/* harmony import */ var _ModalDialog__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../ModalDialog */ "../react-devtools-shared/src/devtools/views/ModalDialog.js");
/* harmony import */ var react_devtools_shared_src_devtools_views_Settings_SettingsModal__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! react-devtools-shared/src/devtools/views/Settings/SettingsModal */ "../react-devtools-shared/src/devtools/views/Settings/SettingsModal.js");
/* harmony import */ var react_devtools_shared_src_devtools_views_Settings_SettingsModalContext__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! react-devtools-shared/src/devtools/views/Settings/SettingsModalContext */ "../react-devtools-shared/src/devtools/views/Settings/SettingsModalContext.js");
/* harmony import */ var _Components_css__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./Components.css */ "../react-devtools-shared/src/devtools/views/Components/Components.css");
/* harmony import */ var _Components_css__WEBPACK_IMPORTED_MODULE_10___default = /*#__PURE__*/__webpack_require__.n(_Components_css__WEBPACK_IMPORTED_MODULE_10__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function Components(_) {
// TODO Flex wrappers below should be user resizable.
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react_devtools_shared_src_devtools_views_Settings_SettingsModalContext__WEBPACK_IMPORTED_MODULE_9__["SettingsModalContextController"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_OwnersListContext__WEBPACK_IMPORTED_MODULE_5__["OwnersListContextController"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_InspectedElementContext__WEBPACK_IMPORTED_MODULE_3__["InspectedElementContextController"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Components_css__WEBPACK_IMPORTED_MODULE_10___default.a.Components
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Components_css__WEBPACK_IMPORTED_MODULE_10___default.a.TreeWrapper
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Tree__WEBPACK_IMPORTED_MODULE_1__["default"], null)), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Components_css__WEBPACK_IMPORTED_MODULE_10___default.a.SelectedElementWrapper
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_NativeStyleEditor_context__WEBPACK_IMPORTED_MODULE_4__["NativeStyleContextController"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0__["Suspense"], {
fallback: react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(Loading, null)
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_SelectedElement__WEBPACK_IMPORTED_MODULE_2__["default"], null)))), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ModalDialog__WEBPACK_IMPORTED_MODULE_7__["ModalDialog"], null), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react_devtools_shared_src_devtools_views_Settings_SettingsModal__WEBPACK_IMPORTED_MODULE_8__["default"], null)))));
}
function Loading() {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Components_css__WEBPACK_IMPORTED_MODULE_10___default.a.Loading
}, "Loading...");
}
/* harmony default export */ __webpack_exports__["default"] = (Object(_portaledContent__WEBPACK_IMPORTED_MODULE_6__["default"])(Components));
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/EditableName.css":
/*!*******************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/EditableName.css ***!
\*******************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./EditableName.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/EditableName.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/EditableName.js":
/*!******************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/EditableName.js ***!
\******************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return EditableName; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _NativeStyleEditor_AutoSizeInput__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./NativeStyleEditor/AutoSizeInput */ "../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/AutoSizeInput.js");
/* harmony import */ var _EditableName_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./EditableName.css */ "../react-devtools-shared/src/devtools/views/Components/EditableName.css");
/* harmony import */ var _EditableName_css__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_EditableName_css__WEBPACK_IMPORTED_MODULE_2__);
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function EditableName(_ref) {
var _ref$autoFocus = _ref.autoFocus,
autoFocus = _ref$autoFocus === void 0 ? false : _ref$autoFocus,
_ref$initialValue = _ref.initialValue,
initialValue = _ref$initialValue === void 0 ? '' : _ref$initialValue,
overrideNameFn = _ref.overrideNameFn;
var _useState = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(initialValue),
_useState2 = _slicedToArray(_useState, 2),
editableName = _useState2[0],
setEditableName = _useState2[1];
var _useState3 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(false),
_useState4 = _slicedToArray(_useState3, 2),
isValid = _useState4[0],
setIsValid = _useState4[1];
var handleChange = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (_ref2) {
var target = _ref2.target;
var value = target.value.trim();
if (value) {
setIsValid(true);
} else {
setIsValid(false);
}
setEditableName(value);
}, [overrideNameFn]);
var handleKeyDown = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (event) {
// Prevent keydown events from e.g. change selected element in the tree
event.stopPropagation();
switch (event.key) {
case 'Enter':
case 'Tab':
if (isValid) {
overrideNameFn(editableName);
}
break;
case 'Escape':
setEditableName(initialValue);
break;
default:
break;
}
}, [editableName, setEditableName, isValid, initialValue, overrideNameFn]);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_NativeStyleEditor_AutoSizeInput__WEBPACK_IMPORTED_MODULE_1__["default"], {
autoFocus: autoFocus,
className: _EditableName_css__WEBPACK_IMPORTED_MODULE_2___default.a.Input,
onChange: handleChange,
onKeyDown: handleKeyDown,
placeholder: "new prop",
type: "text",
value: editableName
});
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/EditableValue.css":
/*!********************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/EditableValue.css ***!
\********************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./EditableValue.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/EditableValue.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/EditableValue.js":
/*!*******************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/EditableValue.js ***!
\*******************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return EditableValue; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _Button__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../Button */ "../react-devtools-shared/src/devtools/views/Button.js");
/* harmony import */ var _ButtonIcon__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../ButtonIcon */ "../react-devtools-shared/src/devtools/views/ButtonIcon.js");
/* harmony import */ var _EditableValue_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./EditableValue.css */ "../react-devtools-shared/src/devtools/views/Components/EditableValue.css");
/* harmony import */ var _EditableValue_css__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_EditableValue_css__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _hooks__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../hooks */ "../react-devtools-shared/src/devtools/views/hooks.js");
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function EditableValue(_ref) {
var _ref$className = _ref.className,
className = _ref$className === void 0 ? '' : _ref$className,
overrideValueFn = _ref.overrideValueFn,
path = _ref.path,
value = _ref.value;
var inputRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(null);
var _useEditableValue = Object(_hooks__WEBPACK_IMPORTED_MODULE_4__["useEditableValue"])(value),
_useEditableValue2 = _slicedToArray(_useEditableValue, 2),
state = _useEditableValue2[0],
dispatch = _useEditableValue2[1];
var editableValue = state.editableValue,
hasPendingChanges = state.hasPendingChanges,
isValid = state.isValid,
parsedValue = state.parsedValue;
var reset = function reset() {
return dispatch({
type: 'RESET',
externalValue: value
});
};
var handleChange = function handleChange(_ref2) {
var target = _ref2.target;
return dispatch({
type: 'UPDATE',
editableValue: target.value,
externalValue: value
});
};
var handleKeyDown = function handleKeyDown(event) {
// Prevent keydown events from e.g. change selected element in the tree
event.stopPropagation();
switch (event.key) {
case 'Enter':
if (isValid && hasPendingChanges) {
overrideValueFn(path, parsedValue);
}
break;
case 'Escape':
reset();
break;
default:
break;
}
};
var placeholder = '';
if (editableValue === undefined) {
placeholder = '(undefined)';
} else {
placeholder = 'Enter valid JSON';
}
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("input", {
autoComplete: "new-password",
className: "".concat(isValid ? _EditableValue_css__WEBPACK_IMPORTED_MODULE_3___default.a.Input : _EditableValue_css__WEBPACK_IMPORTED_MODULE_3___default.a.Invalid, " ").concat(className),
onChange: handleChange,
onKeyDown: handleKeyDown,
placeholder: placeholder,
ref: inputRef,
type: "text",
value: editableValue
}), hasPendingChanges && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_1__["default"], {
className: _EditableValue_css__WEBPACK_IMPORTED_MODULE_3___default.a.ResetButton,
onClick: reset,
title: "Reset value"
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_2__["default"], {
type: "undo"
})));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/Element.css":
/*!**************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/Element.css ***!
\**************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./Element.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/Element.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/Element.js":
/*!*************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/Element.js ***!
\*************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return ElementView; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_devtools_shared_src_devtools_store__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-devtools-shared/src/devtools/store */ "../react-devtools-shared/src/devtools/store.js");
/* harmony import */ var _Badge__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Badge */ "../react-devtools-shared/src/devtools/views/Components/Badge.js");
/* harmony import */ var _ButtonIcon__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../ButtonIcon */ "../react-devtools-shared/src/devtools/views/ButtonIcon.js");
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../utils */ "../react-devtools-shared/src/devtools/views/utils.js");
/* harmony import */ var _TreeContext__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./TreeContext */ "../react-devtools-shared/src/devtools/views/Components/TreeContext.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var _Element_css__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./Element.css */ "../react-devtools-shared/src/devtools/views/Components/Element.css");
/* harmony import */ var _Element_css__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_Element_css__WEBPACK_IMPORTED_MODULE_7__);
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function ElementView(_ref) {
var data = _ref.data,
index = _ref.index,
style = _ref.style;
var store = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_6__["StoreContext"]);
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_TreeContext__WEBPACK_IMPORTED_MODULE_5__["TreeStateContext"]),
ownerFlatTree = _useContext.ownerFlatTree,
ownerID = _useContext.ownerID,
selectedElementID = _useContext.selectedElementID;
var dispatch = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_TreeContext__WEBPACK_IMPORTED_MODULE_5__["TreeDispatcherContext"]);
var element = ownerFlatTree !== null ? ownerFlatTree[index] : store.getElementAtIndex(index);
var _useState = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(false),
_useState2 = _slicedToArray(_useState, 2),
isHovered = _useState2[0],
setIsHovered = _useState2[1];
var isNavigatingWithKeyboard = data.isNavigatingWithKeyboard,
onElementMouseEnter = data.onElementMouseEnter,
treeFocused = data.treeFocused;
var id = element === null ? null : element.id;
var isSelected = selectedElementID === id;
var handleDoubleClick = function handleDoubleClick() {
if (id !== null) {
dispatch({
type: 'SELECT_OWNER',
payload: id
});
}
};
var handleMouseDown = function handleMouseDown(_ref2) {
var metaKey = _ref2.metaKey;
if (id !== null) {
dispatch({
type: 'SELECT_ELEMENT_BY_ID',
payload: metaKey ? null : id
});
}
};
var handleMouseEnter = function handleMouseEnter() {
setIsHovered(true);
if (id !== null) {
onElementMouseEnter(id);
}
};
var handleMouseLeave = function handleMouseLeave() {
setIsHovered(false);
};
var handleKeyDoubleClick = function handleKeyDoubleClick(event) {
// Double clicks on key value are used for text selection (if the text has been truncated).
// They should not enter the owners tree view.
event.stopPropagation();
event.preventDefault();
}; // Handle elements that are removed from the tree while an async render is in progress.
if (element == null) {
console.warn("<ElementView> Could not find element at index ".concat(index)); // This return needs to happen after hooks, since hooks can't be conditional.
return null;
}
var _ref3 = element,
depth = _ref3.depth,
displayName = _ref3.displayName,
hocDisplayNames = _ref3.hocDisplayNames,
key = _ref3.key,
type = _ref3.type;
var className = _Element_css__WEBPACK_IMPORTED_MODULE_7___default.a.Element;
if (isSelected) {
className = treeFocused ? _Element_css__WEBPACK_IMPORTED_MODULE_7___default.a.SelectedElement : _Element_css__WEBPACK_IMPORTED_MODULE_7___default.a.InactiveSelectedElement;
} else if (isHovered && !isNavigatingWithKeyboard) {
className = _Element_css__WEBPACK_IMPORTED_MODULE_7___default.a.HoveredElement;
}
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: className,
onMouseEnter: handleMouseEnter,
onMouseLeave: handleMouseLeave,
onMouseDown: handleMouseDown,
onDoubleClick: handleDoubleClick,
style: style,
"data-depth": depth
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Element_css__WEBPACK_IMPORTED_MODULE_7___default.a.Wrapper,
style: {
// Left offset presents the appearance of a nested tree structure.
// We must use padding rather than margin/left because of the selected background color.
transform: "translateX(calc(".concat(depth, " * var(--indentation-size)))")
}
}, ownerID === null ? react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(ExpandCollapseToggle, {
element: element,
store: store
}) : null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(DisplayName, {
displayName: displayName,
id: id
}), key && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, "\xA0", react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("span", {
className: _Element_css__WEBPACK_IMPORTED_MODULE_7___default.a.KeyName
}, "key"), "=\"", react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("span", {
className: _Element_css__WEBPACK_IMPORTED_MODULE_7___default.a.KeyValue,
title: key,
onDoubleClick: handleKeyDoubleClick
}, key), "\""), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Badge__WEBPACK_IMPORTED_MODULE_2__["default"], {
className: _Element_css__WEBPACK_IMPORTED_MODULE_7___default.a.Badge,
hocDisplayNames: hocDisplayNames,
type: type
})));
} // Prevent double clicks on toggle from drilling into the owner list.
var swallowDoubleClick = function swallowDoubleClick(event) {
event.preventDefault();
event.stopPropagation();
};
function ExpandCollapseToggle(_ref4) {
var element = _ref4.element,
store = _ref4.store;
var children = element.children,
id = element.id,
isCollapsed = element.isCollapsed;
var toggleCollapsed = function toggleCollapsed(event) {
event.preventDefault();
event.stopPropagation();
store.toggleIsCollapsed(id, !isCollapsed);
};
var stopPropagation = function stopPropagation(event) {
// Prevent the row from selecting
event.stopPropagation();
};
if (children.length === 0) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Element_css__WEBPACK_IMPORTED_MODULE_7___default.a.ExpandCollapseToggle
});
}
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Element_css__WEBPACK_IMPORTED_MODULE_7___default.a.ExpandCollapseToggle,
onMouseDown: stopPropagation,
onClick: toggleCollapsed,
onDoubleClick: swallowDoubleClick
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_3__["default"], {
type: isCollapsed ? 'collapsed' : 'expanded'
}));
}
function DisplayName(_ref5) {
var displayName = _ref5.displayName,
id = _ref5.id;
var _useContext2 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_TreeContext__WEBPACK_IMPORTED_MODULE_5__["TreeStateContext"]),
searchIndex = _useContext2.searchIndex,
searchResults = _useContext2.searchResults,
searchText = _useContext2.searchText;
var isSearchResult = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
return searchResults.includes(id);
}, [id, searchResults]);
var isCurrentResult = searchIndex !== null && id === searchResults[searchIndex];
if (!isSearchResult || displayName === null) {
return displayName;
}
var match = Object(_utils__WEBPACK_IMPORTED_MODULE_4__["createRegExp"])(searchText).exec(displayName);
if (match === null) {
return displayName;
}
var startIndex = match.index;
var stopIndex = startIndex + match[0].length;
var children = [];
if (startIndex > 0) {
children.push(react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("span", {
key: "begin"
}, displayName.slice(0, startIndex)));
}
children.push(react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("mark", {
key: "middle",
className: isCurrentResult ? _Element_css__WEBPACK_IMPORTED_MODULE_7___default.a.CurrentHighlight : _Element_css__WEBPACK_IMPORTED_MODULE_7___default.a.Highlight
}, displayName.slice(startIndex, stopIndex)));
if (stopIndex < displayName.length) {
children.push(react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("span", {
key: "end"
}, displayName.slice(stopIndex)));
}
return children;
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/ExpandCollapseToggle.css":
/*!***************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/ExpandCollapseToggle.css ***!
\***************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./ExpandCollapseToggle.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/ExpandCollapseToggle.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/ExpandCollapseToggle.js":
/*!**************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/ExpandCollapseToggle.js ***!
\**************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return ExpandCollapseToggle; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _Button__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../Button */ "../react-devtools-shared/src/devtools/views/Button.js");
/* harmony import */ var _ButtonIcon__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../ButtonIcon */ "../react-devtools-shared/src/devtools/views/ButtonIcon.js");
/* harmony import */ var _ExpandCollapseToggle_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./ExpandCollapseToggle.css */ "../react-devtools-shared/src/devtools/views/Components/ExpandCollapseToggle.css");
/* harmony import */ var _ExpandCollapseToggle_css__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_ExpandCollapseToggle_css__WEBPACK_IMPORTED_MODULE_3__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function ExpandCollapseToggle(_ref) {
var isOpen = _ref.isOpen,
setIsOpen = _ref.setIsOpen;
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_1__["default"], {
className: _ExpandCollapseToggle_css__WEBPACK_IMPORTED_MODULE_3___default.a.ExpandCollapseToggle,
onClick: function onClick() {
return setIsOpen(function (prevIsOpen) {
return !prevIsOpen;
});
},
title: "".concat(isOpen ? 'Collapse' : 'Expand', " prop value")
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_2__["default"], {
type: isOpen ? 'expanded' : 'collapsed'
}));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/HocBadges.css":
/*!****************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/HocBadges.css ***!
\****************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./HocBadges.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/HocBadges.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/HocBadges.js":
/*!***************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/HocBadges.js ***!
\***************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return HocBadges; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-devtools-shared/src/types */ "../react-devtools-shared/src/types.js");
/* harmony import */ var _HocBadges_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./HocBadges.css */ "../react-devtools-shared/src/devtools/views/Components/HocBadges.css");
/* harmony import */ var _HocBadges_css__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_HocBadges_css__WEBPACK_IMPORTED_MODULE_2__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function HocBadges(_ref) {
var element = _ref.element;
var _ref2 = element,
hocDisplayNames = _ref2.hocDisplayNames,
type = _ref2.type;
var typeBadge = null;
if (type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_1__["ElementTypeMemo"]) {
typeBadge = 'Memo';
} else if (type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_1__["ElementTypeForwardRef"]) {
typeBadge = 'ForwardRef';
}
if (hocDisplayNames === null && typeBadge === null) {
return null;
}
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _HocBadges_css__WEBPACK_IMPORTED_MODULE_2___default.a.HocBadges
}, typeBadge !== null && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _HocBadges_css__WEBPACK_IMPORTED_MODULE_2___default.a.Badge
}, typeBadge), hocDisplayNames !== null && hocDisplayNames.map(function (hocDisplayName) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
key: hocDisplayName,
className: _HocBadges_css__WEBPACK_IMPORTED_MODULE_2___default.a.Badge
}, hocDisplayName);
}));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/HooksTree.css":
/*!****************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/HooksTree.css ***!
\****************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./HooksTree.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/HooksTree.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/HooksTree.js":
/*!***************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/HooksTree.js ***!
\***************************************************************************/
/*! exports provided: HooksTreeView, InnerHooksTreeView, default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "HooksTreeView", function() { return HooksTreeView; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "InnerHooksTreeView", function() { return InnerHooksTreeView; });
/* harmony import */ var clipboard_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! clipboard-js */ "../../node_modules/clipboard-js/clipboard.js");
/* harmony import */ var clipboard_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(clipboard_js__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var _Button__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../Button */ "../react-devtools-shared/src/devtools/views/Button.js");
/* harmony import */ var _ButtonIcon__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../ButtonIcon */ "../react-devtools-shared/src/devtools/views/ButtonIcon.js");
/* harmony import */ var _EditableValue__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./EditableValue */ "../react-devtools-shared/src/devtools/views/Components/EditableValue.js");
/* harmony import */ var _ExpandCollapseToggle__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./ExpandCollapseToggle */ "../react-devtools-shared/src/devtools/views/Components/ExpandCollapseToggle.js");
/* harmony import */ var _InspectedElementContext__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./InspectedElementContext */ "../react-devtools-shared/src/devtools/views/Components/InspectedElementContext.js");
/* harmony import */ var _KeyValue__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./KeyValue */ "../react-devtools-shared/src/devtools/views/Components/KeyValue.js");
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../utils */ "../react-devtools-shared/src/devtools/views/utils.js");
/* harmony import */ var _HooksTree_css__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./HooksTree.css */ "../react-devtools-shared/src/devtools/views/Components/HooksTree.css");
/* harmony import */ var _HooksTree_css__WEBPACK_IMPORTED_MODULE_10___default = /*#__PURE__*/__webpack_require__.n(_HooksTree_css__WEBPACK_IMPORTED_MODULE_10__);
/* harmony import */ var _ContextMenu_useContextMenu__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../ContextMenu/useContextMenu */ "../react-devtools-shared/src/devtools/ContextMenu/useContextMenu.js");
/* harmony import */ var _hydration__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../../hydration */ "../react-devtools-shared/src/hydration.js");
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }
function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function HooksTreeView(_ref) {
var canEditHooks = _ref.canEditHooks,
hooks = _ref.hooks,
id = _ref.id;
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_1__["useContext"])(_InspectedElementContext__WEBPACK_IMPORTED_MODULE_7__["InspectedElementContext"]),
getInspectedElementPath = _useContext.getInspectedElementPath;
var inspectPath = Object(react__WEBPACK_IMPORTED_MODULE_1__["useCallback"])(function (path) {
getInspectedElementPath(id, ['hooks'].concat(_toConsumableArray(path)));
}, [getInspectedElementPath, id]);
var handleCopy = Object(react__WEBPACK_IMPORTED_MODULE_1__["useCallback"])(function () {
return Object(clipboard_js__WEBPACK_IMPORTED_MODULE_0__["copy"])(Object(_utils__WEBPACK_IMPORTED_MODULE_9__["serializeHooksForCopy"])(hooks));
}, [hooks]);
if (hooks === null) {
return null;
} else {
return react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _HooksTree_css__WEBPACK_IMPORTED_MODULE_10___default.a.HooksTreeView
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _HooksTree_css__WEBPACK_IMPORTED_MODULE_10___default.a.HeaderRow
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _HooksTree_css__WEBPACK_IMPORTED_MODULE_10___default.a.Header
}, "hooks"), react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_3__["default"], {
onClick: handleCopy,
title: "Copy to clipboard"
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_4__["default"], {
type: "copy"
}))), react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(InnerHooksTreeView, {
canEditHooks: canEditHooks,
hooks: hooks,
id: id,
inspectPath: inspectPath,
path: []
}));
}
}
function InnerHooksTreeView(_ref2) {
var canEditHooks = _ref2.canEditHooks,
hooks = _ref2.hooks,
id = _ref2.id,
inspectPath = _ref2.inspectPath,
path = _ref2.path;
// $FlowFixMe "Missing type annotation for U" whatever that means
return hooks.map(function (hook, index) {
return react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(HookView, {
key: index,
canEditHooks: canEditHooks,
hook: hooks[index],
id: id,
inspectPath: inspectPath,
path: path.concat([index])
});
});
}
function HookView(_ref3) {
var canEditHooks = _ref3.canEditHooks,
hook = _ref3.hook,
id = _ref3.id,
inspectPath = _ref3.inspectPath,
path = _ref3.path;
var name = hook.name,
hookID = hook.id,
isStateEditable = hook.isStateEditable,
subHooks = hook.subHooks,
value = hook.value;
var bridge = Object(react__WEBPACK_IMPORTED_MODULE_1__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_2__["BridgeContext"]);
var store = Object(react__WEBPACK_IMPORTED_MODULE_1__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_2__["StoreContext"]);
var _useState = Object(react__WEBPACK_IMPORTED_MODULE_1__["useState"])(false),
_useState2 = _slicedToArray(_useState, 2),
isOpen = _useState2[0],
setIsOpen = _useState2[1];
var toggleIsOpen = Object(react__WEBPACK_IMPORTED_MODULE_1__["useCallback"])(function () {
return setIsOpen(function (prevIsOpen) {
return !prevIsOpen;
});
}, []);
var contextMenuTriggerRef = Object(react__WEBPACK_IMPORTED_MODULE_1__["useRef"])(null);
Object(_ContextMenu_useContextMenu__WEBPACK_IMPORTED_MODULE_11__["default"])({
data: {
path: ['hooks'].concat(_toConsumableArray(path)),
type: hook !== null && _typeof(hook) === 'object' && hook.hasOwnProperty(_hydration__WEBPACK_IMPORTED_MODULE_12__["meta"].type) ? hook[_hydration__WEBPACK_IMPORTED_MODULE_12__["meta"].type] : _typeof(value)
},
id: 'SelectedElement',
ref: contextMenuTriggerRef
});
if (hook.hasOwnProperty(_hydration__WEBPACK_IMPORTED_MODULE_12__["meta"].inspected)) {
// This Hook is too deep and hasn't been hydrated.
if (true) {
console.warn('Unexpected dehydrated hook; this is a DevTools error.');
}
return react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _HooksTree_css__WEBPACK_IMPORTED_MODULE_10___default.a.Hook
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _HooksTree_css__WEBPACK_IMPORTED_MODULE_10___default.a.NameValueRow
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("span", {
className: _HooksTree_css__WEBPACK_IMPORTED_MODULE_10___default.a.TruncationIndicator
}, "...")));
}
var isCustomHook = subHooks.length > 0;
var type = _typeof(value);
var displayValue;
var isComplexDisplayValue = false; // Format data for display to mimic the props/state/context for now.
if (type === 'string') {
displayValue = "\"".concat(value, "\"");
} else if (type === 'boolean') {
displayValue = value ? 'true' : 'false';
} else if (type === 'number') {
displayValue = value;
} else if (value === null) {
displayValue = 'null';
} else if (value === undefined) {
displayValue = null;
} else if (Array.isArray(value)) {
isComplexDisplayValue = true;
displayValue = 'Array';
} else if (type === 'object') {
isComplexDisplayValue = true;
displayValue = 'Object';
}
if (isCustomHook) {
var subHooksView = Array.isArray(subHooks) ? react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(InnerHooksTreeView, {
canEditHooks: canEditHooks,
hooks: subHooks,
id: id,
inspectPath: inspectPath,
path: path.concat(['subHooks'])
}) : react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_KeyValue__WEBPACK_IMPORTED_MODULE_8__["default"], {
depth: 1,
alphaSort: false,
inspectPath: inspectPath,
name: "subHooks",
path: path.concat(['subHooks']),
pathRoot: "hooks",
value: subHooks
});
if (isComplexDisplayValue) {
return react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _HooksTree_css__WEBPACK_IMPORTED_MODULE_10___default.a.Hook
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
ref: contextMenuTriggerRef,
className: _HooksTree_css__WEBPACK_IMPORTED_MODULE_10___default.a.NameValueRow
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_ExpandCollapseToggle__WEBPACK_IMPORTED_MODULE_6__["default"], {
isOpen: isOpen,
setIsOpen: setIsOpen
}), react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("span", {
onClick: toggleIsOpen,
className: name !== '' ? _HooksTree_css__WEBPACK_IMPORTED_MODULE_10___default.a.Name : _HooksTree_css__WEBPACK_IMPORTED_MODULE_10___default.a.NameAnonymous
}, name || 'Anonymous')), react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _HooksTree_css__WEBPACK_IMPORTED_MODULE_10___default.a.Children,
hidden: !isOpen
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_KeyValue__WEBPACK_IMPORTED_MODULE_8__["default"], {
depth: 1,
alphaSort: false,
inspectPath: inspectPath,
name: "DebugValue",
path: path.concat(['value']),
pathRoot: "hooks",
value: value
}), subHooksView));
} else {
return react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _HooksTree_css__WEBPACK_IMPORTED_MODULE_10___default.a.Hook
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
ref: contextMenuTriggerRef,
className: _HooksTree_css__WEBPACK_IMPORTED_MODULE_10___default.a.NameValueRow
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_ExpandCollapseToggle__WEBPACK_IMPORTED_MODULE_6__["default"], {
isOpen: isOpen,
setIsOpen: setIsOpen
}), react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("span", {
onClick: toggleIsOpen,
className: name !== '' ? _HooksTree_css__WEBPACK_IMPORTED_MODULE_10___default.a.Name : _HooksTree_css__WEBPACK_IMPORTED_MODULE_10___default.a.NameAnonymous
}, name || 'Anonymous'), ' ', react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("span", {
className: _HooksTree_css__WEBPACK_IMPORTED_MODULE_10___default.a.Value,
onClick: toggleIsOpen
}, displayValue)), react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _HooksTree_css__WEBPACK_IMPORTED_MODULE_10___default.a.Children,
hidden: !isOpen
}, subHooksView));
}
} else {
var overrideValueFn = null; // TODO Maybe read editable value from debug hook?
if (canEditHooks && isStateEditable) {
overrideValueFn = function overrideValueFn(absolutePath, newValue) {
var rendererID = store.getRendererIDForElement(id);
if (rendererID !== null) {
bridge.send('overrideHookState', {
id: id,
hookID: hookID,
// Hooks override function expects a relative path for the specified hook (id),
// starting with its id within the (flat) hooks list structure.
// This relative path does not include the fake tree structure DevTools uses for display,
// so it's important that we remove that part of the path before sending the update.
path: absolutePath.slice(path.length + 1),
rendererID: rendererID,
value: newValue
});
}
};
}
if (isComplexDisplayValue) {
return react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _HooksTree_css__WEBPACK_IMPORTED_MODULE_10___default.a.Hook
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_KeyValue__WEBPACK_IMPORTED_MODULE_8__["default"], {
depth: 1,
alphaSort: false,
inspectPath: inspectPath,
name: name,
overrideValueFn: overrideValueFn,
path: path.concat(['value']),
pathRoot: "hooks",
value: value
}));
} else {
return react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _HooksTree_css__WEBPACK_IMPORTED_MODULE_10___default.a.Hook
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
ref: contextMenuTriggerRef,
className: _HooksTree_css__WEBPACK_IMPORTED_MODULE_10___default.a.NameValueRow
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("span", {
className: _HooksTree_css__WEBPACK_IMPORTED_MODULE_10___default.a.ExpandCollapseToggleSpacer
}), react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("span", {
className: typeof overrideValueFn === 'function' ? _HooksTree_css__WEBPACK_IMPORTED_MODULE_10___default.a.EditableName : _HooksTree_css__WEBPACK_IMPORTED_MODULE_10___default.a.Name
}, name), typeof overrideValueFn === 'function' ? react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_EditableValue__WEBPACK_IMPORTED_MODULE_5__["default"], {
overrideValueFn: overrideValueFn,
path: [],
value: value
}) : // $FlowFixMe Cannot create span element because in property children
react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("span", {
className: _HooksTree_css__WEBPACK_IMPORTED_MODULE_10___default.a.Value
}, displayValue)));
}
}
} // $FlowFixMe
/* harmony default export */ __webpack_exports__["default"] = (react__WEBPACK_IMPORTED_MODULE_1___default.a.memo(HooksTreeView));
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/InspectHostNodesToggle.js":
/*!****************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/InspectHostNodesToggle.js ***!
\****************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return InspectHostNodesToggle; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var _Toggle__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../Toggle */ "../react-devtools-shared/src/devtools/views/Toggle.js");
/* harmony import */ var _ButtonIcon__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../ButtonIcon */ "../react-devtools-shared/src/devtools/views/ButtonIcon.js");
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function InspectHostNodesToggle() {
var _useState = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(false),
_useState2 = _slicedToArray(_useState, 2),
isInspecting = _useState2[0],
setIsInspecting = _useState2[1];
var bridge = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_1__["BridgeContext"]);
var handleChange = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (isChecked) {
setIsInspecting(isChecked);
if (isChecked) {
bridge.send('startInspectingNative');
} else {
bridge.send('stopInspectingNative', false);
}
}, [bridge]);
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
var onStopInspectingNative = function onStopInspectingNative() {
return setIsInspecting(false);
};
bridge.addListener('stopInspectingNative', onStopInspectingNative);
return function () {
return bridge.removeListener('stopInspectingNative', onStopInspectingNative);
};
}, [bridge]);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Toggle__WEBPACK_IMPORTED_MODULE_2__["default"], {
onChange: handleChange,
isChecked: isInspecting,
title: "Select an element in the page to inspect it"
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_3__["default"], {
type: "search"
}));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/InspectedElementContext.js":
/*!*****************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/InspectedElementContext.js ***!
\*****************************************************************************************/
/*! exports provided: InspectedElementContext, InspectedElementContextController */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "InspectedElementContext", function() { return InspectedElementContext; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "InspectedElementContextController", function() { return InspectedElementContextController; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ "react-dom");
/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _cache__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../cache */ "../react-devtools-shared/src/devtools/cache.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var react_devtools_shared_src_hydration__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react-devtools-shared/src/hydration */ "../react-devtools-shared/src/hydration.js");
/* harmony import */ var _TreeContext__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./TreeContext */ "../react-devtools-shared/src/devtools/views/Components/TreeContext.js");
/* harmony import */ var react_devtools_shared_src_utils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! react-devtools-shared/src/utils */ "../react-devtools-shared/src/utils.js");
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(source, true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
var InspectedElementContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["createContext"])(null);
InspectedElementContext.displayName = 'InspectedElementContext';
var inProgressRequests = new WeakMap();
var resource = Object(_cache__WEBPACK_IMPORTED_MODULE_2__["createResource"])(function (element) {
var request = inProgressRequests.get(element);
if (request != null) {
return request.promise;
}
var resolveFn = null;
var promise = new Promise(function (resolve) {
resolveFn = resolve;
});
inProgressRequests.set(element, {
promise: promise,
resolveFn: resolveFn
});
return promise;
}, function (element) {
return element;
}, {
useWeakMap: true
});
function InspectedElementContextController(_ref) {
var children = _ref.children;
var bridge = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_3__["BridgeContext"]);
var store = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_3__["StoreContext"]);
var storeAsGlobalCount = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(1); // Ask the backend to store the value at the specified path as a global variable.
var storeAsGlobal = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (id, path) {
var rendererID = store.getRendererIDForElement(id);
if (rendererID !== null) {
bridge.send('storeAsGlobal', {
count: storeAsGlobalCount.current++,
id: id,
path: path,
rendererID: rendererID
});
}
}, [bridge, store]); // Ask the backend to copy the specified path to the clipboard.
var copyInspectedElementPath = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (id, path) {
var rendererID = store.getRendererIDForElement(id);
if (rendererID !== null) {
bridge.send('copyElementPath', {
id: id,
path: path,
rendererID: rendererID
});
}
}, [bridge, store]); // Ask the backend to fill in a "dehydrated" path; this will result in a "inspectedElement".
var getInspectedElementPath = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (id, path) {
var rendererID = store.getRendererIDForElement(id);
if (rendererID !== null) {
bridge.send('inspectElement', {
id: id,
path: path,
rendererID: rendererID
});
}
}, [bridge, store]);
var getInspectedElement = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (id) {
var element = store.getElementByID(id);
if (element !== null) {
return resource.read(element);
} else {
return null;
}
}, [store]); // It's very important that this context consumes selectedElementID and not inspectedElementID.
// Otherwise the effect that sends the "inspect" message across the bridge-
// would itself be blocked by the same render that suspends (waiting for the data).
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_TreeContext__WEBPACK_IMPORTED_MODULE_5__["TreeStateContext"]),
selectedElementID = _useContext.selectedElementID;
var _useState = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(null),
_useState2 = _slicedToArray(_useState, 2),
currentlyInspectedElement = _useState2[0],
setCurrentlyInspectedElement = _useState2[1]; // This effect handler invalidates the suspense cache and schedules rendering updates with React.
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
var onInspectedElement = function onInspectedElement(data) {
var id = data.id;
var element;
switch (data.type) {
case 'no-change':
case 'not-found':
// No-op
break;
case 'hydrated-path':
// Merge new data into previous object and invalidate cache
element = store.getElementByID(id);
if (element !== null) {
if (currentlyInspectedElement != null) {
var _value = hydrateHelper(data.value, data.path);
var _inspectedElement2 = _objectSpread({}, currentlyInspectedElement);
Object(react_devtools_shared_src_hydration__WEBPACK_IMPORTED_MODULE_4__["fillInPath"])(_inspectedElement2, data.value, data.path, _value);
resource.write(element, _inspectedElement2); // Schedule update with React if the curently-selected element has been invalidated.
if (id === selectedElementID) {
setCurrentlyInspectedElement(_inspectedElement2);
}
}
}
break;
case 'full-data':
var _ref2 = data.value,
canEditFunctionProps = _ref2.canEditFunctionProps,
canEditHooks = _ref2.canEditHooks,
canToggleSuspense = _ref2.canToggleSuspense,
canViewSource = _ref2.canViewSource,
hasLegacyContext = _ref2.hasLegacyContext,
source = _ref2.source,
type = _ref2.type,
owners = _ref2.owners,
context = _ref2.context,
hooks = _ref2.hooks,
props = _ref2.props,
state = _ref2.state;
var _inspectedElement = {
canEditFunctionProps: canEditFunctionProps,
canEditHooks: canEditHooks,
canToggleSuspense: canToggleSuspense,
canViewSource: canViewSource,
hasLegacyContext: hasLegacyContext,
id: id,
source: source,
type: type,
owners: owners === null ? null : owners.map(function (owner) {
var _separateDisplayNameA = Object(react_devtools_shared_src_utils__WEBPACK_IMPORTED_MODULE_6__["separateDisplayNameAndHOCs"])(owner.displayName, owner.type),
_separateDisplayNameA2 = _slicedToArray(_separateDisplayNameA, 2),
displayName = _separateDisplayNameA2[0],
hocDisplayNames = _separateDisplayNameA2[1];
return _objectSpread({}, owner, {
displayName: displayName,
hocDisplayNames: hocDisplayNames
});
}),
context: hydrateHelper(context),
hooks: hydrateHelper(hooks),
props: hydrateHelper(props),
state: hydrateHelper(state)
};
element = store.getElementByID(id);
if (element !== null) {
var request = inProgressRequests.get(element);
if (request != null) {
inProgressRequests.delete(element);
Object(react_dom__WEBPACK_IMPORTED_MODULE_1__["unstable_batchedUpdates"])(function () {
request.resolveFn(_inspectedElement);
setCurrentlyInspectedElement(_inspectedElement);
});
} else {
resource.write(element, _inspectedElement); // Schedule update with React if the curently-selected element has been invalidated.
if (id === selectedElementID) {
setCurrentlyInspectedElement(_inspectedElement);
}
}
}
break;
default:
break;
}
};
bridge.addListener('inspectedElement', onInspectedElement);
return function () {
return bridge.removeListener('inspectedElement', onInspectedElement);
};
}, [bridge, currentlyInspectedElement, selectedElementID, store]); // This effect handler polls for updates on the currently selected element.
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
if (selectedElementID === null) {
return function () {};
}
var rendererID = store.getRendererIDForElement(selectedElementID);
var timeoutID = null;
var sendRequest = function sendRequest() {
timeoutID = null;
if (rendererID !== null) {
bridge.send('inspectElement', {
id: selectedElementID,
rendererID: rendererID
});
}
}; // Send the initial inspection request.
// We'll poll for an update in the response handler below.
sendRequest();
var onInspectedElement = function onInspectedElement(data) {
// If this is the element we requested, wait a little bit and then ask for another update.
if (data.id === selectedElementID) {
switch (data.type) {
case 'no-change':
case 'full-data':
case 'hydrated-path':
if (timeoutID !== null) {
clearTimeout(timeoutID);
}
timeoutID = setTimeout(sendRequest, 1000);
break;
default:
break;
}
}
};
bridge.addListener('inspectedElement', onInspectedElement);
return function () {
bridge.removeListener('inspectedElement', onInspectedElement);
if (timeoutID !== null) {
clearTimeout(timeoutID);
}
};
}, [bridge, selectedElementID, store]);
var value = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
return {
copyInspectedElementPath: copyInspectedElementPath,
getInspectedElement: getInspectedElement,
getInspectedElementPath: getInspectedElementPath,
storeAsGlobal: storeAsGlobal
};
}, // InspectedElement is used to invalidate the cache and schedule an update with React.
[copyInspectedElementPath, currentlyInspectedElement, getInspectedElement, getInspectedElementPath, storeAsGlobal]);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(InspectedElementContext.Provider, {
value: value
}, children);
}
function hydrateHelper(dehydratedData, path) {
if (dehydratedData !== null) {
var cleaned = dehydratedData.cleaned,
data = dehydratedData.data,
unserializable = dehydratedData.unserializable;
if (path) {
var length = path.length;
if (length > 0) {
// Hydration helper requires full paths, but inspection dehydrates with relative paths.
// In that event it's important that we adjust the "cleaned" paths to match.
cleaned = cleaned.map(function (cleanedPath) {
return cleanedPath.slice(length);
});
unserializable = unserializable.map(function (unserializablePath) {
return unserializablePath.slice(length);
});
}
}
return Object(react_devtools_shared_src_hydration__WEBPACK_IMPORTED_MODULE_4__["hydrate"])(data, cleaned, unserializable);
} else {
return null;
}
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/InspectedElementTree.css":
/*!***************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/InspectedElementTree.css ***!
\***************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./InspectedElementTree.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/InspectedElementTree.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/InspectedElementTree.js":
/*!**************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/InspectedElementTree.js ***!
\**************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return InspectedElementTree; });
/* harmony import */ var clipboard_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! clipboard-js */ "../../node_modules/clipboard-js/clipboard.js");
/* harmony import */ var clipboard_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(clipboard_js__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _Button__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../Button */ "../react-devtools-shared/src/devtools/views/Button.js");
/* harmony import */ var _ButtonIcon__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../ButtonIcon */ "../react-devtools-shared/src/devtools/views/ButtonIcon.js");
/* harmony import */ var _KeyValue__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./KeyValue */ "../react-devtools-shared/src/devtools/views/Components/KeyValue.js");
/* harmony import */ var _EditableName__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./EditableName */ "../react-devtools-shared/src/devtools/views/Components/EditableName.js");
/* harmony import */ var _EditableValue__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./EditableValue */ "../react-devtools-shared/src/devtools/views/Components/EditableValue.js");
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../utils */ "../react-devtools-shared/src/devtools/views/utils.js");
/* harmony import */ var _InspectedElementTree_css__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./InspectedElementTree.css */ "../react-devtools-shared/src/devtools/views/Components/InspectedElementTree.css");
/* harmony import */ var _InspectedElementTree_css__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_InspectedElementTree_css__WEBPACK_IMPORTED_MODULE_8__);
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function InspectedElementTree(_ref) {
var data = _ref.data,
inspectPath = _ref.inspectPath,
label = _ref.label,
overrideValueFn = _ref.overrideValueFn,
pathRoot = _ref.pathRoot,
_ref$canAddEntries = _ref.canAddEntries,
canAddEntries = _ref$canAddEntries === void 0 ? false : _ref$canAddEntries,
_ref$showWhenEmpty = _ref.showWhenEmpty,
showWhenEmpty = _ref$showWhenEmpty === void 0 ? false : _ref$showWhenEmpty;
var entries = data != null ? Object.entries(data) : null;
if (entries !== null) {
entries.sort(_utils__WEBPACK_IMPORTED_MODULE_7__["alphaSortEntries"]);
}
var _useState = Object(react__WEBPACK_IMPORTED_MODULE_1__["useState"])(0),
_useState2 = _slicedToArray(_useState, 2),
newPropKey = _useState2[0],
setNewPropKey = _useState2[1];
var _useState3 = Object(react__WEBPACK_IMPORTED_MODULE_1__["useState"])(''),
_useState4 = _slicedToArray(_useState3, 2),
newPropName = _useState4[0],
setNewPropName = _useState4[1];
var isEmpty = entries === null || entries.length === 0;
var handleCopy = Object(react__WEBPACK_IMPORTED_MODULE_1__["useCallback"])(function () {
return Object(clipboard_js__WEBPACK_IMPORTED_MODULE_0__["copy"])(Object(_utils__WEBPACK_IMPORTED_MODULE_7__["serializeDataForCopy"])(data));
}, [data]);
var handleNewEntryValue = Object(react__WEBPACK_IMPORTED_MODULE_1__["useCallback"])(function (name, value) {
if (!newPropName) {
return;
}
setNewPropName('');
setNewPropKey(function (key) {
return key + 1;
});
if (typeof overrideValueFn === 'function') {
overrideValueFn(name, value);
}
}, [newPropName, overrideValueFn]);
if (isEmpty && !showWhenEmpty && !canAddEntries) {
return null;
} else {
return react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _InspectedElementTree_css__WEBPACK_IMPORTED_MODULE_8___default.a.InspectedElementTree
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _InspectedElementTree_css__WEBPACK_IMPORTED_MODULE_8___default.a.HeaderRow
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _InspectedElementTree_css__WEBPACK_IMPORTED_MODULE_8___default.a.Header
}, label), !isEmpty && react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_2__["default"], {
onClick: handleCopy,
title: "Copy to clipboard"
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_3__["default"], {
type: "copy"
}))), isEmpty && !canAddEntries && react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _InspectedElementTree_css__WEBPACK_IMPORTED_MODULE_8___default.a.Empty
}, "None"), !isEmpty && entries.map(function (_ref2) {
var _ref3 = _slicedToArray(_ref2, 2),
name = _ref3[0],
value = _ref3[1];
return react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_KeyValue__WEBPACK_IMPORTED_MODULE_4__["default"], {
key: name,
alphaSort: true,
pathRoot: pathRoot,
depth: 1,
inspectPath: inspectPath,
name: name,
overrideValueFn: overrideValueFn,
path: [name],
value: value
});
}), canAddEntries && react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _InspectedElementTree_css__WEBPACK_IMPORTED_MODULE_8___default.a.AddEntry,
key: newPropKey
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_EditableName__WEBPACK_IMPORTED_MODULE_5__["default"], {
autoFocus: newPropKey > 0,
overrideNameFn: setNewPropName
}), ":\xA0", react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_EditableValue__WEBPACK_IMPORTED_MODULE_6__["default"], {
className: _InspectedElementTree_css__WEBPACK_IMPORTED_MODULE_8___default.a.EditableValue,
overrideValueFn: handleNewEntryValue,
path: [newPropName],
value: ''
})));
}
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/KeyValue.css":
/*!***************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/KeyValue.css ***!
\***************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./KeyValue.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/KeyValue.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/KeyValue.js":
/*!**************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/KeyValue.js ***!
\**************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return KeyValue; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _EditableValue__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./EditableValue */ "../react-devtools-shared/src/devtools/views/Components/EditableValue.js");
/* harmony import */ var _ExpandCollapseToggle__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./ExpandCollapseToggle */ "../react-devtools-shared/src/devtools/views/Components/ExpandCollapseToggle.js");
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../utils */ "../react-devtools-shared/src/devtools/views/utils.js");
/* harmony import */ var _hydration__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../hydration */ "../react-devtools-shared/src/hydration.js");
/* harmony import */ var _ContextMenu_useContextMenu__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../ContextMenu/useContextMenu */ "../react-devtools-shared/src/devtools/ContextMenu/useContextMenu.js");
/* harmony import */ var _KeyValue_css__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./KeyValue.css */ "../react-devtools-shared/src/devtools/views/Components/KeyValue.css");
/* harmony import */ var _KeyValue_css__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_KeyValue_css__WEBPACK_IMPORTED_MODULE_6__);
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }
function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function KeyValue(_ref) {
var alphaSort = _ref.alphaSort,
depth = _ref.depth,
inspectPath = _ref.inspectPath,
isReadOnly = _ref.isReadOnly,
hidden = _ref.hidden,
name = _ref.name,
overrideValueFn = _ref.overrideValueFn,
path = _ref.path,
pathRoot = _ref.pathRoot,
value = _ref.value;
var _useState = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(false),
_useState2 = _slicedToArray(_useState, 2),
isOpen = _useState2[0],
setIsOpen = _useState2[1];
var prevIsOpenRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(isOpen);
var contextMenuTriggerRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(null);
var isInspectable = value !== null && _typeof(value) === 'object' && value[_hydration__WEBPACK_IMPORTED_MODULE_4__["meta"].inspectable] && value[_hydration__WEBPACK_IMPORTED_MODULE_4__["meta"].size] !== 0;
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
if (isInspectable && isOpen && !prevIsOpenRef.current && typeof inspectPath === 'function') {
inspectPath(path);
}
prevIsOpenRef.current = isOpen;
}, [inspectPath, isInspectable, isOpen, path]);
var toggleIsOpen = function toggleIsOpen() {
return setIsOpen(function (prevIsOpen) {
return !prevIsOpen;
});
};
Object(_ContextMenu_useContextMenu__WEBPACK_IMPORTED_MODULE_5__["default"])({
data: {
path: [pathRoot].concat(_toConsumableArray(path)),
type: value !== null && _typeof(value) === 'object' && hasOwnProperty.call(value, _hydration__WEBPACK_IMPORTED_MODULE_4__["meta"].type) ? value[_hydration__WEBPACK_IMPORTED_MODULE_4__["meta"].type] : _typeof(value)
},
id: 'SelectedElement',
ref: contextMenuTriggerRef
});
var dataType = _typeof(value);
var isSimpleType = dataType === 'number' || dataType === 'string' || dataType === 'boolean' || value == null;
var style = {
paddingLeft: "".concat((depth - 1) * 0.75, "rem")
};
var children = null;
if (isSimpleType) {
var displayValue = value;
if (dataType === 'string') {
displayValue = "\"".concat(value, "\"");
} else if (dataType === 'boolean') {
displayValue = value ? 'true' : 'false';
} else if (value === null) {
displayValue = 'null';
} else if (value === undefined) {
displayValue = 'undefined';
}
var isEditable = typeof overrideValueFn === 'function' && !isReadOnly;
children = react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
key: "root",
path: path,
className: _KeyValue_css__WEBPACK_IMPORTED_MODULE_6___default.a.Item,
hidden: hidden,
ref: contextMenuTriggerRef,
style: style
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _KeyValue_css__WEBPACK_IMPORTED_MODULE_6___default.a.ExpandCollapseToggleSpacer
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("span", {
className: isEditable ? _KeyValue_css__WEBPACK_IMPORTED_MODULE_6___default.a.EditableName : _KeyValue_css__WEBPACK_IMPORTED_MODULE_6___default.a.Name
}, name), isEditable ? react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_EditableValue__WEBPACK_IMPORTED_MODULE_1__["default"], {
overrideValueFn: overrideValueFn,
path: path,
value: value
}) : react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("span", {
className: _KeyValue_css__WEBPACK_IMPORTED_MODULE_6___default.a.Value
}, displayValue));
} else if (hasOwnProperty.call(value, _hydration__WEBPACK_IMPORTED_MODULE_4__["meta"].type) && !hasOwnProperty.call(value, _hydration__WEBPACK_IMPORTED_MODULE_4__["meta"].unserializable)) {
children = react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
ref: contextMenuTriggerRef,
key: "root",
className: _KeyValue_css__WEBPACK_IMPORTED_MODULE_6___default.a.Item,
hidden: hidden,
style: style
}, isInspectable ? react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ExpandCollapseToggle__WEBPACK_IMPORTED_MODULE_2__["default"], {
isOpen: isOpen,
setIsOpen: setIsOpen
}) : react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _KeyValue_css__WEBPACK_IMPORTED_MODULE_6___default.a.ExpandCollapseToggleSpacer
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("span", {
className: _KeyValue_css__WEBPACK_IMPORTED_MODULE_6___default.a.Name,
onClick: isInspectable ? toggleIsOpen : undefined
}, name), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("span", {
className: _KeyValue_css__WEBPACK_IMPORTED_MODULE_6___default.a.Value,
onClick: isInspectable ? toggleIsOpen : undefined
}, Object(_utils__WEBPACK_IMPORTED_MODULE_3__["getMetaValueLabel"])(value)));
} else {
if (Array.isArray(value)) {
var hasChildren = value.length > 0;
var displayName = Object(_utils__WEBPACK_IMPORTED_MODULE_3__["getMetaValueLabel"])(value);
children = value.map(function (innerValue, index) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(KeyValue, {
key: index,
alphaSort: alphaSort,
depth: depth + 1,
inspectPath: inspectPath,
isReadOnly: isReadOnly,
hidden: hidden || !isOpen,
name: index,
overrideValueFn: overrideValueFn,
path: path.concat(index),
pathRoot: pathRoot,
value: value[index]
});
});
children.unshift(react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
ref: contextMenuTriggerRef,
key: "".concat(depth, "-root"),
className: _KeyValue_css__WEBPACK_IMPORTED_MODULE_6___default.a.Item,
hidden: hidden,
style: style
}, hasChildren ? react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ExpandCollapseToggle__WEBPACK_IMPORTED_MODULE_2__["default"], {
isOpen: isOpen,
setIsOpen: setIsOpen
}) : react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _KeyValue_css__WEBPACK_IMPORTED_MODULE_6___default.a.ExpandCollapseToggleSpacer
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("span", {
className: _KeyValue_css__WEBPACK_IMPORTED_MODULE_6___default.a.Name,
onClick: hasChildren ? toggleIsOpen : undefined
}, name), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("span", {
className: _KeyValue_css__WEBPACK_IMPORTED_MODULE_6___default.a.Value,
onClick: hasChildren ? toggleIsOpen : undefined
}, displayName)));
} else {
// TRICKY
// It's important to use Object.entries() rather than Object.keys()
// because of the hidden meta Symbols used for hydration and unserializable values.
var entries = Object.entries(value);
if (alphaSort) {
entries.sort(_utils__WEBPACK_IMPORTED_MODULE_3__["alphaSortEntries"]);
}
var _hasChildren = entries.length > 0;
var _displayName = Object(_utils__WEBPACK_IMPORTED_MODULE_3__["getMetaValueLabel"])(value);
var areChildrenReadOnly = isReadOnly || !!value[_hydration__WEBPACK_IMPORTED_MODULE_4__["meta"].readonly];
children = entries.map(function (_ref2) {
var _ref3 = _slicedToArray(_ref2, 2),
key = _ref3[0],
keyValue = _ref3[1];
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(KeyValue, {
key: key,
alphaSort: alphaSort,
depth: depth + 1,
inspectPath: inspectPath,
isReadOnly: areChildrenReadOnly,
hidden: hidden || !isOpen,
name: key,
overrideValueFn: overrideValueFn,
path: path.concat(key),
pathRoot: pathRoot,
value: keyValue
});
});
children.unshift(react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
ref: contextMenuTriggerRef,
key: "".concat(depth, "-root"),
className: _KeyValue_css__WEBPACK_IMPORTED_MODULE_6___default.a.Item,
hidden: hidden,
style: style
}, _hasChildren ? react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ExpandCollapseToggle__WEBPACK_IMPORTED_MODULE_2__["default"], {
isOpen: isOpen,
setIsOpen: setIsOpen
}) : react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _KeyValue_css__WEBPACK_IMPORTED_MODULE_6___default.a.ExpandCollapseToggleSpacer
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("span", {
className: _KeyValue_css__WEBPACK_IMPORTED_MODULE_6___default.a.Name,
onClick: _hasChildren ? toggleIsOpen : undefined
}, name), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("span", {
className: _KeyValue_css__WEBPACK_IMPORTED_MODULE_6___default.a.Value,
onClick: _hasChildren ? toggleIsOpen : undefined
}, _displayName)));
}
}
return children;
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/AutoSizeInput.css":
/*!**************************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/AutoSizeInput.css ***!
\**************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../../node_modules/css-loader??ref--5-1!./AutoSizeInput.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/AutoSizeInput.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/AutoSizeInput.js":
/*!*************************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/AutoSizeInput.js ***!
\*************************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return AutoSizeInput; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _AutoSizeInput_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./AutoSizeInput.css */ "../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/AutoSizeInput.css");
/* harmony import */ var _AutoSizeInput_css__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_AutoSizeInput_css__WEBPACK_IMPORTED_MODULE_1__);
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function AutoSizeInput(_ref) {
var className = _ref.className,
onFocus = _ref.onFocus,
placeholder = _ref.placeholder,
value = _ref.value,
rest = _objectWithoutProperties(_ref, ["className", "onFocus", "placeholder", "value"]);
var hiddenDivRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(null);
var inputRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(null);
var onFocusWrapper = function onFocusWrapper(event) {
if (inputRef.current !== null) {
inputRef.current.selectionStart = 0;
inputRef.current.selectionEnd = value.length;
}
if (typeof onFocus === 'function') {
onFocus(event);
}
}; // Copy text styles from <input> to hidden sizing <div>
Object(react__WEBPACK_IMPORTED_MODULE_0__["useLayoutEffect"])(function () {
if (typeof window.getComputedStyle !== 'function' || inputRef.current === null) {
return;
}
var inputStyle = window.getComputedStyle(inputRef.current);
if (!inputStyle) {
return;
}
if (hiddenDivRef.current !== null) {
var divStyle = hiddenDivRef.current.style;
divStyle.border = inputStyle.border;
divStyle.fontFamily = inputStyle.fontFamily;
divStyle.fontSize = inputStyle.fontSize;
divStyle.fontStyle = inputStyle.fontStyle;
divStyle.fontWeight = inputStyle.fontWeight;
divStyle.letterSpacing = inputStyle.letterSpacing;
divStyle.padding = inputStyle.padding;
}
}, []); // Resize input any time text changes
Object(react__WEBPACK_IMPORTED_MODULE_0__["useLayoutEffect"])(function () {
if (hiddenDivRef.current === null) {
return;
}
var scrollWidth = hiddenDivRef.current.getBoundingClientRect().width;
if (!scrollWidth) {
return;
} // Adding an extra pixel avoids a slight horizontal scroll when changing text selection/cursor.
// Not sure why this is, but the old DevTools did a similar thing.
var targetWidth = Math.ceil(scrollWidth) + 1;
if (inputRef.current !== null) {
inputRef.current.style.width = "".concat(targetWidth, "px");
}
}, [value]);
var isEmpty = value === '' || value === '""';
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("input", _extends({
ref: inputRef,
className: "".concat(className ? className : '', " ").concat(_AutoSizeInput_css__WEBPACK_IMPORTED_MODULE_1___default.a.Input),
onFocus: onFocusWrapper,
placeholder: placeholder,
value: isEmpty ? '' : value
}, rest)), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
ref: hiddenDivRef,
className: _AutoSizeInput_css__WEBPACK_IMPORTED_MODULE_1___default.a.HiddenDiv
}, isEmpty ? placeholder : value));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/LayoutViewer.css":
/*!*************************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/LayoutViewer.css ***!
\*************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../../node_modules/css-loader??ref--5-1!./LayoutViewer.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/LayoutViewer.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/LayoutViewer.js":
/*!************************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/LayoutViewer.js ***!
\************************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return LayoutViewer; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _LayoutViewer_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./LayoutViewer.css */ "../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/LayoutViewer.css");
/* harmony import */ var _LayoutViewer_css__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_LayoutViewer_css__WEBPACK_IMPORTED_MODULE_1__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function LayoutViewer(_ref) {
var id = _ref.id,
layout = _ref.layout;
var height = layout.height,
margin = layout.margin,
padding = layout.padding,
y = layout.y,
width = layout.width,
x = layout.x;
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _LayoutViewer_css__WEBPACK_IMPORTED_MODULE_1___default.a.LayoutViewer
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _LayoutViewer_css__WEBPACK_IMPORTED_MODULE_1___default.a.Header
}, "layout"), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _LayoutViewer_css__WEBPACK_IMPORTED_MODULE_1___default.a.DashedBox
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _LayoutViewer_css__WEBPACK_IMPORTED_MODULE_1___default.a.LabelRow
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("label", {
className: _LayoutViewer_css__WEBPACK_IMPORTED_MODULE_1___default.a.Label
}, "margin"), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("label", null, margin.top || '-')), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _LayoutViewer_css__WEBPACK_IMPORTED_MODULE_1___default.a.BoxRow
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("label", null, margin.left || '-'), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _LayoutViewer_css__WEBPACK_IMPORTED_MODULE_1___default.a.SolidBox
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _LayoutViewer_css__WEBPACK_IMPORTED_MODULE_1___default.a.LabelRow
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("label", {
className: _LayoutViewer_css__WEBPACK_IMPORTED_MODULE_1___default.a.Label
}, "padding"), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("label", null, padding.top || '-')), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _LayoutViewer_css__WEBPACK_IMPORTED_MODULE_1___default.a.BoxRow
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("label", null, padding.left || '-'), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _LayoutViewer_css__WEBPACK_IMPORTED_MODULE_1___default.a.DashedBox
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _LayoutViewer_css__WEBPACK_IMPORTED_MODULE_1___default.a.LabelRow
}, format(width), " x ", format(height), " (", format(x), ", ", format(y), ")")), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("label", null, padding.right || '-')), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("label", null, padding.bottom || '-')), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("label", null, margin.right || '-')), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("label", null, margin.bottom || '-')));
}
function format(number) {
if (Math.round(number) === number) {
return number;
} else {
return number.toFixed(1);
}
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/StyleEditor.css":
/*!************************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/StyleEditor.css ***!
\************************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../../node_modules/css-loader??ref--5-1!./StyleEditor.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/StyleEditor.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/StyleEditor.js":
/*!***********************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/StyleEditor.js ***!
\***********************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return StyleEditor; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ "react-dom");
/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var clipboard_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! clipboard-js */ "../../node_modules/clipboard-js/clipboard.js");
/* harmony import */ var clipboard_js__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(clipboard_js__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react_devtools_shared_src_devtools_views_context__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react-devtools-shared/src/devtools/views/context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var _Button__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../Button */ "../react-devtools-shared/src/devtools/views/Button.js");
/* harmony import */ var _ButtonIcon__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../ButtonIcon */ "../react-devtools-shared/src/devtools/views/ButtonIcon.js");
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../utils */ "../react-devtools-shared/src/devtools/views/utils.js");
/* harmony import */ var _AutoSizeInput__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./AutoSizeInput */ "../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/AutoSizeInput.js");
/* harmony import */ var _StyleEditor_css__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./StyleEditor.css */ "../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/StyleEditor.css");
/* harmony import */ var _StyleEditor_css__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_StyleEditor_css__WEBPACK_IMPORTED_MODULE_8__);
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../../utils */ "../react-devtools-shared/src/devtools/utils.js");
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function StyleEditor(_ref) {
var id = _ref.id,
style = _ref.style;
var bridge = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(react_devtools_shared_src_devtools_views_context__WEBPACK_IMPORTED_MODULE_3__["BridgeContext"]);
var store = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(react_devtools_shared_src_devtools_views_context__WEBPACK_IMPORTED_MODULE_3__["StoreContext"]);
var changeAttribute = function changeAttribute(oldName, newName, value) {
var rendererID = store.getRendererIDForElement(id);
if (rendererID !== null) {
bridge.send('NativeStyleEditor_renameAttribute', {
id: id,
rendererID: rendererID,
oldName: oldName,
newName: newName,
value: value
});
}
};
var changeValue = function changeValue(name, value) {
var rendererID = store.getRendererIDForElement(id);
if (rendererID !== null) {
bridge.send('NativeStyleEditor_setValue', {
id: id,
rendererID: rendererID,
name: name,
value: value
});
}
};
var keys = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
return Array.from(Object.keys(style));
}, [style]);
var handleCopy = function handleCopy() {
return Object(clipboard_js__WEBPACK_IMPORTED_MODULE_2__["copy"])(Object(_utils__WEBPACK_IMPORTED_MODULE_6__["serializeDataForCopy"])(style));
};
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _StyleEditor_css__WEBPACK_IMPORTED_MODULE_8___default.a.StyleEditor
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _StyleEditor_css__WEBPACK_IMPORTED_MODULE_8___default.a.HeaderRow
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _StyleEditor_css__WEBPACK_IMPORTED_MODULE_8___default.a.Header
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _StyleEditor_css__WEBPACK_IMPORTED_MODULE_8___default.a.Brackets
}, 'style {')), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_4__["default"], {
onClick: handleCopy,
title: "Copy to clipboard"
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_5__["default"], {
type: "copy"
}))), keys.length > 0 && keys.map(function (attribute) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(Row, {
key: attribute,
attribute: attribute,
changeAttribute: changeAttribute,
changeValue: changeValue,
validAttributes: store.nativeStyleEditorValidAttributes,
value: style[attribute]
});
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(NewRow, {
changeAttribute: changeAttribute,
changeValue: changeValue,
validAttributes: store.nativeStyleEditorValidAttributes
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _StyleEditor_css__WEBPACK_IMPORTED_MODULE_8___default.a.Brackets
}, '}'));
}
function NewRow(_ref2) {
var changeAttribute = _ref2.changeAttribute,
changeValue = _ref2.changeValue,
validAttributes = _ref2.validAttributes;
var _useState = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(0),
_useState2 = _slicedToArray(_useState, 2),
key = _useState2[0],
setKey = _useState2[1];
var reset = function reset() {
return setKey(key + 1);
};
var newAttributeRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])('');
var changeAttributeWrapper = function changeAttributeWrapper(oldAttribute, newAttribute, value) {
// Ignore attribute changes until a value has been specified
newAttributeRef.current = newAttribute;
};
var changeValueWrapper = function changeValueWrapper(attribute, value) {
// Blur events should reset/cancel if there's no value or no attribute
if (newAttributeRef.current !== '') {
if (value !== '') {
changeValue(newAttributeRef.current, value);
}
reset();
}
};
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(Row, {
key: key,
attribute: '',
attributePlaceholder: "attribute",
changeAttribute: changeAttributeWrapper,
changeValue: changeValueWrapper,
validAttributes: validAttributes,
value: '',
valuePlaceholder: "value"
});
}
function Row(_ref3) {
var attribute = _ref3.attribute,
attributePlaceholder = _ref3.attributePlaceholder,
changeAttribute = _ref3.changeAttribute,
changeValue = _ref3.changeValue,
validAttributes = _ref3.validAttributes,
value = _ref3.value,
valuePlaceholder = _ref3.valuePlaceholder;
// TODO (RN style editor) Use @reach/combobox to auto-complete attributes.
// The list of valid attributes would need to be injected by RN backend,
// which would need to require them from ReactNativeViewViewConfig "validAttributes.style" keys.
// This would need to degrade gracefully for react-native-web,
// althoguh we could let it also inject a custom set of whitelisted attributes.
var _useState3 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(attribute),
_useState4 = _slicedToArray(_useState3, 2),
localAttribute = _useState4[0],
setLocalAttribute = _useState4[1];
var _useState5 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(JSON.stringify(value)),
_useState6 = _slicedToArray(_useState5, 2),
localValue = _useState6[0],
setLocalValue = _useState6[1];
var _useState7 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(true),
_useState8 = _slicedToArray(_useState7, 2),
isAttributeValid = _useState8[0],
setIsAttributeValid = _useState8[1];
var _useState9 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(true),
_useState10 = _slicedToArray(_useState9, 2),
isValueValid = _useState10[0],
setIsValueValid = _useState10[1];
var validateAndSetLocalAttribute = function validateAndSetLocalAttribute(newAttribute) {
var isValid = newAttribute === '' || validAttributes === null || validAttributes.indexOf(newAttribute) >= 0;
Object(react_dom__WEBPACK_IMPORTED_MODULE_1__["unstable_batchedUpdates"])(function () {
setLocalAttribute(newAttribute);
setIsAttributeValid(isValid);
});
};
var validateAndSetLocalValue = function validateAndSetLocalValue(newValue) {
var isValid = false;
try {
JSON.parse(Object(_utils__WEBPACK_IMPORTED_MODULE_9__["sanitizeForParse"])(newValue));
isValid = true;
} catch (error) {}
Object(react_dom__WEBPACK_IMPORTED_MODULE_1__["unstable_batchedUpdates"])(function () {
setLocalValue(newValue);
setIsValueValid(isValid);
});
};
var resetAttribute = function resetAttribute() {
setLocalAttribute(attribute);
};
var resetValue = function resetValue() {
setLocalValue(value);
};
var submitValueChange = function submitValueChange() {
if (isAttributeValid && isValueValid) {
var parsedLocalValue = JSON.parse(Object(_utils__WEBPACK_IMPORTED_MODULE_9__["sanitizeForParse"])(localValue));
if (value !== parsedLocalValue) {
changeValue(attribute, parsedLocalValue);
}
}
};
var submitAttributeChange = function submitAttributeChange() {
if (isAttributeValid && isValueValid) {
if (attribute !== localAttribute) {
changeAttribute(attribute, localAttribute, value);
}
}
};
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _StyleEditor_css__WEBPACK_IMPORTED_MODULE_8___default.a.Row
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(Field, {
className: isAttributeValid ? _StyleEditor_css__WEBPACK_IMPORTED_MODULE_8___default.a.Attribute : _StyleEditor_css__WEBPACK_IMPORTED_MODULE_8___default.a.Invalid,
onChange: validateAndSetLocalAttribute,
onReset: resetAttribute,
onSubmit: submitAttributeChange,
placeholder: attributePlaceholder,
value: localAttribute
}), ":\xA0", react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(Field, {
className: isValueValid ? _StyleEditor_css__WEBPACK_IMPORTED_MODULE_8___default.a.Value : _StyleEditor_css__WEBPACK_IMPORTED_MODULE_8___default.a.Invalid,
onChange: validateAndSetLocalValue,
onReset: resetValue,
onSubmit: submitValueChange,
placeholder: valuePlaceholder,
value: localValue
}), ";");
}
function Field(_ref4) {
var className = _ref4.className,
_onChange = _ref4.onChange,
onReset = _ref4.onReset,
onSubmit = _ref4.onSubmit,
placeholder = _ref4.placeholder,
value = _ref4.value;
var onKeyDown = function onKeyDown(event) {
switch (event.key) {
case 'Enter':
onSubmit();
break;
case 'Escape':
onReset();
break;
case 'ArrowDown':
case 'ArrowLeft':
case 'ArrowRight':
case 'ArrowUp':
event.stopPropagation();
break;
default:
break;
}
};
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_AutoSizeInput__WEBPACK_IMPORTED_MODULE_7__["default"], {
className: "".concat(className, " ").concat(_StyleEditor_css__WEBPACK_IMPORTED_MODULE_8___default.a.Input),
onBlur: onSubmit,
onChange: function onChange(event) {
return _onChange(event.target.value);
},
onKeyDown: onKeyDown,
placeholder: placeholder,
value: value
});
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/context.js":
/*!*******************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/context.js ***!
\*******************************************************************************************/
/*! exports provided: NativeStyleContext, NativeStyleContextController */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "NativeStyleContext", function() { return NativeStyleContext; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "NativeStyleContextController", function() { return NativeStyleContextController; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ "react-dom");
/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var react_devtools_shared_src_devtools_cache__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-devtools-shared/src/devtools/cache */ "../react-devtools-shared/src/devtools/cache.js");
/* harmony import */ var react_devtools_shared_src_devtools_views_context__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react-devtools-shared/src/devtools/views/context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var _TreeContext__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../TreeContext */ "../react-devtools-shared/src/devtools/views/Components/TreeContext.js");
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
var NativeStyleContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["createContext"])(null);
NativeStyleContext.displayName = 'NativeStyleContext';
var inProgressRequests = new WeakMap();
var resource = Object(react_devtools_shared_src_devtools_cache__WEBPACK_IMPORTED_MODULE_2__["createResource"])(function (element) {
var request = inProgressRequests.get(element);
if (request != null) {
return request.promise;
}
var resolveFn = null;
var promise = new Promise(function (resolve) {
resolveFn = resolve;
});
inProgressRequests.set(element, {
promise: promise,
resolveFn: resolveFn
});
return promise;
}, function (element) {
return element;
}, {
useWeakMap: true
});
function NativeStyleContextController(_ref) {
var children = _ref.children;
var bridge = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(react_devtools_shared_src_devtools_views_context__WEBPACK_IMPORTED_MODULE_3__["BridgeContext"]);
var store = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(react_devtools_shared_src_devtools_views_context__WEBPACK_IMPORTED_MODULE_3__["StoreContext"]);
var getStyleAndLayout = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (id) {
var element = store.getElementByID(id);
if (element !== null) {
return resource.read(element);
} else {
return null;
}
}, [store]); // It's very important that this context consumes selectedElementID and not NativeStyleID.
// Otherwise the effect that sends the "inspect" message across the bridge-
// would itself be blocked by the same render that suspends (waiting for the data).
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_TreeContext__WEBPACK_IMPORTED_MODULE_4__["TreeStateContext"]),
selectedElementID = _useContext.selectedElementID;
var _useState = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(null),
_useState2 = _slicedToArray(_useState, 2),
currentStyleAndLayout = _useState2[0],
setCurrentStyleAndLayout = _useState2[1]; // This effect handler invalidates the suspense cache and schedules rendering updates with React.
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
var onStyleAndLayout = function onStyleAndLayout(_ref2) {
var id = _ref2.id,
layout = _ref2.layout,
style = _ref2.style;
var element = store.getElementByID(id);
if (element !== null) {
var _styleAndLayout = {
layout: layout,
style: style
};
var request = inProgressRequests.get(element);
if (request != null) {
inProgressRequests.delete(element);
Object(react_dom__WEBPACK_IMPORTED_MODULE_1__["unstable_batchedUpdates"])(function () {
request.resolveFn(_styleAndLayout);
setCurrentStyleAndLayout(_styleAndLayout);
});
} else {
resource.write(element, _styleAndLayout); // Schedule update with React if the currently-selected element has been invalidated.
if (id === selectedElementID) {
setCurrentStyleAndLayout(_styleAndLayout);
}
}
}
};
bridge.addListener('NativeStyleEditor_styleAndLayout', onStyleAndLayout);
return function () {
return bridge.removeListener('NativeStyleEditor_styleAndLayout', onStyleAndLayout);
};
}, [bridge, currentStyleAndLayout, selectedElementID, store]); // This effect handler polls for updates on the currently selected element.
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
if (selectedElementID === null) {
return function () {};
}
var rendererID = store.getRendererIDForElement(selectedElementID);
var timeoutID = null;
var sendRequest = function sendRequest() {
timeoutID = null;
if (rendererID !== null) {
bridge.send('NativeStyleEditor_measure', {
id: selectedElementID,
rendererID: rendererID
});
}
}; // Send the initial measurement request.
// We'll poll for an update in the response handler below.
sendRequest();
var onStyleAndLayout = function onStyleAndLayout(_ref3) {
var id = _ref3.id;
// If this is the element we requested, wait a little bit and then ask for another update.
if (id === selectedElementID) {
if (timeoutID !== null) {
clearTimeout(timeoutID);
}
timeoutID = setTimeout(sendRequest, 1000);
}
};
bridge.addListener('NativeStyleEditor_styleAndLayout', onStyleAndLayout);
return function () {
bridge.removeListener('NativeStyleEditor_styleAndLayout', onStyleAndLayout);
if (timeoutID !== null) {
clearTimeout(timeoutID);
}
};
}, [bridge, selectedElementID, store]);
var value = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
return {
getStyleAndLayout: getStyleAndLayout
};
}, // NativeStyle is used to invalidate the cache and schedule an update with React.
[currentStyleAndLayout, getStyleAndLayout]);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(NativeStyleContext.Provider, {
value: value
}, children);
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/index.js":
/*!*****************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/index.js ***!
\*****************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return NativeStyleEditorWrapper; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_devtools_shared_src_devtools_views_context__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-devtools-shared/src/devtools/views/context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var react_devtools_shared_src_devtools_views_hooks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-devtools-shared/src/devtools/views/hooks */ "../react-devtools-shared/src/devtools/views/hooks.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./context */ "../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/context.js");
/* harmony import */ var _LayoutViewer__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./LayoutViewer */ "../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/LayoutViewer.js");
/* harmony import */ var _StyleEditor__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./StyleEditor */ "../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/StyleEditor.js");
/* harmony import */ var _TreeContext__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../TreeContext */ "../react-devtools-shared/src/devtools/views/Components/TreeContext.js");
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function NativeStyleEditorWrapper(_) {
var store = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(react_devtools_shared_src_devtools_views_context__WEBPACK_IMPORTED_MODULE_1__["StoreContext"]);
var subscription = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
return {
getCurrentValue: function getCurrentValue() {
return store.supportsNativeStyleEditor;
},
subscribe: function subscribe(callback) {
store.addListener('supportsNativeStyleEditor', callback);
return function () {
store.removeListener('supportsNativeStyleEditor', callback);
};
}
};
}, [store]);
var supportsNativeStyleEditor = Object(react_devtools_shared_src_devtools_views_hooks__WEBPACK_IMPORTED_MODULE_2__["useSubscription"])(subscription);
if (!supportsNativeStyleEditor) {
return null;
}
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(NativeStyleEditor, null);
}
function NativeStyleEditor(_) {
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_3__["NativeStyleContext"]),
getStyleAndLayout = _useContext.getStyleAndLayout;
var _useContext2 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_TreeContext__WEBPACK_IMPORTED_MODULE_6__["TreeStateContext"]),
inspectedElementID = _useContext2.inspectedElementID;
if (inspectedElementID === null) {
return null;
}
var maybeStyleAndLayout = getStyleAndLayout(inspectedElementID);
if (maybeStyleAndLayout === null) {
return null;
}
var layout = maybeStyleAndLayout.layout,
style = maybeStyleAndLayout.style;
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, layout !== null && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_LayoutViewer__WEBPACK_IMPORTED_MODULE_4__["default"], {
id: inspectedElementID,
layout: layout
}), style !== null && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_StyleEditor__WEBPACK_IMPORTED_MODULE_5__["default"], {
id: inspectedElementID,
style: style !== null ? style : {}
}));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/OwnersListContext.js":
/*!***********************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/OwnersListContext.js ***!
\***********************************************************************************/
/*! exports provided: OwnersListContext, OwnersListContextController */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "OwnersListContext", function() { return OwnersListContext; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "OwnersListContextController", function() { return OwnersListContextController; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _cache__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../cache */ "../react-devtools-shared/src/devtools/cache.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var _TreeContext__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./TreeContext */ "../react-devtools-shared/src/devtools/views/Components/TreeContext.js");
/* harmony import */ var react_devtools_shared_src_utils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react-devtools-shared/src/utils */ "../react-devtools-shared/src/utils.js");
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(source, true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
var OwnersListContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["createContext"])(null);
OwnersListContext.displayName = 'OwnersListContext';
var inProgressRequests = new WeakMap();
var resource = Object(_cache__WEBPACK_IMPORTED_MODULE_1__["createResource"])(function (element) {
var request = inProgressRequests.get(element);
if (request != null) {
return request.promise;
}
var resolveFn = null;
var promise = new Promise(function (resolve) {
resolveFn = resolve;
});
inProgressRequests.set(element, {
promise: promise,
resolveFn: resolveFn
});
return promise;
}, function (element) {
return element;
}, {
useWeakMap: true
});
function OwnersListContextController(_ref) {
var children = _ref.children;
var bridge = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_2__["BridgeContext"]);
var store = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_2__["StoreContext"]);
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_TreeContext__WEBPACK_IMPORTED_MODULE_3__["TreeStateContext"]),
ownerID = _useContext.ownerID;
var read = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (id) {
var element = store.getElementByID(id);
if (element !== null) {
return resource.read(element);
} else {
return null;
}
}, [store]);
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
var onOwnersList = function onOwnersList(ownersList) {
var id = ownersList.id;
var element = store.getElementByID(id);
if (element !== null) {
var request = inProgressRequests.get(element);
if (request != null) {
inProgressRequests.delete(element);
request.resolveFn(ownersList.owners === null ? null : ownersList.owners.map(function (owner) {
var _separateDisplayNameA = Object(react_devtools_shared_src_utils__WEBPACK_IMPORTED_MODULE_4__["separateDisplayNameAndHOCs"])(owner.displayName, owner.type),
_separateDisplayNameA2 = _slicedToArray(_separateDisplayNameA, 2),
displayNameWithoutHOCs = _separateDisplayNameA2[0],
hocDisplayNames = _separateDisplayNameA2[1];
return _objectSpread({}, owner, {
displayName: displayNameWithoutHOCs,
hocDisplayNames: hocDisplayNames
});
}));
}
}
};
bridge.addListener('ownersList', onOwnersList);
return function () {
return bridge.removeListener('ownersList', onOwnersList);
};
}, [bridge, store]); // This effect requests an updated owners list any time the selected owner changes
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
if (ownerID !== null) {
var rendererID = store.getRendererIDForElement(ownerID);
if (rendererID !== null) {
bridge.send('getOwnersList', {
id: ownerID,
rendererID: rendererID
});
}
}
return function () {};
}, [bridge, ownerID, store]);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(OwnersListContext.Provider, {
value: read
}, children);
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/OwnersStack.css":
/*!******************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/OwnersStack.css ***!
\******************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./OwnersStack.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/OwnersStack.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/OwnersStack.js":
/*!*****************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/OwnersStack.js ***!
\*****************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return OwnerStack; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _reach_tooltip__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @reach/tooltip */ "../../node_modules/@reach/tooltip/es/index.js");
/* harmony import */ var _reach_menu_button__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @reach/menu-button */ "../../node_modules/@reach/menu-button/es/index.js");
/* harmony import */ var _Button__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../Button */ "../react-devtools-shared/src/devtools/views/Button.js");
/* harmony import */ var _ButtonIcon__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../ButtonIcon */ "../react-devtools-shared/src/devtools/views/ButtonIcon.js");
/* harmony import */ var _Toggle__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../Toggle */ "../react-devtools-shared/src/devtools/views/Toggle.js");
/* harmony import */ var _Badge__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./Badge */ "../react-devtools-shared/src/devtools/views/Components/Badge.js");
/* harmony import */ var _OwnersListContext__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./OwnersListContext */ "../react-devtools-shared/src/devtools/views/Components/OwnersListContext.js");
/* harmony import */ var _TreeContext__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./TreeContext */ "../react-devtools-shared/src/devtools/views/Components/TreeContext.js");
/* harmony import */ var _hooks__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../hooks */ "../react-devtools-shared/src/devtools/views/hooks.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var _OwnersStack_css__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./OwnersStack.css */ "../react-devtools-shared/src/devtools/views/Components/OwnersStack.css");
/* harmony import */ var _OwnersStack_css__WEBPACK_IMPORTED_MODULE_11___default = /*#__PURE__*/__webpack_require__.n(_OwnersStack_css__WEBPACK_IMPORTED_MODULE_11__);
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(source, true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function dialogReducer(state, action) {
switch (action.type) {
case 'UPDATE_OWNER_ID':
var selectedIndex = action.owners.findIndex(function (owner) {
return owner.id === action.ownerID;
});
return {
ownerID: action.ownerID,
owners: action.owners,
selectedIndex: selectedIndex
};
case 'UPDATE_SELECTED_INDEX':
return _objectSpread({}, state, {
selectedIndex: action.selectedIndex
});
default:
throw new Error("Invalid action \"".concat(action.type, "\""));
}
}
function OwnerStack() {
var read = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_OwnersListContext__WEBPACK_IMPORTED_MODULE_7__["OwnersListContext"]);
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_TreeContext__WEBPACK_IMPORTED_MODULE_8__["TreeStateContext"]),
ownerID = _useContext.ownerID;
var treeDispatch = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_TreeContext__WEBPACK_IMPORTED_MODULE_8__["TreeDispatcherContext"]);
var _useReducer = Object(react__WEBPACK_IMPORTED_MODULE_0__["useReducer"])(dialogReducer, {
ownerID: null,
owners: [],
selectedIndex: 0
}),
_useReducer2 = _slicedToArray(_useReducer, 2),
state = _useReducer2[0],
dispatch = _useReducer2[1]; // When an owner is selected, we either need to update the selected index, or we need to fetch a new list of owners.
// We use a reducer here so that we can avoid fetching a new list unless the owner ID has actually changed.
if (ownerID === null) {
dispatch({
type: 'UPDATE_OWNER_ID',
ownerID: null,
owners: []
});
} else if (ownerID !== state.ownerID) {
var isInStore = state.owners.findIndex(function (owner) {
return owner.id === ownerID;
}) >= 0;
dispatch({
type: 'UPDATE_OWNER_ID',
ownerID: ownerID,
owners: isInStore ? state.owners : read(ownerID) || []
});
}
var owners = state.owners,
selectedIndex = state.selectedIndex;
var selectOwner = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (owner) {
if (owner !== null) {
var index = owners.indexOf(owner);
dispatch({
type: 'UPDATE_SELECTED_INDEX',
selectedIndex: index >= 0 ? index : 0
});
treeDispatch({
type: 'SELECT_OWNER',
payload: owner.id
});
} else {
dispatch({
type: 'UPDATE_SELECTED_INDEX',
selectedIndex: 0
});
treeDispatch({
type: 'RESET_OWNER_STACK'
});
}
}, [owners, treeDispatch]);
var _useState = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(0),
_useState2 = _slicedToArray(_useState, 2),
elementsTotalWidth = _useState2[0],
setElementsTotalWidth = _useState2[1];
var elementsBarRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(null);
var isOverflowing = Object(_hooks__WEBPACK_IMPORTED_MODULE_9__["useIsOverflowing"])(elementsBarRef, elementsTotalWidth);
var selectedOwner = owners[selectedIndex];
Object(react__WEBPACK_IMPORTED_MODULE_0__["useLayoutEffect"])(function () {
// If we're already overflowing, then we don't need to re-measure items.
// That's because once the owners stack is open, it can only get larger (by driling in).
// A totally new stack can only be reached by exiting this mode and re-entering it.
if (elementsBarRef.current === null || isOverflowing) {
return function () {};
}
var totalWidth = 0;
for (var i = 0; i < owners.length; i++) {
var element = elementsBarRef.current.children[i];
var computedStyle = getComputedStyle(element);
totalWidth += element.offsetWidth + parseInt(computedStyle.marginLeft, 10) + parseInt(computedStyle.marginRight, 10);
}
setElementsTotalWidth(totalWidth);
}, [elementsBarRef, isOverflowing, owners.length]);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _OwnersStack_css__WEBPACK_IMPORTED_MODULE_11___default.a.OwnerStack
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _OwnersStack_css__WEBPACK_IMPORTED_MODULE_11___default.a.Bar,
ref: elementsBarRef
}, isOverflowing && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(ElementsDropdown, {
owners: owners,
selectedIndex: selectedIndex,
selectOwner: selectOwner
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(BackToOwnerButton, {
owners: owners,
selectedIndex: selectedIndex,
selectOwner: selectOwner
}), selectedOwner != null && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(ElementView, {
owner: selectedOwner,
isSelected: true,
selectOwner: selectOwner
})), !isOverflowing && owners.map(function (owner, index) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(ElementView, {
key: index,
owner: owner,
isSelected: index === selectedIndex,
selectOwner: selectOwner
});
})), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _OwnersStack_css__WEBPACK_IMPORTED_MODULE_11___default.a.VRule
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_3__["default"], {
className: _OwnersStack_css__WEBPACK_IMPORTED_MODULE_11___default.a.IconButton,
onClick: function onClick() {
return selectOwner(null);
},
title: "Back to tree view"
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_4__["default"], {
type: "close"
})));
}
function ElementsDropdown(_ref) {
var owners = _ref.owners,
selectedIndex = _ref.selectedIndex,
selectOwner = _ref.selectOwner;
var store = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_10__["StoreContext"]);
var menuItems = [];
var _loop = function _loop(index) {
var owner = owners[index];
var isInStore = store.containsElement(owner.id);
menuItems.push(react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_reach_menu_button__WEBPACK_IMPORTED_MODULE_2__["MenuItem"], {
key: owner.id,
className: "".concat(_OwnersStack_css__WEBPACK_IMPORTED_MODULE_11___default.a.Component, " ").concat(isInStore ? '' : _OwnersStack_css__WEBPACK_IMPORTED_MODULE_11___default.a.NotInStore),
onSelect: function onSelect() {
return isInStore ? selectOwner(owner) : null;
}
}, owner.displayName, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Badge__WEBPACK_IMPORTED_MODULE_6__["default"], {
className: _OwnersStack_css__WEBPACK_IMPORTED_MODULE_11___default.a.Badge,
hocDisplayNames: owner.hocDisplayNames,
type: owner.type
})));
};
for (var index = owners.length - 1; index >= 0; index--) {
_loop(index);
}
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_reach_menu_button__WEBPACK_IMPORTED_MODULE_2__["Menu"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_reach_menu_button__WEBPACK_IMPORTED_MODULE_2__["MenuButton"], {
className: _OwnersStack_css__WEBPACK_IMPORTED_MODULE_11___default.a.MenuButton
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_reach_tooltip__WEBPACK_IMPORTED_MODULE_1__["default"], {
label: "Open elements dropdown"
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("span", {
className: _OwnersStack_css__WEBPACK_IMPORTED_MODULE_11___default.a.MenuButtonContent,
tabIndex: -1
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_4__["default"], {
type: "more"
})))), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_reach_menu_button__WEBPACK_IMPORTED_MODULE_2__["MenuList"], {
className: _OwnersStack_css__WEBPACK_IMPORTED_MODULE_11___default.a.Modal
}, menuItems));
}
function ElementView(_ref2) {
var isSelected = _ref2.isSelected,
owner = _ref2.owner,
selectOwner = _ref2.selectOwner;
var store = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_10__["StoreContext"]);
var displayName = owner.displayName,
hocDisplayNames = owner.hocDisplayNames,
type = owner.type;
var isInStore = store.containsElement(owner.id);
var handleChange = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function () {
if (isInStore) {
selectOwner(owner);
}
}, [isInStore, selectOwner, owner]);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Toggle__WEBPACK_IMPORTED_MODULE_5__["default"], {
className: "".concat(_OwnersStack_css__WEBPACK_IMPORTED_MODULE_11___default.a.Component, " ").concat(isInStore ? '' : _OwnersStack_css__WEBPACK_IMPORTED_MODULE_11___default.a.NotInStore),
isChecked: isSelected,
onChange: handleChange
}, displayName, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Badge__WEBPACK_IMPORTED_MODULE_6__["default"], {
className: _OwnersStack_css__WEBPACK_IMPORTED_MODULE_11___default.a.Badge,
hocDisplayNames: hocDisplayNames,
type: type
}));
}
function BackToOwnerButton(_ref3) {
var owners = _ref3.owners,
selectedIndex = _ref3.selectedIndex,
selectOwner = _ref3.selectOwner;
var store = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_10__["StoreContext"]);
if (selectedIndex <= 0) {
return null;
}
var owner = owners[selectedIndex - 1];
var isInStore = store.containsElement(owner.id);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_3__["default"], {
className: isInStore ? undefined : _OwnersStack_css__WEBPACK_IMPORTED_MODULE_11___default.a.NotInStore,
onClick: function onClick() {
return isInStore ? selectOwner(owner) : null;
},
title: "Up to ".concat(owner.displayName || 'owner')
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_4__["default"], {
type: "previous"
}));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/SearchInput.css":
/*!******************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/SearchInput.css ***!
\******************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./SearchInput.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/SearchInput.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/SearchInput.js":
/*!*****************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/SearchInput.js ***!
\*****************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return SearchInput; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _TreeContext__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./TreeContext */ "../react-devtools-shared/src/devtools/views/Components/TreeContext.js");
/* harmony import */ var _Button__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../Button */ "../react-devtools-shared/src/devtools/views/Button.js");
/* harmony import */ var _ButtonIcon__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../ButtonIcon */ "../react-devtools-shared/src/devtools/views/ButtonIcon.js");
/* harmony import */ var _Icon__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../Icon */ "../react-devtools-shared/src/devtools/views/Icon.js");
/* harmony import */ var _SearchInput_css__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./SearchInput.css */ "../react-devtools-shared/src/devtools/views/Components/SearchInput.css");
/* harmony import */ var _SearchInput_css__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_SearchInput_css__WEBPACK_IMPORTED_MODULE_5__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function SearchInput(props) {
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_TreeContext__WEBPACK_IMPORTED_MODULE_1__["TreeStateContext"]),
searchIndex = _useContext.searchIndex,
searchResults = _useContext.searchResults,
searchText = _useContext.searchText;
var dispatch = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_TreeContext__WEBPACK_IMPORTED_MODULE_1__["TreeDispatcherContext"]);
var inputRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(null);
var handleTextChange = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (_ref) {
var currentTarget = _ref.currentTarget;
return dispatch({
type: 'SET_SEARCH_TEXT',
payload: currentTarget.value
});
}, [dispatch]);
var resetSearch = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function () {
return dispatch({
type: 'SET_SEARCH_TEXT',
payload: ''
});
}, [dispatch]);
var handleKeyDown = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (event) {
// For convenience, let up/down arrow keys change Tree selection.
switch (event.key) {
case 'ArrowDown':
dispatch({
type: 'SELECT_NEXT_ELEMENT_IN_TREE'
});
event.preventDefault();
break;
case 'ArrowUp':
dispatch({
type: 'SELECT_PREVIOUS_ELEMENT_IN_TREE'
});
event.preventDefault();
break;
default:
break;
}
}, [dispatch]);
var handleInputKeyPress = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (_ref2) {
var key = _ref2.key,
shiftKey = _ref2.shiftKey;
if (key === 'Enter') {
if (shiftKey) {
dispatch({
type: 'GO_TO_PREVIOUS_SEARCH_RESULT'
});
} else {
dispatch({
type: 'GO_TO_NEXT_SEARCH_RESULT'
});
}
}
}, [dispatch]); // Auto-focus search input
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
if (inputRef.current === null) {
return function () {};
}
var handleWindowKey = function handleWindowKey(event) {
var key = event.key,
metaKey = event.metaKey;
if (key === 'f' && metaKey) {
if (inputRef.current !== null) {
inputRef.current.focus();
event.preventDefault();
event.stopPropagation();
}
}
}; // It's important to listen to the ownerDocument to support the browser extension.
// Here we use portals to render individual tabs (e.g. Profiler),
// and the root document might belong to a different window.
var ownerDocument = inputRef.current.ownerDocument;
ownerDocument.addEventListener('keydown', handleWindowKey);
return function () {
return ownerDocument.removeEventListener('keydown', handleWindowKey);
};
}, [inputRef]);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SearchInput_css__WEBPACK_IMPORTED_MODULE_5___default.a.SearchInput
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Icon__WEBPACK_IMPORTED_MODULE_4__["default"], {
className: _SearchInput_css__WEBPACK_IMPORTED_MODULE_5___default.a.InputIcon,
type: "search"
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("input", {
className: _SearchInput_css__WEBPACK_IMPORTED_MODULE_5___default.a.Input,
onChange: handleTextChange,
onKeyDown: handleKeyDown,
onKeyPress: handleInputKeyPress,
placeholder: "Search (text or /regex/)",
ref: inputRef,
value: searchText
}), !!searchText && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("span", {
className: _SearchInput_css__WEBPACK_IMPORTED_MODULE_5___default.a.IndexLabel
}, Math.min(searchIndex + 1, searchResults.length), " |", ' ', searchResults.length), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SearchInput_css__WEBPACK_IMPORTED_MODULE_5___default.a.LeftVRule
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_2__["default"], {
className: _SearchInput_css__WEBPACK_IMPORTED_MODULE_5___default.a.IconButton,
disabled: !searchText,
onClick: function onClick() {
return dispatch({
type: 'GO_TO_PREVIOUS_SEARCH_RESULT'
});
},
title: "Scroll to previous search result"
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_3__["default"], {
type: "up"
})), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_2__["default"], {
className: _SearchInput_css__WEBPACK_IMPORTED_MODULE_5___default.a.IconButton,
disabled: !searchText,
onClick: function onClick() {
return dispatch({
type: 'GO_TO_NEXT_SEARCH_RESULT'
});
},
title: "Scroll to next search result"
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_3__["default"], {
type: "down"
})), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_2__["default"], {
className: _SearchInput_css__WEBPACK_IMPORTED_MODULE_5___default.a.IconButton,
disabled: !searchText,
onClick: resetSearch,
title: "Reset search"
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_3__["default"], {
type: "close"
})));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/SelectedElement.css":
/*!**********************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/SelectedElement.css ***!
\**********************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./SelectedElement.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/SelectedElement.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/SelectedElement.js":
/*!*********************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/SelectedElement.js ***!
\*********************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return SelectedElement; });
/* harmony import */ var clipboard_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! clipboard-js */ "../../node_modules/clipboard-js/clipboard.js");
/* harmony import */ var clipboard_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(clipboard_js__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _TreeContext__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./TreeContext */ "../react-devtools-shared/src/devtools/views/Components/TreeContext.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var _ContextMenu_ContextMenu__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../ContextMenu/ContextMenu */ "../react-devtools-shared/src/devtools/ContextMenu/ContextMenu.js");
/* harmony import */ var _ContextMenu_ContextMenuItem__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../ContextMenu/ContextMenuItem */ "../react-devtools-shared/src/devtools/ContextMenu/ContextMenuItem.js");
/* harmony import */ var _Button__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../Button */ "../react-devtools-shared/src/devtools/views/Button.js");
/* harmony import */ var _ButtonIcon__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../ButtonIcon */ "../react-devtools-shared/src/devtools/views/ButtonIcon.js");
/* harmony import */ var _Icon__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../Icon */ "../react-devtools-shared/src/devtools/views/Icon.js");
/* harmony import */ var _HooksTree__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./HooksTree */ "../react-devtools-shared/src/devtools/views/Components/HooksTree.js");
/* harmony import */ var _ModalDialog__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../ModalDialog */ "../react-devtools-shared/src/devtools/views/ModalDialog.js");
/* harmony import */ var _HocBadges__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./HocBadges */ "../react-devtools-shared/src/devtools/views/Components/HocBadges.js");
/* harmony import */ var _InspectedElementTree__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./InspectedElementTree */ "../react-devtools-shared/src/devtools/views/Components/InspectedElementTree.js");
/* harmony import */ var _InspectedElementContext__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./InspectedElementContext */ "../react-devtools-shared/src/devtools/views/Components/InspectedElementContext.js");
/* harmony import */ var _ViewElementSourceContext__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./ViewElementSourceContext */ "../react-devtools-shared/src/devtools/views/Components/ViewElementSourceContext.js");
/* harmony import */ var _NativeStyleEditor__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./NativeStyleEditor */ "../react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/index.js");
/* harmony import */ var _Toggle__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../Toggle */ "../react-devtools-shared/src/devtools/views/Toggle.js");
/* harmony import */ var _Badge__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ./Badge */ "../react-devtools-shared/src/devtools/views/Components/Badge.js");
/* harmony import */ var react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! react-devtools-shared/src/types */ "../react-devtools-shared/src/types.js");
/* harmony import */ var _SelectedElement_css__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ./SelectedElement.css */ "../react-devtools-shared/src/devtools/views/Components/SelectedElement.css");
/* harmony import */ var _SelectedElement_css__WEBPACK_IMPORTED_MODULE_19___default = /*#__PURE__*/__webpack_require__.n(_SelectedElement_css__WEBPACK_IMPORTED_MODULE_19__);
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }
function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function SelectedElement(_) {
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_1__["useContext"])(_TreeContext__WEBPACK_IMPORTED_MODULE_2__["TreeStateContext"]),
inspectedElementID = _useContext.inspectedElementID;
var dispatch = Object(react__WEBPACK_IMPORTED_MODULE_1__["useContext"])(_TreeContext__WEBPACK_IMPORTED_MODULE_2__["TreeDispatcherContext"]);
var _useContext2 = Object(react__WEBPACK_IMPORTED_MODULE_1__["useContext"])(_ViewElementSourceContext__WEBPACK_IMPORTED_MODULE_14__["default"]),
canViewElementSourceFunction = _useContext2.canViewElementSourceFunction,
viewElementSourceFunction = _useContext2.viewElementSourceFunction;
var bridge = Object(react__WEBPACK_IMPORTED_MODULE_1__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_3__["BridgeContext"]);
var store = Object(react__WEBPACK_IMPORTED_MODULE_1__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_3__["StoreContext"]);
var _useContext3 = Object(react__WEBPACK_IMPORTED_MODULE_1__["useContext"])(_ModalDialog__WEBPACK_IMPORTED_MODULE_10__["ModalDialogContext"]),
modalDialogDispatch = _useContext3.dispatch;
var _useContext4 = Object(react__WEBPACK_IMPORTED_MODULE_1__["useContext"])(_InspectedElementContext__WEBPACK_IMPORTED_MODULE_13__["InspectedElementContext"]),
copyInspectedElementPath = _useContext4.copyInspectedElementPath,
getInspectedElementPath = _useContext4.getInspectedElementPath,
getInspectedElement = _useContext4.getInspectedElement,
storeAsGlobal = _useContext4.storeAsGlobal,
viewInspectedElementPath = _useContext4.viewInspectedElementPath;
var element = inspectedElementID !== null ? store.getElementByID(inspectedElementID) : null;
var inspectedElement = inspectedElementID != null ? getInspectedElement(inspectedElementID) : null;
var highlightElement = Object(react__WEBPACK_IMPORTED_MODULE_1__["useCallback"])(function () {
if (element !== null && inspectedElementID !== null) {
var rendererID = store.getRendererIDForElement(inspectedElementID);
if (rendererID !== null) {
bridge.send('highlightNativeElement', {
displayName: element.displayName,
hideAfterTimeout: true,
id: inspectedElementID,
openNativeElementsPanel: true,
rendererID: rendererID,
scrollIntoView: true
});
}
}
}, [bridge, element, inspectedElementID, store]);
var logElement = Object(react__WEBPACK_IMPORTED_MODULE_1__["useCallback"])(function () {
if (inspectedElementID !== null) {
var rendererID = store.getRendererIDForElement(inspectedElementID);
if (rendererID !== null) {
bridge.send('logElementToConsole', {
id: inspectedElementID,
rendererID: rendererID
});
}
}
}, [bridge, inspectedElementID, store]);
var viewSource = Object(react__WEBPACK_IMPORTED_MODULE_1__["useCallback"])(function () {
if (viewElementSourceFunction != null && inspectedElement !== null) {
viewElementSourceFunction(inspectedElement.id, inspectedElement);
}
}, [inspectedElement, viewElementSourceFunction]); // In some cases (e.g. FB internal usage) the standalone shell might not be able to view the source.
// To detect this case, we defer to an injected helper function (if present).
var canViewSource = inspectedElement !== null && inspectedElement.canViewSource && viewElementSourceFunction !== null && (canViewElementSourceFunction === null || canViewElementSourceFunction(inspectedElement));
var isSuspended = element !== null && element.type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_18__["ElementTypeSuspense"] && inspectedElement != null && inspectedElement.state != null;
var canToggleSuspense = inspectedElement != null && inspectedElement.canToggleSuspense; // TODO (suspense toggle) Would be nice to eventually use a two setState pattern here as well.
var toggleSuspended = Object(react__WEBPACK_IMPORTED_MODULE_1__["useCallback"])(function () {
var nearestSuspenseElement = null;
var currentElement = element;
while (currentElement !== null) {
if (currentElement.type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_18__["ElementTypeSuspense"]) {
nearestSuspenseElement = currentElement;
break;
} else if (currentElement.parentID > 0) {
currentElement = store.getElementByID(currentElement.parentID);
} else {
currentElement = null;
}
} // If we didn't find a Suspense ancestor, we can't suspend.
// Instead we can show a warning to the user.
if (nearestSuspenseElement === null) {
modalDialogDispatch({
type: 'SHOW',
content: react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(CannotSuspendWarningMessage, null)
});
} else {
var nearestSuspenseElementID = nearestSuspenseElement.id; // If we're suspending from an arbitary (non-Suspense) component, select the nearest Suspense element in the Tree.
// This way when the fallback UI is shown and the current element is hidden, something meaningful is selected.
if (nearestSuspenseElement !== element) {
dispatch({
type: 'SELECT_ELEMENT_BY_ID',
payload: nearestSuspenseElementID
});
}
var rendererID = store.getRendererIDForElement(nearestSuspenseElementID); // Toggle suspended
if (rendererID !== null) {
bridge.send('overrideSuspense', {
id: nearestSuspenseElementID,
rendererID: rendererID,
forceFallback: !isSuspended
});
}
}
}, [bridge, dispatch, element, isSuspended, modalDialogDispatch, store]);
if (element === null) {
return react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _SelectedElement_css__WEBPACK_IMPORTED_MODULE_19___default.a.SelectedElement
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _SelectedElement_css__WEBPACK_IMPORTED_MODULE_19___default.a.TitleRow
}));
}
return react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _SelectedElement_css__WEBPACK_IMPORTED_MODULE_19___default.a.SelectedElement
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _SelectedElement_css__WEBPACK_IMPORTED_MODULE_19___default.a.TitleRow
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _SelectedElement_css__WEBPACK_IMPORTED_MODULE_19___default.a.SelectedComponentName
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _SelectedElement_css__WEBPACK_IMPORTED_MODULE_19___default.a.Component,
title: element.displayName
}, element.displayName)), canToggleSuspense && react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_Toggle__WEBPACK_IMPORTED_MODULE_16__["default"], {
className: _SelectedElement_css__WEBPACK_IMPORTED_MODULE_19___default.a.IconButton,
isChecked: isSuspended,
onChange: toggleSuspended,
title: isSuspended ? 'Unsuspend the selected component' : 'Suspend the selected component'
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_7__["default"], {
type: "suspend"
})), store.supportsNativeInspection && react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_6__["default"], {
className: _SelectedElement_css__WEBPACK_IMPORTED_MODULE_19___default.a.IconButton,
onClick: highlightElement,
title: "Inspect the matching DOM element"
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_7__["default"], {
type: "view-dom"
})), react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_6__["default"], {
className: _SelectedElement_css__WEBPACK_IMPORTED_MODULE_19___default.a.IconButton,
onClick: logElement,
title: "Log this component data to the console"
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_7__["default"], {
type: "log-data"
})), react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_6__["default"], {
className: _SelectedElement_css__WEBPACK_IMPORTED_MODULE_19___default.a.IconButton,
disabled: !canViewSource,
onClick: viewSource,
title: "View source for this element"
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_7__["default"], {
type: "view-source"
}))), inspectedElement === null && react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _SelectedElement_css__WEBPACK_IMPORTED_MODULE_19___default.a.Loading
}, "Loading..."), inspectedElement !== null && react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(InspectedElementView, {
key: inspectedElementID
/* Force reset when seleted Element changes */
,
copyInspectedElementPath: copyInspectedElementPath,
element: element,
getInspectedElementPath: getInspectedElementPath,
inspectedElement: inspectedElement,
storeAsGlobal: storeAsGlobal,
viewInspectedElementPath: viewInspectedElementPath
}));
}
var IS_SUSPENDED = 'Suspended';
function InspectedElementView(_ref) {
var copyInspectedElementPath = _ref.copyInspectedElementPath,
element = _ref.element,
getInspectedElementPath = _ref.getInspectedElementPath,
inspectedElement = _ref.inspectedElement,
storeAsGlobal = _ref.storeAsGlobal,
viewInspectedElementPath = _ref.viewInspectedElementPath;
var id = element.id,
type = element.type;
var canEditFunctionProps = inspectedElement.canEditFunctionProps,
canEditHooks = inspectedElement.canEditHooks,
canToggleSuspense = inspectedElement.canToggleSuspense,
hasLegacyContext = inspectedElement.hasLegacyContext,
context = inspectedElement.context,
hooks = inspectedElement.hooks,
owners = inspectedElement.owners,
props = inspectedElement.props,
source = inspectedElement.source,
state = inspectedElement.state;
var _useContext5 = Object(react__WEBPACK_IMPORTED_MODULE_1__["useContext"])(_TreeContext__WEBPACK_IMPORTED_MODULE_2__["TreeStateContext"]),
ownerID = _useContext5.ownerID;
var bridge = Object(react__WEBPACK_IMPORTED_MODULE_1__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_3__["BridgeContext"]);
var store = Object(react__WEBPACK_IMPORTED_MODULE_1__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_3__["StoreContext"]);
var _useContext6 = Object(react__WEBPACK_IMPORTED_MODULE_1__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_3__["ContextMenuContext"]),
isEnabledForInspectedElement = _useContext6.isEnabledForInspectedElement,
viewAttributeSourceFunction = _useContext6.viewAttributeSourceFunction;
var inspectContextPath = Object(react__WEBPACK_IMPORTED_MODULE_1__["useCallback"])(function (path) {
getInspectedElementPath(id, ['context'].concat(_toConsumableArray(path)));
}, [getInspectedElementPath, id]);
var inspectPropsPath = Object(react__WEBPACK_IMPORTED_MODULE_1__["useCallback"])(function (path) {
getInspectedElementPath(id, ['props'].concat(_toConsumableArray(path)));
}, [getInspectedElementPath, id]);
var inspectStatePath = Object(react__WEBPACK_IMPORTED_MODULE_1__["useCallback"])(function (path) {
getInspectedElementPath(id, ['state'].concat(_toConsumableArray(path)));
}, [getInspectedElementPath, id]);
var overrideContextFn = null;
var overridePropsFn = null;
var overrideStateFn = null;
var overrideSuspenseFn = null;
if (type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_18__["ElementTypeClass"]) {
overrideContextFn = function overrideContextFn(path, value) {
var rendererID = store.getRendererIDForElement(id);
if (rendererID !== null) {
bridge.send('overrideContext', {
id: id,
path: path,
rendererID: rendererID,
value: value
});
}
};
overridePropsFn = function overridePropsFn(path, value) {
var rendererID = store.getRendererIDForElement(id);
if (rendererID !== null) {
bridge.send('overrideProps', {
id: id,
path: path,
rendererID: rendererID,
value: value
});
}
};
overrideStateFn = function overrideStateFn(path, value) {
var rendererID = store.getRendererIDForElement(id);
if (rendererID !== null) {
bridge.send('overrideState', {
id: id,
path: path,
rendererID: rendererID,
value: value
});
}
};
} else if ((type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_18__["ElementTypeFunction"] || type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_18__["ElementTypeMemo"] || type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_18__["ElementTypeForwardRef"]) && canEditFunctionProps) {
overridePropsFn = function overridePropsFn(path, value) {
var rendererID = store.getRendererIDForElement(id);
if (rendererID !== null) {
bridge.send('overrideProps', {
id: id,
path: path,
rendererID: rendererID,
value: value
});
}
};
} else if (type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_18__["ElementTypeSuspense"] && canToggleSuspense) {
overrideSuspenseFn = function overrideSuspenseFn(path, value) {
if (path.length !== 1 && path !== IS_SUSPENDED) {
throw new Error('Unexpected path.');
}
var rendererID = store.getRendererIDForElement(id);
if (rendererID !== null) {
bridge.send('overrideSuspense', {
id: id,
rendererID: rendererID,
forceFallback: value
});
}
};
}
return react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_1__["Fragment"], null, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _SelectedElement_css__WEBPACK_IMPORTED_MODULE_19___default.a.InspectedElement
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_HocBadges__WEBPACK_IMPORTED_MODULE_11__["default"], {
element: element
}), react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_InspectedElementTree__WEBPACK_IMPORTED_MODULE_12__["default"], {
label: "props",
data: props,
inspectPath: inspectPropsPath,
overrideValueFn: overridePropsFn,
pathRoot: "props",
showWhenEmpty: true,
canAddEntries: typeof overridePropsFn === 'function'
}), type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_18__["ElementTypeSuspense"] ? react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_InspectedElementTree__WEBPACK_IMPORTED_MODULE_12__["default"], {
label: "suspense",
data: _defineProperty({}, IS_SUSPENDED, state !== null),
overrideValueFn: overrideSuspenseFn
}) : react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_InspectedElementTree__WEBPACK_IMPORTED_MODULE_12__["default"], {
label: "state",
data: state,
inspectPath: inspectStatePath,
overrideValueFn: overrideStateFn,
pathRoot: "state"
}), react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_HooksTree__WEBPACK_IMPORTED_MODULE_9__["default"], {
canEditHooks: canEditHooks,
hooks: hooks,
id: id
}), react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_InspectedElementTree__WEBPACK_IMPORTED_MODULE_12__["default"], {
label: hasLegacyContext ? 'legacy context' : 'context',
data: context,
inspectPath: inspectContextPath,
overrideValueFn: overrideContextFn,
pathRoot: "context"
}), react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_NativeStyleEditor__WEBPACK_IMPORTED_MODULE_15__["default"], null), ownerID === null && owners !== null && owners.length > 0 && react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _SelectedElement_css__WEBPACK_IMPORTED_MODULE_19___default.a.Owners
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _SelectedElement_css__WEBPACK_IMPORTED_MODULE_19___default.a.OwnersHeader
}, "rendered by"), owners.map(function (owner) {
return react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(OwnerView, {
key: owner.id,
displayName: owner.displayName || 'Anonymous',
hocDisplayNames: owner.hocDisplayNames,
id: owner.id,
isInStore: store.containsElement(owner.id),
type: owner.type
});
})), source !== null && react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(Source, {
fileName: source.fileName,
lineNumber: source.lineNumber
})), isEnabledForInspectedElement && react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_ContextMenu_ContextMenu__WEBPACK_IMPORTED_MODULE_4__["default"], {
id: "SelectedElement"
}, function (data) {
return react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_1__["Fragment"], null, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_ContextMenu_ContextMenuItem__WEBPACK_IMPORTED_MODULE_5__["default"], {
onClick: function onClick() {
return copyInspectedElementPath(id, data.path);
},
title: "Copy value to clipboard"
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_Icon__WEBPACK_IMPORTED_MODULE_8__["default"], {
className: _SelectedElement_css__WEBPACK_IMPORTED_MODULE_19___default.a.ContextMenuIcon,
type: "copy"
}), " Copy value to clipboard"), react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_ContextMenu_ContextMenuItem__WEBPACK_IMPORTED_MODULE_5__["default"], {
onClick: function onClick() {
return storeAsGlobal(id, data.path);
},
title: "Store as global variable"
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_Icon__WEBPACK_IMPORTED_MODULE_8__["default"], {
className: _SelectedElement_css__WEBPACK_IMPORTED_MODULE_19___default.a.ContextMenuIcon,
type: "store-as-global-variable"
}), ' ', "Store as global variable"), viewAttributeSourceFunction !== null && data.type === 'function' && react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_ContextMenu_ContextMenuItem__WEBPACK_IMPORTED_MODULE_5__["default"], {
onClick: function onClick() {
return viewAttributeSourceFunction(id, data.path);
},
title: "Go to definition"
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_Icon__WEBPACK_IMPORTED_MODULE_8__["default"], {
className: _SelectedElement_css__WEBPACK_IMPORTED_MODULE_19___default.a.ContextMenuIcon,
type: "code"
}), " Go to definition"));
}));
} // This function is based on packages/shared/describeComponentFrame.js
function formatSourceForDisplay(fileName, lineNumber) {
var BEFORE_SLASH_RE = /^(.*)[\\\/]/;
var nameOnly = fileName.replace(BEFORE_SLASH_RE, ''); // In DEV, include code for a common special case:
// prefer "folder/index.js" instead of just "index.js".
if (/^index\./.test(nameOnly)) {
var match = fileName.match(BEFORE_SLASH_RE);
if (match) {
var pathBeforeSlash = match[1];
if (pathBeforeSlash) {
var folderName = pathBeforeSlash.replace(BEFORE_SLASH_RE, '');
nameOnly = folderName + '/' + nameOnly;
}
}
}
return "".concat(nameOnly, ":").concat(lineNumber);
}
function Source(_ref3) {
var fileName = _ref3.fileName,
lineNumber = _ref3.lineNumber;
var handleCopy = function handleCopy() {
return Object(clipboard_js__WEBPACK_IMPORTED_MODULE_0__["copy"])("".concat(fileName, ":").concat(lineNumber));
};
return react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _SelectedElement_css__WEBPACK_IMPORTED_MODULE_19___default.a.Source
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _SelectedElement_css__WEBPACK_IMPORTED_MODULE_19___default.a.SourceHeaderRow
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _SelectedElement_css__WEBPACK_IMPORTED_MODULE_19___default.a.SourceHeader
}, "source"), react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_6__["default"], {
onClick: handleCopy,
title: "Copy to clipboard"
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_7__["default"], {
type: "copy"
}))), react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _SelectedElement_css__WEBPACK_IMPORTED_MODULE_19___default.a.SourceOneLiner
}, formatSourceForDisplay(fileName, lineNumber)));
}
function OwnerView(_ref4) {
var displayName = _ref4.displayName,
hocDisplayNames = _ref4.hocDisplayNames,
id = _ref4.id,
isInStore = _ref4.isInStore,
type = _ref4.type;
var dispatch = Object(react__WEBPACK_IMPORTED_MODULE_1__["useContext"])(_TreeContext__WEBPACK_IMPORTED_MODULE_2__["TreeDispatcherContext"]);
var handleClick = Object(react__WEBPACK_IMPORTED_MODULE_1__["useCallback"])(function () {
return dispatch({
type: 'SELECT_ELEMENT_BY_ID',
payload: id
});
}, [dispatch, id]);
return react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_6__["default"], {
key: id,
className: _SelectedElement_css__WEBPACK_IMPORTED_MODULE_19___default.a.OwnerButton,
disabled: !isInStore,
onClick: handleClick
}, react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("span", {
className: "".concat(_SelectedElement_css__WEBPACK_IMPORTED_MODULE_19___default.a.Owner, " ").concat(isInStore ? '' : _SelectedElement_css__WEBPACK_IMPORTED_MODULE_19___default.a.NotInStore),
title: displayName
}, displayName), react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(_Badge__WEBPACK_IMPORTED_MODULE_17__["default"], {
hocDisplayNames: hocDisplayNames,
type: type
}));
}
function CannotSuspendWarningMessage() {
var store = Object(react__WEBPACK_IMPORTED_MODULE_1__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_3__["StoreContext"]);
var areSuspenseElementsHidden = !!store.componentFilters.find(function (filter) {
return filter.type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_18__["ComponentFilterElementType"] && filter.value === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_18__["ElementTypeSuspense"] && filter.isEnabled;
}); // Has the user filted out Suspense nodes from the tree?
// If so, the selected element might actually be in a Suspense tree after all.
if (areSuspenseElementsHidden) {
return react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _SelectedElement_css__WEBPACK_IMPORTED_MODULE_19___default.a.CannotSuspendWarningMessage
}, "Suspended state cannot be toggled while Suspense components are hidden. Disable the filter and try agan.");
} else {
return react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", {
className: _SelectedElement_css__WEBPACK_IMPORTED_MODULE_19___default.a.CannotSuspendWarningMessage
}, "The selected element is not within a Suspense container. Suspending it would cause an error.");
}
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/SelectedTreeHighlight.css":
/*!****************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/SelectedTreeHighlight.css ***!
\****************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./SelectedTreeHighlight.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/SelectedTreeHighlight.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/SelectedTreeHighlight.js":
/*!***************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/SelectedTreeHighlight.js ***!
\***************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return SelectedTreeHighlight; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _TreeContext__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./TreeContext */ "../react-devtools-shared/src/devtools/views/Components/TreeContext.js");
/* harmony import */ var _Settings_SettingsContext__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../Settings/SettingsContext */ "../react-devtools-shared/src/devtools/views/Settings/SettingsContext.js");
/* harmony import */ var _TreeFocusedContext__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./TreeFocusedContext */ "../react-devtools-shared/src/devtools/views/Components/TreeFocusedContext.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var _hooks__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../hooks */ "../react-devtools-shared/src/devtools/views/hooks.js");
/* harmony import */ var _SelectedTreeHighlight_css__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./SelectedTreeHighlight.css */ "../react-devtools-shared/src/devtools/views/Components/SelectedTreeHighlight.css");
/* harmony import */ var _SelectedTreeHighlight_css__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_SelectedTreeHighlight_css__WEBPACK_IMPORTED_MODULE_6__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function SelectedTreeHighlight(_) {
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_Settings_SettingsContext__WEBPACK_IMPORTED_MODULE_2__["SettingsContext"]),
lineHeight = _useContext.lineHeight;
var store = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_4__["StoreContext"]);
var treeFocused = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_TreeFocusedContext__WEBPACK_IMPORTED_MODULE_3__["default"]);
var _useContext2 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_TreeContext__WEBPACK_IMPORTED_MODULE_1__["TreeStateContext"]),
ownerID = _useContext2.ownerID,
selectedElementID = _useContext2.selectedElementID;
var subscription = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
return {
getCurrentValue: function getCurrentValue() {
if (selectedElementID === null || store.isInsideCollapsedSubTree(selectedElementID)) {
return null;
}
var element = store.getElementByID(selectedElementID);
if (element === null || element.isCollapsed || element.children.length === 0) {
return null;
}
var startIndex = store.getIndexOfElementID(element.children[0]);
if (startIndex === null) {
return null;
}
var stopIndex = null;
var current = element;
while (current !== null) {
if (current.isCollapsed || current.children.length === 0) {
// We've found the last/deepest descendant.
stopIndex = store.getIndexOfElementID(current.id);
current = null;
} else {
var lastChildID = current.children[current.children.length - 1];
current = store.getElementByID(lastChildID);
}
}
if (stopIndex === null) {
return null;
}
return {
startIndex: startIndex,
stopIndex: stopIndex
};
},
subscribe: function subscribe(callback) {
store.addListener('mutated', callback);
return function () {
store.removeListener('mutated', callback);
};
}
};
}, [selectedElementID, store]);
var data = Object(_hooks__WEBPACK_IMPORTED_MODULE_5__["useSubscription"])(subscription);
if (ownerID !== null) {
return null;
}
if (data === null) {
return null;
}
var startIndex = data.startIndex,
stopIndex = data.stopIndex;
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: treeFocused ? _SelectedTreeHighlight_css__WEBPACK_IMPORTED_MODULE_6___default.a.Active : _SelectedTreeHighlight_css__WEBPACK_IMPORTED_MODULE_6___default.a.Inactive,
style: {
position: 'absolute',
top: "".concat(startIndex * lineHeight, "px"),
height: "".concat((stopIndex + 1 - startIndex) * lineHeight, "px")
}
});
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/Tree.css":
/*!***********************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/Tree.css ***!
\***********************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./Tree.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Components/Tree.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/Tree.js":
/*!**********************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/Tree.js ***!
\**********************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return Tree; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_virtualized_auto_sizer__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-virtualized-auto-sizer */ "../../node_modules/react-virtualized-auto-sizer/dist/index.esm.js");
/* harmony import */ var react_window__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-window */ "../react-devtools-shared/src/node_modules/react-window/dist/index.esm.js");
/* harmony import */ var _TreeContext__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./TreeContext */ "../react-devtools-shared/src/devtools/views/Components/TreeContext.js");
/* harmony import */ var _Settings_SettingsContext__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../Settings/SettingsContext */ "../react-devtools-shared/src/devtools/views/Settings/SettingsContext.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var _Element__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./Element */ "../react-devtools-shared/src/devtools/views/Components/Element.js");
/* harmony import */ var _InspectHostNodesToggle__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./InspectHostNodesToggle */ "../react-devtools-shared/src/devtools/views/Components/InspectHostNodesToggle.js");
/* harmony import */ var _OwnersStack__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./OwnersStack */ "../react-devtools-shared/src/devtools/views/Components/OwnersStack.js");
/* harmony import */ var _SearchInput__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./SearchInput */ "../react-devtools-shared/src/devtools/views/Components/SearchInput.js");
/* harmony import */ var react_devtools_shared_src_devtools_views_Settings_SettingsModalContextToggle__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! react-devtools-shared/src/devtools/views/Settings/SettingsModalContextToggle */ "../react-devtools-shared/src/devtools/views/Settings/SettingsModalContextToggle.js");
/* harmony import */ var _SelectedTreeHighlight__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./SelectedTreeHighlight */ "../react-devtools-shared/src/devtools/views/Components/SelectedTreeHighlight.js");
/* harmony import */ var _TreeFocusedContext__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./TreeFocusedContext */ "../react-devtools-shared/src/devtools/views/Components/TreeFocusedContext.js");
/* harmony import */ var _Tree_css__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./Tree.css */ "../react-devtools-shared/src/devtools/views/Components/Tree.css");
/* harmony import */ var _Tree_css__WEBPACK_IMPORTED_MODULE_13___default = /*#__PURE__*/__webpack_require__.n(_Tree_css__WEBPACK_IMPORTED_MODULE_13__);
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
// Never indent more than this number of pixels (even if we have the room).
var DEFAULT_INDENTATION_SIZE = 12;
function Tree(props) {
var dispatch = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_TreeContext__WEBPACK_IMPORTED_MODULE_3__["TreeDispatcherContext"]);
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_TreeContext__WEBPACK_IMPORTED_MODULE_3__["TreeStateContext"]),
numElements = _useContext.numElements,
ownerID = _useContext.ownerID,
searchIndex = _useContext.searchIndex,
searchResults = _useContext.searchResults,
selectedElementID = _useContext.selectedElementID,
selectedElementIndex = _useContext.selectedElementIndex;
var bridge = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_5__["BridgeContext"]);
var store = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_5__["StoreContext"]);
var _useState = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(false),
_useState2 = _slicedToArray(_useState, 2),
isNavigatingWithKeyboard = _useState2[0],
setIsNavigatingWithKeyboard = _useState2[1];
var treeRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(null);
var focusTargetRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(null);
var _useState3 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(false),
_useState4 = _slicedToArray(_useState3, 2),
treeFocused = _useState4[0],
setTreeFocused = _useState4[1];
var _useContext2 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_Settings_SettingsContext__WEBPACK_IMPORTED_MODULE_4__["SettingsContext"]),
lineHeight = _useContext2.lineHeight; // Make sure a newly selected element is visible in the list.
// This is helpful for things like the owners list and search.
//
// TRICKY:
// It's important to use a callback ref for this, rather than a ref object and an effect.
// As an optimization, the AutoSizer component does not render children when their size would be 0.
// This means that in some cases (if the browser panel size is initially really small),
// the Tree component might render without rendering an inner List.
// In this case, the list ref would be null on mount (when the scroll effect runs),
// meaning the scroll action would be skipped (since ref updates don't re-run effects).
// Using a callback ref accounts for this case...
var listCallbackRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (list) {
if (list != null && selectedElementIndex !== null) {
list.scrollToItem(selectedElementIndex, 'smart');
}
}, [selectedElementIndex]); // Picking an element in the inspector should put focus into the tree.
// This ensures that keyboard navigation works right after picking a node.
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
function handleStopInspectingNative(didSelectNode) {
if (didSelectNode && focusTargetRef.current !== null) {
focusTargetRef.current.focus();
}
}
bridge.addListener('stopInspectingNative', handleStopInspectingNative);
return function () {
return bridge.removeListener('stopInspectingNative', handleStopInspectingNative);
};
}, [bridge]); // This ref is passed down the context to elements.
// It lets them avoid autoscrolling to the same item many times
// when a selected virtual row goes in and out of the viewport.
var lastScrolledIDRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(null); // Navigate the tree with up/down arrow keys.
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
if (treeRef.current === null) {
return function () {};
}
var handleKeyDown = function handleKeyDown(event) {
if (event.target.tagName === 'INPUT' || event.defaultPrevented) {
return;
} // TODO We should ignore arrow keys if the focus is outside of DevTools.
// Otherwise the inline (embedded) DevTools might change selection unexpectedly,
// e.g. when a text input or a select has focus.
var element;
switch (event.key) {
case 'ArrowDown':
event.preventDefault();
dispatch({
type: 'SELECT_NEXT_ELEMENT_IN_TREE'
});
break;
case 'ArrowLeft':
event.preventDefault();
element = selectedElementID !== null ? store.getElementByID(selectedElementID) : null;
if (element !== null) {
if (element.children.length > 0 && !element.isCollapsed) {
store.toggleIsCollapsed(element.id, true);
} else {
dispatch({
type: 'SELECT_PARENT_ELEMENT_IN_TREE'
});
}
}
break;
case 'ArrowRight':
event.preventDefault();
element = selectedElementID !== null ? store.getElementByID(selectedElementID) : null;
if (element !== null) {
if (element.children.length > 0 && element.isCollapsed) {
store.toggleIsCollapsed(element.id, false);
} else {
dispatch({
type: 'SELECT_CHILD_ELEMENT_IN_TREE'
});
}
}
break;
case 'ArrowUp':
event.preventDefault();
dispatch({
type: 'SELECT_PREVIOUS_ELEMENT_IN_TREE'
});
break;
default:
return;
}
setIsNavigatingWithKeyboard(true);
}; // It's important to listen to the ownerDocument to support the browser extension.
// Here we use portals to render individual tabs (e.g. Profiler),
// and the root document might belong to a different window.
var ownerDocument = treeRef.current.ownerDocument;
ownerDocument.addEventListener('keydown', handleKeyDown);
return function () {
ownerDocument.removeEventListener('keydown', handleKeyDown);
};
}, [dispatch, selectedElementID, store]); // Focus management.
var handleBlur = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function () {
return setTreeFocused(false);
}, []);
var handleFocus = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function () {
setTreeFocused(true);
if (selectedElementIndex === null && numElements > 0) {
dispatch({
type: 'SELECT_ELEMENT_AT_INDEX',
payload: 0
});
}
}, [dispatch, numElements, selectedElementIndex]);
var handleKeyPress = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (event) {
switch (event.key) {
case 'Enter':
case ' ':
if (selectedElementID !== null) {
dispatch({
type: 'SELECT_OWNER',
payload: selectedElementID
});
}
break;
default:
break;
}
}, [dispatch, selectedElementID]);
var highlightNativeElement = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (id) {
var element = store.getElementByID(id);
var rendererID = store.getRendererIDForElement(id);
if (element !== null && rendererID !== null) {
bridge.send('highlightNativeElement', {
displayName: element.displayName,
hideAfterTimeout: false,
id: id,
openNativeElementsPanel: false,
rendererID: rendererID,
scrollIntoView: false
});
}
}, [store, bridge]); // If we switch the selected element while using the keyboard,
// start highlighting it in the DOM instead of the last hovered node.
var searchRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])({
searchIndex: searchIndex,
searchResults: searchResults
});
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
var didSelectNewSearchResult = false;
if (searchRef.current.searchIndex !== searchIndex || searchRef.current.searchResults !== searchResults) {
searchRef.current.searchIndex = searchIndex;
searchRef.current.searchResults = searchResults;
didSelectNewSearchResult = true;
}
if (isNavigatingWithKeyboard || didSelectNewSearchResult) {
if (selectedElementID !== null) {
highlightNativeElement(selectedElementID);
} else {
bridge.send('clearNativeElementHighlight');
}
}
}, [bridge, isNavigatingWithKeyboard, highlightNativeElement, searchIndex, searchResults, selectedElementID]); // Highlight last hovered element.
var handleElementMouseEnter = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (id) {
// Ignore hover while we're navigating with keyboard.
// This avoids flicker from the hovered nodes under the mouse.
if (!isNavigatingWithKeyboard) {
highlightNativeElement(id);
}
}, [isNavigatingWithKeyboard, highlightNativeElement]);
var handleMouseMove = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function () {
// We started using the mouse again.
// This will enable hover styles in individual rows.
setIsNavigatingWithKeyboard(false);
}, []);
var handleMouseLeave = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function () {
bridge.send('clearNativeElementHighlight');
}, [bridge]); // Let react-window know to re-render any time the underlying tree data changes.
// This includes the owner context, since it controls a filtered view of the tree.
var itemData = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
return {
numElements: numElements,
isNavigatingWithKeyboard: isNavigatingWithKeyboard,
onElementMouseEnter: handleElementMouseEnter,
lastScrolledIDRef: lastScrolledIDRef,
treeFocused: treeFocused
};
}, [numElements, isNavigatingWithKeyboard, handleElementMouseEnter, lastScrolledIDRef, treeFocused]);
var itemKey = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (index) {
return store.getElementIDAtIndex(index);
}, [store]);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_TreeFocusedContext__WEBPACK_IMPORTED_MODULE_12__["default"].Provider, {
value: treeFocused
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Tree_css__WEBPACK_IMPORTED_MODULE_13___default.a.Tree,
ref: treeRef
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Tree_css__WEBPACK_IMPORTED_MODULE_13___default.a.SearchInput
}, store.supportsNativeInspection && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_InspectHostNodesToggle__WEBPACK_IMPORTED_MODULE_7__["default"], null), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Tree_css__WEBPACK_IMPORTED_MODULE_13___default.a.VRule
})), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0__["Suspense"], {
fallback: react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(Loading, null)
}, ownerID !== null ? react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_OwnersStack__WEBPACK_IMPORTED_MODULE_8__["default"], null) : react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_SearchInput__WEBPACK_IMPORTED_MODULE_9__["default"], null)), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Tree_css__WEBPACK_IMPORTED_MODULE_13___default.a.VRule
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react_devtools_shared_src_devtools_views_Settings_SettingsModalContextToggle__WEBPACK_IMPORTED_MODULE_10__["default"], null)), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Tree_css__WEBPACK_IMPORTED_MODULE_13___default.a.AutoSizerWrapper,
onBlur: handleBlur,
onFocus: handleFocus,
onKeyPress: handleKeyPress,
onMouseMove: handleMouseMove,
onMouseLeave: handleMouseLeave,
ref: focusTargetRef,
tabIndex: 0
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react_virtualized_auto_sizer__WEBPACK_IMPORTED_MODULE_1__["default"], null, function (_ref) {
var height = _ref.height,
width = _ref.width;
return (// $FlowFixMe https://github.com/facebook/flow/issues/7341
react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react_window__WEBPACK_IMPORTED_MODULE_2__["FixedSizeList"], {
className: _Tree_css__WEBPACK_IMPORTED_MODULE_13___default.a.List,
height: height,
innerElementType: InnerElementType,
itemCount: numElements,
itemData: itemData,
itemKey: itemKey,
itemSize: lineHeight,
ref: listCallbackRef,
width: width
}, _Element__WEBPACK_IMPORTED_MODULE_6__["default"])
);
}))));
} // Indentation size can be adjusted but child width is fixed.
// We need to adjust indentations so the widest child can fit without overflowing.
// Sometimes the widest child is also the deepest in the tree:
// ┏----------------------┓
// ┆ <Foo> ┆
// ┆ ••••<Foobar> ┆
// ┆ ••••••••<Baz> ┆
// ┗----------------------┛
//
// But this is not always the case.
// Even with the above example, a change in indentation may change the overall widest child:
// ┏----------------------┓
// ┆ <Foo> ┆
// ┆ ••<Foobar> ┆
// ┆ ••••<Baz> ┆
// ┗----------------------┛
//
// In extreme cases this difference can be important:
// ┏----------------------┓
// ┆ <ReallyLongName> ┆
// ┆ ••<Foo> ┆
// ┆ ••••<Bar> ┆
// ┆ ••••••<Baz> ┆
// ┆ ••••••••<Qux> ┆
// ┗----------------------┛
//
// In the above example, the current indentation is fine,
// but if we naively assumed that the widest element is also the deepest element,
// we would end up compressing the indentation unnecessarily:
// ┏----------------------┓
// ┆ <ReallyLongName> ┆
// ┆ •<Foo> ┆
// ┆ ••<Bar> ┆
// ┆ •••<Baz> ┆
// ┆ ••••<Qux> ┆
// ┗----------------------┛
//
// The way we deal with this is to compute the max indentation size that can fit each child,
// given the child's fixed width and depth within the tree.
// Then we take the smallest of these indentation sizes...
function updateIndentationSizeVar(innerDiv, cachedChildWidths, indentationSizeRef, prevListWidthRef) {
var list = innerDiv.parentElement;
var listWidth = list.clientWidth; // Skip measurements when the Components panel is hidden.
if (listWidth === 0) {
return;
} // Reset the max indentation size if the width of the tree has increased.
if (listWidth > prevListWidthRef.current) {
indentationSizeRef.current = DEFAULT_INDENTATION_SIZE;
}
prevListWidthRef.current = listWidth;
var maxIndentationSize = indentationSizeRef.current; // eslint-disable-next-line no-for-of-loops/no-for-of-loops
var _iteratorNormalCompletion = true;
var _didIteratorError = false;
var _iteratorError = undefined;
try {
for (var _iterator = innerDiv.children[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
var child = _step.value;
var depth = parseInt(child.getAttribute('data-depth'), 10) || 0;
var childWidth = 0;
var cachedChildWidth = cachedChildWidths.get(child);
if (cachedChildWidth != null) {
childWidth = cachedChildWidth;
} else {
var firstElementChild = child.firstElementChild; // Skip over e.g. the guideline element
if (firstElementChild != null) {
childWidth = firstElementChild.clientWidth;
cachedChildWidths.set(child, childWidth);
}
}
var remainingWidth = Math.max(0, listWidth - childWidth);
maxIndentationSize = Math.min(maxIndentationSize, remainingWidth / depth);
}
} catch (err) {
_didIteratorError = true;
_iteratorError = err;
} finally {
try {
if (!_iteratorNormalCompletion && _iterator.return != null) {
_iterator.return();
}
} finally {
if (_didIteratorError) {
throw _iteratorError;
}
}
}
indentationSizeRef.current = maxIndentationSize;
list.style.setProperty('--indentation-size', "".concat(maxIndentationSize, "px"));
}
function InnerElementType(_ref2) {
var children = _ref2.children,
style = _ref2.style,
rest = _objectWithoutProperties(_ref2, ["children", "style"]);
var _useContext3 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_TreeContext__WEBPACK_IMPORTED_MODULE_3__["TreeStateContext"]),
ownerID = _useContext3.ownerID;
var cachedChildWidths = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
return new WeakMap();
}, []); // This ref tracks the current indentation size.
// We decrease indentation to fit wider/deeper trees.
// We indentionally do not increase it again afterward, to avoid the perception of content "jumping"
// e.g. clicking to toggle/collapse a row might otherwise jump horizontally beneath your cursor,
// e.g. scrolling a wide row off screen could cause narrower rows to jump to the right some.
//
// There are two exceptions for this:
// 1. The first is when the width of the tree increases.
// The user may have resized the window specifically to make more room for DevTools.
// In either case, this should reset our max indentation size logic.
// 2. The second is when the user enters or exits an owner tree.
var indentationSizeRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(DEFAULT_INDENTATION_SIZE);
var prevListWidthRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(0);
var prevOwnerIDRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(ownerID);
var divRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(null); // We shouldn't retain this width across different conceptual trees though,
// so when the user opens the "owners tree" view, we should discard the previous width.
if (ownerID !== prevOwnerIDRef.current) {
prevOwnerIDRef.current = ownerID;
indentationSizeRef.current = DEFAULT_INDENTATION_SIZE;
} // When we render new content, measure to see if we need to shrink indentation to fit it.
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
if (divRef.current !== null) {
updateIndentationSizeVar(divRef.current, cachedChildWidths, indentationSizeRef, prevListWidthRef);
}
}); // This style override enables the background color to fill the full visible width,
// when combined with the CSS tweaks in Element.
// A lot of options were considered; this seemed the one that requires the least code.
// See https://github.com/bvaughn/react-devtools-experimental/issues/9
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", _extends({
className: _Tree_css__WEBPACK_IMPORTED_MODULE_13___default.a.InnerElementType,
ref: divRef,
style: style
}, rest), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_SelectedTreeHighlight__WEBPACK_IMPORTED_MODULE_11__["default"], null), children);
}
function Loading() {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Tree_css__WEBPACK_IMPORTED_MODULE_13___default.a.Loading
}, "Loading...");
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/TreeContext.js":
/*!*****************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/TreeContext.js ***!
\*****************************************************************************/
/*! exports provided: TreeDispatcherContext, TreeStateContext, TreeContextController */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "TreeDispatcherContext", function() { return TreeDispatcherContext; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "TreeStateContext", function() { return TreeStateContext; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "TreeContextController", function() { return TreeContextController; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var scheduler__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! scheduler */ "scheduler");
/* harmony import */ var scheduler__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(scheduler__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../utils */ "../react-devtools-shared/src/devtools/views/utils.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../store */ "../react-devtools-shared/src/devtools/store.js");
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(source, true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
// This context combines tree/selection state, search, and the owners stack.
// These values are managed together because changes in one often impact the others.
// Combining them enables us to avoid cascading renders.
//
// Changes to search state may impact tree state.
// For example, updating the selected search result also updates the tree's selected value.
// Search does not fundamanetally change the tree though.
// It is also possible to update the selected tree value independently.
//
// Changes to owners state mask search and tree values.
// When owners statck is not empty, search is temporarily disabnled,
// and tree values (e.g. num elements, selected element) are masked.
// Both tree and search values are restored when the owners stack is cleared.
//
// For this reason, changes to the tree context are processed in sequence: tree -> search -> owners
// This enables each section to potentially override (or mask) previous values.
var TreeStateContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["createContext"])(null);
TreeStateContext.displayName = 'TreeStateContext';
var TreeDispatcherContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["createContext"])(null);
TreeDispatcherContext.displayName = 'TreeDispatcherContext';
function reduceTreeState(store, state, action) {
var numElements = state.numElements,
ownerID = state.ownerID,
selectedElementIndex = state.selectedElementIndex,
selectedElementID = state.selectedElementID;
var lookupIDForIndex = true; // Base tree should ignore selected element changes when the owner's tree is active.
if (ownerID === null) {
switch (action.type) {
case 'HANDLE_STORE_MUTATION':
numElements = store.numElements; // If the currently-selected Element has been removed from the tree, update selection state.
var removedIDs = action.payload[1]; // Find the closest parent that wasn't removed during this batch.
// We deduce the parent-child mapping from removedIDs (id -> parentID)
// because by now it's too late to read them from the store.
while (selectedElementID !== null && removedIDs.has(selectedElementID)) {
selectedElementID = removedIDs.get(selectedElementID);
}
if (selectedElementID === 0) {
// The whole root was removed.
selectedElementIndex = null;
}
break;
case 'SELECT_CHILD_ELEMENT_IN_TREE':
if (selectedElementIndex !== null) {
var selectedElement = store.getElementAtIndex(selectedElementIndex);
if (selectedElement !== null && selectedElement.children.length > 0 && !selectedElement.isCollapsed) {
var firstChildID = selectedElement.children[0];
var firstChildIndex = store.getIndexOfElementID(firstChildID);
if (firstChildIndex !== null) {
selectedElementIndex = firstChildIndex;
}
}
}
break;
case 'SELECT_ELEMENT_AT_INDEX':
selectedElementIndex = action.payload;
break;
case 'SELECT_ELEMENT_BY_ID':
// Skip lookup in this case; it would be redundant.
// It might also cause problems if the specified element was inside of a (not yet expanded) subtree.
lookupIDForIndex = false;
selectedElementID = action.payload;
selectedElementIndex = selectedElementID === null ? null : store.getIndexOfElementID(selectedElementID);
break;
case 'SELECT_NEXT_ELEMENT_IN_TREE':
if (selectedElementIndex === null || selectedElementIndex + 1 >= numElements) {
selectedElementIndex = 0;
} else {
selectedElementIndex++;
}
break;
case 'SELECT_PARENT_ELEMENT_IN_TREE':
if (selectedElementIndex !== null) {
var _selectedElement = store.getElementAtIndex(selectedElementIndex);
if (_selectedElement !== null && _selectedElement.parentID !== null) {
var parentIndex = store.getIndexOfElementID(_selectedElement.parentID);
if (parentIndex !== null) {
selectedElementIndex = parentIndex;
}
}
}
break;
case 'SELECT_PREVIOUS_ELEMENT_IN_TREE':
if (selectedElementIndex === null || selectedElementIndex === 0) {
selectedElementIndex = numElements - 1;
} else {
selectedElementIndex--;
}
break;
default:
// React can bailout of no-op updates.
return state;
}
} // Keep selected item ID and index in sync.
if (lookupIDForIndex && selectedElementIndex !== state.selectedElementIndex) {
if (selectedElementIndex === null) {
selectedElementID = null;
} else {
selectedElementID = store.getElementIDAtIndex(selectedElementIndex);
}
}
return _objectSpread({}, state, {
numElements: numElements,
selectedElementIndex: selectedElementIndex,
selectedElementID: selectedElementID
});
}
function reduceSearchState(store, state, action) {
var ownerID = state.ownerID,
searchIndex = state.searchIndex,
searchResults = state.searchResults,
searchText = state.searchText,
selectedElementID = state.selectedElementID,
selectedElementIndex = state.selectedElementIndex;
var prevSearchIndex = searchIndex;
var prevSearchText = searchText;
var numPrevSearchResults = searchResults.length; // We track explicitly whether search was requested because
// we might want to search even if search index didn't change.
// For example, if you press "next result" on a search with a single
// result but a different current selection, we'll set this to true.
var didRequestSearch = false; // Search isn't supported when the owner's tree is active.
if (ownerID === null) {
switch (action.type) {
case 'GO_TO_NEXT_SEARCH_RESULT':
if (numPrevSearchResults > 0) {
didRequestSearch = true;
searchIndex = searchIndex + 1 < numPrevSearchResults ? searchIndex + 1 : 0;
}
break;
case 'GO_TO_PREVIOUS_SEARCH_RESULT':
if (numPrevSearchResults > 0) {
didRequestSearch = true;
searchIndex = searchIndex > 0 ? searchIndex - 1 : numPrevSearchResults - 1;
}
break;
case 'HANDLE_STORE_MUTATION':
if (searchText !== '') {
var _payload = _slicedToArray(action.payload, 2),
addedElementIDs = _payload[0],
removedElementIDs = _payload[1];
removedElementIDs.forEach(function (parentID, id) {
// Prune this item from the search results.
var index = searchResults.indexOf(id);
if (index >= 0) {
searchResults = searchResults.slice(0, index).concat(searchResults.slice(index + 1)); // If the results are now empty, also deselect things.
if (searchResults.length === 0) {
searchIndex = null;
} else if (searchIndex >= searchResults.length) {
searchIndex = searchResults.length - 1;
}
}
});
addedElementIDs.forEach(function (id) {
var element = store.getElementByID(id); // It's possible that multiple tree operations will fire before this action has run.
// So it's important to check for elements that may have been added and then removed.
if (element !== null) {
var displayName = element.displayName; // Add this item to the search results if it matches.
var regExp = Object(_utils__WEBPACK_IMPORTED_MODULE_2__["createRegExp"])(searchText);
if (displayName !== null && regExp.test(displayName)) {
var newElementIndex = store.getIndexOfElementID(id);
var foundMatch = false;
for (var index = 0; index < searchResults.length; index++) {
var resultID = searchResults[index];
if (newElementIndex < store.getIndexOfElementID(resultID)) {
foundMatch = true;
searchResults = searchResults.slice(0, index).concat(resultID).concat(searchResults.slice(index));
break;
}
}
if (!foundMatch) {
searchResults = searchResults.concat(id);
}
searchIndex = searchIndex === null ? 0 : searchIndex;
}
}
});
}
break;
case 'SET_SEARCH_TEXT':
searchIndex = null;
searchResults = [];
searchText = action.payload;
if (searchText !== '') {
var regExp = Object(_utils__WEBPACK_IMPORTED_MODULE_2__["createRegExp"])(searchText);
store.roots.forEach(function (rootID) {
recursivelySearchTree(store, rootID, regExp, searchResults);
});
if (searchResults.length > 0) {
if (prevSearchIndex === null) {
if (selectedElementIndex !== null) {
searchIndex = getNearestResultIndex(store, searchResults, selectedElementIndex);
} else {
searchIndex = 0;
}
} else {
searchIndex = Math.min(prevSearchIndex, searchResults.length - 1);
}
}
}
break;
default:
// React can bailout of no-op updates.
return state;
}
}
if (searchText !== prevSearchText) {
var newSearchIndex = searchResults.indexOf(selectedElementID);
if (newSearchIndex === -1) {
// Only move the selection if the new query
// doesn't match the current selection anymore.
didRequestSearch = true;
} else {
// Selected item still matches the new search query.
// Adjust the index to reflect its position in new results.
searchIndex = newSearchIndex;
}
}
if (didRequestSearch && searchIndex !== null) {
selectedElementID = searchResults[searchIndex];
selectedElementIndex = store.getIndexOfElementID(selectedElementID);
}
return _objectSpread({}, state, {
selectedElementID: selectedElementID,
selectedElementIndex: selectedElementIndex,
searchIndex: searchIndex,
searchResults: searchResults,
searchText: searchText
});
}
function reduceOwnersState(store, state, action) {
var numElements = state.numElements,
selectedElementID = state.selectedElementID,
selectedElementIndex = state.selectedElementIndex,
ownerID = state.ownerID,
ownerFlatTree = state.ownerFlatTree,
searchIndex = state.searchIndex,
searchResults = state.searchResults,
searchText = state.searchText;
var prevSelectedElementIndex = selectedElementIndex;
switch (action.type) {
case 'HANDLE_STORE_MUTATION':
if (ownerID !== null) {
if (!store.containsElement(ownerID)) {
ownerID = null;
ownerFlatTree = null;
selectedElementID = null;
} else {
ownerFlatTree = store.getOwnersListForElement(ownerID);
if (selectedElementID !== null) {
// Mutation might have caused the index of this ID to shift.
selectedElementIndex = ownerFlatTree.findIndex(function (element) {
return element.id === selectedElementID;
});
}
}
} else {
if (selectedElementID !== null) {
// Mutation might have caused the index of this ID to shift.
selectedElementIndex = store.getIndexOfElementID(selectedElementID);
}
}
if (selectedElementIndex === -1) {
// If we couldn't find this ID after mutation, unselect it.
selectedElementIndex = null;
selectedElementID = null;
}
break;
case 'RESET_OWNER_STACK':
ownerID = null;
ownerFlatTree = null;
selectedElementIndex = selectedElementID !== null ? store.getIndexOfElementID(selectedElementID) : null;
break;
case 'SELECT_ELEMENT_AT_INDEX':
if (ownerFlatTree !== null) {
selectedElementIndex = action.payload;
}
break;
case 'SELECT_ELEMENT_BY_ID':
if (ownerFlatTree !== null) {
var payload = action.payload;
if (payload === null) {
selectedElementIndex = null;
} else {
selectedElementIndex = ownerFlatTree.findIndex(function (element) {
return element.id === payload;
}); // If the selected element is outside of the current owners list,
// exit the list and select the element in the main tree.
// This supports features like toggling Suspense.
if (selectedElementIndex !== null && selectedElementIndex < 0) {
ownerID = null;
ownerFlatTree = null;
selectedElementIndex = store.getIndexOfElementID(payload);
}
}
}
break;
case 'SELECT_NEXT_ELEMENT_IN_TREE':
if (ownerFlatTree !== null && ownerFlatTree.length > 0) {
if (selectedElementIndex === null) {
selectedElementIndex = 0;
} else if (selectedElementIndex + 1 < ownerFlatTree.length) {
selectedElementIndex++;
}
}
break;
case 'SELECT_PREVIOUS_ELEMENT_IN_TREE':
if (ownerFlatTree !== null && ownerFlatTree.length > 0) {
if (selectedElementIndex !== null && selectedElementIndex > 0) {
selectedElementIndex--;
}
}
break;
case 'SELECT_OWNER':
// If the Store doesn't have any owners metadata, don't drill into an empty stack.
// This is a confusing user experience.
if (store.hasOwnerMetadata) {
ownerID = action.payload;
ownerFlatTree = store.getOwnersListForElement(ownerID); // Always force reset selection to be the top of the new owner tree.
selectedElementIndex = 0;
prevSelectedElementIndex = null;
}
break;
default:
// React can bailout of no-op updates.
return state;
} // Changes in the selected owner require re-calculating the owners tree.
if (ownerFlatTree !== state.ownerFlatTree || action.type === 'HANDLE_STORE_MUTATION') {
if (ownerFlatTree === null) {
numElements = store.numElements;
} else {
numElements = ownerFlatTree.length;
}
} // Keep selected item ID and index in sync.
if (selectedElementIndex !== prevSelectedElementIndex) {
if (selectedElementIndex === null) {
selectedElementID = null;
} else {
if (ownerFlatTree !== null) {
selectedElementID = ownerFlatTree[selectedElementIndex].id;
}
}
}
return _objectSpread({}, state, {
numElements: numElements,
selectedElementID: selectedElementID,
selectedElementIndex: selectedElementIndex,
searchIndex: searchIndex,
searchResults: searchResults,
searchText: searchText,
ownerID: ownerID,
ownerFlatTree: ownerFlatTree
});
}
function reduceSuspenseState(store, state, action) {
var type = action.type;
switch (type) {
case 'UPDATE_INSPECTED_ELEMENT_ID':
if (state.inspectedElementID !== state.selectedElementID) {
return _objectSpread({}, state, {
inspectedElementID: state.selectedElementID
});
}
break;
default:
break;
} // React can bailout of no-op updates.
return state;
}
// TODO Remove TreeContextController wrapper element once global ConsearchText.write API exists.
function TreeContextController(_ref) {
var children = _ref.children,
defaultInspectedElementID = _ref.defaultInspectedElementID,
defaultOwnerID = _ref.defaultOwnerID,
defaultSelectedElementID = _ref.defaultSelectedElementID,
defaultSelectedElementIndex = _ref.defaultSelectedElementIndex;
var bridge = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_3__["BridgeContext"]);
var store = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_3__["StoreContext"]);
var initialRevision = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
return store.revision;
}, [store]); // This reducer is created inline because it needs access to the Store.
// The store is mutable, but the Store itself is global and lives for the lifetime of the DevTools,
// so it's okay for the reducer to have an empty dependencies array.
var reducer = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
return function (state, action) {
var type = action.type;
switch (type) {
case 'GO_TO_NEXT_SEARCH_RESULT':
case 'GO_TO_PREVIOUS_SEARCH_RESULT':
case 'HANDLE_STORE_MUTATION':
case 'RESET_OWNER_STACK':
case 'SELECT_ELEMENT_AT_INDEX':
case 'SELECT_ELEMENT_BY_ID':
case 'SELECT_CHILD_ELEMENT_IN_TREE':
case 'SELECT_NEXT_ELEMENT_IN_TREE':
case 'SELECT_PARENT_ELEMENT_IN_TREE':
case 'SELECT_PREVIOUS_ELEMENT_IN_TREE':
case 'SELECT_OWNER':
case 'UPDATE_INSPECTED_ELEMENT_ID':
case 'SET_SEARCH_TEXT':
state = reduceTreeState(store, state, action);
state = reduceSearchState(store, state, action);
state = reduceOwnersState(store, state, action);
state = reduceSuspenseState(store, state, action); // If the selected ID is in a collapsed subtree, reset the selected index to null.
// We'll know the correct index after the layout effect will toggle the tree,
// and the store tree is mutated to account for that.
if (state.selectedElementID !== null && store.isInsideCollapsedSubTree(state.selectedElementID)) {
return _objectSpread({}, state, {
selectedElementIndex: null
});
}
return state;
default:
throw new Error("Unrecognized action \"".concat(type, "\""));
}
};
}, [store]);
var _useReducer = Object(react__WEBPACK_IMPORTED_MODULE_0__["useReducer"])(reducer, {
// Tree
numElements: store.numElements,
selectedElementID: defaultSelectedElementID == null ? null : defaultSelectedElementID,
selectedElementIndex: defaultSelectedElementIndex == null ? null : defaultSelectedElementIndex,
// Search
searchIndex: null,
searchResults: [],
searchText: '',
// Owners
ownerID: defaultOwnerID == null ? null : defaultOwnerID,
ownerFlatTree: null,
// Inspection element panel
inspectedElementID: defaultInspectedElementID == null ? null : defaultInspectedElementID
}),
_useReducer2 = _slicedToArray(_useReducer, 2),
state = _useReducer2[0],
dispatch = _useReducer2[1];
var dispatchWrapper = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (action) {
// Run the first update at "user-blocking" priority in case dispatch is called from a non-React event.
// In this case, the current (and "next") priorities would both be "normal",
// and suspense would potentially block both updates.
Object(scheduler__WEBPACK_IMPORTED_MODULE_1__["unstable_runWithPriority"])(scheduler__WEBPACK_IMPORTED_MODULE_1__["unstable_UserBlockingPriority"], function () {
return dispatch(action);
});
Object(scheduler__WEBPACK_IMPORTED_MODULE_1__["unstable_next"])(function () {
return dispatch({
type: 'UPDATE_INSPECTED_ELEMENT_ID'
});
});
}, [dispatch]); // Listen for host element selections.
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
var handleSelectFiber = function handleSelectFiber(id) {
return dispatchWrapper({
type: 'SELECT_ELEMENT_BY_ID',
payload: id
});
};
bridge.addListener('selectFiber', handleSelectFiber);
return function () {
return bridge.removeListener('selectFiber', handleSelectFiber);
};
}, [bridge, dispatchWrapper]); // If a newly-selected search result or inspection selection is inside of a collapsed subtree, auto expand it.
// This needs to be a layout effect to avoid temporarily flashing an incorrect selection.
var prevSelectedElementID = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(null);
Object(react__WEBPACK_IMPORTED_MODULE_0__["useLayoutEffect"])(function () {
if (state.selectedElementID !== prevSelectedElementID.current) {
prevSelectedElementID.current = state.selectedElementID;
if (state.selectedElementID !== null) {
var element = store.getElementByID(state.selectedElementID);
if (element !== null && element.parentID > 0) {
store.toggleIsCollapsed(element.parentID, false);
}
}
}
}, [state.selectedElementID, store]); // Mutations to the underlying tree may impact this context (e.g. search results, selection state).
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
var handleStoreMutated = function handleStoreMutated(_ref2) {
var _ref3 = _slicedToArray(_ref2, 2),
addedElementIDs = _ref3[0],
removedElementIDs = _ref3[1];
dispatchWrapper({
type: 'HANDLE_STORE_MUTATION',
payload: [addedElementIDs, removedElementIDs]
});
}; // Since this is a passive effect, the tree may have been mutated before our initial subscription.
if (store.revision !== initialRevision) {
// At the moment, we can treat this as a mutation.
// We don't know which Elements were newly added/removed, but that should be okay in this case.
// It would only impact the search state, which is unlikely to exist yet at this point.
dispatchWrapper({
type: 'HANDLE_STORE_MUTATION',
payload: [[], new Map()]
});
}
store.addListener('mutated', handleStoreMutated);
return function () {
return store.removeListener('mutated', handleStoreMutated);
};
}, [dispatchWrapper, initialRevision, store]);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(TreeStateContext.Provider, {
value: state
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(TreeDispatcherContext.Provider, {
value: dispatchWrapper
}, children));
}
function recursivelySearchTree(store, elementID, regExp, searchResults) {
var _ref4 = store.getElementByID(elementID),
children = _ref4.children,
displayName = _ref4.displayName,
hocDisplayNames = _ref4.hocDisplayNames;
if (displayName != null && regExp.test(displayName) === true) {
searchResults.push(elementID);
} else if (hocDisplayNames != null && hocDisplayNames.length > 0 && hocDisplayNames.some(function (name) {
return regExp.test(name);
}) === true) {
searchResults.push(elementID);
}
children.forEach(function (childID) {
return recursivelySearchTree(store, childID, regExp, searchResults);
});
}
function getNearestResultIndex(store, searchResults, selectedElementIndex) {
var index = searchResults.findIndex(function (id) {
var innerIndex = store.getIndexOfElementID(id);
return innerIndex !== null && innerIndex >= selectedElementIndex;
});
return index === -1 ? 0 : index;
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/TreeFocusedContext.js":
/*!************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/TreeFocusedContext.js ***!
\************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
var TreeFocusedContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["createContext"])(false);
/* harmony default export */ __webpack_exports__["default"] = (TreeFocusedContext);
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Components/ViewElementSourceContext.js":
/*!******************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Components/ViewElementSourceContext.js ***!
\******************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
var ViewElementSourceContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["createContext"])(null);
ViewElementSourceContext.displayName = 'ViewElementSourceContext';
/* harmony default export */ __webpack_exports__["default"] = (ViewElementSourceContext);
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/DevTools.css":
/*!****************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/DevTools.css ***!
\****************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../node_modules/css-loader??ref--5-1!./DevTools.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/DevTools.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/DevTools.js":
/*!***************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/DevTools.js ***!
\***************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return DevTools; });
/* harmony import */ var _reach_menu_button_styles_css__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @reach/menu-button/styles.css */ "../../node_modules/@reach/menu-button/styles.css");
/* harmony import */ var _reach_menu_button_styles_css__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_reach_menu_button_styles_css__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _reach_tooltip_styles_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @reach/tooltip/styles.css */ "../../node_modules/@reach/tooltip/styles.css");
/* harmony import */ var _reach_tooltip_styles_css__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_reach_tooltip_styles_css__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../store */ "../react-devtools-shared/src/devtools/store.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var _Components_Components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./Components/Components */ "../react-devtools-shared/src/devtools/views/Components/Components.js");
/* harmony import */ var _Profiler_Profiler__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./Profiler/Profiler */ "../react-devtools-shared/src/devtools/views/Profiler/Profiler.js");
/* harmony import */ var _TabBar__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./TabBar */ "../react-devtools-shared/src/devtools/views/TabBar.js");
/* harmony import */ var _Settings_SettingsContext__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./Settings/SettingsContext */ "../react-devtools-shared/src/devtools/views/Settings/SettingsContext.js");
/* harmony import */ var _Components_TreeContext__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./Components/TreeContext */ "../react-devtools-shared/src/devtools/views/Components/TreeContext.js");
/* harmony import */ var _Components_ViewElementSourceContext__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./Components/ViewElementSourceContext */ "../react-devtools-shared/src/devtools/views/Components/ViewElementSourceContext.js");
/* harmony import */ var _Profiler_ProfilerContext__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./Profiler/ProfilerContext */ "../react-devtools-shared/src/devtools/views/Profiler/ProfilerContext.js");
/* harmony import */ var _ModalDialog__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./ModalDialog */ "../react-devtools-shared/src/devtools/views/ModalDialog.js");
/* harmony import */ var _ReactLogo__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./ReactLogo */ "../react-devtools-shared/src/devtools/views/ReactLogo.js");
/* harmony import */ var _UnsupportedVersionDialog__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./UnsupportedVersionDialog */ "../react-devtools-shared/src/devtools/views/UnsupportedVersionDialog.js");
/* harmony import */ var _WarnIfLegacyBackendDetected__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./WarnIfLegacyBackendDetected */ "../react-devtools-shared/src/devtools/views/WarnIfLegacyBackendDetected.js");
/* harmony import */ var _DevTools_css__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ./DevTools.css */ "../react-devtools-shared/src/devtools/views/DevTools.css");
/* harmony import */ var _DevTools_css__WEBPACK_IMPORTED_MODULE_16___default = /*#__PURE__*/__webpack_require__.n(_DevTools_css__WEBPACK_IMPORTED_MODULE_16__);
/* harmony import */ var _root_css__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ./root.css */ "../react-devtools-shared/src/devtools/views/root.css");
/* harmony import */ var _root_css__WEBPACK_IMPORTED_MODULE_17___default = /*#__PURE__*/__webpack_require__.n(_root_css__WEBPACK_IMPORTED_MODULE_17__);
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
// Reach styles need to come before any component styles.
// This makes overriding the styles simpler.
var componentsTab = {
id: 'components',
icon: 'components',
label: 'Components',
title: 'React Components'
};
var profilerTab = {
id: 'profiler',
icon: 'profiler',
label: 'Profiler',
title: 'React Profiler'
};
var tabs = [componentsTab, profilerTab];
function DevTools(_ref) {
var bridge = _ref.bridge,
_ref$browserTheme = _ref.browserTheme,
browserTheme = _ref$browserTheme === void 0 ? 'light' : _ref$browserTheme,
canViewElementSourceFunction = _ref.canViewElementSourceFunction,
componentsPortalContainer = _ref.componentsPortalContainer,
_ref$defaultTab = _ref.defaultTab,
defaultTab = _ref$defaultTab === void 0 ? 'components' : _ref$defaultTab,
_ref$enabledInspected = _ref.enabledInspectedElementContextMenu,
enabledInspectedElementContextMenu = _ref$enabledInspected === void 0 ? false : _ref$enabledInspected,
overrideTab = _ref.overrideTab,
profilerPortalContainer = _ref.profilerPortalContainer,
_ref$showTabBar = _ref.showTabBar,
showTabBar = _ref$showTabBar === void 0 ? false : _ref$showTabBar,
store = _ref.store,
_ref$warnIfLegacyBack = _ref.warnIfLegacyBackendDetected,
warnIfLegacyBackendDetected = _ref$warnIfLegacyBack === void 0 ? false : _ref$warnIfLegacyBack,
_ref$warnIfUnsupporte = _ref.warnIfUnsupportedVersionDetected,
warnIfUnsupportedVersionDetected = _ref$warnIfUnsupporte === void 0 ? false : _ref$warnIfUnsupporte,
viewAttributeSourceFunction = _ref.viewAttributeSourceFunction,
viewElementSourceFunction = _ref.viewElementSourceFunction;
var _useState = Object(react__WEBPACK_IMPORTED_MODULE_2__["useState"])(defaultTab),
_useState2 = _slicedToArray(_useState, 2),
tab = _useState2[0],
setTab = _useState2[1];
if (overrideTab != null && overrideTab !== tab) {
setTab(overrideTab);
}
var viewElementSource = Object(react__WEBPACK_IMPORTED_MODULE_2__["useMemo"])(function () {
return {
canViewElementSourceFunction: canViewElementSourceFunction || null,
viewElementSourceFunction: viewElementSourceFunction || null
};
}, [canViewElementSourceFunction, viewElementSourceFunction]);
var contextMenu = Object(react__WEBPACK_IMPORTED_MODULE_2__["useMemo"])(function () {
return {
isEnabledForInspectedElement: enabledInspectedElementContextMenu,
viewAttributeSourceFunction: viewAttributeSourceFunction || null
};
}, [enabledInspectedElementContextMenu, viewAttributeSourceFunction]);
Object(react__WEBPACK_IMPORTED_MODULE_2__["useEffect"])(function () {
return function () {
try {
bridge.shutdown();
} catch (error) {// Attempting to use a disconnected port.
}
};
}, [bridge]);
return react__WEBPACK_IMPORTED_MODULE_2___default.a.createElement(_context__WEBPACK_IMPORTED_MODULE_4__["BridgeContext"].Provider, {
value: bridge
}, react__WEBPACK_IMPORTED_MODULE_2___default.a.createElement(_context__WEBPACK_IMPORTED_MODULE_4__["StoreContext"].Provider, {
value: store
}, react__WEBPACK_IMPORTED_MODULE_2___default.a.createElement(_context__WEBPACK_IMPORTED_MODULE_4__["ContextMenuContext"].Provider, {
value: contextMenu
}, react__WEBPACK_IMPORTED_MODULE_2___default.a.createElement(_ModalDialog__WEBPACK_IMPORTED_MODULE_12__["ModalDialogContextController"], null, react__WEBPACK_IMPORTED_MODULE_2___default.a.createElement(_Settings_SettingsContext__WEBPACK_IMPORTED_MODULE_8__["SettingsContextController"], {
browserTheme: browserTheme,
componentsPortalContainer: componentsPortalContainer,
profilerPortalContainer: profilerPortalContainer
}, react__WEBPACK_IMPORTED_MODULE_2___default.a.createElement(_Components_ViewElementSourceContext__WEBPACK_IMPORTED_MODULE_10__["default"].Provider, {
value: viewElementSource
}, react__WEBPACK_IMPORTED_MODULE_2___default.a.createElement(_Components_TreeContext__WEBPACK_IMPORTED_MODULE_9__["TreeContextController"], null, react__WEBPACK_IMPORTED_MODULE_2___default.a.createElement(_Profiler_ProfilerContext__WEBPACK_IMPORTED_MODULE_11__["ProfilerContextController"], null, react__WEBPACK_IMPORTED_MODULE_2___default.a.createElement("div", {
className: _DevTools_css__WEBPACK_IMPORTED_MODULE_16___default.a.DevTools
}, showTabBar && react__WEBPACK_IMPORTED_MODULE_2___default.a.createElement("div", {
className: _DevTools_css__WEBPACK_IMPORTED_MODULE_16___default.a.TabBar
}, react__WEBPACK_IMPORTED_MODULE_2___default.a.createElement(_ReactLogo__WEBPACK_IMPORTED_MODULE_13__["default"], null), react__WEBPACK_IMPORTED_MODULE_2___default.a.createElement("span", {
className: _DevTools_css__WEBPACK_IMPORTED_MODULE_16___default.a.DevToolsVersion
}, "4.4.0-f749045a5"), react__WEBPACK_IMPORTED_MODULE_2___default.a.createElement("div", {
className: _DevTools_css__WEBPACK_IMPORTED_MODULE_16___default.a.Spacer
}), react__WEBPACK_IMPORTED_MODULE_2___default.a.createElement(_TabBar__WEBPACK_IMPORTED_MODULE_7__["default"], {
currentTab: tab,
id: "DevTools",
selectTab: setTab,
tabs: tabs,
type: "navigation"
})), react__WEBPACK_IMPORTED_MODULE_2___default.a.createElement("div", {
className: _DevTools_css__WEBPACK_IMPORTED_MODULE_16___default.a.TabContent,
hidden: tab !== 'components'
}, react__WEBPACK_IMPORTED_MODULE_2___default.a.createElement(_Components_Components__WEBPACK_IMPORTED_MODULE_5__["default"], {
portalContainer: componentsPortalContainer
})), react__WEBPACK_IMPORTED_MODULE_2___default.a.createElement("div", {
className: _DevTools_css__WEBPACK_IMPORTED_MODULE_16___default.a.TabContent,
hidden: tab !== 'profiler'
}, react__WEBPACK_IMPORTED_MODULE_2___default.a.createElement(_Profiler_Profiler__WEBPACK_IMPORTED_MODULE_6__["default"], {
portalContainer: profilerPortalContainer
}))))))), warnIfLegacyBackendDetected && react__WEBPACK_IMPORTED_MODULE_2___default.a.createElement(_WarnIfLegacyBackendDetected__WEBPACK_IMPORTED_MODULE_15__["default"], null), warnIfUnsupportedVersionDetected && react__WEBPACK_IMPORTED_MODULE_2___default.a.createElement(_UnsupportedVersionDialog__WEBPACK_IMPORTED_MODULE_14__["default"], null)))));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/ErrorBoundary.css":
/*!*********************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/ErrorBoundary.css ***!
\*********************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../node_modules/css-loader??ref--5-1!./ErrorBoundary.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/ErrorBoundary.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/ErrorBoundary.js":
/*!********************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/ErrorBoundary.js ***!
\********************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return ErrorBoundary; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _ErrorBoundary_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./ErrorBoundary.css */ "../react-devtools-shared/src/devtools/views/ErrorBoundary.css");
/* harmony import */ var _ErrorBoundary_css__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_ErrorBoundary_css__WEBPACK_IMPORTED_MODULE_1__);
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
var ErrorBoundary =
/*#__PURE__*/
function (_Component) {
_inherits(ErrorBoundary, _Component);
function ErrorBoundary() {
var _getPrototypeOf2;
var _this;
_classCallCheck(this, ErrorBoundary);
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
_this = _possibleConstructorReturn(this, (_getPrototypeOf2 = _getPrototypeOf(ErrorBoundary)).call.apply(_getPrototypeOf2, [this].concat(args)));
_defineProperty(_assertThisInitialized(_this), "state", {
callStack: null,
componentStack: null,
errorMessage: null,
hasError: false
});
return _this;
}
_createClass(ErrorBoundary, [{
key: "componentDidCatch",
value: function componentDidCatch(error, _ref) {
var componentStack = _ref.componentStack;
var errorMessage = _typeof(error) === 'object' && error.hasOwnProperty('message') ? error.message : error;
var callStack = _typeof(error) === 'object' && error.hasOwnProperty('stack') ? error.stack.split('\n').slice(1).join('\n') : null;
this.setState({
callStack: callStack,
componentStack: componentStack,
errorMessage: errorMessage,
hasError: true
});
}
}, {
key: "render",
value: function render() {
var children = this.props.children;
var _this$state = this.state,
callStack = _this$state.callStack,
componentStack = _this$state.componentStack,
errorMessage = _this$state.errorMessage,
hasError = _this$state.hasError;
var bugURL = "https://github.com/facebook/react";
if (bugURL) {
var title = "Error: \"".concat(errorMessage || '', "\"");
var label = 'Component: Developer Tools';
var body = 'Describe what you were doing when the bug occurred:';
body += '\n1. ';
body += '\n2. ';
body += '\n3. ';
body += '\n\n---------------------------------------------';
body += '\nPlease do not remove the text below this line';
body += '\n---------------------------------------------';
body += "\n\nDevTools version: ".concat("4.4.0-f749045a5" || false);
if (callStack) {
body += "\n\nCall stack: ".concat(callStack.trim());
}
if (componentStack) {
body += "\n\nComponent stack: ".concat(componentStack.trim());
}
bugURL += "/issues/new?labels=".concat(encodeURI(label), "&title=").concat(encodeURI(title), "&body=").concat(encodeURI(body));
}
if (hasError) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _ErrorBoundary_css__WEBPACK_IMPORTED_MODULE_1___default.a.ErrorBoundary
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _ErrorBoundary_css__WEBPACK_IMPORTED_MODULE_1___default.a.Header
}, "An error was thrown: \"", errorMessage, "\""), bugURL && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("a", {
href: bugURL,
rel: "noopener noreferrer",
target: "_blank",
title: "Report bug"
}, "Report this issue"), !!callStack && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _ErrorBoundary_css__WEBPACK_IMPORTED_MODULE_1___default.a.Stack
}, "The error was thrown ", callStack.trim()), !!componentStack && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _ErrorBoundary_css__WEBPACK_IMPORTED_MODULE_1___default.a.Stack
}, "The error occurred ", componentStack.trim()));
}
return children;
}
}]);
return ErrorBoundary;
}(react__WEBPACK_IMPORTED_MODULE_0__["Component"]);
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Icon.css":
/*!************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Icon.css ***!
\************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../node_modules/css-loader??ref--5-1!./Icon.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Icon.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Icon.js":
/*!***********************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Icon.js ***!
\***********************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return Icon; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _Icon_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Icon.css */ "../react-devtools-shared/src/devtools/views/Icon.css");
/* harmony import */ var _Icon_css__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_Icon_css__WEBPACK_IMPORTED_MODULE_1__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function Icon(_ref) {
var _ref$className = _ref.className,
className = _ref$className === void 0 ? '' : _ref$className,
type = _ref.type;
var pathData = null;
switch (type) {
case 'arrow':
pathData = PATH_ARROW;
break;
case 'code':
pathData = PATH_CODE;
break;
case 'components':
pathData = PATH_COMPONENTS;
break;
case 'copy':
pathData = PATH_COPY;
break;
case 'flame-chart':
pathData = PATH_FLAME_CHART;
break;
case 'interactions':
pathData = PATH_INTERACTIONS;
break;
case 'profiler':
pathData = PATH_PROFILER;
break;
case 'ranked-chart':
pathData = PATH_RANKED_CHART;
break;
case 'search':
pathData = PATH_SEARCH;
break;
case 'settings':
pathData = PATH_SETTINGS;
break;
case 'store-as-global-variable':
pathData = PATH_STORE_AS_GLOBAL_VARIABLE;
break;
default:
console.warn("Unsupported type \"".concat(type, "\" specified for Icon"));
break;
}
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("svg", {
xmlns: "http://www.w3.org/2000/svg",
className: "".concat(_Icon_css__WEBPACK_IMPORTED_MODULE_1___default.a.Icon, " ").concat(className),
width: "24",
height: "24",
viewBox: "0 0 24 24"
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("path", {
d: "M0 0h24v24H0z",
fill: "none"
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("path", {
fill: "currentColor",
d: pathData
}));
}
var PATH_ARROW = 'M8 5v14l11-7z';
var PATH_CODE = "\n M9.4 16.6L4.8 12l4.6-4.6L8 6l-6 6 6 6 1.4-1.4zm5.2 0l4.6-4.6-4.6-4.6L16 6l6 6-6 6-1.4-1.4z\n ";
var PATH_COMPONENTS = 'M9.4 16.6L4.8 12l4.6-4.6L8 6l-6 6 6 6 1.4-1.4zm5.2 0l4.6-4.6-4.6-4.6L16 6l6 6-6 6-1.4-1.4z';
var PATH_COPY = "\n M3 13h2v-2H3v2zm0 4h2v-2H3v2zm2 4v-2H3a2 2 0 0 0 2 2zM3 9h2V7H3v2zm12 12h2v-2h-2v2zm4-18H9a2 2 0 0 0-2\n 2v10a2 2 0 0 0 2 2h10c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 12H9V5h10v10zm-8 6h2v-2h-2v2zm-4 0h2v-2H7v2z\n";
var PATH_FLAME_CHART = "\n M10.0650893,21.5040462 C7.14020814,20.6850349 5,18.0558698 5,14.9390244 C5,14.017627\n 5,9.81707317 7.83333333,7.37804878 C7.83333333,7.37804878 7.58333333,11.199187 10,\n 10.6300813 C11.125,10.326087 13.0062497,7.63043487 8.91666667,2.5 C14.1666667,3.06910569\n 19,9.32926829 19,14.9390244 C19,18.0558698 16.8597919,20.6850349 13.9349107,21.5040462\n C14.454014,21.0118505 14.7765152,20.3233394 14.7765152,19.5613412 C14.7765152,17.2826087\n 12,15.0875871 12,15.0875871 C12,15.0875871 9.22348485,17.2826087 9.22348485,19.5613412\n C9.22348485,20.3233394 9.54598603,21.0118505 10.0650893,21.5040462 Z M12.0833333,20.6514763\n C11.3814715,20.6514763 10.8125,20.1226027 10.8125,19.4702042 C10.8125,18.6069669\n 12.0833333,16.9347829 12.0833333,16.9347829 C12.0833333,16.9347829 13.3541667,18.6069669\n 13.3541667,19.4702042 C13.3541667,20.1226027 12.7851952,20.6514763 12.0833333,20.6514763 Z\n";
var PATH_INTERACTIONS = "\n M23 8c0 1.1-.9 2-2 2-.18 0-.35-.02-.51-.07l-3.56 3.55c.05.16.07.34.07.52 0 1.1-.9 2-2\n 2s-2-.9-2-2c0-.18.02-.36.07-.52l-2.55-2.55c-.16.05-.34.07-.52.07s-.36-.02-.52-.07l-4.55\n 4.56c.05.16.07.33.07.51 0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2c.18 0 .35.02.51.07l4.56-4.55C8.02\n 9.36 8 9.18 8 9c0-1.1.9-2 2-2s2 .9 2 2c0 .18-.02.36-.07.52l2.55\n 2.55c.16-.05.34-.07.52-.07s.36.02.52.07l3.55-3.56C19.02 8.35 19 8.18 19 8c0-1.1.9-2 2-2s2 .9 2 2z\n";
var PATH_PROFILER = 'M5 9.2h3V19H5zM10.6 5h2.8v14h-2.8zm5.6 8H19v6h-2.8z';
var PATH_SEARCH = "\n M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91\n 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99\n 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z\n";
var PATH_RANKED_CHART = 'M3 5h18v3H3zM3 10.5h13v3H3zM3 16h8v3H3z';
var PATH_SETTINGS = "\n M19.43 12.98c.04-.32.07-.64.07-.98s-.03-.66-.07-.98l2.11-1.65c.19-.15.24-.42.12-.64l-2-3.46c-.12-.22-.39-.3-.61-.22l-2.49\n 1c-.52-.4-1.08-.73-1.69-.98l-.38-2.65C14.46 2.18 14.25 2 14 2h-4c-.25 0-.46.18-.49.42l-.38\n 2.65c-.61.25-1.17.59-1.69.98l-2.49-1c-.23-.09-.49 0-.61.22l-2 3.46c-.13.22-.07.49.12.64l2.11\n 1.65c-.04.32-.07.65-.07.98s.03.66.07.98l-2.11 1.65c-.19.15-.24.42-.12.64l2 3.46c.12.22.39.3.61.22l2.49-1c.52.4\n 1.08.73 1.69.98l.38 2.65c.03.24.24.42.49.42h4c.25 0 .46-.18.49-.42l.38-2.65c.61-.25 1.17-.59 1.69-.98l2.49\n 1c.23.09.49 0 .61-.22l2-3.46c.12-.22.07-.49-.12-.64l-2.11-1.65zM12 15.5c-1.93 0-3.5-1.57-3.5-3.5s1.57-3.5\n 3.5-3.5 3.5 1.57 3.5 3.5-1.57 3.5-3.5 3.5z\n";
var PATH_STORE_AS_GLOBAL_VARIABLE = "\n M20 8h-2.81c-.45-.78-1.07-1.45-1.82-1.96L17 4.41 15.59 3l-2.17 2.17C12.96 5.06 12.49 5 12 5c-.49 0-.96.06-1.41.17L8.41\n 3 7 4.41l1.62 1.63C7.88 6.55 7.26 7.22 6.81 8H4v2h2.09c-.05.33-.09.66-.09 1v1H4v2h2v1c0 .34.04.67.09 1H4v2h2.81c1.04\n 1.79 2.97 3 5.19 3s4.15-1.21 5.19-3H20v-2h-2.09c.05-.33.09-.66.09-1v-1h2v-2h-2v-1c0-.34-.04-.67-.09-1H20V8zm-6\n 8h-4v-2h4v2zm0-4h-4v-2h4v2z\n";
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/ModalDialog.css":
/*!*******************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/ModalDialog.css ***!
\*******************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../node_modules/css-loader??ref--5-1!./ModalDialog.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/ModalDialog.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/ModalDialog.js":
/*!******************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/ModalDialog.js ***!
\******************************************************************/
/*! exports provided: ModalDialog, ModalDialogContext, ModalDialogContextController */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ModalDialog", function() { return ModalDialog; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ModalDialogContext", function() { return ModalDialogContext; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ModalDialogContextController", function() { return ModalDialogContextController; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _Button__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Button */ "../react-devtools-shared/src/devtools/views/Button.js");
/* harmony import */ var _hooks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./hooks */ "../react-devtools-shared/src/devtools/views/hooks.js");
/* harmony import */ var _ModalDialog_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./ModalDialog.css */ "../react-devtools-shared/src/devtools/views/ModalDialog.css");
/* harmony import */ var _ModalDialog_css__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_ModalDialog_css__WEBPACK_IMPORTED_MODULE_3__);
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
var ModalDialogContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["createContext"])(null);
ModalDialogContext.displayName = 'ModalDialogContext';
function dialogReducer(state, action) {
switch (action.type) {
case 'HIDE':
return {
canBeDismissed: true,
content: null,
isVisible: false,
title: null
};
case 'SHOW':
return {
canBeDismissed: action.canBeDismissed !== false,
content: action.content,
isVisible: true,
title: action.title || null
};
default:
throw new Error("Invalid action \"".concat(action.type, "\""));
}
}
function ModalDialogContextController(_ref) {
var children = _ref.children;
var _useReducer = Object(react__WEBPACK_IMPORTED_MODULE_0__["useReducer"])(dialogReducer, {
canBeDismissed: true,
content: null,
isVisible: false,
title: null
}),
_useReducer2 = _slicedToArray(_useReducer, 2),
state = _useReducer2[0],
dispatch = _useReducer2[1];
var value = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
return {
canBeDismissed: state.canBeDismissed,
content: state.content,
isVisible: state.isVisible,
title: state.title,
dispatch: dispatch
};
}, [state, dispatch]);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(ModalDialogContext.Provider, {
value: value
}, children);
}
function ModalDialog(_) {
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(ModalDialogContext),
isVisible = _useContext.isVisible;
return isVisible ? react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(ModalDialogImpl, null) : null;
}
function ModalDialogImpl(_) {
var _useContext2 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(ModalDialogContext),
canBeDismissed = _useContext2.canBeDismissed,
content = _useContext2.content,
dispatch = _useContext2.dispatch,
title = _useContext2.title;
var dismissModal = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function () {
if (canBeDismissed) {
dispatch({
type: 'HIDE'
});
}
}, [canBeDismissed, dispatch]);
var dialogRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(null); // It's important to trap click events within the dialog,
// so the dismiss hook will use it for click hit detection.
// Because multiple tabs may be showing this ModalDialog,
// the normal `dialog.contains(target)` check would fail on a background tab.
Object(_hooks__WEBPACK_IMPORTED_MODULE_2__["useModalDismissSignal"])(dialogRef, dismissModal, false); // Clicks on the dialog should not bubble.
// This way we can dismiss by listening to clicks on the background.
var handleDialogClick = function handleDialogClick(event) {
event.stopPropagation(); // It is important that we don't also prevent default,
// or clicks within the dialog (e.g. on links) won't work.
};
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _ModalDialog_css__WEBPACK_IMPORTED_MODULE_3___default.a.Background,
onClick: dismissModal
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
ref: dialogRef,
className: _ModalDialog_css__WEBPACK_IMPORTED_MODULE_3___default.a.Dialog,
onClick: handleDialogClick
}, title !== null && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _ModalDialog_css__WEBPACK_IMPORTED_MODULE_3___default.a.Title
}, title), content, canBeDismissed && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _ModalDialog_css__WEBPACK_IMPORTED_MODULE_3___default.a.Buttons
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_1__["default"], {
autoFocus: true,
className: _ModalDialog_css__WEBPACK_IMPORTED_MODULE_3___default.a.Button,
onClick: dismissModal
}, "Okay"))));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/ChartNode.css":
/*!**************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/ChartNode.css ***!
\**************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./ChartNode.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/ChartNode.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/ChartNode.js":
/*!*************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/ChartNode.js ***!
\*************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return ChartNode; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _ChartNode_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./ChartNode.css */ "../react-devtools-shared/src/devtools/views/Profiler/ChartNode.css");
/* harmony import */ var _ChartNode_css__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_ChartNode_css__WEBPACK_IMPORTED_MODULE_1__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
var minWidthToDisplay = 35;
function ChartNode(_ref) {
var color = _ref.color,
height = _ref.height,
_ref$isDimmed = _ref.isDimmed,
isDimmed = _ref$isDimmed === void 0 ? false : _ref$isDimmed,
label = _ref.label,
onClick = _ref.onClick,
onDoubleClick = _ref.onDoubleClick,
textStyle = _ref.textStyle,
width = _ref.width,
x = _ref.x,
y = _ref.y;
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("g", {
className: _ChartNode_css__WEBPACK_IMPORTED_MODULE_1___default.a.Group,
transform: "translate(".concat(x, ",").concat(y, ")")
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("title", null, label), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("rect", {
width: width,
height: height,
fill: color,
onClick: onClick,
onDoubleClick: onDoubleClick,
className: _ChartNode_css__WEBPACK_IMPORTED_MODULE_1___default.a.Rect,
style: {
opacity: isDimmed ? 0.5 : 1
}
}), width >= minWidthToDisplay && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("foreignObject", {
width: width,
height: height,
className: _ChartNode_css__WEBPACK_IMPORTED_MODULE_1___default.a.ForeignObject,
style: {
paddingLeft: x < 0 ? -x : 0,
opacity: isDimmed ? 0.75 : 1,
display: width < minWidthToDisplay ? 'none' : 'block'
},
y: 0
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _ChartNode_css__WEBPACK_IMPORTED_MODULE_1___default.a.Div,
style: textStyle
}, label)));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/ClearProfilingDataButton.js":
/*!****************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/ClearProfilingDataButton.js ***!
\****************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return ClearProfilingDataButton; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _ProfilerContext__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./ProfilerContext */ "../react-devtools-shared/src/devtools/views/Profiler/ProfilerContext.js");
/* harmony import */ var _Button__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../Button */ "../react-devtools-shared/src/devtools/views/Button.js");
/* harmony import */ var _ButtonIcon__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../ButtonIcon */ "../react-devtools-shared/src/devtools/views/ButtonIcon.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../context */ "../react-devtools-shared/src/devtools/views/context.js");
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function ClearProfilingDataButton() {
var store = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_4__["StoreContext"]);
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_ProfilerContext__WEBPACK_IMPORTED_MODULE_1__["ProfilerContext"]),
didRecordCommits = _useContext.didRecordCommits,
isProfiling = _useContext.isProfiling;
var profilerStore = store.profilerStore;
var clear = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function () {
return profilerStore.clear();
}, [profilerStore]);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_2__["default"], {
disabled: isProfiling || !didRecordCommits,
onClick: clear,
title: "Clear profiling data"
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_3__["default"], {
type: "clear"
}));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/CommitFlamegraph.css":
/*!*********************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/CommitFlamegraph.css ***!
\*********************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./CommitFlamegraph.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/CommitFlamegraph.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/CommitFlamegraph.js":
/*!********************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/CommitFlamegraph.js ***!
\********************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return CommitFlamegraphAutoSizer; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_virtualized_auto_sizer__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-virtualized-auto-sizer */ "../../node_modules/react-virtualized-auto-sizer/dist/index.esm.js");
/* harmony import */ var react_window__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-window */ "../react-devtools-shared/src/node_modules/react-window/dist/index.esm.js");
/* harmony import */ var _ProfilerContext__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./ProfilerContext */ "../react-devtools-shared/src/devtools/views/Profiler/ProfilerContext.js");
/* harmony import */ var _NoCommitData__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./NoCommitData */ "../react-devtools-shared/src/devtools/views/Profiler/NoCommitData.js");
/* harmony import */ var _CommitFlamegraphListItem__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./CommitFlamegraphListItem */ "../react-devtools-shared/src/devtools/views/Profiler/CommitFlamegraphListItem.js");
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./utils */ "../react-devtools-shared/src/devtools/views/Profiler/utils.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var _Settings_SettingsContext__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../Settings/SettingsContext */ "../react-devtools-shared/src/devtools/views/Settings/SettingsContext.js");
/* harmony import */ var _CommitFlamegraph_css__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./CommitFlamegraph.css */ "../react-devtools-shared/src/devtools/views/Profiler/CommitFlamegraph.css");
/* harmony import */ var _CommitFlamegraph_css__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(_CommitFlamegraph_css__WEBPACK_IMPORTED_MODULE_9__);
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function CommitFlamegraphAutoSizer(_) {
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_7__["StoreContext"]),
profilerStore = _useContext.profilerStore;
var _useContext2 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_ProfilerContext__WEBPACK_IMPORTED_MODULE_3__["ProfilerContext"]),
rootID = _useContext2.rootID,
selectedCommitIndex = _useContext2.selectedCommitIndex,
selectFiber = _useContext2.selectFiber;
var profilingCache = profilerStore.profilingCache;
var deselectCurrentFiber = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (event) {
event.stopPropagation();
selectFiber(null, null);
}, [selectFiber]);
var commitTree = null;
var chartData = null;
if (selectedCommitIndex !== null) {
commitTree = profilingCache.getCommitTree({
commitIndex: selectedCommitIndex,
rootID: rootID
});
chartData = profilingCache.getFlamegraphChartData({
commitIndex: selectedCommitIndex,
commitTree: commitTree,
rootID: rootID
});
}
if (commitTree != null && chartData != null && chartData.depth > 0) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _CommitFlamegraph_css__WEBPACK_IMPORTED_MODULE_9___default.a.Container,
onClick: deselectCurrentFiber
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react_virtualized_auto_sizer__WEBPACK_IMPORTED_MODULE_1__["default"], null, function (_ref) {
var height = _ref.height,
width = _ref.width;
return (// Force Flow types to avoid checking for `null` here because there's no static proof that
// by the time this render prop function is called, the values of the `let` variables have not changed.
react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(CommitFlamegraph, {
chartData: chartData,
commitTree: commitTree,
height: height,
width: width
})
);
}));
} else {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_NoCommitData__WEBPACK_IMPORTED_MODULE_4__["default"], null);
}
}
function CommitFlamegraph(_ref2) {
var chartData = _ref2.chartData,
commitTree = _ref2.commitTree,
height = _ref2.height,
width = _ref2.width;
var _useContext3 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_Settings_SettingsContext__WEBPACK_IMPORTED_MODULE_8__["SettingsContext"]),
lineHeight = _useContext3.lineHeight;
var _useContext4 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_ProfilerContext__WEBPACK_IMPORTED_MODULE_3__["ProfilerContext"]),
selectFiber = _useContext4.selectFiber,
selectedFiberID = _useContext4.selectedFiberID;
var selectedChartNodeIndex = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
if (selectedFiberID === null) {
return 0;
} // The selected node might not be in the tree for this commit,
// so it's important that we have a fallback plan.
var depth = chartData.idToDepthMap.get(selectedFiberID);
return depth !== undefined ? depth - 1 : 0;
}, [chartData, selectedFiberID]);
var selectedChartNode = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
if (selectedFiberID !== null) {
return chartData.rows[selectedChartNodeIndex].find(function (chartNode) {
return chartNode.id === selectedFiberID;
}) || null;
}
return null;
}, [chartData, selectedFiberID, selectedChartNodeIndex]);
var itemData = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
return {
chartData: chartData,
scaleX: Object(_utils__WEBPACK_IMPORTED_MODULE_6__["scale"])(0, selectedChartNode !== null ? selectedChartNode.treeBaseDuration : chartData.baseDuration, 0, width),
selectedChartNode: selectedChartNode,
selectedChartNodeIndex: selectedChartNodeIndex,
selectFiber: selectFiber,
width: width
};
}, [chartData, selectedChartNode, selectedChartNodeIndex, selectFiber, width]);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react_window__WEBPACK_IMPORTED_MODULE_2__["FixedSizeList"], {
height: height,
innerElementType: InnerElementType,
itemCount: chartData.depth,
itemData: itemData,
itemSize: lineHeight,
width: width
}, _CommitFlamegraphListItem__WEBPACK_IMPORTED_MODULE_5__["default"]);
}
var InnerElementType = Object(react__WEBPACK_IMPORTED_MODULE_0__["forwardRef"])(function (_ref3, ref) {
var children = _ref3.children,
rest = _objectWithoutProperties(_ref3, ["children"]);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("svg", _extends({
ref: ref
}, rest), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("defs", null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("pattern", {
id: "didNotRenderPattern",
patternUnits: "userSpaceOnUse",
width: "4",
height: "4"
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("path", {
d: "M-1,1 l2,-2 M0,4 l4,-4 M3,5 l2,-2",
className: _CommitFlamegraph_css__WEBPACK_IMPORTED_MODULE_9___default.a.PatternPath
}))), children);
});
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/CommitFlamegraphListItem.js":
/*!****************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/CommitFlamegraphListItem.js ***!
\****************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_window__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-window */ "../react-devtools-shared/src/node_modules/react-window/dist/index.esm.js");
/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./constants */ "../react-devtools-shared/src/devtools/views/Profiler/constants.js");
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./utils */ "../react-devtools-shared/src/devtools/views/Profiler/utils.js");
/* harmony import */ var _ChartNode__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./ChartNode */ "../react-devtools-shared/src/devtools/views/Profiler/ChartNode.js");
/* harmony import */ var _Settings_SettingsContext__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../Settings/SettingsContext */ "../react-devtools-shared/src/devtools/views/Settings/SettingsContext.js");
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function CommitFlamegraphListItem(_ref) {
var data = _ref.data,
index = _ref.index,
style = _ref.style;
var chartData = data.chartData,
scaleX = data.scaleX,
selectedChartNode = data.selectedChartNode,
selectedChartNodeIndex = data.selectedChartNodeIndex,
selectFiber = data.selectFiber,
width = data.width;
var renderPathNodes = chartData.renderPathNodes,
maxSelfDuration = chartData.maxSelfDuration,
rows = chartData.rows;
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_Settings_SettingsContext__WEBPACK_IMPORTED_MODULE_5__["SettingsContext"]),
lineHeight = _useContext.lineHeight;
var handleClick = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (event, id, name) {
event.stopPropagation();
selectFiber(id, name);
}, [selectFiber]); // List items are absolutely positioned using the CSS "top" attribute.
// The "left" value will always be 0.
// Since height is fixed, and width is based on the node's duration,
// We can ignore those values as well.
var top = parseInt(style.top, 10);
var row = rows[index];
var selectedNodeOffset = scaleX(selectedChartNode !== null ? selectedChartNode.offset : 0, width);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, row.map(function (chartNode) {
var didRender = chartNode.didRender,
id = chartNode.id,
label = chartNode.label,
name = chartNode.name,
offset = chartNode.offset,
selfDuration = chartNode.selfDuration,
treeBaseDuration = chartNode.treeBaseDuration;
var nodeOffset = scaleX(offset, width);
var nodeWidth = scaleX(treeBaseDuration, width); // Filter out nodes that are too small to see or click.
// This also helps render large trees faster.
if (nodeWidth < _constants__WEBPACK_IMPORTED_MODULE_2__["barWidthThreshold"]) {
return null;
} // Filter out nodes that are outside of the horizontal window.
if (nodeOffset + nodeWidth < selectedNodeOffset || nodeOffset > selectedNodeOffset + width) {
return null;
}
var color = 'url(#didNotRenderPattern)';
var textColor = 'var(--color-commit-did-not-render-pattern-text)';
if (didRender) {
color = Object(_utils__WEBPACK_IMPORTED_MODULE_3__["getGradientColor"])(selfDuration / maxSelfDuration);
textColor = 'var(--color-commit-gradient-text)';
} else if (renderPathNodes.has(id)) {
color = 'var(--color-commit-did-not-render-fill)';
textColor = 'var(--color-commit-did-not-render-fill-text)';
}
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ChartNode__WEBPACK_IMPORTED_MODULE_4__["default"], {
color: color,
height: lineHeight,
isDimmed: index < selectedChartNodeIndex,
key: id,
label: label,
onClick: function onClick(event) {
return handleClick(event, id, name);
},
textStyle: {
color: textColor
},
width: nodeWidth,
x: nodeOffset - selectedNodeOffset,
y: top
});
}));
}
/* harmony default export */ __webpack_exports__["default"] = (Object(react__WEBPACK_IMPORTED_MODULE_0__["memo"])(CommitFlamegraphListItem, react_window__WEBPACK_IMPORTED_MODULE_1__["areEqual"]));
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/CommitRanked.css":
/*!*****************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/CommitRanked.css ***!
\*****************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./CommitRanked.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/CommitRanked.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/CommitRanked.js":
/*!****************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/CommitRanked.js ***!
\****************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return CommitRankedAutoSizer; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_virtualized_auto_sizer__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-virtualized-auto-sizer */ "../../node_modules/react-virtualized-auto-sizer/dist/index.esm.js");
/* harmony import */ var react_window__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-window */ "../react-devtools-shared/src/node_modules/react-window/dist/index.esm.js");
/* harmony import */ var _ProfilerContext__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./ProfilerContext */ "../react-devtools-shared/src/devtools/views/Profiler/ProfilerContext.js");
/* harmony import */ var _NoCommitData__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./NoCommitData */ "../react-devtools-shared/src/devtools/views/Profiler/NoCommitData.js");
/* harmony import */ var _CommitRankedListItem__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./CommitRankedListItem */ "../react-devtools-shared/src/devtools/views/Profiler/CommitRankedListItem.js");
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./utils */ "../react-devtools-shared/src/devtools/views/Profiler/utils.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var _Settings_SettingsContext__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../Settings/SettingsContext */ "../react-devtools-shared/src/devtools/views/Settings/SettingsContext.js");
/* harmony import */ var _CommitRanked_css__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./CommitRanked.css */ "../react-devtools-shared/src/devtools/views/Profiler/CommitRanked.css");
/* harmony import */ var _CommitRanked_css__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(_CommitRanked_css__WEBPACK_IMPORTED_MODULE_9__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function CommitRankedAutoSizer(_) {
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_7__["StoreContext"]),
profilerStore = _useContext.profilerStore;
var _useContext2 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_ProfilerContext__WEBPACK_IMPORTED_MODULE_3__["ProfilerContext"]),
rootID = _useContext2.rootID,
selectedCommitIndex = _useContext2.selectedCommitIndex,
selectFiber = _useContext2.selectFiber;
var profilingCache = profilerStore.profilingCache;
var deselectCurrentFiber = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (event) {
event.stopPropagation();
selectFiber(null, null);
}, [selectFiber]);
var commitTree = null;
var chartData = null;
if (selectedCommitIndex !== null) {
commitTree = profilingCache.getCommitTree({
commitIndex: selectedCommitIndex,
rootID: rootID
});
chartData = profilingCache.getRankedChartData({
commitIndex: selectedCommitIndex,
commitTree: commitTree,
rootID: rootID
});
}
if (commitTree != null && chartData != null && chartData.nodes.length > 0) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _CommitRanked_css__WEBPACK_IMPORTED_MODULE_9___default.a.Container,
onClick: deselectCurrentFiber
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react_virtualized_auto_sizer__WEBPACK_IMPORTED_MODULE_1__["default"], null, function (_ref) {
var height = _ref.height,
width = _ref.width;
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(CommitRanked, {
chartData: chartData,
commitTree: commitTree,
height: height,
width: width
});
}));
} else {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_NoCommitData__WEBPACK_IMPORTED_MODULE_4__["default"], null);
}
}
function CommitRanked(_ref2) {
var chartData = _ref2.chartData,
commitTree = _ref2.commitTree,
height = _ref2.height,
width = _ref2.width;
var _useContext3 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_Settings_SettingsContext__WEBPACK_IMPORTED_MODULE_8__["SettingsContext"]),
lineHeight = _useContext3.lineHeight;
var _useContext4 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_ProfilerContext__WEBPACK_IMPORTED_MODULE_3__["ProfilerContext"]),
selectedFiberID = _useContext4.selectedFiberID,
selectFiber = _useContext4.selectFiber;
var selectedFiberIndex = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
return getNodeIndex(chartData, selectedFiberID);
}, [chartData, selectedFiberID]);
var itemData = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
return {
chartData: chartData,
scaleX: Object(_utils__WEBPACK_IMPORTED_MODULE_6__["scale"])(0, chartData.nodes[selectedFiberIndex].value, 0, width),
selectedFiberID: selectedFiberID,
selectedFiberIndex: selectedFiberIndex,
selectFiber: selectFiber,
width: width
};
}, [chartData, selectedFiberID, selectedFiberIndex, selectFiber, width]);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react_window__WEBPACK_IMPORTED_MODULE_2__["FixedSizeList"], {
height: height,
innerElementType: "svg",
itemCount: chartData.nodes.length,
itemData: itemData,
itemSize: lineHeight,
width: width
}, _CommitRankedListItem__WEBPACK_IMPORTED_MODULE_5__["default"]);
}
var getNodeIndex = function getNodeIndex(chartData, id) {
if (id === null) {
return 0;
}
var nodes = chartData.nodes;
for (var index = 0; index < nodes.length; index++) {
if (nodes[index].id === id) {
return index;
}
}
return 0;
};
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/CommitRankedListItem.js":
/*!************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/CommitRankedListItem.js ***!
\************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_window__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-window */ "../react-devtools-shared/src/node_modules/react-window/dist/index.esm.js");
/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./constants */ "../react-devtools-shared/src/devtools/views/Profiler/constants.js");
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./utils */ "../react-devtools-shared/src/devtools/views/Profiler/utils.js");
/* harmony import */ var _ChartNode__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./ChartNode */ "../react-devtools-shared/src/devtools/views/Profiler/ChartNode.js");
/* harmony import */ var _Settings_SettingsContext__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../Settings/SettingsContext */ "../react-devtools-shared/src/devtools/views/Settings/SettingsContext.js");
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function CommitRankedListItem(_ref) {
var data = _ref.data,
index = _ref.index,
style = _ref.style;
var chartData = data.chartData,
scaleX = data.scaleX,
selectedFiberIndex = data.selectedFiberIndex,
selectFiber = data.selectFiber,
width = data.width;
var node = chartData.nodes[index];
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_Settings_SettingsContext__WEBPACK_IMPORTED_MODULE_5__["SettingsContext"]),
lineHeight = _useContext.lineHeight;
var handleClick = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (event) {
event.stopPropagation();
selectFiber(node.id, node.name);
}, [node, selectFiber]); // List items are absolutely positioned using the CSS "top" attribute.
// The "left" value will always be 0.
// Since height is fixed, and width is based on the node's duration,
// We can ignore those values as well.
var top = parseInt(style.top, 10);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ChartNode__WEBPACK_IMPORTED_MODULE_4__["default"], {
color: Object(_utils__WEBPACK_IMPORTED_MODULE_3__["getGradientColor"])(node.value / chartData.maxValue),
height: lineHeight,
isDimmed: index < selectedFiberIndex,
key: node.id,
label: node.label,
onClick: handleClick,
width: Math.max(_constants__WEBPACK_IMPORTED_MODULE_2__["minBarWidth"], scaleX(node.value, width)),
x: 0,
y: top
});
}
/* harmony default export */ __webpack_exports__["default"] = (Object(react__WEBPACK_IMPORTED_MODULE_0__["memo"])(CommitRankedListItem, react_window__WEBPACK_IMPORTED_MODULE_1__["areEqual"]));
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/CommitTreeBuilder.js":
/*!*********************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/CommitTreeBuilder.js ***!
\*********************************************************************************/
/*! exports provided: getCommitTree, invalidateCommitTrees */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getCommitTree", function() { return getCommitTree; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "invalidateCommitTrees", function() { return invalidateCommitTrees; });
/* harmony import */ var react_devtools_shared_src_constants__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react-devtools-shared/src/constants */ "../react-devtools-shared/src/constants.js");
/* harmony import */ var react_devtools_shared_src_utils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-devtools-shared/src/utils */ "../react-devtools-shared/src/utils.js");
/* harmony import */ var react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-devtools-shared/src/types */ "../react-devtools-shared/src/types.js");
/* harmony import */ var react_devtools_shared_src_devtools_ProfilerStore__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react-devtools-shared/src/devtools/ProfilerStore */ "../react-devtools-shared/src/devtools/ProfilerStore.js");
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
var debug = function debug(methodName) {
if (react_devtools_shared_src_constants__WEBPACK_IMPORTED_MODULE_0__["__DEBUG__"]) {
var _console;
for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
args[_key - 1] = arguments[_key];
}
(_console = console).log.apply(_console, ["%cCommitTreeBuilder %c".concat(methodName), 'color: pink; font-weight: bold;', 'font-weight: bold;'].concat(args));
}
};
var rootToCommitTreeMap = new Map();
function getCommitTree(_ref) {
var commitIndex = _ref.commitIndex,
profilerStore = _ref.profilerStore,
rootID = _ref.rootID;
if (!rootToCommitTreeMap.has(rootID)) {
rootToCommitTreeMap.set(rootID, []);
}
var commitTrees = rootToCommitTreeMap.get(rootID);
if (commitIndex < commitTrees.length) {
return commitTrees[commitIndex];
}
var profilingData = profilerStore.profilingData;
if (profilingData === null) {
throw Error("No profiling data available");
}
var dataForRoot = profilingData.dataForRoots.get(rootID);
if (dataForRoot == null) {
throw Error("Could not find profiling data for root \"".concat(rootID, "\""));
}
var operations = dataForRoot.operations; // Commits are generated sequentially and cached.
// If this is the very first commit, start with the cached snapshot and apply the first mutation.
// Otherwise load (or generate) the previous commit and append a mutation to it.
if (commitIndex === 0) {
var nodes = new Map(); // Construct the initial tree.
recursivelyInitializeTree(rootID, 0, nodes, dataForRoot); // Mutate the tree
if (operations != null && commitIndex < operations.length) {
var commitTree = updateTree({
nodes: nodes,
rootID: rootID
}, operations[commitIndex]);
if (react_devtools_shared_src_constants__WEBPACK_IMPORTED_MODULE_0__["__DEBUG__"]) {
__printTree(commitTree);
}
commitTrees.push(commitTree);
return commitTree;
}
} else {
var previousCommitTree = getCommitTree({
commitIndex: commitIndex - 1,
profilerStore: profilerStore,
rootID: rootID
});
if (operations != null && commitIndex < operations.length) {
var _commitTree = updateTree(previousCommitTree, operations[commitIndex]);
if (react_devtools_shared_src_constants__WEBPACK_IMPORTED_MODULE_0__["__DEBUG__"]) {
__printTree(_commitTree);
}
commitTrees.push(_commitTree);
return _commitTree;
}
}
throw Error("getCommitTree(): Unable to reconstruct tree for root \"".concat(rootID, "\" and commit ").concat(commitIndex));
}
function recursivelyInitializeTree(id, parentID, nodes, dataForRoot) {
var node = dataForRoot.snapshots.get(id);
if (node != null) {
nodes.set(id, {
id: id,
children: node.children,
displayName: node.displayName,
key: node.key,
parentID: parentID,
treeBaseDuration: dataForRoot.initialTreeBaseDurations.get(id),
type: node.type
});
node.children.forEach(function (childID) {
return recursivelyInitializeTree(childID, id, nodes, dataForRoot);
});
}
}
function updateTree(commitTree, operations) {
// Clone the original tree so edits don't affect it.
var nodes = new Map(commitTree.nodes); // Clone nodes before mutating them so edits don't affect them.
var getClonedNode = function getClonedNode(id) {
var clonedNode = Object.assign({}, nodes.get(id));
nodes.set(id, clonedNode);
return clonedNode;
};
var i = 2;
var id = null; // Reassemble the string table.
var stringTable = [null];
var stringTableSize = operations[i++];
var stringTableEnd = i + stringTableSize;
while (i < stringTableEnd) {
var nextLength = operations[i++];
var nextString = Object(react_devtools_shared_src_utils__WEBPACK_IMPORTED_MODULE_1__["utfDecodeString"])(operations.slice(i, i + nextLength));
stringTable.push(nextString);
i += nextLength;
}
while (i < operations.length) {
var operation = operations[i];
switch (operation) {
case react_devtools_shared_src_constants__WEBPACK_IMPORTED_MODULE_0__["TREE_OPERATION_ADD"]:
id = operations[i + 1];
var type = operations[i + 2];
i += 3;
if (nodes.has(id)) {
throw new Error('Commit tree already contains fiber ' + id + '. This is a bug in React DevTools.');
}
if (type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_2__["ElementTypeRoot"]) {
i++; // supportsProfiling flag
i++; // hasOwnerMetadata flag
if (react_devtools_shared_src_constants__WEBPACK_IMPORTED_MODULE_0__["__DEBUG__"]) {
debug('Add', "new root fiber ".concat(id));
}
var node = {
children: [],
displayName: null,
id: id,
key: null,
parentID: 0,
treeBaseDuration: 0,
// This will be updated by a subsequent operation
type: type
};
nodes.set(id, node);
} else {
var parentID = operations[i];
i++;
i++; // ownerID
var displayNameStringID = operations[i];
var displayName = stringTable[displayNameStringID];
i++;
var keyStringID = operations[i];
var key = stringTable[keyStringID];
i++;
if (react_devtools_shared_src_constants__WEBPACK_IMPORTED_MODULE_0__["__DEBUG__"]) {
debug('Add', "fiber ".concat(id, " (").concat(displayName || 'null', ") as child of ").concat(parentID));
}
var parentNode = getClonedNode(parentID);
parentNode.children = parentNode.children.concat(id);
var _node = {
children: [],
displayName: displayName,
id: id,
key: key,
parentID: parentID,
treeBaseDuration: 0,
// This will be updated by a subsequent operation
type: type
};
nodes.set(id, _node);
}
break;
case react_devtools_shared_src_constants__WEBPACK_IMPORTED_MODULE_0__["TREE_OPERATION_REMOVE"]:
{
var removeLength = operations[i + 1];
i += 2;
for (var removeIndex = 0; removeIndex < removeLength; removeIndex++) {
id = operations[i];
i++;
if (!nodes.has(id)) {
throw new Error('Commit tree does not contain fiber ' + id + '. This is a bug in React DevTools.');
}
var _node2 = getClonedNode(id);
var _parentID = _node2.parentID;
nodes.delete(id);
if (!nodes.has(_parentID)) {// No-op
} else {
var _parentNode = getClonedNode(_parentID);
if (react_devtools_shared_src_constants__WEBPACK_IMPORTED_MODULE_0__["__DEBUG__"]) {
debug('Remove', "fiber ".concat(id, " from parent ").concat(_parentID));
}
_parentNode.children = _parentNode.children.filter(function (childID) {
return childID !== id;
});
}
}
break;
}
case react_devtools_shared_src_constants__WEBPACK_IMPORTED_MODULE_0__["TREE_OPERATION_REORDER_CHILDREN"]:
{
id = operations[i + 1];
var numChildren = operations[i + 2];
var children = operations.slice(i + 3, i + 3 + numChildren);
i = i + 3 + numChildren;
if (react_devtools_shared_src_constants__WEBPACK_IMPORTED_MODULE_0__["__DEBUG__"]) {
debug('Re-order', "fiber ".concat(id, " children ").concat(children.join(',')));
}
var _node3 = getClonedNode(id);
_node3.children = Array.from(children);
break;
}
case react_devtools_shared_src_constants__WEBPACK_IMPORTED_MODULE_0__["TREE_OPERATION_UPDATE_TREE_BASE_DURATION"]:
{
id = operations[i + 1];
var _node4 = getClonedNode(id);
_node4.treeBaseDuration = operations[i + 2] / 1000; // Convert microseconds back to milliseconds;
if (react_devtools_shared_src_constants__WEBPACK_IMPORTED_MODULE_0__["__DEBUG__"]) {
debug('Update', "fiber ".concat(id, " treeBaseDuration to ").concat(_node4.treeBaseDuration));
}
i += 3;
break;
}
default:
throw Error("Unsupported Bridge operation ".concat(operation));
}
}
return {
nodes: nodes,
rootID: commitTree.rootID
};
}
function invalidateCommitTrees() {
rootToCommitTreeMap.clear();
} // DEBUG
var __printTree = function __printTree(commitTree) {
if (react_devtools_shared_src_constants__WEBPACK_IMPORTED_MODULE_0__["__DEBUG__"]) {
(function () {
var nodes = commitTree.nodes,
rootID = commitTree.rootID;
console.group('__printTree()');
var queue = [rootID, 0];
var _loop = function _loop() {
var id = queue.shift();
var depth = queue.shift();
var node = nodes.get(id);
if (node == null) {
throw Error("Could not find node with id \"".concat(id, "\" in commit tree"));
}
console.log("".concat('•'.repeat(depth)).concat(node.id, ":").concat(node.displayName || '', " ").concat(node.key ? "key:\"".concat(node.key, "\"") : '', " (").concat(node.treeBaseDuration, ")"));
node.children.forEach(function (childID) {
queue.push(childID, depth + 1);
});
};
while (queue.length > 0) {
_loop();
}
console.groupEnd();
})();
}
};
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/FlamegraphChartBuilder.js":
/*!**************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/FlamegraphChartBuilder.js ***!
\**************************************************************************************/
/*! exports provided: getChartData, invalidateChartData */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getChartData", function() { return getChartData; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "invalidateChartData", function() { return invalidateChartData; });
/* harmony import */ var react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react-devtools-shared/src/types */ "../react-devtools-shared/src/types.js");
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./utils */ "../react-devtools-shared/src/devtools/views/Profiler/utils.js");
/* harmony import */ var react_devtools_shared_src_devtools_ProfilerStore__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-devtools-shared/src/devtools/ProfilerStore */ "../react-devtools-shared/src/devtools/ProfilerStore.js");
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
var cachedChartData = new Map();
function getChartData(_ref) {
var commitIndex = _ref.commitIndex,
commitTree = _ref.commitTree,
profilerStore = _ref.profilerStore,
rootID = _ref.rootID;
var commitDatum = profilerStore.getCommitData(rootID, commitIndex);
var fiberActualDurations = commitDatum.fiberActualDurations,
fiberSelfDurations = commitDatum.fiberSelfDurations;
var nodes = commitTree.nodes;
var chartDataKey = "".concat(rootID, "-").concat(commitIndex);
if (cachedChartData.has(chartDataKey)) {
return cachedChartData.get(chartDataKey);
}
var idToDepthMap = new Map();
var renderPathNodes = new Set();
var rows = [];
var maxDepth = 0;
var maxSelfDuration = 0; // Generate flame graph structure using tree base durations.
var walkTree = function walkTree(id, rightOffset, currentDepth) {
idToDepthMap.set(id, currentDepth);
var node = nodes.get(id);
if (node == null) {
throw Error("Could not find node with id \"".concat(id, "\" in commit tree"));
}
var children = node.children,
displayName = node.displayName,
key = node.key,
treeBaseDuration = node.treeBaseDuration,
type = node.type;
var actualDuration = fiberActualDurations.get(id) || 0;
var selfDuration = fiberSelfDurations.get(id) || 0;
var didRender = fiberActualDurations.has(id);
var name = displayName || 'Anonymous';
var maybeKey = key !== null ? " key=\"".concat(key, "\"") : '';
var maybeBadge = '';
if (type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_0__["ElementTypeForwardRef"]) {
maybeBadge = ' (ForwardRef)';
} else if (type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_0__["ElementTypeMemo"]) {
maybeBadge = ' (Memo)';
}
var label = "".concat(name).concat(maybeBadge).concat(maybeKey);
if (didRender) {
label += " (".concat(Object(_utils__WEBPACK_IMPORTED_MODULE_1__["formatDuration"])(selfDuration), "ms of ").concat(Object(_utils__WEBPACK_IMPORTED_MODULE_1__["formatDuration"])(actualDuration), "ms)");
}
maxDepth = Math.max(maxDepth, currentDepth);
maxSelfDuration = Math.max(maxSelfDuration, selfDuration);
var chartNode = {
actualDuration: actualDuration,
didRender: didRender,
id: id,
label: label,
name: name,
offset: rightOffset - treeBaseDuration,
selfDuration: selfDuration,
treeBaseDuration: treeBaseDuration
};
if (currentDepth > rows.length) {
rows.push([chartNode]);
} else {
rows[currentDepth - 1].push(chartNode);
}
for (var i = children.length - 1; i >= 0; i--) {
var childID = children[i];
var childChartNode = walkTree(childID, rightOffset, currentDepth + 1);
rightOffset -= childChartNode.treeBaseDuration;
}
return chartNode;
};
var baseDuration = 0; // Special case to handle unmounted roots.
if (nodes.size > 0) {
// Skip over the root; we don't want to show it in the flamegraph.
var root = nodes.get(rootID);
if (root == null) {
throw Error("Could not find root node with id \"".concat(rootID, "\" in commit tree"));
} // Don't assume a single root.
// Component filters or Fragments might lead to multiple "roots" in a flame graph.
for (var i = root.children.length - 1; i >= 0; i--) {
var id = root.children[i];
var node = nodes.get(id);
if (node == null) {
throw Error("Could not find node with id \"".concat(id, "\" in commit tree"));
}
baseDuration += node.treeBaseDuration;
walkTree(id, baseDuration, 1);
}
fiberActualDurations.forEach(function (duration, id) {
var node = nodes.get(id);
if (node != null) {
var currentID = node.parentID;
while (currentID !== 0) {
if (renderPathNodes.has(currentID)) {
// We've already walked this path; we can skip it.
break;
} else {
renderPathNodes.add(currentID);
}
node = nodes.get(currentID);
currentID = node != null ? node.parentID : 0;
}
}
});
}
var chartData = {
baseDuration: baseDuration,
depth: maxDepth,
idToDepthMap: idToDepthMap,
maxSelfDuration: maxSelfDuration,
renderPathNodes: renderPathNodes,
rows: rows
};
cachedChartData.set(chartDataKey, chartData);
return chartData;
}
function invalidateChartData() {
cachedChartData.clear();
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/InteractionListItem.css":
/*!************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/InteractionListItem.css ***!
\************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./InteractionListItem.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/InteractionListItem.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/InteractionListItem.js":
/*!***********************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/InteractionListItem.js ***!
\***********************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_window__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-window */ "../react-devtools-shared/src/node_modules/react-window/dist/index.esm.js");
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./utils */ "../react-devtools-shared/src/devtools/views/Profiler/utils.js");
/* harmony import */ var _InteractionListItem_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./InteractionListItem.css */ "../react-devtools-shared/src/devtools/views/Profiler/InteractionListItem.css");
/* harmony import */ var _InteractionListItem_css__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_InteractionListItem_css__WEBPACK_IMPORTED_MODULE_3__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function InteractionListItem(_ref) {
var itemData = _ref.data,
index = _ref.index,
style = _ref.style;
var chartData = itemData.chartData,
dataForRoot = itemData.dataForRoot,
labelWidth = itemData.labelWidth,
scaleX = itemData.scaleX,
selectedInteractionID = itemData.selectedInteractionID,
selectCommitIndex = itemData.selectCommitIndex,
selectInteraction = itemData.selectInteraction,
selectTab = itemData.selectTab;
var commitData = dataForRoot.commitData,
interactionCommits = dataForRoot.interactionCommits;
var interactions = chartData.interactions,
lastInteractionTime = chartData.lastInteractionTime,
maxCommitDuration = chartData.maxCommitDuration;
var interaction = interactions[index];
if (interaction == null) {
throw Error("Could not find interaction #".concat(index));
}
var handleClick = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function () {
selectInteraction(interaction.id);
}, [interaction, selectInteraction]);
var commits = interactionCommits.get(interaction.id) || [];
var startTime = interaction.timestamp;
var stopTime = lastInteractionTime;
var viewCommit = function viewCommit(commitIndex) {
selectTab('flame-chart');
selectCommitIndex(commitIndex);
};
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: selectedInteractionID === interaction.id ? _InteractionListItem_css__WEBPACK_IMPORTED_MODULE_3___default.a.SelectedInteraction : _InteractionListItem_css__WEBPACK_IMPORTED_MODULE_3___default.a.Interaction,
onClick: handleClick,
style: style
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _InteractionListItem_css__WEBPACK_IMPORTED_MODULE_3___default.a.Name,
style: {
maxWidth: labelWidth
},
title: interaction.name
}, interaction.name), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _InteractionListItem_css__WEBPACK_IMPORTED_MODULE_3___default.a.InteractionLine,
style: {
left: labelWidth + scaleX(startTime, 0),
width: scaleX(stopTime - startTime, 0)
}
}), commits.map(function (commitIndex) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _InteractionListItem_css__WEBPACK_IMPORTED_MODULE_3___default.a.CommitBox,
key: commitIndex,
onClick: function onClick() {
return viewCommit(commitIndex);
},
style: {
backgroundColor: Object(_utils__WEBPACK_IMPORTED_MODULE_2__["getGradientColor"])(Math.min(1, Math.max(0, commitData[commitIndex].duration / maxCommitDuration)) || 0),
left: labelWidth + scaleX(commitData[commitIndex].timestamp, 0)
}
});
}));
}
/* harmony default export */ __webpack_exports__["default"] = (Object(react__WEBPACK_IMPORTED_MODULE_0__["memo"])(InteractionListItem, react_window__WEBPACK_IMPORTED_MODULE_1__["areEqual"]));
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/Interactions.css":
/*!*****************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/Interactions.css ***!
\*****************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./Interactions.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/Interactions.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/Interactions.js":
/*!****************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/Interactions.js ***!
\****************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return InteractionsAutoSizer; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_virtualized_auto_sizer__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-virtualized-auto-sizer */ "../../node_modules/react-virtualized-auto-sizer/dist/index.esm.js");
/* harmony import */ var react_window__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-window */ "../react-devtools-shared/src/node_modules/react-window/dist/index.esm.js");
/* harmony import */ var _ProfilerContext__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./ProfilerContext */ "../react-devtools-shared/src/devtools/views/Profiler/ProfilerContext.js");
/* harmony import */ var _InteractionListItem__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./InteractionListItem */ "../react-devtools-shared/src/devtools/views/Profiler/InteractionListItem.js");
/* harmony import */ var _NoInteractions__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./NoInteractions */ "../react-devtools-shared/src/devtools/views/Profiler/NoInteractions.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./utils */ "../react-devtools-shared/src/devtools/views/Profiler/utils.js");
/* harmony import */ var _Interactions_css__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./Interactions.css */ "../react-devtools-shared/src/devtools/views/Profiler/Interactions.css");
/* harmony import */ var _Interactions_css__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_Interactions_css__WEBPACK_IMPORTED_MODULE_8__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function InteractionsAutoSizer(_) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Interactions_css__WEBPACK_IMPORTED_MODULE_8___default.a.Container
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react_virtualized_auto_sizer__WEBPACK_IMPORTED_MODULE_1__["default"], null, function (_ref) {
var height = _ref.height,
width = _ref.width;
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(Interactions, {
height: height,
width: width
});
}));
}
function Interactions(_ref2) {
var height = _ref2.height,
width = _ref2.width;
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_ProfilerContext__WEBPACK_IMPORTED_MODULE_3__["ProfilerContext"]),
rootID = _useContext.rootID,
selectedInteractionID = _useContext.selectedInteractionID,
selectInteraction = _useContext.selectInteraction,
selectCommitIndex = _useContext.selectCommitIndex,
selectTab = _useContext.selectTab;
var _useContext2 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_6__["StoreContext"]),
profilerStore = _useContext2.profilerStore;
var profilingCache = profilerStore.profilingCache;
var dataForRoot = profilerStore.getDataForRoot(rootID);
var chartData = profilingCache.getInteractionsChartData({
rootID: rootID
});
var interactions = chartData.interactions;
var handleKeyDown = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (event) {
var index;
switch (event.key) {
case 'ArrowDown':
index = interactions.findIndex(function (interaction) {
return interaction.id === selectedInteractionID;
});
selectInteraction(Math.min(interactions.length - 1, index + 1));
event.stopPropagation();
break;
case 'ArrowUp':
index = interactions.findIndex(function (interaction) {
return interaction.id === selectedInteractionID;
});
selectInteraction(Math.max(0, index - 1));
event.stopPropagation();
break;
default:
break;
}
}, [interactions, selectedInteractionID, selectInteraction]);
var itemData = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
var interactionCommitSize = parseInt(getComputedStyle(document.body).getPropertyValue('--interaction-commit-size'), 10);
var interactionLabelWidth = parseInt(getComputedStyle(document.body).getPropertyValue('--interaction-label-width'), 10);
var labelWidth = Math.min(interactionLabelWidth, width / 5);
var timelineWidth = width - labelWidth - interactionCommitSize;
return {
chartData: chartData,
dataForRoot: dataForRoot,
labelWidth: labelWidth,
scaleX: Object(_utils__WEBPACK_IMPORTED_MODULE_7__["scale"])(0, chartData.lastInteractionTime, 0, timelineWidth),
selectedInteractionID: selectedInteractionID,
selectCommitIndex: selectCommitIndex,
selectInteraction: selectInteraction,
selectTab: selectTab
};
}, [chartData, dataForRoot, selectedInteractionID, selectCommitIndex, selectInteraction, selectTab, width]); // If a commit contains no fibers with an actualDuration > 0,
// Display a fallback message.
if (interactions.length === 0) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_NoInteractions__WEBPACK_IMPORTED_MODULE_5__["default"], {
height: height,
width: width
});
}
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Interactions_css__WEBPACK_IMPORTED_MODULE_8___default.a.FocusTarget,
onKeyDown: handleKeyDown,
tabIndex: 0
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react_window__WEBPACK_IMPORTED_MODULE_2__["FixedSizeList"], {
height: height,
itemCount: interactions.length,
itemData: itemData,
itemSize: 30,
width: width
}, _InteractionListItem__WEBPACK_IMPORTED_MODULE_4__["default"]));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/InteractionsChartBuilder.js":
/*!****************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/InteractionsChartBuilder.js ***!
\****************************************************************************************/
/*! exports provided: getChartData, invalidateChartData */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getChartData", function() { return getChartData; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "invalidateChartData", function() { return invalidateChartData; });
/* harmony import */ var react_devtools_shared_src_devtools_ProfilerStore__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react-devtools-shared/src/devtools/ProfilerStore */ "../react-devtools-shared/src/devtools/ProfilerStore.js");
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
var cachedChartData = new Map();
function getChartData(_ref) {
var profilerStore = _ref.profilerStore,
rootID = _ref.rootID;
if (cachedChartData.has(rootID)) {
return cachedChartData.get(rootID);
}
var dataForRoot = profilerStore.getDataForRoot(rootID);
if (dataForRoot == null) {
throw Error("Could not find profiling data for root \"".concat(rootID, "\""));
}
var commitData = dataForRoot.commitData,
interactions = dataForRoot.interactions;
var lastInteractionTime = commitData.length > 0 ? commitData[commitData.length - 1].timestamp : 0;
var maxCommitDuration = 0;
commitData.forEach(function (commitDatum) {
maxCommitDuration = Math.max(maxCommitDuration, commitDatum.duration);
});
var chartData = {
interactions: Array.from(interactions.values()),
lastInteractionTime: lastInteractionTime,
maxCommitDuration: maxCommitDuration
};
cachedChartData.set(rootID, chartData);
return chartData;
}
function invalidateChartData() {
cachedChartData.clear();
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/NoCommitData.css":
/*!*****************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/NoCommitData.css ***!
\*****************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./NoCommitData.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/NoCommitData.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/NoCommitData.js":
/*!****************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/NoCommitData.js ***!
\****************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return NoCommitData; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _NoCommitData_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./NoCommitData.css */ "../react-devtools-shared/src/devtools/views/Profiler/NoCommitData.css");
/* harmony import */ var _NoCommitData_css__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_NoCommitData_css__WEBPACK_IMPORTED_MODULE_1__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function NoCommitData(_) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _NoCommitData_css__WEBPACK_IMPORTED_MODULE_1___default.a.NoCommitData
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _NoCommitData_css__WEBPACK_IMPORTED_MODULE_1___default.a.Header
}, "There is no data matching the current filter criteria."), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _NoCommitData_css__WEBPACK_IMPORTED_MODULE_1___default.a.FilterMessage
}, "Try adjusting the commit filter in Profiler settings."));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/NoInteractions.css":
/*!*******************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/NoInteractions.css ***!
\*******************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./NoInteractions.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/NoInteractions.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/NoInteractions.js":
/*!******************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/NoInteractions.js ***!
\******************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return NoInteractions; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _NoInteractions_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./NoInteractions.css */ "../react-devtools-shared/src/devtools/views/Profiler/NoInteractions.css");
/* harmony import */ var _NoInteractions_css__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_NoInteractions_css__WEBPACK_IMPORTED_MODULE_1__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function NoInteractions(_ref) {
var height = _ref.height,
width = _ref.width;
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _NoInteractions_css__WEBPACK_IMPORTED_MODULE_1___default.a.NoInteractions,
style: {
height: height,
width: width
}
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("p", {
className: _NoInteractions_css__WEBPACK_IMPORTED_MODULE_1___default.a.Header
}, "No interactions were recorded."), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("p", null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("a", {
className: _NoInteractions_css__WEBPACK_IMPORTED_MODULE_1___default.a.Link,
href: "http://fb.me/react-interaction-tracing",
rel: "noopener noreferrer",
target: "_blank"
}, "Learn more about the interaction tracing API here.")));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/Profiler.css":
/*!*************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/Profiler.css ***!
\*************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./Profiler.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/Profiler.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/Profiler.js":
/*!************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/Profiler.js ***!
\************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _ModalDialog__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../ModalDialog */ "../react-devtools-shared/src/devtools/views/ModalDialog.js");
/* harmony import */ var _ProfilerContext__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./ProfilerContext */ "../react-devtools-shared/src/devtools/views/Profiler/ProfilerContext.js");
/* harmony import */ var _TabBar__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../TabBar */ "../react-devtools-shared/src/devtools/views/TabBar.js");
/* harmony import */ var _ClearProfilingDataButton__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./ClearProfilingDataButton */ "../react-devtools-shared/src/devtools/views/Profiler/ClearProfilingDataButton.js");
/* harmony import */ var _CommitFlamegraph__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./CommitFlamegraph */ "../react-devtools-shared/src/devtools/views/Profiler/CommitFlamegraph.js");
/* harmony import */ var _CommitRanked__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./CommitRanked */ "../react-devtools-shared/src/devtools/views/Profiler/CommitRanked.js");
/* harmony import */ var _Interactions__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./Interactions */ "../react-devtools-shared/src/devtools/views/Profiler/Interactions.js");
/* harmony import */ var _RootSelector__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./RootSelector */ "../react-devtools-shared/src/devtools/views/Profiler/RootSelector.js");
/* harmony import */ var _RecordToggle__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./RecordToggle */ "../react-devtools-shared/src/devtools/views/Profiler/RecordToggle.js");
/* harmony import */ var _ReloadAndProfileButton__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./ReloadAndProfileButton */ "../react-devtools-shared/src/devtools/views/Profiler/ReloadAndProfileButton.js");
/* harmony import */ var _ProfilingImportExportButtons__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./ProfilingImportExportButtons */ "../react-devtools-shared/src/devtools/views/Profiler/ProfilingImportExportButtons.js");
/* harmony import */ var _SnapshotSelector__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./SnapshotSelector */ "../react-devtools-shared/src/devtools/views/Profiler/SnapshotSelector.js");
/* harmony import */ var _SidebarCommitInfo__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./SidebarCommitInfo */ "../react-devtools-shared/src/devtools/views/Profiler/SidebarCommitInfo.js");
/* harmony import */ var _SidebarInteractions__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./SidebarInteractions */ "../react-devtools-shared/src/devtools/views/Profiler/SidebarInteractions.js");
/* harmony import */ var _SidebarSelectedFiberInfo__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./SidebarSelectedFiberInfo */ "../react-devtools-shared/src/devtools/views/Profiler/SidebarSelectedFiberInfo.js");
/* harmony import */ var react_devtools_shared_src_devtools_views_Settings_SettingsModal__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! react-devtools-shared/src/devtools/views/Settings/SettingsModal */ "../react-devtools-shared/src/devtools/views/Settings/SettingsModal.js");
/* harmony import */ var react_devtools_shared_src_devtools_views_Settings_SettingsModalContextToggle__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! react-devtools-shared/src/devtools/views/Settings/SettingsModalContextToggle */ "../react-devtools-shared/src/devtools/views/Settings/SettingsModalContextToggle.js");
/* harmony import */ var react_devtools_shared_src_devtools_views_Settings_SettingsModalContext__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! react-devtools-shared/src/devtools/views/Settings/SettingsModalContext */ "../react-devtools-shared/src/devtools/views/Settings/SettingsModalContext.js");
/* harmony import */ var _portaledContent__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ../portaledContent */ "../react-devtools-shared/src/devtools/views/portaledContent.js");
/* harmony import */ var _Profiler_css__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ./Profiler.css */ "../react-devtools-shared/src/devtools/views/Profiler/Profiler.css");
/* harmony import */ var _Profiler_css__WEBPACK_IMPORTED_MODULE_20___default = /*#__PURE__*/__webpack_require__.n(_Profiler_css__WEBPACK_IMPORTED_MODULE_20__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function Profiler(_) {
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_ProfilerContext__WEBPACK_IMPORTED_MODULE_2__["ProfilerContext"]),
didRecordCommits = _useContext.didRecordCommits,
isProcessingData = _useContext.isProcessingData,
isProfiling = _useContext.isProfiling,
selectedCommitIndex = _useContext.selectedCommitIndex,
selectedFiberID = _useContext.selectedFiberID,
selectedTabID = _useContext.selectedTabID,
selectTab = _useContext.selectTab,
supportsProfiling = _useContext.supportsProfiling;
var view = null;
if (didRecordCommits) {
switch (selectedTabID) {
case 'flame-chart':
view = react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_CommitFlamegraph__WEBPACK_IMPORTED_MODULE_5__["default"], null);
break;
case 'ranked-chart':
view = react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_CommitRanked__WEBPACK_IMPORTED_MODULE_6__["default"], null);
break;
case 'interactions':
view = react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Interactions__WEBPACK_IMPORTED_MODULE_7__["default"], null);
break;
default:
break;
}
} else if (isProfiling) {
view = react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(RecordingInProgress, null);
} else if (isProcessingData) {
view = react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(ProcessingData, null);
} else if (supportsProfiling) {
view = react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(NoProfilingData, null);
} else {
view = react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(ProfilingNotSupported, null);
}
var sidebar = null;
if (!isProfiling && !isProcessingData && didRecordCommits) {
switch (selectedTabID) {
case 'interactions':
sidebar = react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_SidebarInteractions__WEBPACK_IMPORTED_MODULE_14__["default"], null);
break;
case 'flame-chart':
case 'ranked-chart':
// TRICKY
// Handle edge case where no commit is selected because of a min-duration filter update.
// In that case, the selected commit index would be null.
// We could still show a sidebar for the previously selected fiber,
// but it would be an odd user experience.
// TODO (ProfilerContext) This check should not be necessary.
if (selectedCommitIndex !== null) {
if (selectedFiberID !== null) {
sidebar = react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_SidebarSelectedFiberInfo__WEBPACK_IMPORTED_MODULE_15__["default"], null);
} else {
sidebar = react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_SidebarCommitInfo__WEBPACK_IMPORTED_MODULE_13__["default"], null);
}
}
break;
default:
break;
}
}
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react_devtools_shared_src_devtools_views_Settings_SettingsModalContext__WEBPACK_IMPORTED_MODULE_18__["SettingsModalContextController"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Profiler_css__WEBPACK_IMPORTED_MODULE_20___default.a.Profiler
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Profiler_css__WEBPACK_IMPORTED_MODULE_20___default.a.LeftColumn
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Profiler_css__WEBPACK_IMPORTED_MODULE_20___default.a.Toolbar
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_RecordToggle__WEBPACK_IMPORTED_MODULE_9__["default"], {
disabled: !supportsProfiling
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ReloadAndProfileButton__WEBPACK_IMPORTED_MODULE_10__["default"], null), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ClearProfilingDataButton__WEBPACK_IMPORTED_MODULE_4__["default"], null), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ProfilingImportExportButtons__WEBPACK_IMPORTED_MODULE_11__["default"], null), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Profiler_css__WEBPACK_IMPORTED_MODULE_20___default.a.VRule
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_TabBar__WEBPACK_IMPORTED_MODULE_3__["default"], {
currentTab: selectedTabID,
id: "Profiler",
selectTab: selectTab,
tabs: tabs,
type: "profiler"
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_RootSelector__WEBPACK_IMPORTED_MODULE_8__["default"], null), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Profiler_css__WEBPACK_IMPORTED_MODULE_20___default.a.Spacer
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react_devtools_shared_src_devtools_views_Settings_SettingsModalContextToggle__WEBPACK_IMPORTED_MODULE_17__["default"], null), didRecordCommits && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Profiler_css__WEBPACK_IMPORTED_MODULE_20___default.a.VRule
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_SnapshotSelector__WEBPACK_IMPORTED_MODULE_12__["default"], null))), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Profiler_css__WEBPACK_IMPORTED_MODULE_20___default.a.Content
}, view, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ModalDialog__WEBPACK_IMPORTED_MODULE_1__["ModalDialog"], null))), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Profiler_css__WEBPACK_IMPORTED_MODULE_20___default.a.RightColumn
}, sidebar), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react_devtools_shared_src_devtools_views_Settings_SettingsModal__WEBPACK_IMPORTED_MODULE_16__["default"], null)));
}
var tabs = [{
id: 'flame-chart',
icon: 'flame-chart',
label: 'Flamegraph',
title: 'Flamegraph chart'
}, {
id: 'ranked-chart',
icon: 'ranked-chart',
label: 'Ranked',
title: 'Ranked chart'
}, {
id: 'interactions',
icon: 'interactions',
label: 'Interactions',
title: 'Profiled interactions'
}];
var NoProfilingData = function NoProfilingData() {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Profiler_css__WEBPACK_IMPORTED_MODULE_20___default.a.Column
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Profiler_css__WEBPACK_IMPORTED_MODULE_20___default.a.Header
}, "No profiling data has been recorded."), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Profiler_css__WEBPACK_IMPORTED_MODULE_20___default.a.Row
}, "Click the record button ", react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_RecordToggle__WEBPACK_IMPORTED_MODULE_9__["default"], null), " to start recording."));
};
var ProfilingNotSupported = function ProfilingNotSupported() {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Profiler_css__WEBPACK_IMPORTED_MODULE_20___default.a.Column
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Profiler_css__WEBPACK_IMPORTED_MODULE_20___default.a.Header
}, "Profiling not supported."), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("p", {
className: _Profiler_css__WEBPACK_IMPORTED_MODULE_20___default.a.Paragraph
}, "Profiling support requires either a development or production-profiling build of React v16.5+."), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("p", {
className: _Profiler_css__WEBPACK_IMPORTED_MODULE_20___default.a.Paragraph
}, "Learn more at", ' ', react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("a", {
className: _Profiler_css__WEBPACK_IMPORTED_MODULE_20___default.a.Link,
href: "https://fb.me/react-profiling",
rel: "noopener noreferrer",
target: "_blank"
}, "fb.me/react-profiling"), "."));
};
var ProcessingData = function ProcessingData() {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Profiler_css__WEBPACK_IMPORTED_MODULE_20___default.a.Column
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Profiler_css__WEBPACK_IMPORTED_MODULE_20___default.a.Header
}, "Processing data..."), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Profiler_css__WEBPACK_IMPORTED_MODULE_20___default.a.Row
}, "This should only take a minute."));
};
var RecordingInProgress = function RecordingInProgress() {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Profiler_css__WEBPACK_IMPORTED_MODULE_20___default.a.Column
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Profiler_css__WEBPACK_IMPORTED_MODULE_20___default.a.Header
}, "Profiling is in progress..."), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _Profiler_css__WEBPACK_IMPORTED_MODULE_20___default.a.Row
}, "Click the record button ", react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_RecordToggle__WEBPACK_IMPORTED_MODULE_9__["default"], null), " to stop recording."));
};
/* harmony default export */ __webpack_exports__["default"] = (Object(_portaledContent__WEBPACK_IMPORTED_MODULE_19__["default"])(Profiler));
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/ProfilerContext.js":
/*!*******************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/ProfilerContext.js ***!
\*******************************************************************************/
/*! exports provided: ProfilerContext, ProfilerContextController */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ProfilerContext", function() { return ProfilerContext; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ProfilerContextController", function() { return ProfilerContextController; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ "react-dom");
/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _hooks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../hooks */ "../react-devtools-shared/src/devtools/views/hooks.js");
/* harmony import */ var _Components_TreeContext__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../Components/TreeContext */ "../react-devtools-shared/src/devtools/views/Components/TreeContext.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../context */ "../react-devtools-shared/src/devtools/views/context.js");
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
var ProfilerContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["createContext"])(null);
ProfilerContext.displayName = 'ProfilerContext';
function ProfilerContextController(_ref) {
var children = _ref.children;
var store = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_4__["StoreContext"]);
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_Components_TreeContext__WEBPACK_IMPORTED_MODULE_3__["TreeStateContext"]),
selectedElementID = _useContext.selectedElementID;
var dispatch = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_Components_TreeContext__WEBPACK_IMPORTED_MODULE_3__["TreeDispatcherContext"]);
var profilerStore = store.profilerStore;
var subscription = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
return {
getCurrentValue: function getCurrentValue() {
return {
didRecordCommits: profilerStore.didRecordCommits,
isProcessingData: profilerStore.isProcessingData,
isProfiling: profilerStore.isProfiling,
profilingData: profilerStore.profilingData,
supportsProfiling: store.supportsProfiling
};
},
subscribe: function subscribe(callback) {
profilerStore.addListener('profilingData', callback);
profilerStore.addListener('isProcessingData', callback);
profilerStore.addListener('isProfiling', callback);
store.addListener('supportsProfiling', callback);
return function () {
profilerStore.removeListener('profilingData', callback);
profilerStore.removeListener('isProcessingData', callback);
profilerStore.removeListener('isProfiling', callback);
store.removeListener('supportsProfiling', callback);
};
}
};
}, [profilerStore, store]);
var _useSubscription = Object(_hooks__WEBPACK_IMPORTED_MODULE_2__["useSubscription"])(subscription),
didRecordCommits = _useSubscription.didRecordCommits,
isProcessingData = _useSubscription.isProcessingData,
isProfiling = _useSubscription.isProfiling,
profilingData = _useSubscription.profilingData,
supportsProfiling = _useSubscription.supportsProfiling;
var _useState = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(),
_useState2 = _slicedToArray(_useState, 2),
prevProfilingData = _useState2[0],
setPrevProfilingData = _useState2[1];
var _useState3 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(null),
_useState4 = _slicedToArray(_useState3, 2),
rootID = _useState4[0],
setRootID = _useState4[1];
if (prevProfilingData !== profilingData) {
Object(react_dom__WEBPACK_IMPORTED_MODULE_1__["unstable_batchedUpdates"])(function () {
setPrevProfilingData(profilingData);
var dataForRoots = profilingData !== null ? profilingData.dataForRoots : null;
if (dataForRoots != null) {
var firstRootID = dataForRoots.keys().next().value || null;
if (rootID === null || !dataForRoots.has(rootID)) {
var selectedElementRootID = null;
if (selectedElementID !== null) {
selectedElementRootID = store.getRootIDForElement(selectedElementID);
}
if (selectedElementRootID !== null && dataForRoots.has(selectedElementRootID)) {
setRootID(selectedElementRootID);
} else {
setRootID(firstRootID);
}
}
}
});
}
var startProfiling = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function () {
return store.profilerStore.startProfiling();
}, [store]);
var stopProfiling = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function () {
return store.profilerStore.stopProfiling();
}, [store]);
var _useLocalStorage = Object(_hooks__WEBPACK_IMPORTED_MODULE_2__["useLocalStorage"])('React::DevTools::isCommitFilterEnabled', false),
_useLocalStorage2 = _slicedToArray(_useLocalStorage, 2),
isCommitFilterEnabled = _useLocalStorage2[0],
setIsCommitFilterEnabled = _useLocalStorage2[1];
var _useLocalStorage3 = Object(_hooks__WEBPACK_IMPORTED_MODULE_2__["useLocalStorage"])('minCommitDuration', 0),
_useLocalStorage4 = _slicedToArray(_useLocalStorage3, 2),
minCommitDuration = _useLocalStorage4[0],
setMinCommitDuration = _useLocalStorage4[1];
var _useState5 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(null),
_useState6 = _slicedToArray(_useState5, 2),
selectedCommitIndex = _useState6[0],
selectCommitIndex = _useState6[1];
var _useState7 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])('flame-chart'),
_useState8 = _slicedToArray(_useState7, 2),
selectedTabID = _useState8[0],
selectTab = _useState8[1];
var _useState9 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(null),
_useState10 = _slicedToArray(_useState9, 2),
selectedFiberID = _useState10[0],
selectFiberID = _useState10[1];
var _useState11 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(null),
_useState12 = _slicedToArray(_useState11, 2),
selectedFiberName = _useState12[0],
selectFiberName = _useState12[1];
var _useState13 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(null),
_useState14 = _slicedToArray(_useState13, 2),
selectedInteractionID = _useState14[0],
selectInteraction = _useState14[1];
var selectFiber = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (id, name) {
selectFiberID(id);
selectFiberName(name); // Sync selection to the Components tab for convenience.
if (id !== null) {
var element = store.getElementByID(id); // Keep in mind that profiling data may be from a previous session.
// In that case, IDs may match up arbitrarily; to be safe, compare both ID and display name.
if (element !== null && element.displayName === name) {
dispatch({
type: 'SELECT_ELEMENT_BY_ID',
payload: id
});
}
}
}, [dispatch, selectFiberID, selectFiberName, store]);
if (isProfiling) {
Object(react_dom__WEBPACK_IMPORTED_MODULE_1__["unstable_batchedUpdates"])(function () {
if (selectedCommitIndex !== null) {
selectCommitIndex(null);
}
if (selectedFiberID !== null) {
selectFiberID(null);
selectFiberName(null);
}
if (selectedInteractionID !== null) {
selectInteraction(null);
}
});
}
var value = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
return {
selectedTabID: selectedTabID,
selectTab: selectTab,
didRecordCommits: didRecordCommits,
isProcessingData: isProcessingData,
isProfiling: isProfiling,
profilingData: profilingData,
startProfiling: startProfiling,
stopProfiling: stopProfiling,
supportsProfiling: supportsProfiling,
rootID: rootID,
setRootID: setRootID,
isCommitFilterEnabled: isCommitFilterEnabled,
setIsCommitFilterEnabled: setIsCommitFilterEnabled,
minCommitDuration: minCommitDuration,
setMinCommitDuration: setMinCommitDuration,
selectedCommitIndex: selectedCommitIndex,
selectCommitIndex: selectCommitIndex,
selectedFiberID: selectedFiberID,
selectedFiberName: selectedFiberName,
selectFiber: selectFiber,
selectedInteractionID: selectedInteractionID,
selectInteraction: selectInteraction
};
}, [selectedTabID, selectTab, didRecordCommits, isProcessingData, isProfiling, profilingData, startProfiling, stopProfiling, supportsProfiling, rootID, setRootID, isCommitFilterEnabled, setIsCommitFilterEnabled, minCommitDuration, setMinCommitDuration, selectedCommitIndex, selectCommitIndex, selectedFiberID, selectedFiberName, selectFiber, selectedInteractionID, selectInteraction]);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(ProfilerContext.Provider, {
value: value
}, children);
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/ProfilingImportExportButtons.css":
/*!*********************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/ProfilingImportExportButtons.css ***!
\*********************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./ProfilingImportExportButtons.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/ProfilingImportExportButtons.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/ProfilingImportExportButtons.js":
/*!********************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/ProfilingImportExportButtons.js ***!
\********************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return ProfilingImportExportButtons; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _ProfilerContext__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./ProfilerContext */ "../react-devtools-shared/src/devtools/views/Profiler/ProfilerContext.js");
/* harmony import */ var _ModalDialog__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../ModalDialog */ "../react-devtools-shared/src/devtools/views/ModalDialog.js");
/* harmony import */ var _Button__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../Button */ "../react-devtools-shared/src/devtools/views/Button.js");
/* harmony import */ var _ButtonIcon__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../ButtonIcon */ "../react-devtools-shared/src/devtools/views/ButtonIcon.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./utils */ "../react-devtools-shared/src/devtools/views/Profiler/utils.js");
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../utils */ "../react-devtools-shared/src/devtools/views/utils.js");
/* harmony import */ var _ProfilingImportExportButtons_css__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./ProfilingImportExportButtons.css */ "../react-devtools-shared/src/devtools/views/Profiler/ProfilingImportExportButtons.css");
/* harmony import */ var _ProfilingImportExportButtons_css__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_ProfilingImportExportButtons_css__WEBPACK_IMPORTED_MODULE_8__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function ProfilingImportExportButtons() {
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_ProfilerContext__WEBPACK_IMPORTED_MODULE_1__["ProfilerContext"]),
isProfiling = _useContext.isProfiling,
profilingData = _useContext.profilingData,
rootID = _useContext.rootID;
var store = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_5__["StoreContext"]);
var profilerStore = store.profilerStore;
var inputRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(null);
var downloadRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(null);
var _useContext2 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_ModalDialog__WEBPACK_IMPORTED_MODULE_2__["ModalDialogContext"]),
modalDialogDispatch = _useContext2.dispatch;
var downloadData = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function () {
if (rootID === null) {
return;
}
if (profilingData !== null && downloadRef.current !== null) {
var profilingDataExport = Object(_utils__WEBPACK_IMPORTED_MODULE_6__["prepareProfilingDataExport"])(profilingData);
var date = new Date();
var dateString = date.toLocaleDateString(undefined, {
year: 'numeric',
month: '2-digit',
day: '2-digit'
}).replace(/\//g, '-');
var timeString = date.toLocaleTimeString(undefined, {
hour12: false
}).replace(/:/g, '-');
Object(_utils__WEBPACK_IMPORTED_MODULE_7__["downloadFile"])(downloadRef.current, "profiling-data.".concat(dateString, ".").concat(timeString, ".json"), JSON.stringify(profilingDataExport, null, 2));
}
}, [rootID, profilingData]);
var uploadData = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function () {
if (inputRef.current !== null) {
inputRef.current.click();
}
}, []);
var handleFiles = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function () {
var input = inputRef.current;
if (input !== null && input.files.length > 0) {
var fileReader = new FileReader();
fileReader.addEventListener('load', function () {
try {
var raw = fileReader.result;
var profilingDataExport = JSON.parse(raw);
profilerStore.profilingData = Object(_utils__WEBPACK_IMPORTED_MODULE_6__["prepareProfilingDataFrontendFromExport"])(profilingDataExport);
} catch (error) {
modalDialogDispatch({
type: 'SHOW',
title: 'Import failed',
content: react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", null, "The profiling data you selected cannot be imported."), error !== null && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _ProfilingImportExportButtons_css__WEBPACK_IMPORTED_MODULE_8___default.a.ErrorMessage
}, error.message))
});
}
}); // TODO (profiling) Handle fileReader errors.
fileReader.readAsText(input.files[0]);
}
}, [modalDialogDispatch, profilerStore]);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _ProfilingImportExportButtons_css__WEBPACK_IMPORTED_MODULE_8___default.a.VRule
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("input", {
ref: inputRef,
className: _ProfilingImportExportButtons_css__WEBPACK_IMPORTED_MODULE_8___default.a.Input,
type: "file",
onChange: handleFiles,
tabIndex: -1
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("a", {
ref: downloadRef,
className: _ProfilingImportExportButtons_css__WEBPACK_IMPORTED_MODULE_8___default.a.Input
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_3__["default"], {
disabled: isProfiling,
onClick: uploadData,
title: "Load profile..."
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_4__["default"], {
type: "import"
})), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_3__["default"], {
disabled: isProfiling || !profilerStore.didRecordCommits,
onClick: downloadData,
title: "Save profile..."
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_4__["default"], {
type: "export"
})));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/RankedChartBuilder.js":
/*!**********************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/RankedChartBuilder.js ***!
\**********************************************************************************/
/*! exports provided: getChartData, invalidateChartData */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getChartData", function() { return getChartData; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "invalidateChartData", function() { return invalidateChartData; });
/* harmony import */ var react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react-devtools-shared/src/types */ "../react-devtools-shared/src/types.js");
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./utils */ "../react-devtools-shared/src/devtools/views/Profiler/utils.js");
/* harmony import */ var react_devtools_shared_src_devtools_ProfilerStore__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-devtools-shared/src/devtools/ProfilerStore */ "../react-devtools-shared/src/devtools/ProfilerStore.js");
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
var cachedChartData = new Map();
function getChartData(_ref) {
var commitIndex = _ref.commitIndex,
commitTree = _ref.commitTree,
profilerStore = _ref.profilerStore,
rootID = _ref.rootID;
var commitDatum = profilerStore.getCommitData(rootID, commitIndex);
var fiberActualDurations = commitDatum.fiberActualDurations,
fiberSelfDurations = commitDatum.fiberSelfDurations;
var nodes = commitTree.nodes;
var chartDataKey = "".concat(rootID, "-").concat(commitIndex);
if (cachedChartData.has(chartDataKey)) {
return cachedChartData.get(chartDataKey);
}
var maxSelfDuration = 0;
var chartNodes = [];
fiberActualDurations.forEach(function (actualDuration, id) {
var node = nodes.get(id);
if (node == null) {
throw Error("Could not find node with id \"".concat(id, "\" in commit tree"));
}
var displayName = node.displayName,
key = node.key,
parentID = node.parentID,
type = node.type; // Don't show the root node in this chart.
if (parentID === 0) {
return;
}
var selfDuration = fiberSelfDurations.get(id) || 0;
maxSelfDuration = Math.max(maxSelfDuration, selfDuration);
var name = displayName || 'Anonymous';
var maybeKey = key !== null ? " key=\"".concat(key, "\"") : '';
var maybeBadge = '';
if (type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_0__["ElementTypeForwardRef"]) {
maybeBadge = ' (ForwardRef)';
} else if (type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_0__["ElementTypeMemo"]) {
maybeBadge = ' (Memo)';
}
var label = "".concat(name).concat(maybeBadge).concat(maybeKey, " (").concat(Object(_utils__WEBPACK_IMPORTED_MODULE_1__["formatDuration"])(selfDuration), "ms)");
chartNodes.push({
id: id,
label: label,
name: name,
value: selfDuration
});
});
var chartData = {
maxValue: maxSelfDuration,
nodes: chartNodes.sort(function (a, b) {
return b.value - a.value;
})
};
cachedChartData.set(chartDataKey, chartData);
return chartData;
}
function invalidateChartData() {
cachedChartData.clear();
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/RecordToggle.css":
/*!*****************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/RecordToggle.css ***!
\*****************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./RecordToggle.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/RecordToggle.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/RecordToggle.js":
/*!****************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/RecordToggle.js ***!
\****************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return RecordToggle; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _Button__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../Button */ "../react-devtools-shared/src/devtools/views/Button.js");
/* harmony import */ var _ButtonIcon__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../ButtonIcon */ "../react-devtools-shared/src/devtools/views/ButtonIcon.js");
/* harmony import */ var _ProfilerContext__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./ProfilerContext */ "../react-devtools-shared/src/devtools/views/Profiler/ProfilerContext.js");
/* harmony import */ var _RecordToggle_css__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./RecordToggle.css */ "../react-devtools-shared/src/devtools/views/Profiler/RecordToggle.css");
/* harmony import */ var _RecordToggle_css__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_RecordToggle_css__WEBPACK_IMPORTED_MODULE_4__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function RecordToggle(_ref) {
var disabled = _ref.disabled;
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_ProfilerContext__WEBPACK_IMPORTED_MODULE_3__["ProfilerContext"]),
isProfiling = _useContext.isProfiling,
startProfiling = _useContext.startProfiling,
stopProfiling = _useContext.stopProfiling;
var className = _RecordToggle_css__WEBPACK_IMPORTED_MODULE_4___default.a.InactiveRecordToggle;
if (disabled) {
className = _RecordToggle_css__WEBPACK_IMPORTED_MODULE_4___default.a.DisabledRecordToggle;
} else if (isProfiling) {
className = _RecordToggle_css__WEBPACK_IMPORTED_MODULE_4___default.a.ActiveRecordToggle;
}
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_1__["default"], {
className: className,
disabled: disabled,
onClick: isProfiling ? stopProfiling : startProfiling,
title: isProfiling ? 'Stop profiling' : 'Start profiling'
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_2__["default"], {
type: "record"
}));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/ReloadAndProfileButton.js":
/*!**************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/ReloadAndProfileButton.js ***!
\**************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return ReloadAndProfileButton; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _Button__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../Button */ "../react-devtools-shared/src/devtools/views/Button.js");
/* harmony import */ var _ButtonIcon__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../ButtonIcon */ "../react-devtools-shared/src/devtools/views/ButtonIcon.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var _hooks__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../hooks */ "../react-devtools-shared/src/devtools/views/hooks.js");
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function ReloadAndProfileButton() {
var bridge = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_3__["BridgeContext"]);
var store = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_3__["StoreContext"]);
var subscription = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
return {
getCurrentValue: function getCurrentValue() {
return {
recordChangeDescriptions: store.recordChangeDescriptions,
supportsReloadAndProfile: store.supportsReloadAndProfile
};
},
subscribe: function subscribe(callback) {
store.addListener('recordChangeDescriptions', callback);
store.addListener('supportsReloadAndProfile', callback);
return function () {
store.removeListener('recordChangeDescriptions', callback);
store.removeListener('supportsReloadAndProfile', callback);
};
}
};
}, [store]);
var _useSubscription = Object(_hooks__WEBPACK_IMPORTED_MODULE_4__["useSubscription"])(subscription),
recordChangeDescriptions = _useSubscription.recordChangeDescriptions,
supportsReloadAndProfile = _useSubscription.supportsReloadAndProfile;
var reloadAndProfile = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function () {
// TODO If we want to support reload-and-profile for e.g. React Native,
// we might need to also start profiling here before reloading the app (since DevTools itself isn't reloaded).
// We'd probably want to do this before reloading though, to avoid sending a message on a disconnected port in the browser.
// For now, let's just skip doing it entirely to avoid paying snapshot costs for data we don't need.
// startProfiling();
bridge.send('reloadAndProfile', recordChangeDescriptions);
}, [bridge, recordChangeDescriptions]);
if (!supportsReloadAndProfile) {
return null;
}
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_1__["default"], {
disabled: !store.supportsProfiling,
onClick: reloadAndProfile,
title: "Reload and start profiling"
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_2__["default"], {
type: "reload"
}));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/RootSelector.css":
/*!*****************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/RootSelector.css ***!
\*****************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./RootSelector.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/RootSelector.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/RootSelector.js":
/*!****************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/RootSelector.js ***!
\****************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return RootSelector; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _ProfilerContext__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./ProfilerContext */ "../react-devtools-shared/src/devtools/views/Profiler/ProfilerContext.js");
/* harmony import */ var _RootSelector_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./RootSelector.css */ "../react-devtools-shared/src/devtools/views/Profiler/RootSelector.css");
/* harmony import */ var _RootSelector_css__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_RootSelector_css__WEBPACK_IMPORTED_MODULE_2__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function RootSelector(_) {
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_ProfilerContext__WEBPACK_IMPORTED_MODULE_1__["ProfilerContext"]),
profilingData = _useContext.profilingData,
rootID = _useContext.rootID,
setRootID = _useContext.setRootID;
var options = [];
if (profilingData !== null) {
profilingData.dataForRoots.forEach(function (dataForRoot, id) {
options.push(react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("option", {
key: id,
value: id
}, dataForRoot.displayName));
});
}
var handleChange = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (_ref) {
var currentTarget = _ref.currentTarget;
setRootID(parseInt(currentTarget.value, 10));
}, [setRootID]);
if (profilingData === null || profilingData.dataForRoots.size <= 1) {
// Don't take up visual space if there's only one root.
return null;
}
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _RootSelector_css__WEBPACK_IMPORTED_MODULE_2___default.a.Spacer
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("select", {
value: rootID,
onChange: handleChange
}, options));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/SidebarCommitInfo.css":
/*!**********************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/SidebarCommitInfo.css ***!
\**********************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./SidebarCommitInfo.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/SidebarCommitInfo.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/SidebarCommitInfo.js":
/*!*********************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/SidebarCommitInfo.js ***!
\*********************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return SidebarCommitInfo; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _ProfilerContext__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./ProfilerContext */ "../react-devtools-shared/src/devtools/views/Profiler/ProfilerContext.js");
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./utils */ "../react-devtools-shared/src/devtools/views/Profiler/utils.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var _SidebarCommitInfo_css__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./SidebarCommitInfo.css */ "../react-devtools-shared/src/devtools/views/Profiler/SidebarCommitInfo.css");
/* harmony import */ var _SidebarCommitInfo_css__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_SidebarCommitInfo_css__WEBPACK_IMPORTED_MODULE_4__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function SidebarCommitInfo(_) {
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_ProfilerContext__WEBPACK_IMPORTED_MODULE_1__["ProfilerContext"]),
selectedCommitIndex = _useContext.selectedCommitIndex,
rootID = _useContext.rootID,
selectInteraction = _useContext.selectInteraction,
selectTab = _useContext.selectTab;
var _useContext2 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_3__["StoreContext"]),
profilerStore = _useContext2.profilerStore;
if (rootID === null || selectedCommitIndex === null) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SidebarCommitInfo_css__WEBPACK_IMPORTED_MODULE_4___default.a.NothingSelected
}, "Nothing selected");
}
var _profilerStore$getDat = profilerStore.getDataForRoot(rootID),
interactions = _profilerStore$getDat.interactions;
var _profilerStore$getCom = profilerStore.getCommitData(rootID, selectedCommitIndex),
duration = _profilerStore$getCom.duration,
interactionIDs = _profilerStore$getCom.interactionIDs,
priorityLevel = _profilerStore$getCom.priorityLevel,
timestamp = _profilerStore$getCom.timestamp;
var viewInteraction = function viewInteraction(interactionID) {
selectTab('interactions');
selectInteraction(interactionID);
};
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SidebarCommitInfo_css__WEBPACK_IMPORTED_MODULE_4___default.a.Toolbar
}, "Commit information"), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SidebarCommitInfo_css__WEBPACK_IMPORTED_MODULE_4___default.a.Content
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("ul", {
className: _SidebarCommitInfo_css__WEBPACK_IMPORTED_MODULE_4___default.a.List
}, priorityLevel !== null && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("li", {
className: _SidebarCommitInfo_css__WEBPACK_IMPORTED_MODULE_4___default.a.ListItem
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("label", {
className: _SidebarCommitInfo_css__WEBPACK_IMPORTED_MODULE_4___default.a.Label
}, "Priority"), ":", ' ', react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("span", {
className: _SidebarCommitInfo_css__WEBPACK_IMPORTED_MODULE_4___default.a.Value
}, priorityLevel)), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("li", {
className: _SidebarCommitInfo_css__WEBPACK_IMPORTED_MODULE_4___default.a.ListItem
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("label", {
className: _SidebarCommitInfo_css__WEBPACK_IMPORTED_MODULE_4___default.a.Label
}, "Committed at"), ":", ' ', react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("span", {
className: _SidebarCommitInfo_css__WEBPACK_IMPORTED_MODULE_4___default.a.Value
}, Object(_utils__WEBPACK_IMPORTED_MODULE_2__["formatTime"])(timestamp), "s")), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("li", {
className: _SidebarCommitInfo_css__WEBPACK_IMPORTED_MODULE_4___default.a.ListItem
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("label", {
className: _SidebarCommitInfo_css__WEBPACK_IMPORTED_MODULE_4___default.a.Label
}, "Render duration"), ":", ' ', react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("span", {
className: _SidebarCommitInfo_css__WEBPACK_IMPORTED_MODULE_4___default.a.Value
}, Object(_utils__WEBPACK_IMPORTED_MODULE_2__["formatDuration"])(duration), "ms")), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("li", {
className: _SidebarCommitInfo_css__WEBPACK_IMPORTED_MODULE_4___default.a.Interactions
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("label", {
className: _SidebarCommitInfo_css__WEBPACK_IMPORTED_MODULE_4___default.a.Label
}, "Interactions"), ":", react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SidebarCommitInfo_css__WEBPACK_IMPORTED_MODULE_4___default.a.InteractionList
}, interactionIDs.length === 0 ? react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SidebarCommitInfo_css__WEBPACK_IMPORTED_MODULE_4___default.a.NoInteractions
}, "None") : null, interactionIDs.map(function (interactionID) {
var interaction = interactions.get(interactionID);
if (interaction == null) {
throw Error("Invalid interaction \"".concat(interactionID, "\""));
}
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("button", {
key: interactionID,
className: _SidebarCommitInfo_css__WEBPACK_IMPORTED_MODULE_4___default.a.Interaction,
onClick: function onClick() {
return viewInteraction(interactionID);
}
}, interaction.name);
}))))));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/SidebarInteractions.css":
/*!************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/SidebarInteractions.css ***!
\************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./SidebarInteractions.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/SidebarInteractions.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/SidebarInteractions.js":
/*!***********************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/SidebarInteractions.js ***!
\***********************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return SidebarInteractions; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _ProfilerContext__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./ProfilerContext */ "../react-devtools-shared/src/devtools/views/Profiler/ProfilerContext.js");
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./utils */ "../react-devtools-shared/src/devtools/views/Profiler/utils.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var _SidebarInteractions_css__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./SidebarInteractions.css */ "../react-devtools-shared/src/devtools/views/Profiler/SidebarInteractions.css");
/* harmony import */ var _SidebarInteractions_css__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_SidebarInteractions_css__WEBPACK_IMPORTED_MODULE_4__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function SidebarInteractions(_) {
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_ProfilerContext__WEBPACK_IMPORTED_MODULE_1__["ProfilerContext"]),
selectedInteractionID = _useContext.selectedInteractionID,
rootID = _useContext.rootID,
selectCommitIndex = _useContext.selectCommitIndex,
selectTab = _useContext.selectTab;
var _useContext2 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_3__["StoreContext"]),
profilerStore = _useContext2.profilerStore;
var profilingCache = profilerStore.profilingCache;
if (selectedInteractionID === null) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SidebarInteractions_css__WEBPACK_IMPORTED_MODULE_4___default.a.NothingSelected
}, "Nothing selected");
}
var _profilerStore$getDat = profilerStore.getDataForRoot(rootID),
interactionCommits = _profilerStore$getDat.interactionCommits,
interactions = _profilerStore$getDat.interactions;
var interaction = interactions.get(selectedInteractionID);
if (interaction == null) {
throw Error("Could not find interaction by selected interaction id \"".concat(selectedInteractionID, "\""));
}
var _profilingCache$getIn = profilingCache.getInteractionsChartData({
rootID: rootID
}),
maxCommitDuration = _profilingCache$getIn.maxCommitDuration;
var viewCommit = function viewCommit(commitIndex) {
selectTab('flame-chart');
selectCommitIndex(commitIndex);
};
var listItems = [];
var commitIndices = interactionCommits.get(selectedInteractionID);
if (commitIndices != null) {
commitIndices.forEach(function (commitIndex) {
var _profilerStore$getCom = profilerStore.getCommitData(rootID, commitIndex),
duration = _profilerStore$getCom.duration,
timestamp = _profilerStore$getCom.timestamp;
listItems.push(react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("li", {
key: commitIndex,
className: _SidebarInteractions_css__WEBPACK_IMPORTED_MODULE_4___default.a.ListItem,
onClick: function onClick() {
return viewCommit(commitIndex);
}
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SidebarInteractions_css__WEBPACK_IMPORTED_MODULE_4___default.a.CommitBox,
style: {
backgroundColor: Object(_utils__WEBPACK_IMPORTED_MODULE_2__["getGradientColor"])(Math.min(1, Math.max(0, duration / maxCommitDuration)) || 0)
}
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", null, "timestamp: ", Object(_utils__WEBPACK_IMPORTED_MODULE_2__["formatTime"])(timestamp), "s", react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("br", null), "duration: ", Object(_utils__WEBPACK_IMPORTED_MODULE_2__["formatDuration"])(duration), "ms")));
});
}
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SidebarInteractions_css__WEBPACK_IMPORTED_MODULE_4___default.a.Toolbar
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SidebarInteractions_css__WEBPACK_IMPORTED_MODULE_4___default.a.Name,
title: interaction.name
}, interaction.name)), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SidebarInteractions_css__WEBPACK_IMPORTED_MODULE_4___default.a.Content
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SidebarInteractions_css__WEBPACK_IMPORTED_MODULE_4___default.a.Commits
}, "Commits:"), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("ul", {
className: _SidebarInteractions_css__WEBPACK_IMPORTED_MODULE_4___default.a.List
}, listItems)));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/SidebarSelectedFiberInfo.css":
/*!*****************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/SidebarSelectedFiberInfo.css ***!
\*****************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./SidebarSelectedFiberInfo.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/SidebarSelectedFiberInfo.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/SidebarSelectedFiberInfo.js":
/*!****************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/SidebarSelectedFiberInfo.js ***!
\****************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return SidebarSelectedFiberInfo; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_devtools_shared_src_devtools_ProfilerStore__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-devtools-shared/src/devtools/ProfilerStore */ "../react-devtools-shared/src/devtools/ProfilerStore.js");
/* harmony import */ var _ProfilerContext__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./ProfilerContext */ "../react-devtools-shared/src/devtools/views/Profiler/ProfilerContext.js");
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./utils */ "../react-devtools-shared/src/devtools/views/Profiler/utils.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var _Button__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../Button */ "../react-devtools-shared/src/devtools/views/Button.js");
/* harmony import */ var _ButtonIcon__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../ButtonIcon */ "../react-devtools-shared/src/devtools/views/ButtonIcon.js");
/* harmony import */ var _SidebarSelectedFiberInfo_css__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./SidebarSelectedFiberInfo.css */ "../react-devtools-shared/src/devtools/views/Profiler/SidebarSelectedFiberInfo.css");
/* harmony import */ var _SidebarSelectedFiberInfo_css__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_SidebarSelectedFiberInfo_css__WEBPACK_IMPORTED_MODULE_7__);
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function SidebarSelectedFiberInfo(_) {
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_4__["StoreContext"]),
profilerStore = _useContext.profilerStore;
var _useContext2 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_ProfilerContext__WEBPACK_IMPORTED_MODULE_2__["ProfilerContext"]),
rootID = _useContext2.rootID,
selectCommitIndex = _useContext2.selectCommitIndex,
selectedCommitIndex = _useContext2.selectedCommitIndex,
selectedFiberID = _useContext2.selectedFiberID,
selectedFiberName = _useContext2.selectedFiberName,
selectFiber = _useContext2.selectFiber;
var profilingCache = profilerStore.profilingCache;
var commitIndices = profilingCache.getFiberCommits({
fiberID: selectedFiberID,
rootID: rootID
});
var listItems = [];
var i = 0;
var _loop = function _loop() {
var commitIndex = commitIndices[i];
var _profilerStore$getCom = profilerStore.getCommitData(rootID, commitIndex),
duration = _profilerStore$getCom.duration,
timestamp = _profilerStore$getCom.timestamp;
listItems.push(react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("button", {
key: commitIndex,
className: selectedCommitIndex === commitIndex ? _SidebarSelectedFiberInfo_css__WEBPACK_IMPORTED_MODULE_7___default.a.CurrentCommit : _SidebarSelectedFiberInfo_css__WEBPACK_IMPORTED_MODULE_7___default.a.Commit,
onClick: function onClick() {
return selectCommitIndex(commitIndex);
}
}, Object(_utils__WEBPACK_IMPORTED_MODULE_3__["formatTime"])(timestamp), "s for ", Object(_utils__WEBPACK_IMPORTED_MODULE_3__["formatDuration"])(duration), "ms"));
};
for (i = 0; i < commitIndices.length; i++) {
_loop();
}
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SidebarSelectedFiberInfo_css__WEBPACK_IMPORTED_MODULE_7___default.a.Toolbar
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SidebarSelectedFiberInfo_css__WEBPACK_IMPORTED_MODULE_7___default.a.Component
}, selectedFiberName || 'Selected component'), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_5__["default"], {
className: _SidebarSelectedFiberInfo_css__WEBPACK_IMPORTED_MODULE_7___default.a.IconButton,
onClick: function onClick() {
return selectFiber(null, null);
},
title: "Back to commit view"
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_6__["default"], {
type: "close"
}))), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SidebarSelectedFiberInfo_css__WEBPACK_IMPORTED_MODULE_7___default.a.Content
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(WhatChanged, {
commitIndex: selectedCommitIndex,
fiberID: selectedFiberID,
profilerStore: profilerStore,
rootID: rootID
}), listItems.length > 0 && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("label", {
className: _SidebarSelectedFiberInfo_css__WEBPACK_IMPORTED_MODULE_7___default.a.Label
}, "Rendered at"), ": ", listItems), listItems.length === 0 && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", null, "Did not render during this profiling session.")));
}
function WhatChanged(_ref) {
var commitIndex = _ref.commitIndex,
fiberID = _ref.fiberID,
profilerStore = _ref.profilerStore,
rootID = _ref.rootID;
// TRICKY
// Handle edge case where no commit is selected because of a min-duration filter update.
// If the commit index is null, suspending for data below would throw an error.
// TODO (ProfilerContext) This check should not be necessary.
if (commitIndex === null) {
return null;
}
var _profilerStore$getCom2 = profilerStore.getCommitData(rootID, commitIndex),
changeDescriptions = _profilerStore$getCom2.changeDescriptions;
if (changeDescriptions === null) {
return null;
}
var changeDescription = changeDescriptions.get(fiberID);
if (changeDescription == null) {
return null;
}
if (changeDescription.isFirstMount) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SidebarSelectedFiberInfo_css__WEBPACK_IMPORTED_MODULE_7___default.a.WhatChanged
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("label", {
className: _SidebarSelectedFiberInfo_css__WEBPACK_IMPORTED_MODULE_7___default.a.Label
}, "Why did this render?"), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SidebarSelectedFiberInfo_css__WEBPACK_IMPORTED_MODULE_7___default.a.WhatChangedItem
}, "This is the first time the component rendered."));
}
var changes = [];
if (changeDescription.context === true) {
changes.push(react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
key: "context",
className: _SidebarSelectedFiberInfo_css__WEBPACK_IMPORTED_MODULE_7___default.a.WhatChangedItem
}, "\u2022 Context changed"));
} else if (_typeof(changeDescription.context) === 'object' && changeDescription.context !== null && changeDescription.context.length !== 0) {
changes.push(react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
key: "context",
className: _SidebarSelectedFiberInfo_css__WEBPACK_IMPORTED_MODULE_7___default.a.WhatChangedItem
}, "\u2022 Context changed:", changeDescription.context.map(function (key) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("span", {
key: key,
className: _SidebarSelectedFiberInfo_css__WEBPACK_IMPORTED_MODULE_7___default.a.WhatChangedKey
}, key);
})));
}
if (changeDescription.didHooksChange) {
changes.push(react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
key: "hooks",
className: _SidebarSelectedFiberInfo_css__WEBPACK_IMPORTED_MODULE_7___default.a.WhatChangedItem
}, "\u2022 Hooks changed"));
}
if (changeDescription.props !== null && changeDescription.props.length !== 0) {
changes.push(react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
key: "props",
className: _SidebarSelectedFiberInfo_css__WEBPACK_IMPORTED_MODULE_7___default.a.WhatChangedItem
}, "\u2022 Props changed:", changeDescription.props.map(function (key) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("span", {
key: key,
className: _SidebarSelectedFiberInfo_css__WEBPACK_IMPORTED_MODULE_7___default.a.WhatChangedKey
}, key);
})));
}
if (changeDescription.state !== null && changeDescription.state.length !== 0) {
changes.push(react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
key: "state",
className: _SidebarSelectedFiberInfo_css__WEBPACK_IMPORTED_MODULE_7___default.a.WhatChangedItem
}, "\u2022 State changed:", changeDescription.state.map(function (key) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("span", {
key: key,
className: _SidebarSelectedFiberInfo_css__WEBPACK_IMPORTED_MODULE_7___default.a.WhatChangedKey
}, key);
})));
}
if (changes.length === 0) {
changes.push(react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
key: "nothing",
className: _SidebarSelectedFiberInfo_css__WEBPACK_IMPORTED_MODULE_7___default.a.WhatChangedItem
}, "The parent component rendered."));
}
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SidebarSelectedFiberInfo_css__WEBPACK_IMPORTED_MODULE_7___default.a.WhatChanged
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("label", {
className: _SidebarSelectedFiberInfo_css__WEBPACK_IMPORTED_MODULE_7___default.a.Label
}, "Why did this render?"), changes);
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/SnapshotCommitList.css":
/*!***********************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/SnapshotCommitList.css ***!
\***********************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./SnapshotCommitList.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/SnapshotCommitList.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/SnapshotCommitList.js":
/*!**********************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/SnapshotCommitList.js ***!
\**********************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return SnapshotCommitList; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_virtualized_auto_sizer__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-virtualized-auto-sizer */ "../../node_modules/react-virtualized-auto-sizer/dist/index.esm.js");
/* harmony import */ var react_window__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-window */ "../react-devtools-shared/src/node_modules/react-window/dist/index.esm.js");
/* harmony import */ var _SnapshotCommitListItem__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./SnapshotCommitListItem */ "../react-devtools-shared/src/devtools/views/Profiler/SnapshotCommitListItem.js");
/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./constants */ "../react-devtools-shared/src/devtools/views/Profiler/constants.js");
/* harmony import */ var _SnapshotCommitList_css__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./SnapshotCommitList.css */ "../react-devtools-shared/src/devtools/views/Profiler/SnapshotCommitList.css");
/* harmony import */ var _SnapshotCommitList_css__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_SnapshotCommitList_css__WEBPACK_IMPORTED_MODULE_5__);
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function SnapshotCommitList(_ref) {
var commitDurations = _ref.commitDurations,
commitTimes = _ref.commitTimes,
filteredCommitIndices = _ref.filteredCommitIndices,
selectedCommitIndex = _ref.selectedCommitIndex,
selectedFilteredCommitIndex = _ref.selectedFilteredCommitIndex,
selectCommitIndex = _ref.selectCommitIndex;
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react_virtualized_auto_sizer__WEBPACK_IMPORTED_MODULE_1__["default"], null, function (_ref2) {
var height = _ref2.height,
width = _ref2.width;
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(List, {
commitDurations: commitDurations,
commitTimes: commitTimes,
height: height,
filteredCommitIndices: filteredCommitIndices,
selectedCommitIndex: selectedCommitIndex,
selectedFilteredCommitIndex: selectedFilteredCommitIndex,
selectCommitIndex: selectCommitIndex,
width: width
});
});
}
function List(_ref3) {
var commitDurations = _ref3.commitDurations,
selectedCommitIndex = _ref3.selectedCommitIndex,
commitTimes = _ref3.commitTimes,
height = _ref3.height,
filteredCommitIndices = _ref3.filteredCommitIndices,
selectedFilteredCommitIndex = _ref3.selectedFilteredCommitIndex,
selectCommitIndex = _ref3.selectCommitIndex,
width = _ref3.width;
var listRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(null);
var divRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(null);
var prevCommitIndexRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(null); // Make sure a newly selected snapshot is fully visible within the list.
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
if (selectedFilteredCommitIndex !== prevCommitIndexRef.current) {
prevCommitIndexRef.current = selectedFilteredCommitIndex;
if (selectedFilteredCommitIndex !== null && listRef.current !== null) {
listRef.current.scrollToItem(selectedFilteredCommitIndex);
}
}
}, [listRef, selectedFilteredCommitIndex]); // When the mouse is down, dragging over a commit should auto-select it.
// This provides a nice way for users to swipe across a range of commits to compare them.
var _useState = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(false),
_useState2 = _slicedToArray(_useState, 2),
isMouseDown = _useState2[0],
setIsMouseDown = _useState2[1];
var handleMouseDown = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function () {
setIsMouseDown(true);
}, []);
var handleMouseUp = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function () {
setIsMouseDown(false);
}, []);
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
if (divRef.current === null) {
return function () {};
} // It's important to listen to the ownerDocument to support the browser extension.
// Here we use portals to render individual tabs (e.g. Profiler),
// and the root document might belong to a different window.
var ownerDocument = divRef.current.ownerDocument;
ownerDocument.addEventListener('mouseup', handleMouseUp);
return function () {
return ownerDocument.removeEventListener('mouseup', handleMouseUp);
};
}, [divRef, handleMouseUp]);
var itemSize = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
return Math.max(_constants__WEBPACK_IMPORTED_MODULE_4__["minBarWidth"], width / filteredCommitIndices.length);
}, [filteredCommitIndices, width]);
var maxDuration = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
return commitDurations.reduce(function (max, duration) {
return Math.max(max, duration);
}, 0);
}, [commitDurations]); // Pass required contextual data down to the ListItem renderer.
var itemData = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
return {
commitDurations: commitDurations,
commitTimes: commitTimes,
filteredCommitIndices: filteredCommitIndices,
isMouseDown: isMouseDown,
maxDuration: maxDuration,
selectedCommitIndex: selectedCommitIndex,
selectedFilteredCommitIndex: selectedFilteredCommitIndex,
selectCommitIndex: selectCommitIndex
};
}, [commitDurations, commitTimes, filteredCommitIndices, isMouseDown, maxDuration, selectedCommitIndex, selectedFilteredCommitIndex, selectCommitIndex]);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
onMouseDown: handleMouseDown,
onMouseUp: handleMouseUp,
ref: divRef,
style: {
height: height,
width: width
}
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react_window__WEBPACK_IMPORTED_MODULE_2__["FixedSizeList"], {
className: _SnapshotCommitList_css__WEBPACK_IMPORTED_MODULE_5___default.a.List,
layout: "horizontal",
height: height,
itemCount: filteredCommitIndices.length,
itemData: itemData,
itemSize: itemSize,
ref: listRef,
width: width
}, _SnapshotCommitListItem__WEBPACK_IMPORTED_MODULE_3__["default"]));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/SnapshotCommitListItem.css":
/*!***************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/SnapshotCommitListItem.css ***!
\***************************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./SnapshotCommitListItem.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/SnapshotCommitListItem.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/SnapshotCommitListItem.js":
/*!**************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/SnapshotCommitListItem.js ***!
\**************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_window__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-window */ "../react-devtools-shared/src/node_modules/react-window/dist/index.esm.js");
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./utils */ "../react-devtools-shared/src/devtools/views/Profiler/utils.js");
/* harmony import */ var _SnapshotCommitListItem_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./SnapshotCommitListItem.css */ "../react-devtools-shared/src/devtools/views/Profiler/SnapshotCommitListItem.css");
/* harmony import */ var _SnapshotCommitListItem_css__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_SnapshotCommitListItem_css__WEBPACK_IMPORTED_MODULE_3__);
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(source, true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function SnapshotCommitListItem(_ref) {
var itemData = _ref.data,
index = _ref.index,
style = _ref.style;
var commitDurations = itemData.commitDurations,
commitTimes = itemData.commitTimes,
filteredCommitIndices = itemData.filteredCommitIndices,
isMouseDown = itemData.isMouseDown,
maxDuration = itemData.maxDuration,
selectedCommitIndex = itemData.selectedCommitIndex,
selectCommitIndex = itemData.selectCommitIndex;
index = filteredCommitIndices[index];
var commitDuration = commitDurations[index];
var commitTime = commitTimes[index];
var handleClick = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function () {
return selectCommitIndex(index);
}, [index, selectCommitIndex]); // Guard against commits with duration 0
var percentage = Math.min(1, Math.max(0, commitDuration / maxDuration)) || 0;
var isSelected = selectedCommitIndex === index; // Leave a 1px gap between snapshots
var width = parseFloat(style.width) - 1;
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SnapshotCommitListItem_css__WEBPACK_IMPORTED_MODULE_3___default.a.Outer,
onClick: handleClick,
onMouseEnter: isMouseDown ? handleClick : null,
style: _objectSpread({}, style, {
width: width,
borderBottom: isSelected ? '3px solid var(--color-tab-selected-border)' : undefined
}),
title: "Duration ".concat(Object(_utils__WEBPACK_IMPORTED_MODULE_2__["formatDuration"])(commitDuration), "ms at ").concat(Object(_utils__WEBPACK_IMPORTED_MODULE_2__["formatTime"])(commitTime), "s")
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SnapshotCommitListItem_css__WEBPACK_IMPORTED_MODULE_3___default.a.Inner,
style: {
height: "".concat(Math.round(percentage * 100), "%"),
backgroundColor: percentage > 0 ? Object(_utils__WEBPACK_IMPORTED_MODULE_2__["getGradientColor"])(percentage) : undefined
}
}));
}
/* harmony default export */ __webpack_exports__["default"] = (Object(react__WEBPACK_IMPORTED_MODULE_0__["memo"])(SnapshotCommitListItem, react_window__WEBPACK_IMPORTED_MODULE_1__["areEqual"]));
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/SnapshotSelector.css":
/*!*********************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/SnapshotSelector.css ***!
\*********************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./SnapshotSelector.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Profiler/SnapshotSelector.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/SnapshotSelector.js":
/*!********************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/SnapshotSelector.js ***!
\********************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return SnapshotSelector; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _Button__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../Button */ "../react-devtools-shared/src/devtools/views/Button.js");
/* harmony import */ var _ButtonIcon__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../ButtonIcon */ "../react-devtools-shared/src/devtools/views/ButtonIcon.js");
/* harmony import */ var _ProfilerContext__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./ProfilerContext */ "../react-devtools-shared/src/devtools/views/Profiler/ProfilerContext.js");
/* harmony import */ var _SnapshotCommitList__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./SnapshotCommitList */ "../react-devtools-shared/src/devtools/views/Profiler/SnapshotCommitList.js");
/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./constants */ "../react-devtools-shared/src/devtools/views/Profiler/constants.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var _SnapshotSelector_css__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./SnapshotSelector.css */ "../react-devtools-shared/src/devtools/views/Profiler/SnapshotSelector.css");
/* harmony import */ var _SnapshotSelector_css__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_SnapshotSelector_css__WEBPACK_IMPORTED_MODULE_7__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function SnapshotSelector(_) {
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_ProfilerContext__WEBPACK_IMPORTED_MODULE_3__["ProfilerContext"]),
isCommitFilterEnabled = _useContext.isCommitFilterEnabled,
minCommitDuration = _useContext.minCommitDuration,
rootID = _useContext.rootID,
selectedCommitIndex = _useContext.selectedCommitIndex,
selectCommitIndex = _useContext.selectCommitIndex;
var _useContext2 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_6__["StoreContext"]),
profilerStore = _useContext2.profilerStore;
var _profilerStore$getDat = profilerStore.getDataForRoot(rootID),
commitData = _profilerStore$getDat.commitData;
var commitDurations = [];
var commitTimes = [];
commitData.forEach(function (commitDatum) {
commitDurations.push(commitDatum.duration);
commitTimes.push(commitDatum.timestamp);
});
var filteredCommitIndices = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
return commitData.reduce(function (reduced, commitDatum, index) {
if (!isCommitFilterEnabled || commitDatum.duration >= minCommitDuration) {
reduced.push(index);
}
return reduced;
}, []);
}, [commitData, isCommitFilterEnabled, minCommitDuration]);
var numFilteredCommits = filteredCommitIndices.length; // Map the (unfiltered) selected commit index to an index within the filtered data.
var selectedFilteredCommitIndex = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
if (selectedCommitIndex !== null) {
for (var i = 0; i < filteredCommitIndices.length; i++) {
if (filteredCommitIndices[i] === selectedCommitIndex) {
return i;
}
}
}
return null;
}, [filteredCommitIndices, selectedCommitIndex]); // TODO (ProfilerContext) This should be managed by the context controller (reducer).
// It doesn't currently know about the filtered commits though (since it doesn't suspend).
// Maybe this component should pass filteredCommitIndices up?
if (selectedFilteredCommitIndex === null) {
if (numFilteredCommits > 0) {
selectCommitIndex(0);
} else {
selectCommitIndex(null);
}
} else if (selectedFilteredCommitIndex >= numFilteredCommits) {
selectCommitIndex(numFilteredCommits === 0 ? null : numFilteredCommits - 1);
}
var label = null;
if (numFilteredCommits > 0) {
label = "".concat(selectedFilteredCommitIndex + 1).padStart("".concat(numFilteredCommits).length, '0') + ' / ' + numFilteredCommits;
}
var viewNextCommit = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function () {
var nextCommitIndex = selectedFilteredCommitIndex + 1;
if (nextCommitIndex === filteredCommitIndices.length) {
nextCommitIndex = 0;
}
selectCommitIndex(filteredCommitIndices[nextCommitIndex]);
}, [selectedFilteredCommitIndex, filteredCommitIndices, selectCommitIndex]);
var viewPrevCommit = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function () {
var nextCommitIndex = selectedFilteredCommitIndex - 1;
if (nextCommitIndex < 0) {
nextCommitIndex = filteredCommitIndices.length - 1;
}
selectCommitIndex(filteredCommitIndices[nextCommitIndex]);
}, [selectedFilteredCommitIndex, filteredCommitIndices, selectCommitIndex]);
var handleKeyDown = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (event) {
switch (event.key) {
case 'ArrowLeft':
viewPrevCommit();
event.stopPropagation();
break;
case 'ArrowRight':
viewNextCommit();
event.stopPropagation();
break;
default:
break;
}
}, [viewNextCommit, viewPrevCommit]);
if (commitData.length === 0) {
return null;
}
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("span", {
className: _SnapshotSelector_css__WEBPACK_IMPORTED_MODULE_7___default.a.IndexLabel
}, label), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_1__["default"], {
className: _SnapshotSelector_css__WEBPACK_IMPORTED_MODULE_7___default.a.Button,
disabled: numFilteredCommits === 0,
onClick: viewPrevCommit,
title: "Select previous commit"
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_2__["default"], {
type: "previous"
})), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SnapshotSelector_css__WEBPACK_IMPORTED_MODULE_7___default.a.Commits,
onKeyDown: handleKeyDown,
style: {
flex: numFilteredCommits > 0 ? '1 1 auto' : '0 0 auto',
maxWidth: numFilteredCommits > 0 ? numFilteredCommits * _constants__WEBPACK_IMPORTED_MODULE_5__["maxBarWidth"] : undefined
},
tabIndex: 0
}, numFilteredCommits > 0 && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_SnapshotCommitList__WEBPACK_IMPORTED_MODULE_4__["default"], {
commitDurations: commitDurations,
commitTimes: commitTimes,
filteredCommitIndices: filteredCommitIndices,
selectedCommitIndex: selectedCommitIndex,
selectedFilteredCommitIndex: selectedFilteredCommitIndex,
selectCommitIndex: selectCommitIndex
}), numFilteredCommits === 0 && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SnapshotSelector_css__WEBPACK_IMPORTED_MODULE_7___default.a.NoCommits
}, "No commits")), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_1__["default"], {
className: _SnapshotSelector_css__WEBPACK_IMPORTED_MODULE_7___default.a.Button,
disabled: numFilteredCommits === 0,
onClick: viewNextCommit,
title: "Select next commit"
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_2__["default"], {
type: "next"
})));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/constants.js":
/*!*************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/constants.js ***!
\*************************************************************************/
/*! exports provided: barWidthThreshold, interactionCommitSize, interactionLabelWidth, maxBarWidth, minBarWidth */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "barWidthThreshold", function() { return barWidthThreshold; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "interactionCommitSize", function() { return interactionCommitSize; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "interactionLabelWidth", function() { return interactionLabelWidth; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "maxBarWidth", function() { return maxBarWidth; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "minBarWidth", function() { return minBarWidth; });
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
var barWidthThreshold = 2;
var interactionCommitSize = 10;
var interactionLabelWidth = 200;
var maxBarWidth = 30;
var minBarWidth = 5;
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Profiler/utils.js":
/*!*********************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Profiler/utils.js ***!
\*********************************************************************/
/*! exports provided: prepareProfilingDataFrontendFromBackendAndStore, prepareProfilingDataFrontendFromExport, prepareProfilingDataExport, getGradientColor, formatDuration, formatPercentage, formatTime, scale */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "prepareProfilingDataFrontendFromBackendAndStore", function() { return prepareProfilingDataFrontendFromBackendAndStore; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "prepareProfilingDataFrontendFromExport", function() { return prepareProfilingDataFrontendFromExport; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "prepareProfilingDataExport", function() { return prepareProfilingDataExport; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getGradientColor", function() { return getGradientColor; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "formatDuration", function() { return formatDuration; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "formatPercentage", function() { return formatPercentage; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "formatTime", function() { return formatTime; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "scale", function() { return scale; });
/* harmony import */ var react_devtools_shared_src_constants__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react-devtools-shared/src/constants */ "../react-devtools-shared/src/constants.js");
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
var commitGradient = ['var(--color-commit-gradient-0)', 'var(--color-commit-gradient-1)', 'var(--color-commit-gradient-2)', 'var(--color-commit-gradient-3)', 'var(--color-commit-gradient-4)', 'var(--color-commit-gradient-5)', 'var(--color-commit-gradient-6)', 'var(--color-commit-gradient-7)', 'var(--color-commit-gradient-8)', 'var(--color-commit-gradient-9)']; // Combines info from the Store (frontend) and renderer interfaces (backend) into the format required by the Profiler UI.
// This format can then be quickly exported (and re-imported).
function prepareProfilingDataFrontendFromBackendAndStore(dataBackends, operationsByRootID, snapshotsByRootID) {
var dataForRoots = new Map();
dataBackends.forEach(function (dataBackend) {
dataBackend.dataForRoots.forEach(function (_ref) {
var commitData = _ref.commitData,
displayName = _ref.displayName,
initialTreeBaseDurations = _ref.initialTreeBaseDurations,
interactionCommits = _ref.interactionCommits,
interactions = _ref.interactions,
rootID = _ref.rootID;
var operations = operationsByRootID.get(rootID);
if (operations == null) {
throw Error("Could not find profiling operations for root ".concat(rootID));
}
var snapshots = snapshotsByRootID.get(rootID);
if (snapshots == null) {
throw Error("Could not find profiling snapshots for root ".concat(rootID));
}
dataForRoots.set(rootID, {
commitData: commitData.map(function (commitDataBackend, commitIndex) {
return {
changeDescriptions: commitDataBackend.changeDescriptions != null ? new Map(commitDataBackend.changeDescriptions) : null,
duration: commitDataBackend.duration,
fiberActualDurations: new Map(commitDataBackend.fiberActualDurations),
fiberSelfDurations: new Map(commitDataBackend.fiberSelfDurations),
interactionIDs: commitDataBackend.interactionIDs,
priorityLevel: commitDataBackend.priorityLevel,
timestamp: commitDataBackend.timestamp
};
}),
displayName: displayName,
initialTreeBaseDurations: new Map(initialTreeBaseDurations),
interactionCommits: new Map(interactionCommits),
interactions: new Map(interactions),
operations: operations,
rootID: rootID,
snapshots: snapshots
});
});
});
return {
dataForRoots: dataForRoots
};
} // Converts a Profiling data export into the format required by the Store.
function prepareProfilingDataFrontendFromExport(profilingDataExport) {
var version = profilingDataExport.version;
if (version !== react_devtools_shared_src_constants__WEBPACK_IMPORTED_MODULE_0__["PROFILER_EXPORT_VERSION"]) {
throw Error("Unsupported profiler export version \"".concat(version, "\""));
}
var dataForRoots = new Map();
profilingDataExport.dataForRoots.forEach(function (_ref2) {
var commitData = _ref2.commitData,
displayName = _ref2.displayName,
initialTreeBaseDurations = _ref2.initialTreeBaseDurations,
interactionCommits = _ref2.interactionCommits,
interactions = _ref2.interactions,
operations = _ref2.operations,
rootID = _ref2.rootID,
snapshots = _ref2.snapshots;
dataForRoots.set(rootID, {
commitData: commitData.map(function (_ref3) {
var changeDescriptions = _ref3.changeDescriptions,
duration = _ref3.duration,
fiberActualDurations = _ref3.fiberActualDurations,
fiberSelfDurations = _ref3.fiberSelfDurations,
interactionIDs = _ref3.interactionIDs,
priorityLevel = _ref3.priorityLevel,
timestamp = _ref3.timestamp;
return {
changeDescriptions: changeDescriptions != null ? new Map(changeDescriptions) : null,
duration: duration,
fiberActualDurations: new Map(fiberActualDurations),
fiberSelfDurations: new Map(fiberSelfDurations),
interactionIDs: interactionIDs,
priorityLevel: priorityLevel,
timestamp: timestamp
};
}),
displayName: displayName,
initialTreeBaseDurations: new Map(initialTreeBaseDurations),
interactionCommits: new Map(interactionCommits),
interactions: new Map(interactions),
operations: operations,
rootID: rootID,
snapshots: new Map(snapshots)
});
});
return {
dataForRoots: dataForRoots
};
} // Converts a Store Profiling data into a format that can be safely (JSON) serialized for export.
function prepareProfilingDataExport(profilingDataFrontend) {
var dataForRoots = [];
profilingDataFrontend.dataForRoots.forEach(function (_ref4) {
var commitData = _ref4.commitData,
displayName = _ref4.displayName,
initialTreeBaseDurations = _ref4.initialTreeBaseDurations,
interactionCommits = _ref4.interactionCommits,
interactions = _ref4.interactions,
operations = _ref4.operations,
rootID = _ref4.rootID,
snapshots = _ref4.snapshots;
dataForRoots.push({
commitData: commitData.map(function (_ref5) {
var changeDescriptions = _ref5.changeDescriptions,
duration = _ref5.duration,
fiberActualDurations = _ref5.fiberActualDurations,
fiberSelfDurations = _ref5.fiberSelfDurations,
interactionIDs = _ref5.interactionIDs,
priorityLevel = _ref5.priorityLevel,
timestamp = _ref5.timestamp;
return {
changeDescriptions: changeDescriptions != null ? Array.from(changeDescriptions.entries()) : null,
duration: duration,
fiberActualDurations: Array.from(fiberActualDurations.entries()),
fiberSelfDurations: Array.from(fiberSelfDurations.entries()),
interactionIDs: interactionIDs,
priorityLevel: priorityLevel,
timestamp: timestamp
};
}),
displayName: displayName,
initialTreeBaseDurations: Array.from(initialTreeBaseDurations.entries()),
interactionCommits: Array.from(interactionCommits.entries()),
interactions: Array.from(interactions.entries()),
operations: operations,
rootID: rootID,
snapshots: Array.from(snapshots.entries())
});
});
return {
version: react_devtools_shared_src_constants__WEBPACK_IMPORTED_MODULE_0__["PROFILER_EXPORT_VERSION"],
dataForRoots: dataForRoots
};
}
var getGradientColor = function getGradientColor(value) {
var maxIndex = commitGradient.length - 1;
var index;
if (Number.isNaN(value)) {
index = 0;
} else if (!Number.isFinite(value)) {
index = maxIndex;
} else {
index = Math.max(0, Math.min(maxIndex, value)) * maxIndex;
}
return commitGradient[Math.round(index)];
};
var formatDuration = function formatDuration(duration) {
return Math.round(duration * 10) / 10 || '<0.1';
};
var formatPercentage = function formatPercentage(percentage) {
return Math.round(percentage * 100);
};
var formatTime = function formatTime(timestamp) {
return Math.round(Math.round(timestamp) / 100) / 10;
};
var scale = function scale(minValue, maxValue, minRange, maxRange) {
return function (value, fallbackValue) {
return maxValue - minValue === 0 ? fallbackValue : (value - minValue) / (maxValue - minValue) * (maxRange - minRange);
};
};
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/ReactLogo.css":
/*!*****************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/ReactLogo.css ***!
\*****************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../node_modules/css-loader??ref--5-1!./ReactLogo.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/ReactLogo.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/ReactLogo.js":
/*!****************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/ReactLogo.js ***!
\****************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return ReactLogo; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _ReactLogo_css__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./ReactLogo.css */ "../react-devtools-shared/src/devtools/views/ReactLogo.css");
/* harmony import */ var _ReactLogo_css__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_ReactLogo_css__WEBPACK_IMPORTED_MODULE_1__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function ReactLogo(_ref) {
var className = _ref.className;
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("svg", {
xmlns: "http://www.w3.org/2000/svg",
className: "".concat(_ReactLogo_css__WEBPACK_IMPORTED_MODULE_1___default.a.ReactLogo, " ").concat(className || ''),
viewBox: "-11.5 -10.23174 23 20.46348"
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("circle", {
cx: "0",
cy: "0",
r: "2.05",
fill: "currentColor"
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("g", {
stroke: "currentColor",
strokeWidth: "1",
fill: "none"
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("ellipse", {
rx: "11",
ry: "4.2"
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("ellipse", {
rx: "11",
ry: "4.2",
transform: "rotate(60)"
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("ellipse", {
rx: "11",
ry: "4.2",
transform: "rotate(120)"
})));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Settings/ComponentsSettings.js":
/*!**********************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Settings/ComponentsSettings.js ***!
\**********************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return ComponentsSettings; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _hooks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../hooks */ "../react-devtools-shared/src/devtools/views/hooks.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var _Button__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../Button */ "../react-devtools-shared/src/devtools/views/Button.js");
/* harmony import */ var _ButtonIcon__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../ButtonIcon */ "../react-devtools-shared/src/devtools/views/ButtonIcon.js");
/* harmony import */ var _Toggle__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../Toggle */ "../react-devtools-shared/src/devtools/views/Toggle.js");
/* harmony import */ var react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! react-devtools-shared/src/types */ "../react-devtools-shared/src/types.js");
/* harmony import */ var _SettingsShared_css__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./SettingsShared.css */ "../react-devtools-shared/src/devtools/views/Settings/SettingsShared.css");
/* harmony import */ var _SettingsShared_css__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_SettingsShared_css__WEBPACK_IMPORTED_MODULE_7__);
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(source, true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }
function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function ComponentsSettings(_) {
var store = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_2__["StoreContext"]);
var collapseNodesByDefaultSubscription = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
return {
getCurrentValue: function getCurrentValue() {
return store.collapseNodesByDefault;
},
subscribe: function subscribe(callback) {
store.addListener('collapseNodesByDefault', callback);
return function () {
return store.removeListener('collapseNodesByDefault', callback);
};
}
};
}, [store]);
var collapseNodesByDefault = Object(_hooks__WEBPACK_IMPORTED_MODULE_1__["useSubscription"])(collapseNodesByDefaultSubscription);
var updateCollapseNodesByDefault = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (_ref) {
var currentTarget = _ref.currentTarget;
store.collapseNodesByDefault = !currentTarget.checked;
}, [store]);
var _useState = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(function () {
return _toConsumableArray(store.componentFilters);
}),
_useState2 = _slicedToArray(_useState, 2),
componentFilters = _useState2[0],
setComponentFilters = _useState2[1];
var addFilter = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function () {
setComponentFilters(function (prevComponentFilters) {
return [].concat(_toConsumableArray(prevComponentFilters), [{
type: react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterElementType"],
value: react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ElementTypeHostComponent"],
isEnabled: true
}]);
});
}, []);
var changeFilterType = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (componentFilter, type) {
setComponentFilters(function (prevComponentFilters) {
var cloned = _toConsumableArray(prevComponentFilters);
var index = prevComponentFilters.indexOf(componentFilter);
if (index >= 0) {
if (type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterElementType"]) {
cloned[index] = {
type: react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterElementType"],
isEnabled: componentFilter.isEnabled,
value: react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ElementTypeHostComponent"]
};
} else if (type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterDisplayName"]) {
cloned[index] = {
type: react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterDisplayName"],
isEnabled: componentFilter.isEnabled,
isValid: true,
value: ''
};
} else if (type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterLocation"]) {
cloned[index] = {
type: react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterLocation"],
isEnabled: componentFilter.isEnabled,
isValid: true,
value: ''
};
} else if (type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterHOC"]) {
cloned[index] = {
type: react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterHOC"],
isEnabled: componentFilter.isEnabled,
isValid: true
};
}
}
return cloned;
});
}, []);
var updateFilterValueElementType = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (componentFilter, value) {
if (componentFilter.type !== react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterElementType"]) {
throw Error('Invalid value for element type filter');
}
setComponentFilters(function (prevComponentFilters) {
var cloned = _toConsumableArray(prevComponentFilters);
if (componentFilter.type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterElementType"]) {
var index = prevComponentFilters.indexOf(componentFilter);
if (index >= 0) {
cloned[index] = _objectSpread({}, componentFilter, {
value: value
});
}
}
return cloned;
});
}, []);
var updateFilterValueRegExp = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (componentFilter, value) {
if (componentFilter.type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterElementType"]) {
throw Error('Invalid value for element type filter');
}
setComponentFilters(function (prevComponentFilters) {
var cloned = _toConsumableArray(prevComponentFilters);
if (componentFilter.type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterDisplayName"] || componentFilter.type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterLocation"]) {
var index = prevComponentFilters.indexOf(componentFilter);
if (index >= 0) {
var isValid = true;
try {
new RegExp(value); // eslint-disable-line no-new
} catch (error) {
isValid = false;
}
cloned[index] = _objectSpread({}, componentFilter, {
isValid: isValid,
value: value
});
}
}
return cloned;
});
}, []);
var removeFilter = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (index) {
setComponentFilters(function (prevComponentFilters) {
var cloned = _toConsumableArray(prevComponentFilters);
cloned.splice(index, 1);
return cloned;
});
}, []);
var toggleFilterIsEnabled = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (componentFilter, isEnabled) {
setComponentFilters(function (prevComponentFilters) {
var cloned = _toConsumableArray(prevComponentFilters);
var index = prevComponentFilters.indexOf(componentFilter);
if (index >= 0) {
if (componentFilter.type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterElementType"]) {
cloned[index] = _objectSpread({}, cloned[index], {
isEnabled: isEnabled
});
} else if (componentFilter.type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterDisplayName"] || componentFilter.type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterLocation"]) {
cloned[index] = _objectSpread({}, cloned[index], {
isEnabled: isEnabled
});
} else if (componentFilter.type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterHOC"]) {
cloned[index] = _objectSpread({}, cloned[index], {
isEnabled: isEnabled
});
}
}
return cloned;
});
}, []); // Filter updates are expensive to apply (since they impact the entire tree).
// Only apply them on unmount.
// The Store will avoid doing any expensive work unless they've changed.
// We just want to batch the work in the event that they do change.
var componentFiltersRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(componentFilters);
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
componentFiltersRef.current = componentFilters;
return function () {};
}, [componentFilters]);
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
return function () {
store.componentFilters = _toConsumableArray(componentFiltersRef.current);
};
}, [store]);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_7___default.a.Settings
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("label", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_7___default.a.Setting
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("input", {
type: "checkbox",
checked: !collapseNodesByDefault,
onChange: updateCollapseNodesByDefault
}), ' ', "Expand component tree by default"), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_7___default.a.Header
}, "Hide components where..."), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("table", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_7___default.a.Table
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("tbody", null, componentFilters.length === 0 && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("tr", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_7___default.a.TableRow
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("td", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_7___default.a.NoFiltersCell
}, "No filters have been added.")), componentFilters.map(function (componentFilter, index) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("tr", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_7___default.a.TableRow,
key: index
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("td", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_7___default.a.TableCell
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Toggle__WEBPACK_IMPORTED_MODULE_5__["default"], {
className: componentFilter.isValid !== false ? '' : _SettingsShared_css__WEBPACK_IMPORTED_MODULE_7___default.a.InvalidRegExp,
isChecked: componentFilter.isEnabled,
onChange: function onChange(isEnabled) {
return toggleFilterIsEnabled(componentFilter, isEnabled);
},
title: componentFilter.isValid === false ? 'Filter invalid' : componentFilter.isEnabled ? 'Filter enabled' : 'Filter disabled'
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(ToggleIcon, {
isEnabled: componentFilter.isEnabled,
isValid: componentFilter.isValid == null || componentFilter.isValid === true
}))), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("td", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_7___default.a.TableCell
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("select", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_7___default.a.Select,
value: componentFilter.type,
onChange: function onChange(_ref2) {
var currentTarget = _ref2.currentTarget;
return changeFilterType(componentFilter, parseInt(currentTarget.value, 10));
}
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("option", {
value: react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterLocation"]
}, "location"), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("option", {
value: react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterDisplayName"]
}, "name"), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("option", {
value: react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterElementType"]
}, "type"), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("option", {
value: react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterHOC"]
}, "hoc"))), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("td", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_7___default.a.TableCell
}, componentFilter.type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterElementType"] && 'equals', (componentFilter.type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterLocation"] || componentFilter.type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterDisplayName"]) && 'matches'), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("td", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_7___default.a.TableCell
}, componentFilter.type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterElementType"] && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("select", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_7___default.a.Select,
value: componentFilter.value,
onChange: function onChange(_ref3) {
var currentTarget = _ref3.currentTarget;
return updateFilterValueElementType(componentFilter, parseInt(currentTarget.value, 10));
}
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("option", {
value: react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ElementTypeClass"]
}, "class"), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("option", {
value: react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ElementTypeContext"]
}, "context"), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("option", {
value: react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ElementTypeFunction"]
}, "function"), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("option", {
value: react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ElementTypeForwardRef"]
}, "forward ref"), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("option", {
value: react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ElementTypeHostComponent"]
}, "host (e.g. <div>)"), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("option", {
value: react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ElementTypeMemo"]
}, "memo"), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("option", {
value: react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ElementTypeOtherOrUnknown"]
}, "other"), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("option", {
value: react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ElementTypeProfiler"]
}, "profiler"), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("option", {
value: react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ElementTypeSuspense"]
}, "suspense")), (componentFilter.type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterLocation"] || componentFilter.type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_6__["ComponentFilterDisplayName"]) && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("input", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_7___default.a.Input,
type: "text",
placeholder: "Regular expression",
onChange: function onChange(_ref4) {
var currentTarget = _ref4.currentTarget;
return updateFilterValueRegExp(componentFilter, currentTarget.value);
},
value: componentFilter.value
})), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("td", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_7___default.a.TableCell
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_3__["default"], {
onClick: function onClick() {
return removeFilter(index);
},
title: "Delete filter"
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_4__["default"], {
type: "delete"
}))));
}))), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_3__["default"], {
onClick: addFilter
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_4__["default"], {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_7___default.a.ButtonIcon,
type: "add"
}), "Add filter"));
}
function ToggleIcon(_ref5) {
var isEnabled = _ref5.isEnabled,
isValid = _ref5.isValid;
var className;
if (isValid) {
className = isEnabled ? _SettingsShared_css__WEBPACK_IMPORTED_MODULE_7___default.a.ToggleOn : _SettingsShared_css__WEBPACK_IMPORTED_MODULE_7___default.a.ToggleOff;
} else {
className = isEnabled ? _SettingsShared_css__WEBPACK_IMPORTED_MODULE_7___default.a.ToggleOnInvalid : _SettingsShared_css__WEBPACK_IMPORTED_MODULE_7___default.a.ToggleOffInvalid;
}
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: className
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: isEnabled ? _SettingsShared_css__WEBPACK_IMPORTED_MODULE_7___default.a.ToggleInsideOn : _SettingsShared_css__WEBPACK_IMPORTED_MODULE_7___default.a.ToggleInsideOff
}));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Settings/GeneralSettings.js":
/*!*******************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Settings/GeneralSettings.js ***!
\*******************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return GeneralSettings; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _SettingsContext__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./SettingsContext */ "../react-devtools-shared/src/devtools/views/Settings/SettingsContext.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var react_devtools_shared_src_constants__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react-devtools-shared/src/constants */ "../react-devtools-shared/src/constants.js");
/* harmony import */ var _SettingsShared_css__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./SettingsShared.css */ "../react-devtools-shared/src/devtools/views/Settings/SettingsShared.css");
/* harmony import */ var _SettingsShared_css__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_SettingsShared_css__WEBPACK_IMPORTED_MODULE_4__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function GeneralSettings(_) {
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_SettingsContext__WEBPACK_IMPORTED_MODULE_1__["SettingsContext"]),
appendComponentStack = _useContext.appendComponentStack,
displayDensity = _useContext.displayDensity,
setAppendComponentStack = _useContext.setAppendComponentStack,
setDisplayDensity = _useContext.setDisplayDensity,
setTheme = _useContext.setTheme,
setTraceUpdatesEnabled = _useContext.setTraceUpdatesEnabled,
theme = _useContext.theme,
traceUpdatesEnabled = _useContext.traceUpdatesEnabled;
var _useContext2 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_2__["StoreContext"]),
supportsTraceUpdates = _useContext2.supportsTraceUpdates;
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_4___default.a.Settings
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_4___default.a.Setting
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_4___default.a.RadioLabel
}, "Theme"), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("select", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_4___default.a.Select,
value: theme,
onChange: function onChange(_ref) {
var currentTarget = _ref.currentTarget;
return setTheme(currentTarget.value);
}
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("option", {
value: "auto"
}, "Auto"), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("option", {
value: "light"
}, "Light"), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("option", {
value: "dark"
}, "Dark"))), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_4___default.a.Setting
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_4___default.a.RadioLabel
}, "Display density"), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("select", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_4___default.a.Select,
value: displayDensity,
onChange: function onChange(_ref2) {
var currentTarget = _ref2.currentTarget;
return setDisplayDensity(currentTarget.value);
}
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("option", {
value: "compact"
}, "Compact"), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("option", {
value: "comfortable"
}, "Comfortable"))), supportsTraceUpdates && react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_4___default.a.Setting
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("label", null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("input", {
type: "checkbox",
checked: traceUpdatesEnabled,
onChange: function onChange(_ref3) {
var currentTarget = _ref3.currentTarget;
return setTraceUpdatesEnabled(currentTarget.checked);
}
}), ' ', "Highlight updates when components render.")), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_4___default.a.Setting
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("label", null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("input", {
type: "checkbox",
checked: appendComponentStack,
onChange: function onChange(_ref4) {
var currentTarget = _ref4.currentTarget;
return setAppendComponentStack(currentTarget.checked);
}
}), ' ', "Append component stacks to console warnings and errors.")), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_4___default.a.ReleaseNotes
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("a", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_4___default.a.ReleaseNotesLink,
target: "_blank",
rel: "noopener noreferrer",
href: react_devtools_shared_src_constants__WEBPACK_IMPORTED_MODULE_3__["CHANGE_LOG_URL"]
}, "View release notes"), ' ', "for DevTools version ", "4.4.0-f749045a5"));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Settings/ProfilerSettings.js":
/*!********************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Settings/ProfilerSettings.js ***!
\********************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return ProfilerSettings; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _hooks__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../hooks */ "../react-devtools-shared/src/devtools/views/hooks.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var react_devtools_shared_src_devtools_views_Profiler_ProfilerContext__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react-devtools-shared/src/devtools/views/Profiler/ProfilerContext */ "../react-devtools-shared/src/devtools/views/Profiler/ProfilerContext.js");
/* harmony import */ var _SettingsShared_css__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./SettingsShared.css */ "../react-devtools-shared/src/devtools/views/Settings/SettingsShared.css");
/* harmony import */ var _SettingsShared_css__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_SettingsShared_css__WEBPACK_IMPORTED_MODULE_4__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function ProfilerSettings(_) {
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(react_devtools_shared_src_devtools_views_Profiler_ProfilerContext__WEBPACK_IMPORTED_MODULE_3__["ProfilerContext"]),
isCommitFilterEnabled = _useContext.isCommitFilterEnabled,
minCommitDuration = _useContext.minCommitDuration,
setIsCommitFilterEnabled = _useContext.setIsCommitFilterEnabled,
setMinCommitDuration = _useContext.setMinCommitDuration;
var store = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_2__["StoreContext"]);
var recordChangeDescriptionsSubscription = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
return {
getCurrentValue: function getCurrentValue() {
return store.recordChangeDescriptions;
},
subscribe: function subscribe(callback) {
store.addListener('recordChangeDescriptions', callback);
return function () {
return store.removeListener('recordChangeDescriptions', callback);
};
}
};
}, [store]);
var recordChangeDescriptions = Object(_hooks__WEBPACK_IMPORTED_MODULE_1__["useSubscription"])(recordChangeDescriptionsSubscription);
var updateRecordChangeDescriptions = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (_ref) {
var currentTarget = _ref.currentTarget;
store.recordChangeDescriptions = currentTarget.checked;
}, [store]);
var updateMinCommitDuration = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (event) {
var newValue = parseFloat(event.currentTarget.value);
setMinCommitDuration(Number.isNaN(newValue) || newValue <= 0 ? 0 : newValue);
}, [setMinCommitDuration]);
var updateIsCommitFilterEnabled = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (event) {
var checked = event.currentTarget.checked;
setIsCommitFilterEnabled(checked);
if (checked) {
if (minCommitDurationInputRef.current !== null) {
minCommitDurationInputRef.current.focus();
}
}
}, [setIsCommitFilterEnabled]);
var minCommitDurationInputRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(null);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_4___default.a.Settings
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_4___default.a.Setting
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("label", null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("input", {
type: "checkbox",
checked: recordChangeDescriptions,
onChange: updateRecordChangeDescriptions
}), ' ', "Record why each component rendered while profiling.")), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_4___default.a.Setting
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("label", null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("input", {
checked: isCommitFilterEnabled,
onChange: updateIsCommitFilterEnabled,
type: "checkbox"
}), ' ', "Hide commits below"), ' ', react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("input", {
className: _SettingsShared_css__WEBPACK_IMPORTED_MODULE_4___default.a.Input,
onChange: updateMinCommitDuration,
ref: minCommitDurationInputRef,
type: "number",
value: minCommitDuration
}), ' ', "(ms)"));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Settings/SettingsContext.js":
/*!*******************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Settings/SettingsContext.js ***!
\*******************************************************************************/
/*! exports provided: SettingsContext, SettingsContextController */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "SettingsContext", function() { return SettingsContext; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "SettingsContextController", function() { return SettingsContextController; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_devtools_shared_src_constants__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-devtools-shared/src/constants */ "../react-devtools-shared/src/constants.js");
/* harmony import */ var _hooks__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../hooks */ "../react-devtools-shared/src/devtools/views/hooks.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../context */ "../react-devtools-shared/src/devtools/views/context.js");
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
var SettingsContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["createContext"])(null);
SettingsContext.displayName = 'SettingsContext';
function SettingsContextController(_ref) {
var browserTheme = _ref.browserTheme,
children = _ref.children,
componentsPortalContainer = _ref.componentsPortalContainer,
profilerPortalContainer = _ref.profilerPortalContainer;
var bridge = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_3__["BridgeContext"]);
var _useLocalStorage = Object(_hooks__WEBPACK_IMPORTED_MODULE_2__["useLocalStorage"])('React::DevTools::displayDensity', 'compact'),
_useLocalStorage2 = _slicedToArray(_useLocalStorage, 2),
displayDensity = _useLocalStorage2[0],
setDisplayDensity = _useLocalStorage2[1];
var _useLocalStorage3 = Object(_hooks__WEBPACK_IMPORTED_MODULE_2__["useLocalStorage"])('React::DevTools::theme', 'auto'),
_useLocalStorage4 = _slicedToArray(_useLocalStorage3, 2),
theme = _useLocalStorage4[0],
setTheme = _useLocalStorage4[1];
var _useLocalStorage5 = Object(_hooks__WEBPACK_IMPORTED_MODULE_2__["useLocalStorage"])(react_devtools_shared_src_constants__WEBPACK_IMPORTED_MODULE_1__["LOCAL_STORAGE_SHOULD_PATCH_CONSOLE_KEY"], true),
_useLocalStorage6 = _slicedToArray(_useLocalStorage5, 2),
appendComponentStack = _useLocalStorage6[0],
setAppendComponentStack = _useLocalStorage6[1];
var _useLocalStorage7 = Object(_hooks__WEBPACK_IMPORTED_MODULE_2__["useLocalStorage"])(react_devtools_shared_src_constants__WEBPACK_IMPORTED_MODULE_1__["LOCAL_STORAGE_TRACE_UPDATES_ENABLED_KEY"], false),
_useLocalStorage8 = _slicedToArray(_useLocalStorage7, 2),
traceUpdatesEnabled = _useLocalStorage8[0],
setTraceUpdatesEnabled = _useLocalStorage8[1];
var documentElements = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
var array = [document.documentElement];
if (componentsPortalContainer != null) {
array.push(componentsPortalContainer.ownerDocument.documentElement);
}
if (profilerPortalContainer != null) {
array.push(profilerPortalContainer.ownerDocument.documentElement);
}
return array;
}, [componentsPortalContainer, profilerPortalContainer]);
Object(react__WEBPACK_IMPORTED_MODULE_0__["useLayoutEffect"])(function () {
switch (displayDensity) {
case 'comfortable':
updateDisplayDensity('comfortable', documentElements);
break;
case 'compact':
updateDisplayDensity('compact', documentElements);
break;
default:
throw Error("Unsupported displayDensity value \"".concat(displayDensity, "\""));
}
}, [displayDensity, documentElements]);
Object(react__WEBPACK_IMPORTED_MODULE_0__["useLayoutEffect"])(function () {
switch (theme) {
case 'light':
updateThemeVariables('light', documentElements);
break;
case 'dark':
updateThemeVariables('dark', documentElements);
break;
case 'auto':
updateThemeVariables(browserTheme, documentElements);
break;
default:
throw Error("Unsupported theme value \"".concat(theme, "\""));
}
}, [browserTheme, theme, documentElements]);
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
bridge.send('updateAppendComponentStack', appendComponentStack);
}, [bridge, appendComponentStack]);
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
bridge.send('setTraceUpdatesEnabled', traceUpdatesEnabled);
}, [bridge, traceUpdatesEnabled]);
var value = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
return {
appendComponentStack: appendComponentStack,
displayDensity: displayDensity,
lineHeight: displayDensity === 'compact' ? react_devtools_shared_src_constants__WEBPACK_IMPORTED_MODULE_1__["COMPACT_LINE_HEIGHT"] : react_devtools_shared_src_constants__WEBPACK_IMPORTED_MODULE_1__["COMFORTABLE_LINE_HEIGHT"],
setAppendComponentStack: setAppendComponentStack,
setDisplayDensity: setDisplayDensity,
setTheme: setTheme,
setTraceUpdatesEnabled: setTraceUpdatesEnabled,
theme: theme,
traceUpdatesEnabled: traceUpdatesEnabled
};
}, [appendComponentStack, displayDensity, setAppendComponentStack, setDisplayDensity, setTheme, setTraceUpdatesEnabled, theme, traceUpdatesEnabled]);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(SettingsContext.Provider, {
value: value
}, children);
}
function setStyleVariable(name, value, documentElements) {
documentElements.forEach(function (documentElement) {
return documentElement.style.setProperty(name, value);
});
}
function updateStyleHelper(themeKey, style, documentElements) {
setStyleVariable("--".concat(style), "var(--".concat(themeKey, "-").concat(style, ")"), documentElements);
}
function updateDisplayDensity(displayDensity, documentElements) {
updateStyleHelper(displayDensity, 'font-size-monospace-normal', documentElements);
updateStyleHelper(displayDensity, 'font-size-monospace-large', documentElements);
updateStyleHelper(displayDensity, 'font-size-monospace-small', documentElements);
updateStyleHelper(displayDensity, 'font-size-sans-normal', documentElements);
updateStyleHelper(displayDensity, 'font-size-sans-large', documentElements);
updateStyleHelper(displayDensity, 'font-size-sans-small', documentElements);
updateStyleHelper(displayDensity, 'line-height-data', documentElements); // Sizes and paddings/margins are all rem-based,
// so update the root font-size as well when the display preference changes.
var computedStyle = getComputedStyle(document.body);
var fontSize = computedStyle.getPropertyValue("--".concat(displayDensity, "-root-font-size"));
var root = document.querySelector(':root');
root.style.fontSize = fontSize;
}
function updateThemeVariables(theme, documentElements) {
updateStyleHelper(theme, 'color-attribute-name', documentElements);
updateStyleHelper(theme, 'color-attribute-name-inverted', documentElements);
updateStyleHelper(theme, 'color-attribute-value', documentElements);
updateStyleHelper(theme, 'color-attribute-value-inverted', documentElements);
updateStyleHelper(theme, 'color-attribute-editable-value', documentElements);
updateStyleHelper(theme, 'color-background', documentElements);
updateStyleHelper(theme, 'color-background-hover', documentElements);
updateStyleHelper(theme, 'color-background-inactive', documentElements);
updateStyleHelper(theme, 'color-background-invalid', documentElements);
updateStyleHelper(theme, 'color-background-selected', documentElements);
updateStyleHelper(theme, 'color-border', documentElements);
updateStyleHelper(theme, 'color-button-background', documentElements);
updateStyleHelper(theme, 'color-button-background-focus', documentElements);
updateStyleHelper(theme, 'color-button', documentElements);
updateStyleHelper(theme, 'color-button-active', documentElements);
updateStyleHelper(theme, 'color-button-disabled', documentElements);
updateStyleHelper(theme, 'color-button-focus', documentElements);
updateStyleHelper(theme, 'color-button-hover', documentElements);
updateStyleHelper(theme, 'color-commit-did-not-render-fill', documentElements);
updateStyleHelper(theme, 'color-commit-did-not-render-fill-text', documentElements);
updateStyleHelper(theme, 'color-commit-did-not-render-pattern', documentElements);
updateStyleHelper(theme, 'color-commit-did-not-render-pattern-text', documentElements);
updateStyleHelper(theme, 'color-commit-gradient-0', documentElements);
updateStyleHelper(theme, 'color-commit-gradient-1', documentElements);
updateStyleHelper(theme, 'color-commit-gradient-2', documentElements);
updateStyleHelper(theme, 'color-commit-gradient-3', documentElements);
updateStyleHelper(theme, 'color-commit-gradient-4', documentElements);
updateStyleHelper(theme, 'color-commit-gradient-5', documentElements);
updateStyleHelper(theme, 'color-commit-gradient-6', documentElements);
updateStyleHelper(theme, 'color-commit-gradient-7', documentElements);
updateStyleHelper(theme, 'color-commit-gradient-8', documentElements);
updateStyleHelper(theme, 'color-commit-gradient-9', documentElements);
updateStyleHelper(theme, 'color-commit-gradient-text', documentElements);
updateStyleHelper(theme, 'color-component-name', documentElements);
updateStyleHelper(theme, 'color-component-name-inverted', documentElements);
updateStyleHelper(theme, 'color-component-badge-background', documentElements);
updateStyleHelper(theme, 'color-component-badge-background-inverted', documentElements);
updateStyleHelper(theme, 'color-component-badge-count', documentElements);
updateStyleHelper(theme, 'color-component-badge-count-inverted', documentElements);
updateStyleHelper(theme, 'color-context-background', documentElements);
updateStyleHelper(theme, 'color-context-background-hover', documentElements);
updateStyleHelper(theme, 'color-context-background-selected', documentElements);
updateStyleHelper(theme, 'color-context-border', documentElements);
updateStyleHelper(theme, 'color-context-text', documentElements);
updateStyleHelper(theme, 'color-context-text-selected', documentElements);
updateStyleHelper(theme, 'color-dim', documentElements);
updateStyleHelper(theme, 'color-dimmer', documentElements);
updateStyleHelper(theme, 'color-dimmest', documentElements);
updateStyleHelper(theme, 'color-expand-collapse-toggle', documentElements);
updateStyleHelper(theme, 'color-modal-background', documentElements);
updateStyleHelper(theme, 'color-record-active', documentElements);
updateStyleHelper(theme, 'color-record-hover', documentElements);
updateStyleHelper(theme, 'color-record-inactive', documentElements);
updateStyleHelper(theme, 'color-color-scroll-thumb', documentElements);
updateStyleHelper(theme, 'color-color-scroll-track', documentElements);
updateStyleHelper(theme, 'color-search-match', documentElements);
updateStyleHelper(theme, 'color-shadow', documentElements);
updateStyleHelper(theme, 'color-search-match-current', documentElements);
updateStyleHelper(theme, 'color-selected-tree-highlight-active', documentElements);
updateStyleHelper(theme, 'color-selected-tree-highlight-inactive', documentElements);
updateStyleHelper(theme, 'color-tab-selected-border', documentElements);
updateStyleHelper(theme, 'color-text', documentElements);
updateStyleHelper(theme, 'color-text-invalid', documentElements);
updateStyleHelper(theme, 'color-text-selected', documentElements);
updateStyleHelper(theme, 'color-toggle-background-invalid', documentElements);
updateStyleHelper(theme, 'color-toggle-background-on', documentElements);
updateStyleHelper(theme, 'color-toggle-background-off', documentElements);
updateStyleHelper(theme, 'color-toggle-text', documentElements);
updateStyleHelper(theme, 'color-tooltip-background', documentElements);
updateStyleHelper(theme, 'color-tooltip-text', documentElements); // Font smoothing varies based on the theme.
updateStyleHelper(theme, 'font-smoothing', documentElements); // Update scrollbar color to match theme.
// this CSS property is currently only supported in Firefox,
// but it makes a significant UI improvement in dark mode.
// https://developer.mozilla.org/en-US/docs/Web/CSS/scrollbar-color
documentElements.forEach(function (documentElement) {
// $FlowFixMe scrollbarColor is missing in CSSStyleDeclaration
documentElement.style.scrollbarColor = "var(".concat("--".concat(theme, "-color-scroll-thumb"), ") var(", "--".concat(theme, "-color-scroll-track"), ")");
});
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Settings/SettingsModal.css":
/*!******************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Settings/SettingsModal.css ***!
\******************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./SettingsModal.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Settings/SettingsModal.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Settings/SettingsModal.js":
/*!*****************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Settings/SettingsModal.js ***!
\*****************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return SettingsModal; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _SettingsModalContext__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./SettingsModalContext */ "../react-devtools-shared/src/devtools/views/Settings/SettingsModalContext.js");
/* harmony import */ var _Button__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../Button */ "../react-devtools-shared/src/devtools/views/Button.js");
/* harmony import */ var _ButtonIcon__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../ButtonIcon */ "../react-devtools-shared/src/devtools/views/ButtonIcon.js");
/* harmony import */ var _TabBar__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../TabBar */ "../react-devtools-shared/src/devtools/views/TabBar.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var _hooks__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../hooks */ "../react-devtools-shared/src/devtools/views/hooks.js");
/* harmony import */ var _ComponentsSettings__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./ComponentsSettings */ "../react-devtools-shared/src/devtools/views/Settings/ComponentsSettings.js");
/* harmony import */ var _GeneralSettings__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./GeneralSettings */ "../react-devtools-shared/src/devtools/views/Settings/GeneralSettings.js");
/* harmony import */ var _ProfilerSettings__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./ProfilerSettings */ "../react-devtools-shared/src/devtools/views/Settings/ProfilerSettings.js");
/* harmony import */ var _SettingsModal_css__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./SettingsModal.css */ "../react-devtools-shared/src/devtools/views/Settings/SettingsModal.css");
/* harmony import */ var _SettingsModal_css__WEBPACK_IMPORTED_MODULE_10___default = /*#__PURE__*/__webpack_require__.n(_SettingsModal_css__WEBPACK_IMPORTED_MODULE_10__);
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function SettingsModal(_) {
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_SettingsModalContext__WEBPACK_IMPORTED_MODULE_1__["SettingsModalContext"]),
isModalShowing = _useContext.isModalShowing,
setIsModalShowing = _useContext.setIsModalShowing;
var store = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_5__["StoreContext"]);
var profilerStore = store.profilerStore; // Updating preferences while profiling is in progress could break things (e.g. filtering)
// Explicitly disallow it for now.
var isProfilingSubscription = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
return {
getCurrentValue: function getCurrentValue() {
return profilerStore.isProfiling;
},
subscribe: function subscribe(callback) {
profilerStore.addListener('isProfiling', callback);
return function () {
return profilerStore.removeListener('isProfiling', callback);
};
}
};
}, [profilerStore]);
var isProfiling = Object(_hooks__WEBPACK_IMPORTED_MODULE_6__["useSubscription"])(isProfilingSubscription);
if (isProfiling && isModalShowing) {
setIsModalShowing(false);
}
if (!isModalShowing) {
return null;
}
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(SettingsModalImpl, null);
}
function SettingsModalImpl(_) {
var _useContext2 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_SettingsModalContext__WEBPACK_IMPORTED_MODULE_1__["SettingsModalContext"]),
setIsModalShowing = _useContext2.setIsModalShowing;
var dismissModal = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function () {
return setIsModalShowing(false);
}, [setIsModalShowing]);
var _useLocalStorage = Object(_hooks__WEBPACK_IMPORTED_MODULE_6__["useLocalStorage"])('React::DevTools::selectedSettingsTabID', 'general'),
_useLocalStorage2 = _slicedToArray(_useLocalStorage, 2),
selectedTabID = _useLocalStorage2[0],
selectTab = _useLocalStorage2[1];
var modalRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["useRef"])(null);
Object(_hooks__WEBPACK_IMPORTED_MODULE_6__["useModalDismissSignal"])(modalRef, dismissModal);
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
if (modalRef.current !== null) {
modalRef.current.focus();
}
}, [modalRef]);
var view = null;
switch (selectedTabID) {
case 'general':
view = react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_GeneralSettings__WEBPACK_IMPORTED_MODULE_8__["default"], null);
break;
case 'profiler':
view = react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ProfilerSettings__WEBPACK_IMPORTED_MODULE_9__["default"], null);
break;
case 'components':
view = react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ComponentsSettings__WEBPACK_IMPORTED_MODULE_7__["default"], null);
break;
default:
break;
}
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SettingsModal_css__WEBPACK_IMPORTED_MODULE_10___default.a.Background
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SettingsModal_css__WEBPACK_IMPORTED_MODULE_10___default.a.Modal,
ref: modalRef
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SettingsModal_css__WEBPACK_IMPORTED_MODULE_10___default.a.Tabs
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_TabBar__WEBPACK_IMPORTED_MODULE_4__["default"], {
currentTab: selectedTabID,
id: "Settings",
selectTab: selectTab,
tabs: tabs,
type: "settings"
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SettingsModal_css__WEBPACK_IMPORTED_MODULE_10___default.a.Spacer
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_2__["default"], {
onClick: dismissModal,
title: "Close settings dialog"
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_3__["default"], {
type: "close"
}))), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _SettingsModal_css__WEBPACK_IMPORTED_MODULE_10___default.a.Content
}, view)));
}
var tabs = [{
id: 'general',
icon: 'settings',
label: 'General'
}, {
id: 'components',
icon: 'components',
label: 'Components'
}, {
id: 'profiler',
icon: 'profiler',
label: 'Profiler'
}];
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Settings/SettingsModalContext.js":
/*!************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Settings/SettingsModalContext.js ***!
\************************************************************************************/
/*! exports provided: SettingsModalContext, SettingsModalContextController */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "SettingsModalContext", function() { return SettingsModalContext; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "SettingsModalContextController", function() { return SettingsModalContextController; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
var SettingsModalContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["createContext"])(null);
SettingsModalContext.displayName = 'SettingsModalContext';
function SettingsModalContextController(_ref) {
var children = _ref.children;
var _useState = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(false),
_useState2 = _slicedToArray(_useState, 2),
isModalShowing = _useState2[0],
setIsModalShowing = _useState2[1];
var value = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
return {
isModalShowing: isModalShowing,
setIsModalShowing: setIsModalShowing
};
}, [isModalShowing, setIsModalShowing]);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(SettingsModalContext.Provider, {
value: value
}, children);
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Settings/SettingsModalContextToggle.js":
/*!******************************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Settings/SettingsModalContextToggle.js ***!
\******************************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return SettingsModalContextToggle; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _SettingsModalContext__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./SettingsModalContext */ "../react-devtools-shared/src/devtools/views/Settings/SettingsModalContext.js");
/* harmony import */ var _Button__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../Button */ "../react-devtools-shared/src/devtools/views/Button.js");
/* harmony import */ var _ButtonIcon__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../ButtonIcon */ "../react-devtools-shared/src/devtools/views/ButtonIcon.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var _hooks__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../hooks */ "../react-devtools-shared/src/devtools/views/hooks.js");
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function SettingsModalContextToggle() {
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_SettingsModalContext__WEBPACK_IMPORTED_MODULE_1__["SettingsModalContext"]),
setIsModalShowing = _useContext.setIsModalShowing;
var store = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_4__["StoreContext"]);
var profilerStore = store.profilerStore;
var showFilterModal = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function () {
return setIsModalShowing(true);
}, [setIsModalShowing]); // Updating preferences while profiling is in progress could break things (e.g. filtering)
// Explicitly disallow it for now.
var isProfilingSubscription = Object(react__WEBPACK_IMPORTED_MODULE_0__["useMemo"])(function () {
return {
getCurrentValue: function getCurrentValue() {
return profilerStore.isProfiling;
},
subscribe: function subscribe(callback) {
profilerStore.addListener('isProfiling', callback);
return function () {
return profilerStore.removeListener('isProfiling', callback);
};
}
};
}, [profilerStore]);
var isProfiling = Object(_hooks__WEBPACK_IMPORTED_MODULE_5__["useSubscription"])(isProfilingSubscription);
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Button__WEBPACK_IMPORTED_MODULE_2__["default"], {
disabled: isProfiling,
onClick: showFilterModal,
title: "View settings"
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ButtonIcon__WEBPACK_IMPORTED_MODULE_3__["default"], {
type: "settings"
}));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Settings/SettingsShared.css":
/*!*******************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Settings/SettingsShared.css ***!
\*******************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../../node_modules/css-loader??ref--5-1!./SettingsShared.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Settings/SettingsShared.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/TabBar.css":
/*!**************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/TabBar.css ***!
\**************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../node_modules/css-loader??ref--5-1!./TabBar.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/TabBar.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/TabBar.js":
/*!*************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/TabBar.js ***!
\*************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return TabBar; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _reach_tooltip__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @reach/tooltip */ "../../node_modules/@reach/tooltip/es/index.js");
/* harmony import */ var _Icon__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Icon */ "../react-devtools-shared/src/devtools/views/Icon.js");
/* harmony import */ var _TabBar_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./TabBar.css */ "../react-devtools-shared/src/devtools/views/TabBar.css");
/* harmony import */ var _TabBar_css__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_TabBar_css__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _Tooltip_css__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./Tooltip.css */ "../react-devtools-shared/src/devtools/views/Tooltip.css");
/* harmony import */ var _Tooltip_css__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_Tooltip_css__WEBPACK_IMPORTED_MODULE_4__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function TabBar(_ref) {
var currentTab = _ref.currentTab,
_ref$disabled = _ref.disabled,
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
groupName = _ref.id,
selectTab = _ref.selectTab,
tabs = _ref.tabs,
type = _ref.type;
if (!tabs.some(function (tab) {
return tab.id === currentTab;
})) {
selectTab(tabs[0].id);
}
var onChange = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (_ref2) {
var currentTarget = _ref2.currentTarget;
return selectTab(currentTarget.value);
}, [selectTab]);
var handleKeyDown = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function (event) {
switch (event.key) {
case 'ArrowDown':
case 'ArrowLeft':
case 'ArrowRight':
case 'ArrowUp':
event.stopPropagation();
break;
default:
break;
}
}, []);
var iconSizeClassName;
var tabLabelClassName;
var tabSizeClassName;
switch (type) {
case 'navigation':
iconSizeClassName = _TabBar_css__WEBPACK_IMPORTED_MODULE_3___default.a.IconSizeNavigation;
tabLabelClassName = _TabBar_css__WEBPACK_IMPORTED_MODULE_3___default.a.TabLabelNavigation;
tabSizeClassName = _TabBar_css__WEBPACK_IMPORTED_MODULE_3___default.a.TabSizeNavigation;
break;
case 'profiler':
iconSizeClassName = _TabBar_css__WEBPACK_IMPORTED_MODULE_3___default.a.IconSizeProfiler;
tabLabelClassName = _TabBar_css__WEBPACK_IMPORTED_MODULE_3___default.a.TabLabelProfiler;
tabSizeClassName = _TabBar_css__WEBPACK_IMPORTED_MODULE_3___default.a.TabSizeProfiler;
break;
case 'settings':
iconSizeClassName = _TabBar_css__WEBPACK_IMPORTED_MODULE_3___default.a.IconSizeSettings;
tabLabelClassName = _TabBar_css__WEBPACK_IMPORTED_MODULE_3___default.a.TabLabelSettings;
tabSizeClassName = _TabBar_css__WEBPACK_IMPORTED_MODULE_3___default.a.TabSizeSettings;
break;
default:
throw Error("Unsupported type \"".concat(type, "\""));
}
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, tabs.map(function (_ref3) {
var icon = _ref3.icon,
id = _ref3.id,
label = _ref3.label,
title = _ref3.title;
var button = react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("label", {
className: [tabSizeClassName, disabled ? _TabBar_css__WEBPACK_IMPORTED_MODULE_3___default.a.TabDisabled : _TabBar_css__WEBPACK_IMPORTED_MODULE_3___default.a.Tab, !disabled && currentTab === id ? _TabBar_css__WEBPACK_IMPORTED_MODULE_3___default.a.TabCurrent : ''].join(' '),
key: id,
onKeyDown: handleKeyDown,
onMouseDown: function onMouseDown() {
return selectTab(id);
}
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("input", {
type: "radio",
className: _TabBar_css__WEBPACK_IMPORTED_MODULE_3___default.a.Input,
checked: currentTab === id,
disabled: disabled,
name: groupName,
value: id,
onChange: onChange
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_Icon__WEBPACK_IMPORTED_MODULE_2__["default"], {
className: "".concat(disabled ? _TabBar_css__WEBPACK_IMPORTED_MODULE_3___default.a.IconDisabled : '', " ").concat(iconSizeClassName),
type: icon
}), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("span", {
className: tabLabelClassName
}, label));
if (title) {
button = react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_reach_tooltip__WEBPACK_IMPORTED_MODULE_1__["default"], {
key: id,
className: _Tooltip_css__WEBPACK_IMPORTED_MODULE_4___default.a.Tooltip,
label: title
}, button);
}
return button;
}));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Toggle.css":
/*!**************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Toggle.css ***!
\**************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../node_modules/css-loader??ref--5-1!./Toggle.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Toggle.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Toggle.js":
/*!*************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Toggle.js ***!
\*************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return Toggle; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _reach_tooltip__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @reach/tooltip */ "../../node_modules/@reach/tooltip/es/index.js");
/* harmony import */ var _Toggle_css__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Toggle.css */ "../react-devtools-shared/src/devtools/views/Toggle.css");
/* harmony import */ var _Toggle_css__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_Toggle_css__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _Tooltip_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./Tooltip.css */ "../react-devtools-shared/src/devtools/views/Tooltip.css");
/* harmony import */ var _Tooltip_css__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_Tooltip_css__WEBPACK_IMPORTED_MODULE_3__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function Toggle(_ref) {
var children = _ref.children,
_ref$className = _ref.className,
className = _ref$className === void 0 ? '' : _ref$className,
_ref$isDisabled = _ref.isDisabled,
isDisabled = _ref$isDisabled === void 0 ? false : _ref$isDisabled,
isChecked = _ref.isChecked,
onChange = _ref.onChange,
title = _ref.title;
var defaultClassName;
if (isDisabled) {
defaultClassName = _Toggle_css__WEBPACK_IMPORTED_MODULE_2___default.a.ToggleDisabled;
} else if (isChecked) {
defaultClassName = _Toggle_css__WEBPACK_IMPORTED_MODULE_2___default.a.ToggleOn;
} else {
defaultClassName = _Toggle_css__WEBPACK_IMPORTED_MODULE_2___default.a.ToggleOff;
}
var handleClick = Object(react__WEBPACK_IMPORTED_MODULE_0__["useCallback"])(function () {
return onChange(!isChecked);
}, [isChecked, onChange]);
var toggle = react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("button", {
className: "".concat(defaultClassName, " ").concat(className),
disabled: isDisabled,
onClick: handleClick
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("span", {
className: _Toggle_css__WEBPACK_IMPORTED_MODULE_2___default.a.ToggleContent,
tabIndex: -1
}, children));
if (title) {
toggle = react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_reach_tooltip__WEBPACK_IMPORTED_MODULE_1__["default"], {
className: _Tooltip_css__WEBPACK_IMPORTED_MODULE_3___default.a.Tooltip,
label: title
}, toggle);
}
return toggle;
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/Tooltip.css":
/*!***************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/Tooltip.css ***!
\***************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../node_modules/css-loader??ref--5-1!./Tooltip.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/Tooltip.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/UnsupportedVersionDialog.css":
/*!********************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/UnsupportedVersionDialog.css ***!
\********************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../node_modules/css-loader??ref--5-1!./UnsupportedVersionDialog.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/UnsupportedVersionDialog.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/UnsupportedVersionDialog.js":
/*!*******************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/UnsupportedVersionDialog.js ***!
\*******************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return UnsupportedVersionDialog; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ "react-dom");
/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _ModalDialog__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./ModalDialog */ "../react-devtools-shared/src/devtools/views/ModalDialog.js");
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var react_devtools_shared_src_constants__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react-devtools-shared/src/constants */ "../react-devtools-shared/src/constants.js");
/* harmony import */ var _UnsupportedVersionDialog_css__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./UnsupportedVersionDialog.css */ "../react-devtools-shared/src/devtools/views/UnsupportedVersionDialog.css");
/* harmony import */ var _UnsupportedVersionDialog_css__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_UnsupportedVersionDialog_css__WEBPACK_IMPORTED_MODULE_5__);
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function UnsupportedVersionDialog(_) {
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_ModalDialog__WEBPACK_IMPORTED_MODULE_2__["ModalDialogContext"]),
dispatch = _useContext.dispatch;
var store = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_3__["StoreContext"]);
var _useState = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])('dialog-not-shown'),
_useState2 = _slicedToArray(_useState, 2),
state = _useState2[0],
setState = _useState2[1];
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
if (state === 'dialog-not-shown') {
var showDialog = function showDialog() {
Object(react_dom__WEBPACK_IMPORTED_MODULE_1__["unstable_batchedUpdates"])(function () {
setState('show-dialog');
dispatch({
canBeDismissed: true,
type: 'SHOW',
content: react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(DialogContent, null)
});
});
};
if (store.unsupportedRendererVersionDetected) {
showDialog();
} else {
store.addListener('unsupportedRendererVersionDetected', showDialog);
return function () {
store.removeListener('unsupportedRendererVersionDetected', showDialog);
};
}
}
}, [state, store]);
return null;
}
function DialogContent(_) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _UnsupportedVersionDialog_css__WEBPACK_IMPORTED_MODULE_5___default.a.Row
}, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", {
className: _UnsupportedVersionDialog_css__WEBPACK_IMPORTED_MODULE_5___default.a.Title
}, "Unsupported React version detected"), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("p", null, "This version of React DevTools supports React DOM v15+ and React Native v61+."), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("p", null, "In order to use DevTools with an older version of React, you'll need to", ' ', react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("a", {
className: _UnsupportedVersionDialog_css__WEBPACK_IMPORTED_MODULE_5___default.a.ReleaseNotesLink,
target: "_blank",
rel: "noopener noreferrer",
href: react_devtools_shared_src_constants__WEBPACK_IMPORTED_MODULE_4__["UNSUPPORTED_VERSION_URL"]
}, "install an older version of the extension"), "."))));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/WarnIfLegacyBackendDetected.css":
/*!***********************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/WarnIfLegacyBackendDetected.css ***!
\***********************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../node_modules/css-loader??ref--5-1!./WarnIfLegacyBackendDetected.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/WarnIfLegacyBackendDetected.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/WarnIfLegacyBackendDetected.js":
/*!**********************************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/WarnIfLegacyBackendDetected.js ***!
\**********************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return WarnIfLegacyBackendDetected; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _context__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./context */ "../react-devtools-shared/src/devtools/views/context.js");
/* harmony import */ var _ModalDialog__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./ModalDialog */ "../react-devtools-shared/src/devtools/views/ModalDialog.js");
/* harmony import */ var _WarnIfLegacyBackendDetected_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./WarnIfLegacyBackendDetected.css */ "../react-devtools-shared/src/devtools/views/WarnIfLegacyBackendDetected.css");
/* harmony import */ var _WarnIfLegacyBackendDetected_css__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_WarnIfLegacyBackendDetected_css__WEBPACK_IMPORTED_MODULE_3__);
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function WarnIfLegacyBackendDetected(_) {
var bridge = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_context__WEBPACK_IMPORTED_MODULE_1__["BridgeContext"]);
var _useContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["useContext"])(_ModalDialog__WEBPACK_IMPORTED_MODULE_2__["ModalDialogContext"]),
dispatch = _useContext.dispatch; // Detect pairing with legacy v3 backend.
// We do this by listening to a message that it broadcasts but the v4 backend doesn't.
// In this case the frontend should show upgrade instructions.
Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
// Wall.listen returns a cleanup function
var unlisten = bridge.wall.listen(function (message) {
switch (message.type) {
case 'call':
case 'event':
case 'many-events':
// Any of these types indicate the v3 backend.
dispatch({
canBeDismissed: false,
type: 'SHOW',
title: 'DevTools v4 is incompatible with this version of React',
content: react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(InvalidBackendDetected, null)
}); // Once we've identified the backend version, it's safe to unsubscribe.
if (typeof unlisten === 'function') {
unlisten();
unlisten = null;
}
break;
default:
break;
}
switch (message.event) {
case 'isBackendStorageAPISupported':
case 'isNativeStyleEditorSupported':
case 'operations':
case 'overrideComponentFilters':
// Any of these is sufficient to indicate a v4 backend.
// Once we've identified the backend version, it's safe to unsubscribe.
if (typeof unlisten === 'function') {
unlisten();
unlisten = null;
}
break;
default:
break;
}
});
return function () {
if (typeof unlisten === 'function') {
unlisten();
unlisten = null;
}
};
}, [bridge, dispatch]);
return null;
}
function InvalidBackendDetected(_) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("p", null, "Either upgrade React or install React DevTools v3:"), react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("code", {
className: _WarnIfLegacyBackendDetected_css__WEBPACK_IMPORTED_MODULE_3___default.a.Command
}, "npm install -d react-devtools@^3"));
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/context.js":
/*!**************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/context.js ***!
\**************************************************************/
/*! exports provided: BridgeContext, StoreContext, ContextMenuContext */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "BridgeContext", function() { return BridgeContext; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "StoreContext", function() { return StoreContext; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ContextMenuContext", function() { return ContextMenuContext; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _store__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../store */ "../react-devtools-shared/src/devtools/store.js");
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
var BridgeContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["createContext"])(null);
BridgeContext.displayName = 'BridgeContext';
var StoreContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["createContext"])(null);
StoreContext.displayName = 'StoreContext';
var ContextMenuContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["createContext"])({
isEnabledForInspectedElement: false,
viewAttributeSourceFunction: null
});
ContextMenuContext.displayName = 'ContextMenuContext';
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/hooks.js":
/*!************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/hooks.js ***!
\************************************************************/
/*! exports provided: useEditableValue, useIsOverflowing, useLocalStorage, useModalDismissSignal, useSubscription */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "useEditableValue", function() { return useEditableValue; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "useIsOverflowing", function() { return useIsOverflowing; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "useLocalStorage", function() { return useLocalStorage; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "useModalDismissSignal", function() { return useModalDismissSignal; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "useSubscription", function() { return useSubscription; });
/* harmony import */ var lodash_throttle__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! lodash.throttle */ "../../node_modules/lodash.throttle/index.js");
/* harmony import */ var lodash_throttle__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(lodash_throttle__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var react_devtools_shared_src_storage__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-devtools-shared/src/storage */ "../react-devtools-shared/src/storage.js");
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../utils */ "../react-devtools-shared/src/devtools/utils.js");
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(source, true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function useEditableValueReducer(state, action) {
switch (action.type) {
case 'RESET':
return _objectSpread({}, state, {
editableValue: Object(_utils__WEBPACK_IMPORTED_MODULE_3__["smartStringify"])(action.externalValue),
externalValue: action.externalValue,
hasPendingChanges: false,
isValid: true,
parsedValue: action.externalValue
});
case 'UPDATE':
var isNewValueValid = false;
var newParsedValue;
try {
newParsedValue = Object(_utils__WEBPACK_IMPORTED_MODULE_3__["smartParse"])(action.editableValue);
isNewValueValid = true;
} catch (error) {}
return _objectSpread({}, state, {
editableValue: Object(_utils__WEBPACK_IMPORTED_MODULE_3__["sanitizeForParse"])(action.editableValue),
externalValue: action.externalValue,
hasPendingChanges: Object(_utils__WEBPACK_IMPORTED_MODULE_3__["smartStringify"])(action.externalValue) !== action.editableValue,
isValid: isNewValueValid,
parsedValue: isNewValueValid ? newParsedValue : state.parsedValue
});
default:
throw new Error("Invalid action \"".concat(action.type, "\""));
}
} // Convenience hook for working with an editable value that is validated via JSON.parse.
function useEditableValue(externalValue) {
var _useReducer = Object(react__WEBPACK_IMPORTED_MODULE_1__["useReducer"])(useEditableValueReducer, {
editableValue: Object(_utils__WEBPACK_IMPORTED_MODULE_3__["smartStringify"])(externalValue),
externalValue: externalValue,
hasPendingChanges: false,
isValid: true,
parsedValue: externalValue
}),
_useReducer2 = _slicedToArray(_useReducer, 2),
state = _useReducer2[0],
dispatch = _useReducer2[1];
if (!Object.is(state.externalValue, externalValue)) {
if (!state.hasPendingChanges) {
dispatch({
type: 'RESET',
externalValue: externalValue
});
} else {
dispatch({
type: 'UPDATE',
editableValue: state.editableValue,
externalValue: externalValue
});
}
}
return [state, dispatch];
}
function useIsOverflowing(containerRef, totalChildWidth) {
var _useState = Object(react__WEBPACK_IMPORTED_MODULE_1__["useState"])(false),
_useState2 = _slicedToArray(_useState, 2),
isOverflowing = _useState2[0],
setIsOverflowing = _useState2[1]; // It's important to use a layout effect, so that we avoid showing a flash of overflowed content.
Object(react__WEBPACK_IMPORTED_MODULE_1__["useLayoutEffect"])(function () {
if (containerRef.current === null) {
return function () {};
}
var container = containerRef.current;
var handleResize = lodash_throttle__WEBPACK_IMPORTED_MODULE_0___default()(function () {
return setIsOverflowing(container.clientWidth <= totalChildWidth);
}, 100);
handleResize(); // It's important to listen to the ownerDocument.defaultView to support the browser extension.
// Here we use portals to render individual tabs (e.g. Profiler),
// and the root document might belong to a different window.
var ownerWindow = container.ownerDocument.defaultView;
ownerWindow.addEventListener('resize', handleResize);
return function () {
return ownerWindow.removeEventListener('resize', handleResize);
};
}, [containerRef, totalChildWidth]);
return isOverflowing;
} // Forked from https://usehooks.com/useLocalStorage/
function useLocalStorage(key, initialValue) {
var getValueFromLocalStorage = Object(react__WEBPACK_IMPORTED_MODULE_1__["useCallback"])(function () {
try {
var item = Object(react_devtools_shared_src_storage__WEBPACK_IMPORTED_MODULE_2__["localStorageGetItem"])(key);
if (item != null) {
return JSON.parse(item);
}
} catch (error) {
console.log(error);
}
if (typeof initialValue === 'function') {
return initialValue();
} else {
return initialValue;
}
}, [initialValue, key]);
var _useState3 = Object(react__WEBPACK_IMPORTED_MODULE_1__["useState"])(getValueFromLocalStorage),
_useState4 = _slicedToArray(_useState3, 2),
storedValue = _useState4[0],
setStoredValue = _useState4[1];
var setValue = Object(react__WEBPACK_IMPORTED_MODULE_1__["useCallback"])(function (value) {
try {
var valueToStore = value instanceof Function ? value(storedValue) : value;
setStoredValue(valueToStore);
Object(react_devtools_shared_src_storage__WEBPACK_IMPORTED_MODULE_2__["localStorageSetItem"])(key, JSON.stringify(valueToStore));
} catch (error) {
console.log(error);
}
}, [key, storedValue]); // Listen for changes to this local storage value made from other windows.
// This enables the e.g. "⚛️ Elements" tab to update in response to changes from "⚛️ Settings".
Object(react__WEBPACK_IMPORTED_MODULE_1__["useLayoutEffect"])(function () {
var onStorage = function onStorage(event) {
var newValue = getValueFromLocalStorage();
if (key === event.key && storedValue !== newValue) {
setValue(newValue);
}
};
window.addEventListener('storage', onStorage);
return function () {
window.removeEventListener('storage', onStorage);
};
}, [getValueFromLocalStorage, key, storedValue, setValue]);
return [storedValue, setValue];
}
function useModalDismissSignal(modalRef, dismissCallback) {
var dismissOnClickOutside = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
Object(react__WEBPACK_IMPORTED_MODULE_1__["useEffect"])(function () {
if (modalRef.current === null) {
return function () {};
}
var handleDocumentKeyDown = function handleDocumentKeyDown(_ref) {
var key = _ref.key;
if (key === 'Escape') {
dismissCallback();
}
};
var handleDocumentClick = function handleDocumentClick(event) {
// $FlowFixMe
if (modalRef.current !== null && !modalRef.current.contains(event.target)) {
event.stopPropagation();
event.preventDefault();
dismissCallback();
}
}; // It's important to listen to the ownerDocument to support the browser extension.
// Here we use portals to render individual tabs (e.g. Profiler),
// and the root document might belong to a different window.
var ownerDocument = modalRef.current.ownerDocument;
ownerDocument.addEventListener('keydown', handleDocumentKeyDown);
if (dismissOnClickOutside) {
ownerDocument.addEventListener('click', handleDocumentClick);
}
return function () {
ownerDocument.removeEventListener('keydown', handleDocumentKeyDown);
ownerDocument.removeEventListener('click', handleDocumentClick);
};
}, [modalRef, dismissCallback, dismissOnClickOutside]);
} // Copied from https://github.com/facebook/react/pull/15022
function useSubscription(_ref2) {
var getCurrentValue = _ref2.getCurrentValue,
subscribe = _ref2.subscribe;
var _useState5 = Object(react__WEBPACK_IMPORTED_MODULE_1__["useState"])({
getCurrentValue: getCurrentValue,
subscribe: subscribe,
value: getCurrentValue()
}),
_useState6 = _slicedToArray(_useState5, 2),
state = _useState6[0],
setState = _useState6[1];
if (state.getCurrentValue !== getCurrentValue || state.subscribe !== subscribe) {
setState({
getCurrentValue: getCurrentValue,
subscribe: subscribe,
value: getCurrentValue()
});
}
Object(react__WEBPACK_IMPORTED_MODULE_1__["useEffect"])(function () {
var didUnsubscribe = false;
var checkForUpdates = function checkForUpdates() {
if (didUnsubscribe) {
return;
}
setState(function (prevState) {
if (prevState.getCurrentValue !== getCurrentValue || prevState.subscribe !== subscribe) {
return prevState;
}
var value = getCurrentValue();
if (prevState.value === value) {
return prevState;
}
return _objectSpread({}, prevState, {
value: value
});
});
};
var unsubscribe = subscribe(checkForUpdates);
checkForUpdates();
return function () {
didUnsubscribe = true;
unsubscribe();
};
}, [getCurrentValue, subscribe]);
return state.value;
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/portaledContent.js":
/*!**********************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/portaledContent.js ***!
\**********************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return portaledContent; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ "react-dom");
/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _ErrorBoundary__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./ErrorBoundary */ "../react-devtools-shared/src/devtools/views/ErrorBoundary.js");
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function portaledContent(Component) {
return function PortaledContent(_ref) {
var portalContainer = _ref.portalContainer,
rest = _objectWithoutProperties(_ref, ["portalContainer"]);
var children = react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_ErrorBoundary__WEBPACK_IMPORTED_MODULE_2__["default"], null, react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(Component, rest));
return portalContainer != null ? Object(react_dom__WEBPACK_IMPORTED_MODULE_1__["createPortal"])(children, portalContainer) : children;
};
}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/root.css":
/*!************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/root.css ***!
\************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var content = __webpack_require__(/*! !../../../../../node_modules/css-loader??ref--5-1!./root.css */ "../../node_modules/css-loader/index.js?!../react-devtools-shared/src/devtools/views/root.css");
if(typeof content === 'string') content = [[module.i, content, '']];
var transform;
var insertInto;
var options = {"hmr":true}
options.transform = transform
options.insertInto = undefined;
var update = __webpack_require__(/*! ../../../../../node_modules/style-loader/lib/addStyles.js */ "../../node_modules/style-loader/lib/addStyles.js")(content, options);
if(content.locals) module.exports = content.locals;
if(false) {}
/***/ }),
/***/ "../react-devtools-shared/src/devtools/views/utils.js":
/*!************************************************************!*\
!*** ../react-devtools-shared/src/devtools/views/utils.js ***!
\************************************************************/
/*! exports provided: alphaSortEntries, createRegExp, getMetaValueLabel, serializeDataForCopy, serializeHooksForCopy, downloadFile, truncateText */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "alphaSortEntries", function() { return alphaSortEntries; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "createRegExp", function() { return createRegExp; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getMetaValueLabel", function() { return getMetaValueLabel; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "serializeDataForCopy", function() { return serializeDataForCopy; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "serializeHooksForCopy", function() { return serializeHooksForCopy; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "downloadFile", function() { return downloadFile; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "truncateText", function() { return truncateText; });
/* harmony import */ var escape_string_regexp__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! escape-string-regexp */ "../../node_modules/escape-string-regexp/index.js");
/* harmony import */ var escape_string_regexp__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(escape_string_regexp__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _hydration__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../hydration */ "../react-devtools-shared/src/hydration.js");
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../utils */ "../react-devtools-shared/src/utils.js");
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }
function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function alphaSortEntries(entryA, entryB) {
var a = entryA[0];
var b = entryB[0];
if ('' + +a === a) {
if ('' + +b !== b) {
return -1;
}
return +a < +b ? -1 : 1;
}
return a < b ? -1 : 1;
}
function createRegExp(string) {
// Allow /regex/ syntax with optional last /
if (string[0] === '/') {
// Cut off first slash
string = string.substring(1); // Cut off last slash, but only if it's there
if (string[string.length - 1] === '/') {
string = string.substring(0, string.length - 1);
}
try {
return new RegExp(string, 'i');
} catch (err) {
// Bad regex. Make it not match anything.
// TODO: maybe warn in console?
return new RegExp('.^');
}
}
function isLetter(char) {
return char.toLowerCase() !== char.toUpperCase();
}
function matchAnyCase(char) {
if (!isLetter(char)) {
// Don't mess with special characters like [.
return char;
}
return '[' + char.toLowerCase() + char.toUpperCase() + ']';
} // 'item' should match 'Item' and 'ListItem', but not 'InviteMom'.
// To do this, we'll slice off 'tem' and check first letter separately.
var escaped = escape_string_regexp__WEBPACK_IMPORTED_MODULE_0___default()(string);
var firstChar = escaped[0];
var restRegex = ''; // For 'item' input, restRegex becomes '[tT][eE][mM]'
// We can't simply make it case-insensitive because first letter case matters.
for (var i = 1; i < escaped.length; i++) {
restRegex += matchAnyCase(escaped[i]);
}
if (!isLetter(firstChar)) {
// We can't put a non-character like [ in a group
// so we fall back to the simple case.
return new RegExp(firstChar + restRegex);
} // Construct a smarter regex.
return new RegExp( // For example:
// (^[iI]|I)[tT][eE][mM]
// Matches:
// 'Item'
// 'ListItem'
// but not 'InviteMom'
'(^' + matchAnyCase(firstChar) + '|' + firstChar.toUpperCase() + ')' + restRegex);
}
function getMetaValueLabel(data) {
if (hasOwnProperty.call(data, _hydration__WEBPACK_IMPORTED_MODULE_1__["meta"].preview_long)) {
return data[_hydration__WEBPACK_IMPORTED_MODULE_1__["meta"].preview_long];
} else {
return Object(_utils__WEBPACK_IMPORTED_MODULE_2__["formatDataForPreview"])(data, true);
}
}
function sanitize(data) {
for (var key in data) {
var value = data[key];
if (value && value[_hydration__WEBPACK_IMPORTED_MODULE_1__["meta"].type]) {
data[key] = getMetaValueLabel(value);
} else if (value != null) {
if (Array.isArray(value)) {
sanitize(value);
} else if (_typeof(value) === 'object') {
sanitize(value);
}
}
}
}
function serializeDataForCopy(props) {
var cloned = Object.assign({}, props);
sanitize(cloned);
try {
return JSON.stringify(cloned, null, 2);
} catch (error) {
return '';
}
}
function serializeHooksForCopy(hooks) {
// $FlowFixMe "HooksTree is not an object"
var cloned = Object.assign([], hooks);
var queue = _toConsumableArray(cloned);
while (queue.length > 0) {
var current = queue.pop(); // These aren't meaningful
delete current.id;
delete current.isStateEditable;
if (current.subHooks.length > 0) {
queue.push.apply(queue, _toConsumableArray(current.subHooks));
}
}
sanitize(cloned);
try {
return JSON.stringify(cloned, null, 2);
} catch (error) {
return '';
}
} // Keeping this in memory seems to be enough to enable the browser to download larger profiles.
// Without this, we would see a "Download failed: network error" failure.
var downloadUrl = null;
function downloadFile(element, filename, text) {
var blob = new Blob([text], {
type: 'text/plain;charset=utf-8'
});
if (downloadUrl !== null) {
URL.revokeObjectURL(downloadUrl);
}
downloadUrl = URL.createObjectURL(blob);
element.setAttribute('href', downloadUrl);
element.setAttribute('download', filename);
element.click();
}
function truncateText(text, maxLength) {
var length = text.length;
if (length > maxLength) {
return text.substr(0, Math.floor(maxLength / 2)) + '…' + text.substr(length - Math.ceil(maxLength / 2) - 1);
} else {
return text;
}
}
/***/ }),
/***/ "../react-devtools-shared/src/hydration.js":
/*!*************************************************!*\
!*** ../react-devtools-shared/src/hydration.js ***!
\*************************************************/
/*! exports provided: meta, dehydrate, fillInPath, hydrate */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "meta", function() { return meta; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "dehydrate", function() { return dehydrate; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "fillInPath", function() { return fillInPath; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "hydrate", function() { return hydrate; });
/* harmony import */ var es6_symbol__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! es6-symbol */ "../../node_modules/es6-symbol/index.js");
/* harmony import */ var es6_symbol__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(es6_symbol__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./utils */ "../react-devtools-shared/src/utils.js");
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(source, true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
var meta = {
inspectable: es6_symbol__WEBPACK_IMPORTED_MODULE_0___default()('inspectable'),
inspected: es6_symbol__WEBPACK_IMPORTED_MODULE_0___default()('inspected'),
name: es6_symbol__WEBPACK_IMPORTED_MODULE_0___default()('name'),
preview_long: es6_symbol__WEBPACK_IMPORTED_MODULE_0___default()('preview_long'),
preview_short: es6_symbol__WEBPACK_IMPORTED_MODULE_0___default()('preview_short'),
readonly: es6_symbol__WEBPACK_IMPORTED_MODULE_0___default()('readonly'),
size: es6_symbol__WEBPACK_IMPORTED_MODULE_0___default()('size'),
type: es6_symbol__WEBPACK_IMPORTED_MODULE_0___default()('type'),
unserializable: es6_symbol__WEBPACK_IMPORTED_MODULE_0___default()('unserializable')
};
// This threshold determines the depth at which the bridge "dehydrates" nested data.
// Dehydration means that we don't serialize the data for e.g. postMessage or stringify,
// unless the frontend explicitly requests it (e.g. a user clicks to expand a props object).
//
// Reducing this threshold will improve the speed of initial component inspection,
// but may decrease the responsiveness of expanding objects/arrays to inspect further.
var LEVEL_THRESHOLD = 2;
/**
* Generate the dehydrated metadata for complex object instances
*/
function createDehydrated(type, inspectable, data, cleaned, path) {
cleaned.push(path);
var dehydrated = {
inspectable: inspectable,
type: type,
preview_long: Object(_utils__WEBPACK_IMPORTED_MODULE_1__["formatDataForPreview"])(data, true),
preview_short: Object(_utils__WEBPACK_IMPORTED_MODULE_1__["formatDataForPreview"])(data, false),
name: !data.constructor || data.constructor.name === 'Object' ? '' : data.constructor.name
};
if (type === 'array' || type === 'typed_array') {
dehydrated.size = data.length;
} else if (type === 'object') {
dehydrated.size = Object.keys(data).length;
}
if (type === 'iterator' || type === 'typed_array') {
dehydrated.readonly = true;
}
return dehydrated;
}
/**
* Strip out complex data (instances, functions, and data nested > LEVEL_THRESHOLD levels deep).
* The paths of the stripped out objects are appended to the `cleaned` list.
* On the other side of the barrier, the cleaned list is used to "re-hydrate" the cleaned representation into
* an object with symbols as attributes, so that a sanitized object can be distinguished from a normal object.
*
* Input: {"some": {"attr": fn()}, "other": AnInstance}
* Output: {
* "some": {
* "attr": {"name": the fn.name, type: "function"}
* },
* "other": {
* "name": "AnInstance",
* "type": "object",
* },
* }
* and cleaned = [["some", "attr"], ["other"]]
*/
function dehydrate(data, cleaned, unserializable, path, isPathWhitelisted) {
var level = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : 0;
var type = Object(_utils__WEBPACK_IMPORTED_MODULE_1__["getDataType"])(data);
var isPathWhitelistedCheck;
switch (type) {
case 'html_element':
cleaned.push(path);
return {
inspectable: false,
preview_short: Object(_utils__WEBPACK_IMPORTED_MODULE_1__["formatDataForPreview"])(data, false),
preview_long: Object(_utils__WEBPACK_IMPORTED_MODULE_1__["formatDataForPreview"])(data, true),
name: data.tagName,
type: type
};
case 'function':
cleaned.push(path);
return {
inspectable: false,
preview_short: Object(_utils__WEBPACK_IMPORTED_MODULE_1__["formatDataForPreview"])(data, false),
preview_long: Object(_utils__WEBPACK_IMPORTED_MODULE_1__["formatDataForPreview"])(data, true),
name: data.name,
type: type
};
case 'string':
return data.length <= 500 ? data : data.slice(0, 500) + '...';
case 'bigint':
cleaned.push(path);
return {
inspectable: false,
preview_short: Object(_utils__WEBPACK_IMPORTED_MODULE_1__["formatDataForPreview"])(data, false),
preview_long: Object(_utils__WEBPACK_IMPORTED_MODULE_1__["formatDataForPreview"])(data, true),
name: data.toString(),
type: type
};
case 'symbol':
cleaned.push(path);
return {
inspectable: false,
preview_short: Object(_utils__WEBPACK_IMPORTED_MODULE_1__["formatDataForPreview"])(data, false),
preview_long: Object(_utils__WEBPACK_IMPORTED_MODULE_1__["formatDataForPreview"])(data, true),
name: data.toString(),
type: type
};
// React Elements aren't very inspector-friendly,
// and often contain private fields or circular references.
case 'react_element':
cleaned.push(path);
return {
inspectable: false,
preview_short: Object(_utils__WEBPACK_IMPORTED_MODULE_1__["formatDataForPreview"])(data, false),
preview_long: Object(_utils__WEBPACK_IMPORTED_MODULE_1__["formatDataForPreview"])(data, true),
name: Object(_utils__WEBPACK_IMPORTED_MODULE_1__["getDisplayNameForReactElement"])(data) || 'Unknown',
type: type
};
// ArrayBuffers error if you try to inspect them.
case 'array_buffer':
case 'data_view':
cleaned.push(path);
return {
inspectable: false,
preview_short: Object(_utils__WEBPACK_IMPORTED_MODULE_1__["formatDataForPreview"])(data, false),
preview_long: Object(_utils__WEBPACK_IMPORTED_MODULE_1__["formatDataForPreview"])(data, true),
name: type === 'data_view' ? 'DataView' : 'ArrayBuffer',
size: data.byteLength,
type: type
};
case 'array':
isPathWhitelistedCheck = isPathWhitelisted(path);
if (level >= LEVEL_THRESHOLD && !isPathWhitelistedCheck) {
return createDehydrated(type, true, data, cleaned, path);
}
return data.map(function (item, i) {
return dehydrate(item, cleaned, unserializable, path.concat([i]), isPathWhitelisted, isPathWhitelistedCheck ? 1 : level + 1);
});
case 'typed_array':
case 'iterator':
isPathWhitelistedCheck = isPathWhitelisted(path);
if (level >= LEVEL_THRESHOLD && !isPathWhitelistedCheck) {
return createDehydrated(type, true, data, cleaned, path);
} else {
var unserializableValue = {
unserializable: true,
type: type,
readonly: true,
size: type === 'typed_array' ? data.length : undefined,
preview_short: Object(_utils__WEBPACK_IMPORTED_MODULE_1__["formatDataForPreview"])(data, false),
preview_long: Object(_utils__WEBPACK_IMPORTED_MODULE_1__["formatDataForPreview"])(data, true),
name: !data.constructor || data.constructor.name === 'Object' ? '' : data.constructor.name
};
if (_typeof(data[es6_symbol__WEBPACK_IMPORTED_MODULE_0___default.a.iterator])) {
// TRICKY
// Don't use [...spread] syntax for this purpose.
// This project uses @babel/plugin-transform-spread in "loose" mode which only works with Array values.
// Other types (e.g. typed arrays, Sets) will not spread correctly.
Array.from(data).forEach(function (item, i) {
return unserializableValue[i] = dehydrate(item, cleaned, unserializable, path.concat([i]), isPathWhitelisted, isPathWhitelistedCheck ? 1 : level + 1);
});
}
unserializable.push(path);
return unserializableValue;
}
case 'date':
cleaned.push(path);
return {
inspectable: false,
preview_short: Object(_utils__WEBPACK_IMPORTED_MODULE_1__["formatDataForPreview"])(data, false),
preview_long: Object(_utils__WEBPACK_IMPORTED_MODULE_1__["formatDataForPreview"])(data, true),
name: data.toString(),
type: type
};
case 'regexp':
cleaned.push(path);
return {
inspectable: false,
preview_short: Object(_utils__WEBPACK_IMPORTED_MODULE_1__["formatDataForPreview"])(data, false),
preview_long: Object(_utils__WEBPACK_IMPORTED_MODULE_1__["formatDataForPreview"])(data, true),
name: data.toString(),
type: type
};
case 'object':
isPathWhitelistedCheck = isPathWhitelisted(path);
if (level >= LEVEL_THRESHOLD && !isPathWhitelistedCheck) {
return createDehydrated(type, true, data, cleaned, path);
} else {
var object = {};
for (var name in data) {
object[name] = dehydrate(data[name], cleaned, unserializable, path.concat([name]), isPathWhitelisted, isPathWhitelistedCheck ? 1 : level + 1);
}
return object;
}
case 'infinity':
case 'nan':
case 'undefined':
// Some values are lossy when sent through a WebSocket.
// We dehydrate+rehydrate them to preserve their type.
cleaned.push(path);
return {
type: type
};
default:
return data;
}
}
function fillInPath(object, data, path, value) {
var target = Object(_utils__WEBPACK_IMPORTED_MODULE_1__["getInObject"])(object, path);
if (target != null) {
if (!target[meta.unserializable]) {
delete target[meta.inspectable];
delete target[meta.inspected];
delete target[meta.name];
delete target[meta.preview_long];
delete target[meta.preview_short];
delete target[meta.readonly];
delete target[meta.size];
delete target[meta.type];
}
}
if (value !== null && data.unserializable.length > 0) {
var unserializablePath = data.unserializable[0];
var isMatch = unserializablePath.length === path.length;
for (var i = 0; i < path.length; i++) {
if (path[i] !== unserializablePath[i]) {
isMatch = false;
break;
}
}
if (isMatch) {
upgradeUnserializable(value, value);
}
}
Object(_utils__WEBPACK_IMPORTED_MODULE_1__["setInObject"])(object, path, value);
}
function hydrate(object, cleaned, unserializable) {
cleaned.forEach(function (path) {
var length = path.length;
var last = path[length - 1];
var parent = Object(_utils__WEBPACK_IMPORTED_MODULE_1__["getInObject"])(object, path.slice(0, length - 1));
if (!parent || !parent.hasOwnProperty(last)) {
return;
}
var value = parent[last];
if (value.type === 'infinity') {
parent[last] = Infinity;
} else if (value.type === 'nan') {
parent[last] = NaN;
} else if (value.type === 'undefined') {
parent[last] = undefined;
} else {
// Replace the string keys with Symbols so they're non-enumerable.
var replaced = {};
replaced[meta.inspectable] = !!value.inspectable;
replaced[meta.inspected] = false;
replaced[meta.name] = value.name;
replaced[meta.preview_long] = value.preview_long;
replaced[meta.preview_short] = value.preview_short;
replaced[meta.size] = value.size;
replaced[meta.readonly] = !!value.readonly;
replaced[meta.type] = value.type;
parent[last] = replaced;
}
});
unserializable.forEach(function (path) {
var length = path.length;
var last = path[length - 1];
var parent = Object(_utils__WEBPACK_IMPORTED_MODULE_1__["getInObject"])(object, path.slice(0, length - 1));
if (!parent || !parent.hasOwnProperty(last)) {
return;
}
var node = parent[last];
var replacement = _objectSpread({}, node);
upgradeUnserializable(replacement, node);
parent[last] = replacement;
});
return object;
}
function upgradeUnserializable(destination, source) {
var _Object$definePropert;
Object.defineProperties(destination, (_Object$definePropert = {}, _defineProperty(_Object$definePropert, meta.inspected, {
configurable: true,
enumerable: false,
value: !!source.inspected
}), _defineProperty(_Object$definePropert, meta.name, {
configurable: true,
enumerable: false,
value: source.name
}), _defineProperty(_Object$definePropert, meta.preview_long, {
configurable: true,
enumerable: false,
value: source.preview_long
}), _defineProperty(_Object$definePropert, meta.preview_short, {
configurable: true,
enumerable: false,
value: source.preview_short
}), _defineProperty(_Object$definePropert, meta.size, {
configurable: true,
enumerable: false,
value: source.size
}), _defineProperty(_Object$definePropert, meta.readonly, {
configurable: true,
enumerable: false,
value: !!source.readonly
}), _defineProperty(_Object$definePropert, meta.type, {
configurable: true,
enumerable: false,
value: source.type
}), _defineProperty(_Object$definePropert, meta.unserializable, {
configurable: true,
enumerable: false,
value: !!source.unserializable
}), _Object$definePropert));
delete destination.inspected;
delete destination.name;
delete destination.preview_long;
delete destination.preview_short;
delete destination.size;
delete destination.readonly;
delete destination.type;
delete destination.unserializable;
}
/***/ }),
/***/ "../react-devtools-shared/src/node_modules/react-window/dist/index.esm.js":
/*!********************************************************************************!*\
!*** ../react-devtools-shared/src/node_modules/react-window/dist/index.esm.js ***!
\********************************************************************************/
/*! exports provided: VariableSizeGrid, VariableSizeList, FixedSizeGrid, FixedSizeList, areEqual, shouldComponentUpdate */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "VariableSizeGrid", function() { return VariableSizeGrid; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "VariableSizeList", function() { return VariableSizeList; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "FixedSizeGrid", function() { return FixedSizeGrid; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "FixedSizeList", function() { return FixedSizeList; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "areEqual", function() { return areEqual; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "shouldComponentUpdate", function() { return shouldComponentUpdate; });
/* harmony import */ var _babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/extends */ "../../node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _babel_runtime_helpers_esm_inheritsLoose__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/inheritsLoose */ "../../node_modules/@babel/runtime/helpers/esm/inheritsLoose.js");
/* harmony import */ var _babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @babel/runtime/helpers/esm/assertThisInitialized */ "../../node_modules/@babel/runtime/helpers/esm/assertThisInitialized.js");
/* harmony import */ var memoize_one__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! memoize-one */ "../../node_modules/memoize-one/esm/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_4__);
/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react-dom */ "react-dom");
/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_5__);
/* harmony import */ var _babel_runtime_helpers_esm_objectWithoutPropertiesLoose__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @babel/runtime/helpers/esm/objectWithoutPropertiesLoose */ "../../node_modules/@babel/runtime/helpers/esm/objectWithoutPropertiesLoose.js");
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
// Animation frame based implementation of setTimeout.
// Inspired by Joe Lambert, https://gist.github.com/joelambert/1002116#file-requesttimeout-js
var hasNativePerformanceNow = (typeof performance === "undefined" ? "undefined" : _typeof(performance)) === 'object' && typeof performance.now === 'function';
var now = hasNativePerformanceNow ? function () {
return performance.now();
} : function () {
return Date.now();
};
function cancelTimeout(timeoutID) {
cancelAnimationFrame(timeoutID.id);
}
function requestTimeout(callback, delay) {
var start = now();
function tick() {
if (now() - start >= delay) {
callback.call(null);
} else {
timeoutID.id = requestAnimationFrame(tick);
}
}
var timeoutID = {
id: requestAnimationFrame(tick)
};
return timeoutID;
}
var size = -1; // This utility copied from "dom-helpers" package.
function getScrollbarSize(recalculate) {
if (recalculate === void 0) {
recalculate = false;
}
if (size === -1 || recalculate) {
var div = document.createElement('div');
var style = div.style;
style.width = '50px';
style.height = '50px';
style.overflow = 'scroll';
document.body.appendChild(div);
size = div.offsetWidth - div.clientWidth;
document.body.removeChild(div);
}
return size;
}
var cachedRTLResult = null; // TRICKY According to the spec, scrollLeft should be negative for RTL aligned elements.
// Chrome does not seem to adhere; its scrollLeft values are positive (measured relative to the left).
// Safari's elastic bounce makes detecting this even more complicated wrt potential false positives.
// The safest way to check this is to intentionally set a negative offset,
// and then verify that the subsequent "scroll" event matches the negative offset.
// If it does not match, then we can assume a non-standard RTL scroll implementation.
function getRTLOffsetType(recalculate) {
if (recalculate === void 0) {
recalculate = false;
}
if (cachedRTLResult === null || recalculate) {
var outerDiv = document.createElement('div');
var outerStyle = outerDiv.style;
outerStyle.width = '50px';
outerStyle.height = '50px';
outerStyle.overflow = 'scroll';
outerStyle.direction = 'rtl';
var innerDiv = document.createElement('div');
var innerStyle = innerDiv.style;
innerStyle.width = '100px';
innerStyle.height = '100px';
outerDiv.appendChild(innerDiv);
document.body.appendChild(outerDiv);
if (outerDiv.scrollLeft > 0) {
cachedRTLResult = 'positive-descending';
} else {
outerDiv.scrollLeft = 1;
if (outerDiv.scrollLeft === 0) {
cachedRTLResult = 'negative';
} else {
cachedRTLResult = 'positive-ascending';
}
}
document.body.removeChild(outerDiv);
return cachedRTLResult;
}
return cachedRTLResult;
}
var IS_SCROLLING_DEBOUNCE_INTERVAL = 150;
var defaultItemKey = function defaultItemKey(_ref) {
var columnIndex = _ref.columnIndex,
data = _ref.data,
rowIndex = _ref.rowIndex;
return rowIndex + ":" + columnIndex;
}; // In DEV mode, this Set helps us only log a warning once per component instance.
// This avoids spamming the console every time a render happens.
var devWarningsOverscanCount = null;
var devWarningsOverscanRowsColumnsCount = null;
var devWarningsTagName = null;
if (false) {}
function createGridComponent(_ref2) {
var _class, _temp;
var getColumnOffset = _ref2.getColumnOffset,
getColumnStartIndexForOffset = _ref2.getColumnStartIndexForOffset,
getColumnStopIndexForStartIndex = _ref2.getColumnStopIndexForStartIndex,
getColumnWidth = _ref2.getColumnWidth,
getEstimatedTotalHeight = _ref2.getEstimatedTotalHeight,
getEstimatedTotalWidth = _ref2.getEstimatedTotalWidth,
getOffsetForColumnAndAlignment = _ref2.getOffsetForColumnAndAlignment,
getOffsetForRowAndAlignment = _ref2.getOffsetForRowAndAlignment,
getRowHeight = _ref2.getRowHeight,
getRowOffset = _ref2.getRowOffset,
getRowStartIndexForOffset = _ref2.getRowStartIndexForOffset,
getRowStopIndexForStartIndex = _ref2.getRowStopIndexForStartIndex,
initInstanceProps = _ref2.initInstanceProps,
shouldResetStyleCacheOnItemSizeChange = _ref2.shouldResetStyleCacheOnItemSizeChange,
validateProps = _ref2.validateProps;
return _temp = _class =
/*#__PURE__*/
function (_PureComponent) {
Object(_babel_runtime_helpers_esm_inheritsLoose__WEBPACK_IMPORTED_MODULE_1__["default"])(Grid, _PureComponent); // Always use explicit constructor for React components.
// It produces less code after transpilation. (#26)
// eslint-disable-next-line no-useless-constructor
function Grid(props) {
var _this;
_this = _PureComponent.call(this, props) || this;
_this._instanceProps = initInstanceProps(_this.props, Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_2__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_2__["default"])(_this)));
_this._resetIsScrollingTimeoutId = null;
_this._outerRef = void 0;
_this.state = {
instance: Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_2__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_2__["default"])(_this)),
isScrolling: false,
horizontalScrollDirection: 'forward',
scrollLeft: typeof _this.props.initialScrollLeft === 'number' ? _this.props.initialScrollLeft : 0,
scrollTop: typeof _this.props.initialScrollTop === 'number' ? _this.props.initialScrollTop : 0,
scrollUpdateWasRequested: false,
verticalScrollDirection: 'forward'
};
_this._callOnItemsRendered = void 0;
_this._callOnItemsRendered = Object(memoize_one__WEBPACK_IMPORTED_MODULE_3__["default"])(function (overscanColumnStartIndex, overscanColumnStopIndex, overscanRowStartIndex, overscanRowStopIndex, visibleColumnStartIndex, visibleColumnStopIndex, visibleRowStartIndex, visibleRowStopIndex) {
return _this.props.onItemsRendered({
overscanColumnStartIndex: overscanColumnStartIndex,
overscanColumnStopIndex: overscanColumnStopIndex,
overscanRowStartIndex: overscanRowStartIndex,
overscanRowStopIndex: overscanRowStopIndex,
visibleColumnStartIndex: visibleColumnStartIndex,
visibleColumnStopIndex: visibleColumnStopIndex,
visibleRowStartIndex: visibleRowStartIndex,
visibleRowStopIndex: visibleRowStopIndex
});
});
_this._callOnScroll = void 0;
_this._callOnScroll = Object(memoize_one__WEBPACK_IMPORTED_MODULE_3__["default"])(function (scrollLeft, scrollTop, horizontalScrollDirection, verticalScrollDirection, scrollUpdateWasRequested) {
return _this.props.onScroll({
horizontalScrollDirection: horizontalScrollDirection,
scrollLeft: scrollLeft,
scrollTop: scrollTop,
verticalScrollDirection: verticalScrollDirection,
scrollUpdateWasRequested: scrollUpdateWasRequested
});
});
_this._getItemStyle = void 0;
_this._getItemStyle = function (rowIndex, columnIndex) {
var _this$props = _this.props,
columnWidth = _this$props.columnWidth,
direction = _this$props.direction,
rowHeight = _this$props.rowHeight;
var itemStyleCache = _this._getItemStyleCache(shouldResetStyleCacheOnItemSizeChange && columnWidth, shouldResetStyleCacheOnItemSizeChange && direction, shouldResetStyleCacheOnItemSizeChange && rowHeight);
var key = rowIndex + ":" + columnIndex;
var style;
if (itemStyleCache.hasOwnProperty(key)) {
style = itemStyleCache[key];
} else {
var _style;
itemStyleCache[key] = style = (_style = {
position: 'absolute'
}, _style[direction === 'rtl' ? 'right' : 'left'] = getColumnOffset(_this.props, columnIndex, _this._instanceProps), _style.top = getRowOffset(_this.props, rowIndex, _this._instanceProps), _style.height = getRowHeight(_this.props, rowIndex, _this._instanceProps), _style.width = getColumnWidth(_this.props, columnIndex, _this._instanceProps), _style);
}
return style;
};
_this._getItemStyleCache = void 0;
_this._getItemStyleCache = Object(memoize_one__WEBPACK_IMPORTED_MODULE_3__["default"])(function (_, __, ___) {
return {};
});
_this._onScroll = function (event) {
var _event$currentTarget = event.currentTarget,
clientHeight = _event$currentTarget.clientHeight,
clientWidth = _event$currentTarget.clientWidth,
scrollLeft = _event$currentTarget.scrollLeft,
scrollTop = _event$currentTarget.scrollTop,
scrollHeight = _event$currentTarget.scrollHeight,
scrollWidth = _event$currentTarget.scrollWidth; // Force flush sync for scroll updates to reduce visual checkerboarding.
Object(react_dom__WEBPACK_IMPORTED_MODULE_5__["flushSync"])(function () {
_this.setState(function (prevState) {
if (prevState.scrollLeft === scrollLeft && prevState.scrollTop === scrollTop) {
// Scroll position may have been updated by cDM/cDU,
// In which case we don't need to trigger another render,
// And we don't want to update state.isScrolling.
return null;
}
var direction = _this.props.direction; // TRICKY According to the spec, scrollLeft should be negative for RTL aligned elements.
// This is not the case for all browsers though (e.g. Chrome reports values as positive, measured relative to the left).
// It's also easier for this component if we convert offsets to the same format as they would be in for ltr.
// So the simplest solution is to determine which browser behavior we're dealing with, and convert based on it.
var calculatedScrollLeft = scrollLeft;
if (direction === 'rtl') {
switch (getRTLOffsetType()) {
case 'negative':
calculatedScrollLeft = -scrollLeft;
break;
case 'positive-descending':
calculatedScrollLeft = scrollWidth - clientWidth - scrollLeft;
break;
}
} // Prevent Safari's elastic scrolling from causing visual shaking when scrolling past bounds.
calculatedScrollLeft = Math.max(0, Math.min(calculatedScrollLeft, scrollWidth - clientWidth));
var calculatedScrollTop = Math.max(0, Math.min(scrollTop, scrollHeight - clientHeight));
return {
isScrolling: true,
horizontalScrollDirection: prevState.scrollLeft < scrollLeft ? 'forward' : 'backward',
scrollLeft: calculatedScrollLeft,
scrollTop: calculatedScrollTop,
verticalScrollDirection: prevState.scrollTop < scrollTop ? 'forward' : 'backward',
scrollUpdateWasRequested: false
};
}, _this._resetIsScrollingDebounced);
});
};
_this._outerRefSetter = function (ref) {
var outerRef = _this.props.outerRef;
_this._outerRef = ref;
if (typeof outerRef === 'function') {
outerRef(ref);
} else if (outerRef != null && _typeof(outerRef) === 'object' && outerRef.hasOwnProperty('current')) {
outerRef.current = ref;
}
};
_this._resetIsScrollingDebounced = function () {
if (_this._resetIsScrollingTimeoutId !== null) {
cancelTimeout(_this._resetIsScrollingTimeoutId);
}
_this._resetIsScrollingTimeoutId = requestTimeout(_this._resetIsScrolling, IS_SCROLLING_DEBOUNCE_INTERVAL);
};
_this._resetIsScrolling = function () {
_this._resetIsScrollingTimeoutId = null;
_this.setState({
isScrolling: false
}, function () {
// Clear style cache after state update has been committed.
// This way we don't break pure sCU for items that don't use isScrolling param.
_this._getItemStyleCache(-1);
});
};
return _this;
}
Grid.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, prevState) {
validateSharedProps(nextProps, prevState);
validateProps(nextProps);
return null;
};
var _proto = Grid.prototype;
_proto.scrollTo = function scrollTo(_ref3) {
var scrollLeft = _ref3.scrollLeft,
scrollTop = _ref3.scrollTop;
if (scrollLeft !== undefined) {
scrollLeft = Math.max(0, scrollLeft);
}
if (scrollTop !== undefined) {
scrollTop = Math.max(0, scrollTop);
}
this.setState(function (prevState) {
if (scrollLeft === undefined) {
scrollLeft = prevState.scrollLeft;
}
if (scrollTop === undefined) {
scrollTop = prevState.scrollTop;
}
if (prevState.scrollLeft === scrollLeft && prevState.scrollTop === scrollTop) {
return null;
}
return {
horizontalScrollDirection: prevState.scrollLeft < scrollLeft ? 'forward' : 'backward',
scrollLeft: scrollLeft,
scrollTop: scrollTop,
scrollUpdateWasRequested: true,
verticalScrollDirection: prevState.scrollTop < scrollTop ? 'forward' : 'backward'
};
}, this._resetIsScrollingDebounced);
};
_proto.scrollToItem = function scrollToItem(_ref4) {
var _ref4$align = _ref4.align,
align = _ref4$align === void 0 ? 'auto' : _ref4$align,
columnIndex = _ref4.columnIndex,
rowIndex = _ref4.rowIndex;
var _this$props2 = this.props,
columnCount = _this$props2.columnCount,
height = _this$props2.height,
rowCount = _this$props2.rowCount,
width = _this$props2.width;
var _this$state = this.state,
scrollLeft = _this$state.scrollLeft,
scrollTop = _this$state.scrollTop;
var scrollbarSize = getScrollbarSize();
if (columnIndex !== undefined) {
columnIndex = Math.max(0, Math.min(columnIndex, columnCount - 1));
}
if (rowIndex !== undefined) {
rowIndex = Math.max(0, Math.min(rowIndex, rowCount - 1));
}
var estimatedTotalHeight = getEstimatedTotalHeight(this.props, this._instanceProps);
var estimatedTotalWidth = getEstimatedTotalWidth(this.props, this._instanceProps); // The scrollbar size should be considered when scrolling an item into view,
// to ensure it's fully visible.
// But we only need to account for its size when it's actually visible.
var horizontalScrollbarSize = estimatedTotalWidth > width ? scrollbarSize : 0;
var verticalScrollbarSize = estimatedTotalHeight > height ? scrollbarSize : 0;
this.scrollTo({
scrollLeft: columnIndex !== undefined ? getOffsetForColumnAndAlignment(this.props, columnIndex, align, scrollLeft, this._instanceProps, verticalScrollbarSize) : scrollLeft,
scrollTop: rowIndex !== undefined ? getOffsetForRowAndAlignment(this.props, rowIndex, align, scrollTop, this._instanceProps, horizontalScrollbarSize) : scrollTop
});
};
_proto.componentDidMount = function componentDidMount() {
var _this$props3 = this.props,
initialScrollLeft = _this$props3.initialScrollLeft,
initialScrollTop = _this$props3.initialScrollTop;
if (this._outerRef != null) {
var outerRef = this._outerRef;
if (typeof initialScrollLeft === 'number') {
outerRef.scrollLeft = initialScrollLeft;
}
if (typeof initialScrollTop === 'number') {
outerRef.scrollTop = initialScrollTop;
}
}
this._callPropsCallbacks();
};
_proto.componentDidUpdate = function componentDidUpdate() {
var direction = this.props.direction;
var _this$state2 = this.state,
scrollLeft = _this$state2.scrollLeft,
scrollTop = _this$state2.scrollTop,
scrollUpdateWasRequested = _this$state2.scrollUpdateWasRequested;
if (scrollUpdateWasRequested && this._outerRef != null) {
// TRICKY According to the spec, scrollLeft should be negative for RTL aligned elements.
// This is not the case for all browsers though (e.g. Chrome reports values as positive, measured relative to the left).
// So we need to determine which browser behavior we're dealing with, and mimic it.
var outerRef = this._outerRef;
if (direction === 'rtl') {
switch (getRTLOffsetType()) {
case 'negative':
outerRef.scrollLeft = -scrollLeft;
break;
case 'positive-ascending':
outerRef.scrollLeft = scrollLeft;
break;
default:
var clientWidth = outerRef.clientWidth,
scrollWidth = outerRef.scrollWidth;
outerRef.scrollLeft = scrollWidth - clientWidth - scrollLeft;
break;
}
} else {
outerRef.scrollLeft = Math.max(0, scrollLeft);
}
outerRef.scrollTop = Math.max(0, scrollTop);
}
this._callPropsCallbacks();
};
_proto.componentWillUnmount = function componentWillUnmount() {
if (this._resetIsScrollingTimeoutId !== null) {
cancelTimeout(this._resetIsScrollingTimeoutId);
}
};
_proto.render = function render() {
var _this$props4 = this.props,
children = _this$props4.children,
className = _this$props4.className,
columnCount = _this$props4.columnCount,
direction = _this$props4.direction,
height = _this$props4.height,
innerRef = _this$props4.innerRef,
innerElementType = _this$props4.innerElementType,
innerTagName = _this$props4.innerTagName,
itemData = _this$props4.itemData,
_this$props4$itemKey = _this$props4.itemKey,
itemKey = _this$props4$itemKey === void 0 ? defaultItemKey : _this$props4$itemKey,
outerElementType = _this$props4.outerElementType,
outerTagName = _this$props4.outerTagName,
rowCount = _this$props4.rowCount,
style = _this$props4.style,
useIsScrolling = _this$props4.useIsScrolling,
width = _this$props4.width;
var isScrolling = this.state.isScrolling;
var _this$_getHorizontalR = this._getHorizontalRangeToRender(),
columnStartIndex = _this$_getHorizontalR[0],
columnStopIndex = _this$_getHorizontalR[1];
var _this$_getVerticalRan = this._getVerticalRangeToRender(),
rowStartIndex = _this$_getVerticalRan[0],
rowStopIndex = _this$_getVerticalRan[1];
var items = [];
if (columnCount > 0 && rowCount) {
for (var _rowIndex = rowStartIndex; _rowIndex <= rowStopIndex; _rowIndex++) {
for (var _columnIndex = columnStartIndex; _columnIndex <= columnStopIndex; _columnIndex++) {
items.push(Object(react__WEBPACK_IMPORTED_MODULE_4__["createElement"])(children, {
columnIndex: _columnIndex,
data: itemData,
isScrolling: useIsScrolling ? isScrolling : undefined,
key: itemKey({
columnIndex: _columnIndex,
data: itemData,
rowIndex: _rowIndex
}),
rowIndex: _rowIndex,
style: this._getItemStyle(_rowIndex, _columnIndex)
}));
}
}
} // Read this value AFTER items have been created,
// So their actual sizes (if variable) are taken into consideration.
var estimatedTotalHeight = getEstimatedTotalHeight(this.props, this._instanceProps);
var estimatedTotalWidth = getEstimatedTotalWidth(this.props, this._instanceProps);
return Object(react__WEBPACK_IMPORTED_MODULE_4__["createElement"])(outerElementType || outerTagName || 'div', {
className: className,
onScroll: this._onScroll,
ref: this._outerRefSetter,
style: Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
position: 'relative',
height: height,
width: width,
overflow: 'auto',
WebkitOverflowScrolling: 'touch',
willChange: 'transform',
direction: direction
}, style)
}, Object(react__WEBPACK_IMPORTED_MODULE_4__["createElement"])(innerElementType || innerTagName || 'div', {
children: items,
ref: innerRef,
style: {
height: estimatedTotalHeight,
pointerEvents: isScrolling ? 'none' : undefined,
width: estimatedTotalWidth
}
}));
};
_proto._callPropsCallbacks = function _callPropsCallbacks() {
var _this$props5 = this.props,
columnCount = _this$props5.columnCount,
onItemsRendered = _this$props5.onItemsRendered,
onScroll = _this$props5.onScroll,
rowCount = _this$props5.rowCount;
if (typeof onItemsRendered === 'function') {
if (columnCount > 0 && rowCount > 0) {
var _this$_getHorizontalR2 = this._getHorizontalRangeToRender(),
_overscanColumnStartIndex = _this$_getHorizontalR2[0],
_overscanColumnStopIndex = _this$_getHorizontalR2[1],
_visibleColumnStartIndex = _this$_getHorizontalR2[2],
_visibleColumnStopIndex = _this$_getHorizontalR2[3];
var _this$_getVerticalRan2 = this._getVerticalRangeToRender(),
_overscanRowStartIndex = _this$_getVerticalRan2[0],
_overscanRowStopIndex = _this$_getVerticalRan2[1],
_visibleRowStartIndex = _this$_getVerticalRan2[2],
_visibleRowStopIndex = _this$_getVerticalRan2[3];
this._callOnItemsRendered(_overscanColumnStartIndex, _overscanColumnStopIndex, _overscanRowStartIndex, _overscanRowStopIndex, _visibleColumnStartIndex, _visibleColumnStopIndex, _visibleRowStartIndex, _visibleRowStopIndex);
}
}
if (typeof onScroll === 'function') {
var _this$state3 = this.state,
_horizontalScrollDirection = _this$state3.horizontalScrollDirection,
_scrollLeft = _this$state3.scrollLeft,
_scrollTop = _this$state3.scrollTop,
_scrollUpdateWasRequested = _this$state3.scrollUpdateWasRequested,
_verticalScrollDirection = _this$state3.verticalScrollDirection;
this._callOnScroll(_scrollLeft, _scrollTop, _horizontalScrollDirection, _verticalScrollDirection, _scrollUpdateWasRequested);
}
}; // Lazily create and cache item styles while scrolling,
// So that pure component sCU will prevent re-renders.
// We maintain this cache, and pass a style prop rather than index,
// So that List can clear cached styles and force item re-render if necessary.
_proto._getHorizontalRangeToRender = function _getHorizontalRangeToRender() {
var _this$props6 = this.props,
columnCount = _this$props6.columnCount,
overscanColumnCount = _this$props6.overscanColumnCount,
overscanColumnsCount = _this$props6.overscanColumnsCount,
overscanCount = _this$props6.overscanCount,
rowCount = _this$props6.rowCount;
var _this$state4 = this.state,
horizontalScrollDirection = _this$state4.horizontalScrollDirection,
isScrolling = _this$state4.isScrolling,
scrollLeft = _this$state4.scrollLeft;
var overscanCountResolved = overscanColumnCount || overscanColumnsCount || overscanCount || 1;
if (columnCount === 0 || rowCount === 0) {
return [0, 0, 0, 0];
}
var startIndex = getColumnStartIndexForOffset(this.props, scrollLeft, this._instanceProps);
var stopIndex = getColumnStopIndexForStartIndex(this.props, startIndex, scrollLeft, this._instanceProps); // Overscan by one item in each direction so that tab/focus works.
// If there isn't at least one extra item, tab loops back around.
var overscanBackward = !isScrolling || horizontalScrollDirection === 'backward' ? Math.max(1, overscanCountResolved) : 1;
var overscanForward = !isScrolling || horizontalScrollDirection === 'forward' ? Math.max(1, overscanCountResolved) : 1;
return [Math.max(0, startIndex - overscanBackward), Math.max(0, Math.min(columnCount - 1, stopIndex + overscanForward)), startIndex, stopIndex];
};
_proto._getVerticalRangeToRender = function _getVerticalRangeToRender() {
var _this$props7 = this.props,
columnCount = _this$props7.columnCount,
overscanCount = _this$props7.overscanCount,
overscanRowCount = _this$props7.overscanRowCount,
overscanRowsCount = _this$props7.overscanRowsCount,
rowCount = _this$props7.rowCount;
var _this$state5 = this.state,
isScrolling = _this$state5.isScrolling,
verticalScrollDirection = _this$state5.verticalScrollDirection,
scrollTop = _this$state5.scrollTop;
var overscanCountResolved = overscanRowCount || overscanRowsCount || overscanCount || 1;
if (columnCount === 0 || rowCount === 0) {
return [0, 0, 0, 0];
}
var startIndex = getRowStartIndexForOffset(this.props, scrollTop, this._instanceProps);
var stopIndex = getRowStopIndexForStartIndex(this.props, startIndex, scrollTop, this._instanceProps); // Overscan by one item in each direction so that tab/focus works.
// If there isn't at least one extra item, tab loops back around.
var overscanBackward = !isScrolling || verticalScrollDirection === 'backward' ? Math.max(1, overscanCountResolved) : 1;
var overscanForward = !isScrolling || verticalScrollDirection === 'forward' ? Math.max(1, overscanCountResolved) : 1;
return [Math.max(0, startIndex - overscanBackward), Math.max(0, Math.min(rowCount - 1, stopIndex + overscanForward)), startIndex, stopIndex];
};
return Grid;
}(react__WEBPACK_IMPORTED_MODULE_4__["PureComponent"]), _class.defaultProps = {
direction: 'ltr',
itemData: undefined,
useIsScrolling: false
}, _temp;
}
var validateSharedProps = function validateSharedProps(_ref5, _ref6) {
var children = _ref5.children,
direction = _ref5.direction,
height = _ref5.height,
innerTagName = _ref5.innerTagName,
outerTagName = _ref5.outerTagName,
overscanColumnsCount = _ref5.overscanColumnsCount,
overscanCount = _ref5.overscanCount,
overscanRowsCount = _ref5.overscanRowsCount,
width = _ref5.width;
var instance = _ref6.instance;
if (false) {}
};
var DEFAULT_ESTIMATED_ITEM_SIZE = 50;
var getEstimatedTotalHeight = function getEstimatedTotalHeight(_ref, _ref2) {
var rowCount = _ref.rowCount;
var rowMetadataMap = _ref2.rowMetadataMap,
estimatedRowHeight = _ref2.estimatedRowHeight,
lastMeasuredRowIndex = _ref2.lastMeasuredRowIndex;
var totalSizeOfMeasuredRows = 0; // Edge case check for when the number of items decreases while a scroll is in progress.
// https://github.com/bvaughn/react-window/pull/138
if (lastMeasuredRowIndex >= rowCount) {
lastMeasuredRowIndex = rowCount - 1;
}
if (lastMeasuredRowIndex >= 0) {
var itemMetadata = rowMetadataMap[lastMeasuredRowIndex];
totalSizeOfMeasuredRows = itemMetadata.offset + itemMetadata.size;
}
var numUnmeasuredItems = rowCount - lastMeasuredRowIndex - 1;
var totalSizeOfUnmeasuredItems = numUnmeasuredItems * estimatedRowHeight;
return totalSizeOfMeasuredRows + totalSizeOfUnmeasuredItems;
};
var getEstimatedTotalWidth = function getEstimatedTotalWidth(_ref3, _ref4) {
var columnCount = _ref3.columnCount;
var columnMetadataMap = _ref4.columnMetadataMap,
estimatedColumnWidth = _ref4.estimatedColumnWidth,
lastMeasuredColumnIndex = _ref4.lastMeasuredColumnIndex;
var totalSizeOfMeasuredRows = 0; // Edge case check for when the number of items decreases while a scroll is in progress.
// https://github.com/bvaughn/react-window/pull/138
if (lastMeasuredColumnIndex >= columnCount) {
lastMeasuredColumnIndex = columnCount - 1;
}
if (lastMeasuredColumnIndex >= 0) {
var itemMetadata = columnMetadataMap[lastMeasuredColumnIndex];
totalSizeOfMeasuredRows = itemMetadata.offset + itemMetadata.size;
}
var numUnmeasuredItems = columnCount - lastMeasuredColumnIndex - 1;
var totalSizeOfUnmeasuredItems = numUnmeasuredItems * estimatedColumnWidth;
return totalSizeOfMeasuredRows + totalSizeOfUnmeasuredItems;
};
var getItemMetadata = function getItemMetadata(itemType, props, index, instanceProps) {
var itemMetadataMap, itemSize, lastMeasuredIndex;
if (itemType === 'column') {
itemMetadataMap = instanceProps.columnMetadataMap;
itemSize = props.columnWidth;
lastMeasuredIndex = instanceProps.lastMeasuredColumnIndex;
} else {
itemMetadataMap = instanceProps.rowMetadataMap;
itemSize = props.rowHeight;
lastMeasuredIndex = instanceProps.lastMeasuredRowIndex;
}
if (index > lastMeasuredIndex) {
var offset = 0;
if (lastMeasuredIndex >= 0) {
var itemMetadata = itemMetadataMap[lastMeasuredIndex];
offset = itemMetadata.offset + itemMetadata.size;
}
for (var i = lastMeasuredIndex + 1; i <= index; i++) {
var size = itemSize(i);
itemMetadataMap[i] = {
offset: offset,
size: size
};
offset += size;
}
if (itemType === 'column') {
instanceProps.lastMeasuredColumnIndex = index;
} else {
instanceProps.lastMeasuredRowIndex = index;
}
}
return itemMetadataMap[index];
};
var findNearestItem = function findNearestItem(itemType, props, instanceProps, offset) {
var itemMetadataMap, lastMeasuredIndex;
if (itemType === 'column') {
itemMetadataMap = instanceProps.columnMetadataMap;
lastMeasuredIndex = instanceProps.lastMeasuredColumnIndex;
} else {
itemMetadataMap = instanceProps.rowMetadataMap;
lastMeasuredIndex = instanceProps.lastMeasuredRowIndex;
}
var lastMeasuredItemOffset = lastMeasuredIndex > 0 ? itemMetadataMap[lastMeasuredIndex].offset : 0;
if (lastMeasuredItemOffset >= offset) {
// If we've already measured items within this range just use a binary search as it's faster.
return findNearestItemBinarySearch(itemType, props, instanceProps, lastMeasuredIndex, 0, offset);
} else {
// If we haven't yet measured this high, fallback to an exponential search with an inner binary search.
// The exponential search avoids pre-computing sizes for the full set of items as a binary search would.
// The overall complexity for this approach is O(log n).
return findNearestItemExponentialSearch(itemType, props, instanceProps, Math.max(0, lastMeasuredIndex), offset);
}
};
var findNearestItemBinarySearch = function findNearestItemBinarySearch(itemType, props, instanceProps, high, low, offset) {
while (low <= high) {
var middle = low + Math.floor((high - low) / 2);
var currentOffset = getItemMetadata(itemType, props, middle, instanceProps).offset;
if (currentOffset === offset) {
return middle;
} else if (currentOffset < offset) {
low = middle + 1;
} else if (currentOffset > offset) {
high = middle - 1;
}
}
if (low > 0) {
return low - 1;
} else {
return 0;
}
};
var findNearestItemExponentialSearch = function findNearestItemExponentialSearch(itemType, props, instanceProps, index, offset) {
var itemCount = itemType === 'column' ? props.columnCount : props.rowCount;
var interval = 1;
while (index < itemCount && getItemMetadata(itemType, props, index, instanceProps).offset < offset) {
index += interval;
interval *= 2;
}
return findNearestItemBinarySearch(itemType, props, instanceProps, Math.min(index, itemCount - 1), Math.floor(index / 2), offset);
};
var getOffsetForIndexAndAlignment = function getOffsetForIndexAndAlignment(itemType, props, index, align, scrollOffset, instanceProps, scrollbarSize) {
var size = itemType === 'column' ? props.width : props.height;
var itemMetadata = getItemMetadata(itemType, props, index, instanceProps); // Get estimated total size after ItemMetadata is computed,
// To ensure it reflects actual measurements instead of just estimates.
var estimatedTotalSize = itemType === 'column' ? getEstimatedTotalWidth(props, instanceProps) : getEstimatedTotalHeight(props, instanceProps);
var maxOffset = Math.max(0, Math.min(estimatedTotalSize - size, itemMetadata.offset));
var minOffset = Math.max(0, itemMetadata.offset - size + scrollbarSize + itemMetadata.size);
if (align === 'smart') {
if (scrollOffset >= minOffset - size && scrollOffset <= maxOffset + size) {
align = 'auto';
} else {
align = 'center';
}
}
switch (align) {
case 'start':
return maxOffset;
case 'end':
return minOffset;
case 'center':
return Math.round(minOffset + (maxOffset - minOffset) / 2);
case 'auto':
default:
if (scrollOffset >= minOffset && scrollOffset <= maxOffset) {
return scrollOffset;
} else if (minOffset > maxOffset) {
// Because we only take into account the scrollbar size when calculating minOffset
// this value can be larger than maxOffset when at the end of the list
return minOffset;
} else if (scrollOffset < minOffset) {
return minOffset;
} else {
return maxOffset;
}
}
};
var VariableSizeGrid =
/*#__PURE__*/
createGridComponent({
getColumnOffset: function getColumnOffset(props, index, instanceProps) {
return getItemMetadata('column', props, index, instanceProps).offset;
},
getColumnStartIndexForOffset: function getColumnStartIndexForOffset(props, scrollLeft, instanceProps) {
return findNearestItem('column', props, instanceProps, scrollLeft);
},
getColumnStopIndexForStartIndex: function getColumnStopIndexForStartIndex(props, startIndex, scrollLeft, instanceProps) {
var columnCount = props.columnCount,
width = props.width;
var itemMetadata = getItemMetadata('column', props, startIndex, instanceProps);
var maxOffset = scrollLeft + width;
var offset = itemMetadata.offset + itemMetadata.size;
var stopIndex = startIndex;
while (stopIndex < columnCount - 1 && offset < maxOffset) {
stopIndex++;
offset += getItemMetadata('column', props, stopIndex, instanceProps).size;
}
return stopIndex;
},
getColumnWidth: function getColumnWidth(props, index, instanceProps) {
return instanceProps.columnMetadataMap[index].size;
},
getEstimatedTotalHeight: getEstimatedTotalHeight,
getEstimatedTotalWidth: getEstimatedTotalWidth,
getOffsetForColumnAndAlignment: function getOffsetForColumnAndAlignment(props, index, align, scrollOffset, instanceProps, scrollbarSize) {
return getOffsetForIndexAndAlignment('column', props, index, align, scrollOffset, instanceProps, scrollbarSize);
},
getOffsetForRowAndAlignment: function getOffsetForRowAndAlignment(props, index, align, scrollOffset, instanceProps, scrollbarSize) {
return getOffsetForIndexAndAlignment('row', props, index, align, scrollOffset, instanceProps, scrollbarSize);
},
getRowOffset: function getRowOffset(props, index, instanceProps) {
return getItemMetadata('row', props, index, instanceProps).offset;
},
getRowHeight: function getRowHeight(props, index, instanceProps) {
return instanceProps.rowMetadataMap[index].size;
},
getRowStartIndexForOffset: function getRowStartIndexForOffset(props, scrollTop, instanceProps) {
return findNearestItem('row', props, instanceProps, scrollTop);
},
getRowStopIndexForStartIndex: function getRowStopIndexForStartIndex(props, startIndex, scrollTop, instanceProps) {
var rowCount = props.rowCount,
height = props.height;
var itemMetadata = getItemMetadata('row', props, startIndex, instanceProps);
var maxOffset = scrollTop + height;
var offset = itemMetadata.offset + itemMetadata.size;
var stopIndex = startIndex;
while (stopIndex < rowCount - 1 && offset < maxOffset) {
stopIndex++;
offset += getItemMetadata('row', props, stopIndex, instanceProps).size;
}
return stopIndex;
},
initInstanceProps: function initInstanceProps(props, instance) {
var _ref5 = props,
estimatedColumnWidth = _ref5.estimatedColumnWidth,
estimatedRowHeight = _ref5.estimatedRowHeight;
var instanceProps = {
columnMetadataMap: {},
estimatedColumnWidth: estimatedColumnWidth || DEFAULT_ESTIMATED_ITEM_SIZE,
estimatedRowHeight: estimatedRowHeight || DEFAULT_ESTIMATED_ITEM_SIZE,
lastMeasuredColumnIndex: -1,
lastMeasuredRowIndex: -1,
rowMetadataMap: {}
};
instance.resetAfterColumnIndex = function (columnIndex, shouldForceUpdate) {
if (shouldForceUpdate === void 0) {
shouldForceUpdate = true;
}
instance.resetAfterIndices({
columnIndex: columnIndex,
shouldForceUpdate: shouldForceUpdate
});
};
instance.resetAfterRowIndex = function (rowIndex, shouldForceUpdate) {
if (shouldForceUpdate === void 0) {
shouldForceUpdate = true;
}
instance.resetAfterIndices({
rowIndex: rowIndex,
shouldForceUpdate: shouldForceUpdate
});
};
instance.resetAfterIndices = function (_ref6) {
var columnIndex = _ref6.columnIndex,
rowIndex = _ref6.rowIndex,
_ref6$shouldForceUpda = _ref6.shouldForceUpdate,
shouldForceUpdate = _ref6$shouldForceUpda === void 0 ? true : _ref6$shouldForceUpda;
if (typeof columnIndex === 'number') {
instanceProps.lastMeasuredColumnIndex = Math.min(instanceProps.lastMeasuredColumnIndex, columnIndex - 1);
}
if (typeof rowIndex === 'number') {
instanceProps.lastMeasuredRowIndex = Math.min(instanceProps.lastMeasuredRowIndex, rowIndex - 1);
} // We could potentially optimize further by only evicting styles after this index,
// But since styles are only cached while scrolling is in progress-
// It seems an unnecessary optimization.
// It's unlikely that resetAfterIndex() will be called while a user is scrolling.
instance._getItemStyleCache(-1);
if (shouldForceUpdate) {
instance.forceUpdate();
}
};
return instanceProps;
},
shouldResetStyleCacheOnItemSizeChange: false,
validateProps: function validateProps(_ref7) {
var columnWidth = _ref7.columnWidth,
rowHeight = _ref7.rowHeight;
if (false) {}
}
});
var IS_SCROLLING_DEBOUNCE_INTERVAL$1 = 150;
var defaultItemKey$1 = function defaultItemKey(index, data) {
return index;
}; // In DEV mode, this Set helps us only log a warning once per component instance.
// This avoids spamming the console every time a render happens.
var devWarningsDirection = null;
var devWarningsTagName$1 = null;
if (false) {}
function createListComponent(_ref) {
var _class, _temp;
var getItemOffset = _ref.getItemOffset,
getEstimatedTotalSize = _ref.getEstimatedTotalSize,
getItemSize = _ref.getItemSize,
getOffsetForIndexAndAlignment = _ref.getOffsetForIndexAndAlignment,
getStartIndexForOffset = _ref.getStartIndexForOffset,
getStopIndexForStartIndex = _ref.getStopIndexForStartIndex,
initInstanceProps = _ref.initInstanceProps,
shouldResetStyleCacheOnItemSizeChange = _ref.shouldResetStyleCacheOnItemSizeChange,
validateProps = _ref.validateProps;
return _temp = _class =
/*#__PURE__*/
function (_PureComponent) {
Object(_babel_runtime_helpers_esm_inheritsLoose__WEBPACK_IMPORTED_MODULE_1__["default"])(List, _PureComponent); // Always use explicit constructor for React components.
// It produces less code after transpilation. (#26)
// eslint-disable-next-line no-useless-constructor
function List(props) {
var _this;
_this = _PureComponent.call(this, props) || this;
_this._instanceProps = initInstanceProps(_this.props, Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_2__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_2__["default"])(_this)));
_this._outerRef = void 0;
_this._resetIsScrollingTimeoutId = null;
_this.state = {
instance: Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_2__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_2__["default"])(_this)),
isScrolling: false,
scrollDirection: 'forward',
scrollOffset: typeof _this.props.initialScrollOffset === 'number' ? _this.props.initialScrollOffset : 0,
scrollUpdateWasRequested: false
};
_this._callOnItemsRendered = void 0;
_this._callOnItemsRendered = Object(memoize_one__WEBPACK_IMPORTED_MODULE_3__["default"])(function (overscanStartIndex, overscanStopIndex, visibleStartIndex, visibleStopIndex) {
return _this.props.onItemsRendered({
overscanStartIndex: overscanStartIndex,
overscanStopIndex: overscanStopIndex,
visibleStartIndex: visibleStartIndex,
visibleStopIndex: visibleStopIndex
});
});
_this._callOnScroll = void 0;
_this._callOnScroll = Object(memoize_one__WEBPACK_IMPORTED_MODULE_3__["default"])(function (scrollDirection, scrollOffset, scrollUpdateWasRequested) {
return _this.props.onScroll({
scrollDirection: scrollDirection,
scrollOffset: scrollOffset,
scrollUpdateWasRequested: scrollUpdateWasRequested
});
});
_this._getItemStyle = void 0;
_this._getItemStyle = function (index) {
var _this$props = _this.props,
direction = _this$props.direction,
itemSize = _this$props.itemSize,
layout = _this$props.layout;
var itemStyleCache = _this._getItemStyleCache(shouldResetStyleCacheOnItemSizeChange && itemSize, shouldResetStyleCacheOnItemSizeChange && layout, shouldResetStyleCacheOnItemSizeChange && direction);
var style;
if (itemStyleCache.hasOwnProperty(index)) {
style = itemStyleCache[index];
} else {
var _style;
var _offset = getItemOffset(_this.props, index, _this._instanceProps);
var size = getItemSize(_this.props, index, _this._instanceProps); // TODO Deprecate direction "horizontal"
var isHorizontal = direction === 'horizontal' || layout === 'horizontal';
itemStyleCache[index] = style = (_style = {
position: 'absolute'
}, _style[direction === 'rtl' ? 'right' : 'left'] = isHorizontal ? _offset : 0, _style.top = !isHorizontal ? _offset : 0, _style.height = !isHorizontal ? size : '100%', _style.width = isHorizontal ? size : '100%', _style);
}
return style;
};
_this._getItemStyleCache = void 0;
_this._getItemStyleCache = Object(memoize_one__WEBPACK_IMPORTED_MODULE_3__["default"])(function (_, __, ___) {
return {};
});
_this._onScrollHorizontal = function (event) {
var _event$currentTarget = event.currentTarget,
clientWidth = _event$currentTarget.clientWidth,
scrollLeft = _event$currentTarget.scrollLeft,
scrollWidth = _event$currentTarget.scrollWidth; // Force flush sync for scroll updates to reduce visual checkerboarding.
Object(react_dom__WEBPACK_IMPORTED_MODULE_5__["flushSync"])(function () {
_this.setState(function (prevState) {
if (prevState.scrollOffset === scrollLeft) {
// Scroll position may have been updated by cDM/cDU,
// In which case we don't need to trigger another render,
// And we don't want to update state.isScrolling.
return null;
}
var direction = _this.props.direction;
var scrollOffset = scrollLeft;
if (direction === 'rtl') {
// TRICKY According to the spec, scrollLeft should be negative for RTL aligned elements.
// This is not the case for all browsers though (e.g. Chrome reports values as positive, measured relative to the left).
// It's also easier for this component if we convert offsets to the same format as they would be in for ltr.
// So the simplest solution is to determine which browser behavior we're dealing with, and convert based on it.
switch (getRTLOffsetType()) {
case 'negative':
scrollOffset = -scrollLeft;
break;
case 'positive-descending':
scrollOffset = scrollWidth - clientWidth - scrollLeft;
break;
}
} // Prevent Safari's elastic scrolling from causing visual shaking when scrolling past bounds.
scrollOffset = Math.max(0, Math.min(scrollOffset, scrollWidth - clientWidth));
return {
isScrolling: true,
scrollDirection: prevState.scrollOffset < scrollLeft ? 'forward' : 'backward',
scrollOffset: scrollOffset,
scrollUpdateWasRequested: false
};
}, _this._resetIsScrollingDebounced);
});
};
_this._onScrollVertical = function (event) {
var _event$currentTarget2 = event.currentTarget,
clientHeight = _event$currentTarget2.clientHeight,
scrollHeight = _event$currentTarget2.scrollHeight,
scrollTop = _event$currentTarget2.scrollTop; // Force flush sync for scroll updates to reduce visual checkerboarding.
Object(react_dom__WEBPACK_IMPORTED_MODULE_5__["flushSync"])(function () {
_this.setState(function (prevState) {
if (prevState.scrollOffset === scrollTop) {
// Scroll position may have been updated by cDM/cDU,
// In which case we don't need to trigger another render,
// And we don't want to update state.isScrolling.
return null;
} // Prevent Safari's elastic scrolling from causing visual shaking when scrolling past bounds.
var scrollOffset = Math.max(0, Math.min(scrollTop, scrollHeight - clientHeight));
return {
isScrolling: true,
scrollDirection: prevState.scrollOffset < scrollOffset ? 'forward' : 'backward',
scrollOffset: scrollOffset,
scrollUpdateWasRequested: false
};
}, _this._resetIsScrollingDebounced);
});
};
_this._outerRefSetter = function (ref) {
var outerRef = _this.props.outerRef;
_this._outerRef = ref;
if (typeof outerRef === 'function') {
outerRef(ref);
} else if (outerRef != null && _typeof(outerRef) === 'object' && outerRef.hasOwnProperty('current')) {
outerRef.current = ref;
}
};
_this._resetIsScrollingDebounced = function () {
if (_this._resetIsScrollingTimeoutId !== null) {
cancelTimeout(_this._resetIsScrollingTimeoutId);
}
_this._resetIsScrollingTimeoutId = requestTimeout(_this._resetIsScrolling, IS_SCROLLING_DEBOUNCE_INTERVAL$1);
};
_this._resetIsScrolling = function () {
_this._resetIsScrollingTimeoutId = null;
_this.setState({
isScrolling: false
}, function () {
// Clear style cache after state update has been committed.
// This way we don't break pure sCU for items that don't use isScrolling param.
_this._getItemStyleCache(-1, null);
});
};
return _this;
}
List.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, prevState) {
validateSharedProps$1(nextProps, prevState);
validateProps(nextProps);
return null;
};
var _proto = List.prototype;
_proto.scrollTo = function scrollTo(scrollOffset) {
scrollOffset = Math.max(0, scrollOffset);
this.setState(function (prevState) {
if (prevState.scrollOffset === scrollOffset) {
return null;
}
return {
scrollDirection: prevState.scrollOffset < scrollOffset ? 'forward' : 'backward',
scrollOffset: scrollOffset,
scrollUpdateWasRequested: true
};
}, this._resetIsScrollingDebounced);
};
_proto.scrollToItem = function scrollToItem(index, align) {
if (align === void 0) {
align = 'auto';
}
var itemCount = this.props.itemCount;
var scrollOffset = this.state.scrollOffset;
index = Math.max(0, Math.min(index, itemCount - 1));
this.scrollTo(getOffsetForIndexAndAlignment(this.props, index, align, scrollOffset, this._instanceProps));
};
_proto.componentDidMount = function componentDidMount() {
var _this$props2 = this.props,
direction = _this$props2.direction,
initialScrollOffset = _this$props2.initialScrollOffset,
layout = _this$props2.layout;
if (typeof initialScrollOffset === 'number' && this._outerRef != null) {
var outerRef = this._outerRef; // TODO Deprecate direction "horizontal"
if (direction === 'horizontal' || layout === 'horizontal') {
outerRef.scrollLeft = initialScrollOffset;
} else {
outerRef.scrollTop = initialScrollOffset;
}
}
this._callPropsCallbacks();
};
_proto.componentDidUpdate = function componentDidUpdate() {
var _this$props3 = this.props,
direction = _this$props3.direction,
layout = _this$props3.layout;
var _this$state = this.state,
scrollOffset = _this$state.scrollOffset,
scrollUpdateWasRequested = _this$state.scrollUpdateWasRequested;
if (scrollUpdateWasRequested && this._outerRef != null) {
var outerRef = this._outerRef; // TODO Deprecate direction "horizontal"
if (direction === 'horizontal' || layout === 'horizontal') {
if (direction === 'rtl') {
// TRICKY According to the spec, scrollLeft should be negative for RTL aligned elements.
// This is not the case for all browsers though (e.g. Chrome reports values as positive, measured relative to the left).
// So we need to determine which browser behavior we're dealing with, and mimic it.
switch (getRTLOffsetType()) {
case 'negative':
outerRef.scrollLeft = -scrollOffset;
break;
case 'positive-ascending':
outerRef.scrollLeft = scrollOffset;
break;
default:
var clientWidth = outerRef.clientWidth,
scrollWidth = outerRef.scrollWidth;
outerRef.scrollLeft = scrollWidth - clientWidth - scrollOffset;
break;
}
} else {
outerRef.scrollLeft = scrollOffset;
}
} else {
outerRef.scrollTop = scrollOffset;
}
}
this._callPropsCallbacks();
};
_proto.componentWillUnmount = function componentWillUnmount() {
if (this._resetIsScrollingTimeoutId !== null) {
cancelTimeout(this._resetIsScrollingTimeoutId);
}
};
_proto.render = function render() {
var _this$props4 = this.props,
children = _this$props4.children,
className = _this$props4.className,
direction = _this$props4.direction,
height = _this$props4.height,
innerRef = _this$props4.innerRef,
innerElementType = _this$props4.innerElementType,
innerTagName = _this$props4.innerTagName,
itemCount = _this$props4.itemCount,
itemData = _this$props4.itemData,
_this$props4$itemKey = _this$props4.itemKey,
itemKey = _this$props4$itemKey === void 0 ? defaultItemKey$1 : _this$props4$itemKey,
layout = _this$props4.layout,
outerElementType = _this$props4.outerElementType,
outerTagName = _this$props4.outerTagName,
style = _this$props4.style,
useIsScrolling = _this$props4.useIsScrolling,
width = _this$props4.width;
var isScrolling = this.state.isScrolling; // TODO Deprecate direction "horizontal"
var isHorizontal = direction === 'horizontal' || layout === 'horizontal';
var onScroll = isHorizontal ? this._onScrollHorizontal : this._onScrollVertical;
var _this$_getRangeToRend = this._getRangeToRender(),
startIndex = _this$_getRangeToRend[0],
stopIndex = _this$_getRangeToRend[1];
var items = [];
if (itemCount > 0) {
for (var _index = startIndex; _index <= stopIndex; _index++) {
items.push(Object(react__WEBPACK_IMPORTED_MODULE_4__["createElement"])(children, {
data: itemData,
key: itemKey(_index, itemData),
index: _index,
isScrolling: useIsScrolling ? isScrolling : undefined,
style: this._getItemStyle(_index)
}));
}
} // Read this value AFTER items have been created,
// So their actual sizes (if variable) are taken into consideration.
var estimatedTotalSize = getEstimatedTotalSize(this.props, this._instanceProps);
return Object(react__WEBPACK_IMPORTED_MODULE_4__["createElement"])(outerElementType || outerTagName || 'div', {
className: className,
onScroll: onScroll,
ref: this._outerRefSetter,
style: Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
position: 'relative',
height: height,
width: width,
overflow: 'auto',
WebkitOverflowScrolling: 'touch',
willChange: 'transform',
direction: direction
}, style)
}, Object(react__WEBPACK_IMPORTED_MODULE_4__["createElement"])(innerElementType || innerTagName || 'div', {
children: items,
ref: innerRef,
style: {
height: isHorizontal ? '100%' : estimatedTotalSize,
pointerEvents: isScrolling ? 'none' : undefined,
width: isHorizontal ? estimatedTotalSize : '100%'
}
}));
};
_proto._callPropsCallbacks = function _callPropsCallbacks() {
if (typeof this.props.onItemsRendered === 'function') {
var itemCount = this.props.itemCount;
if (itemCount > 0) {
var _this$_getRangeToRend2 = this._getRangeToRender(),
_overscanStartIndex = _this$_getRangeToRend2[0],
_overscanStopIndex = _this$_getRangeToRend2[1],
_visibleStartIndex = _this$_getRangeToRend2[2],
_visibleStopIndex = _this$_getRangeToRend2[3];
this._callOnItemsRendered(_overscanStartIndex, _overscanStopIndex, _visibleStartIndex, _visibleStopIndex);
}
}
if (typeof this.props.onScroll === 'function') {
var _this$state2 = this.state,
_scrollDirection = _this$state2.scrollDirection,
_scrollOffset = _this$state2.scrollOffset,
_scrollUpdateWasRequested = _this$state2.scrollUpdateWasRequested;
this._callOnScroll(_scrollDirection, _scrollOffset, _scrollUpdateWasRequested);
}
}; // Lazily create and cache item styles while scrolling,
// So that pure component sCU will prevent re-renders.
// We maintain this cache, and pass a style prop rather than index,
// So that List can clear cached styles and force item re-render if necessary.
_proto._getRangeToRender = function _getRangeToRender() {
var _this$props5 = this.props,
itemCount = _this$props5.itemCount,
overscanCount = _this$props5.overscanCount;
var _this$state3 = this.state,
isScrolling = _this$state3.isScrolling,
scrollDirection = _this$state3.scrollDirection,
scrollOffset = _this$state3.scrollOffset;
if (itemCount === 0) {
return [0, 0, 0, 0];
}
var startIndex = getStartIndexForOffset(this.props, scrollOffset, this._instanceProps);
var stopIndex = getStopIndexForStartIndex(this.props, startIndex, scrollOffset, this._instanceProps); // Overscan by one item in each direction so that tab/focus works.
// If there isn't at least one extra item, tab loops back around.
var overscanBackward = !isScrolling || scrollDirection === 'backward' ? Math.max(1, overscanCount) : 1;
var overscanForward = !isScrolling || scrollDirection === 'forward' ? Math.max(1, overscanCount) : 1;
return [Math.max(0, startIndex - overscanBackward), Math.max(0, Math.min(itemCount - 1, stopIndex + overscanForward)), startIndex, stopIndex];
};
return List;
}(react__WEBPACK_IMPORTED_MODULE_4__["PureComponent"]), _class.defaultProps = {
direction: 'ltr',
itemData: undefined,
layout: 'vertical',
overscanCount: 2,
useIsScrolling: false
}, _temp;
} // NOTE: I considered further wrapping individual items with a pure ListItem component.
// This would avoid ever calling the render function for the same index more than once,
// But it would also add the overhead of a lot of components/fibers.
// I assume people already do this (render function returning a class component),
// So my doing it would just unnecessarily double the wrappers.
var validateSharedProps$1 = function validateSharedProps(_ref2, _ref3) {
var children = _ref2.children,
direction = _ref2.direction,
height = _ref2.height,
layout = _ref2.layout,
innerTagName = _ref2.innerTagName,
outerTagName = _ref2.outerTagName,
width = _ref2.width;
var instance = _ref3.instance;
if (false) { var isHorizontal; }
};
var DEFAULT_ESTIMATED_ITEM_SIZE$1 = 50;
var getItemMetadata$1 = function getItemMetadata(props, index, instanceProps) {
var _ref = props,
itemSize = _ref.itemSize;
var itemMetadataMap = instanceProps.itemMetadataMap,
lastMeasuredIndex = instanceProps.lastMeasuredIndex;
if (index > lastMeasuredIndex) {
var offset = 0;
if (lastMeasuredIndex >= 0) {
var itemMetadata = itemMetadataMap[lastMeasuredIndex];
offset = itemMetadata.offset + itemMetadata.size;
}
for (var i = lastMeasuredIndex + 1; i <= index; i++) {
var size = itemSize(i);
itemMetadataMap[i] = {
offset: offset,
size: size
};
offset += size;
}
instanceProps.lastMeasuredIndex = index;
}
return itemMetadataMap[index];
};
var findNearestItem$1 = function findNearestItem(props, instanceProps, offset) {
var itemMetadataMap = instanceProps.itemMetadataMap,
lastMeasuredIndex = instanceProps.lastMeasuredIndex;
var lastMeasuredItemOffset = lastMeasuredIndex > 0 ? itemMetadataMap[lastMeasuredIndex].offset : 0;
if (lastMeasuredItemOffset >= offset) {
// If we've already measured items within this range just use a binary search as it's faster.
return findNearestItemBinarySearch$1(props, instanceProps, lastMeasuredIndex, 0, offset);
} else {
// If we haven't yet measured this high, fallback to an exponential search with an inner binary search.
// The exponential search avoids pre-computing sizes for the full set of items as a binary search would.
// The overall complexity for this approach is O(log n).
return findNearestItemExponentialSearch$1(props, instanceProps, Math.max(0, lastMeasuredIndex), offset);
}
};
var findNearestItemBinarySearch$1 = function findNearestItemBinarySearch(props, instanceProps, high, low, offset) {
while (low <= high) {
var middle = low + Math.floor((high - low) / 2);
var currentOffset = getItemMetadata$1(props, middle, instanceProps).offset;
if (currentOffset === offset) {
return middle;
} else if (currentOffset < offset) {
low = middle + 1;
} else if (currentOffset > offset) {
high = middle - 1;
}
}
if (low > 0) {
return low - 1;
} else {
return 0;
}
};
var findNearestItemExponentialSearch$1 = function findNearestItemExponentialSearch(props, instanceProps, index, offset) {
var itemCount = props.itemCount;
var interval = 1;
while (index < itemCount && getItemMetadata$1(props, index, instanceProps).offset < offset) {
index += interval;
interval *= 2;
}
return findNearestItemBinarySearch$1(props, instanceProps, Math.min(index, itemCount - 1), Math.floor(index / 2), offset);
};
var getEstimatedTotalSize = function getEstimatedTotalSize(_ref2, _ref3) {
var itemCount = _ref2.itemCount;
var itemMetadataMap = _ref3.itemMetadataMap,
estimatedItemSize = _ref3.estimatedItemSize,
lastMeasuredIndex = _ref3.lastMeasuredIndex;
var totalSizeOfMeasuredItems = 0; // Edge case check for when the number of items decreases while a scroll is in progress.
// https://github.com/bvaughn/react-window/pull/138
if (lastMeasuredIndex >= itemCount) {
lastMeasuredIndex = itemCount - 1;
}
if (lastMeasuredIndex >= 0) {
var itemMetadata = itemMetadataMap[lastMeasuredIndex];
totalSizeOfMeasuredItems = itemMetadata.offset + itemMetadata.size;
}
var numUnmeasuredItems = itemCount - lastMeasuredIndex - 1;
var totalSizeOfUnmeasuredItems = numUnmeasuredItems * estimatedItemSize;
return totalSizeOfMeasuredItems + totalSizeOfUnmeasuredItems;
};
var VariableSizeList =
/*#__PURE__*/
createListComponent({
getItemOffset: function getItemOffset(props, index, instanceProps) {
return getItemMetadata$1(props, index, instanceProps).offset;
},
getItemSize: function getItemSize(props, index, instanceProps) {
return instanceProps.itemMetadataMap[index].size;
},
getEstimatedTotalSize: getEstimatedTotalSize,
getOffsetForIndexAndAlignment: function getOffsetForIndexAndAlignment(props, index, align, scrollOffset, instanceProps) {
var direction = props.direction,
height = props.height,
layout = props.layout,
width = props.width; // TODO Deprecate direction "horizontal"
var isHorizontal = direction === 'horizontal' || layout === 'horizontal';
var size = isHorizontal ? width : height;
var itemMetadata = getItemMetadata$1(props, index, instanceProps); // Get estimated total size after ItemMetadata is computed,
// To ensure it reflects actual measurements instead of just estimates.
var estimatedTotalSize = getEstimatedTotalSize(props, instanceProps);
var maxOffset = Math.max(0, Math.min(estimatedTotalSize - size, itemMetadata.offset));
var minOffset = Math.max(0, itemMetadata.offset - size + itemMetadata.size);
if (align === 'smart') {
if (scrollOffset >= minOffset - size && scrollOffset <= maxOffset + size) {
align = 'auto';
} else {
align = 'center';
}
}
switch (align) {
case 'start':
return maxOffset;
case 'end':
return minOffset;
case 'center':
return Math.round(minOffset + (maxOffset - minOffset) / 2);
case 'auto':
default:
if (scrollOffset >= minOffset && scrollOffset <= maxOffset) {
return scrollOffset;
} else if (scrollOffset < minOffset) {
return minOffset;
} else {
return maxOffset;
}
}
},
getStartIndexForOffset: function getStartIndexForOffset(props, offset, instanceProps) {
return findNearestItem$1(props, instanceProps, offset);
},
getStopIndexForStartIndex: function getStopIndexForStartIndex(props, startIndex, scrollOffset, instanceProps) {
var direction = props.direction,
height = props.height,
itemCount = props.itemCount,
layout = props.layout,
width = props.width; // TODO Deprecate direction "horizontal"
var isHorizontal = direction === 'horizontal' || layout === 'horizontal';
var size = isHorizontal ? width : height;
var itemMetadata = getItemMetadata$1(props, startIndex, instanceProps);
var maxOffset = scrollOffset + size;
var offset = itemMetadata.offset + itemMetadata.size;
var stopIndex = startIndex;
while (stopIndex < itemCount - 1 && offset < maxOffset) {
stopIndex++;
offset += getItemMetadata$1(props, stopIndex, instanceProps).size;
}
return stopIndex;
},
initInstanceProps: function initInstanceProps(props, instance) {
var _ref4 = props,
estimatedItemSize = _ref4.estimatedItemSize;
var instanceProps = {
itemMetadataMap: {},
estimatedItemSize: estimatedItemSize || DEFAULT_ESTIMATED_ITEM_SIZE$1,
lastMeasuredIndex: -1
};
instance.resetAfterIndex = function (index, shouldForceUpdate) {
if (shouldForceUpdate === void 0) {
shouldForceUpdate = true;
}
instanceProps.lastMeasuredIndex = Math.min(instanceProps.lastMeasuredIndex, index - 1); // We could potentially optimize further by only evicting styles after this index,
// But since styles are only cached while scrolling is in progress-
// It seems an unnecessary optimization.
// It's unlikely that resetAfterIndex() will be called while a user is scrolling.
instance._getItemStyleCache(-1);
if (shouldForceUpdate) {
instance.forceUpdate();
}
};
return instanceProps;
},
shouldResetStyleCacheOnItemSizeChange: false,
validateProps: function validateProps(_ref5) {
var itemSize = _ref5.itemSize;
if (false) {}
}
});
var FixedSizeGrid =
/*#__PURE__*/
createGridComponent({
getColumnOffset: function getColumnOffset(_ref, index) {
var columnWidth = _ref.columnWidth;
return index * columnWidth;
},
getColumnWidth: function getColumnWidth(_ref2, index) {
var columnWidth = _ref2.columnWidth;
return columnWidth;
},
getRowOffset: function getRowOffset(_ref3, index) {
var rowHeight = _ref3.rowHeight;
return index * rowHeight;
},
getRowHeight: function getRowHeight(_ref4, index) {
var rowHeight = _ref4.rowHeight;
return rowHeight;
},
getEstimatedTotalHeight: function getEstimatedTotalHeight(_ref5) {
var rowCount = _ref5.rowCount,
rowHeight = _ref5.rowHeight;
return rowHeight * rowCount;
},
getEstimatedTotalWidth: function getEstimatedTotalWidth(_ref6) {
var columnCount = _ref6.columnCount,
columnWidth = _ref6.columnWidth;
return columnWidth * columnCount;
},
getOffsetForColumnAndAlignment: function getOffsetForColumnAndAlignment(_ref7, columnIndex, align, scrollLeft, instanceProps, scrollbarSize) {
var columnCount = _ref7.columnCount,
columnWidth = _ref7.columnWidth,
width = _ref7.width;
var lastColumnOffset = Math.max(0, columnCount * columnWidth - width);
var maxOffset = Math.min(lastColumnOffset, columnIndex * columnWidth);
var minOffset = Math.max(0, columnIndex * columnWidth - width + scrollbarSize + columnWidth);
if (align === 'smart') {
if (scrollLeft >= minOffset - width && scrollLeft <= maxOffset + width) {
align = 'auto';
} else {
align = 'center';
}
}
switch (align) {
case 'start':
return maxOffset;
case 'end':
return minOffset;
case 'center':
// "Centered" offset is usually the average of the min and max.
// But near the edges of the list, this doesn't hold true.
var middleOffset = Math.round(minOffset + (maxOffset - minOffset) / 2);
if (middleOffset < Math.ceil(width / 2)) {
return 0; // near the beginning
} else if (middleOffset > lastColumnOffset + Math.floor(width / 2)) {
return lastColumnOffset; // near the end
} else {
return middleOffset;
}
case 'auto':
default:
if (scrollLeft >= minOffset && scrollLeft <= maxOffset) {
return scrollLeft;
} else if (minOffset > maxOffset) {
// Because we only take into account the scrollbar size when calculating minOffset
// this value can be larger than maxOffset when at the end of the list
return minOffset;
} else if (scrollLeft < minOffset) {
return minOffset;
} else {
return maxOffset;
}
}
},
getOffsetForRowAndAlignment: function getOffsetForRowAndAlignment(_ref8, rowIndex, align, scrollTop, instanceProps, scrollbarSize) {
var rowHeight = _ref8.rowHeight,
height = _ref8.height,
rowCount = _ref8.rowCount;
var lastRowOffset = Math.max(0, rowCount * rowHeight - height);
var maxOffset = Math.min(lastRowOffset, rowIndex * rowHeight);
var minOffset = Math.max(0, rowIndex * rowHeight - height + scrollbarSize + rowHeight);
if (align === 'smart') {
if (scrollTop >= minOffset - height && scrollTop <= maxOffset + height) {
align = 'auto';
} else {
align = 'center';
}
}
switch (align) {
case 'start':
return maxOffset;
case 'end':
return minOffset;
case 'center':
// "Centered" offset is usually the average of the min and max.
// But near the edges of the list, this doesn't hold true.
var middleOffset = Math.round(minOffset + (maxOffset - minOffset) / 2);
if (middleOffset < Math.ceil(height / 2)) {
return 0; // near the beginning
} else if (middleOffset > lastRowOffset + Math.floor(height / 2)) {
return lastRowOffset; // near the end
} else {
return middleOffset;
}
case 'auto':
default:
if (scrollTop >= minOffset && scrollTop <= maxOffset) {
return scrollTop;
} else if (minOffset > maxOffset) {
// Because we only take into account the scrollbar size when calculating minOffset
// this value can be larger than maxOffset when at the end of the list
return minOffset;
} else if (scrollTop < minOffset) {
return minOffset;
} else {
return maxOffset;
}
}
},
getColumnStartIndexForOffset: function getColumnStartIndexForOffset(_ref9, scrollLeft) {
var columnWidth = _ref9.columnWidth,
columnCount = _ref9.columnCount;
return Math.max(0, Math.min(columnCount - 1, Math.floor(scrollLeft / columnWidth)));
},
getColumnStopIndexForStartIndex: function getColumnStopIndexForStartIndex(_ref10, startIndex, scrollLeft) {
var columnWidth = _ref10.columnWidth,
columnCount = _ref10.columnCount,
width = _ref10.width;
var left = startIndex * columnWidth;
var numVisibleColumns = Math.ceil((width + scrollLeft - left) / columnWidth);
return Math.max(0, Math.min(columnCount - 1, startIndex + numVisibleColumns - 1 // -1 is because stop index is inclusive
));
},
getRowStartIndexForOffset: function getRowStartIndexForOffset(_ref11, scrollTop) {
var rowHeight = _ref11.rowHeight,
rowCount = _ref11.rowCount;
return Math.max(0, Math.min(rowCount - 1, Math.floor(scrollTop / rowHeight)));
},
getRowStopIndexForStartIndex: function getRowStopIndexForStartIndex(_ref12, startIndex, scrollTop) {
var rowHeight = _ref12.rowHeight,
rowCount = _ref12.rowCount,
height = _ref12.height;
var top = startIndex * rowHeight;
var numVisibleRows = Math.ceil((height + scrollTop - top) / rowHeight);
return Math.max(0, Math.min(rowCount - 1, startIndex + numVisibleRows - 1 // -1 is because stop index is inclusive
));
},
initInstanceProps: function initInstanceProps(props) {// Noop
},
shouldResetStyleCacheOnItemSizeChange: true,
validateProps: function validateProps(_ref13) {
var columnWidth = _ref13.columnWidth,
rowHeight = _ref13.rowHeight;
if (false) {}
}
});
var FixedSizeList =
/*#__PURE__*/
createListComponent({
getItemOffset: function getItemOffset(_ref, index) {
var itemSize = _ref.itemSize;
return index * itemSize;
},
getItemSize: function getItemSize(_ref2, index) {
var itemSize = _ref2.itemSize;
return itemSize;
},
getEstimatedTotalSize: function getEstimatedTotalSize(_ref3) {
var itemCount = _ref3.itemCount,
itemSize = _ref3.itemSize;
return itemSize * itemCount;
},
getOffsetForIndexAndAlignment: function getOffsetForIndexAndAlignment(_ref4, index, align, scrollOffset) {
var direction = _ref4.direction,
height = _ref4.height,
itemCount = _ref4.itemCount,
itemSize = _ref4.itemSize,
layout = _ref4.layout,
width = _ref4.width; // TODO Deprecate direction "horizontal"
var isHorizontal = direction === 'horizontal' || layout === 'horizontal';
var size = isHorizontal ? width : height;
var lastItemOffset = Math.max(0, itemCount * itemSize - size);
var maxOffset = Math.min(lastItemOffset, index * itemSize);
var minOffset = Math.max(0, index * itemSize - size + itemSize);
if (align === 'smart') {
if (scrollOffset >= minOffset - size && scrollOffset <= maxOffset + size) {
align = 'auto';
} else {
align = 'center';
}
}
switch (align) {
case 'start':
return maxOffset;
case 'end':
return minOffset;
case 'center':
{
// "Centered" offset is usually the average of the min and max.
// But near the edges of the list, this doesn't hold true.
var middleOffset = Math.round(minOffset + (maxOffset - minOffset) / 2);
if (middleOffset < Math.ceil(size / 2)) {
return 0; // near the beginning
} else if (middleOffset > lastItemOffset + Math.floor(size / 2)) {
return lastItemOffset; // near the end
} else {
return middleOffset;
}
}
case 'auto':
default:
if (scrollOffset >= minOffset && scrollOffset <= maxOffset) {
return scrollOffset;
} else if (scrollOffset < minOffset) {
return minOffset;
} else {
return maxOffset;
}
}
},
getStartIndexForOffset: function getStartIndexForOffset(_ref5, offset) {
var itemCount = _ref5.itemCount,
itemSize = _ref5.itemSize;
return Math.max(0, Math.min(itemCount - 1, Math.floor(offset / itemSize)));
},
getStopIndexForStartIndex: function getStopIndexForStartIndex(_ref6, startIndex, scrollOffset) {
var direction = _ref6.direction,
height = _ref6.height,
itemCount = _ref6.itemCount,
itemSize = _ref6.itemSize,
layout = _ref6.layout,
width = _ref6.width; // TODO Deprecate direction "horizontal"
var isHorizontal = direction === 'horizontal' || layout === 'horizontal';
var offset = startIndex * itemSize;
var size = isHorizontal ? width : height;
var numVisibleItems = Math.ceil((size + scrollOffset - offset) / itemSize);
return Math.max(0, Math.min(itemCount - 1, startIndex + numVisibleItems - 1 // -1 is because stop index is inclusive
));
},
initInstanceProps: function initInstanceProps(props) {// Noop
},
shouldResetStyleCacheOnItemSizeChange: true,
validateProps: function validateProps(_ref7) {
var itemSize = _ref7.itemSize;
if (false) {}
}
}); // Pulled from react-compat
// https://github.com/developit/preact-compat/blob/7c5de00e7c85e2ffd011bf3af02899b63f699d3a/src/index.js#L349
function shallowDiffers(prev, next) {
for (var attribute in prev) {
if (!(attribute in next)) {
return true;
}
}
for (var _attribute in next) {
if (prev[_attribute] !== next[_attribute]) {
return true;
}
}
return false;
} // It knows to compare individual style props and ignore the wrapper object.
// See https://reactjs.org/docs/react-api.html#reactmemo
function areEqual(prevProps, nextProps) {
var prevStyle = prevProps.style,
prevRest = Object(_babel_runtime_helpers_esm_objectWithoutPropertiesLoose__WEBPACK_IMPORTED_MODULE_6__["default"])(prevProps, ["style"]);
var nextStyle = nextProps.style,
nextRest = Object(_babel_runtime_helpers_esm_objectWithoutPropertiesLoose__WEBPACK_IMPORTED_MODULE_6__["default"])(nextProps, ["style"]);
return !shallowDiffers(prevStyle, nextStyle) && !shallowDiffers(prevRest, nextRest);
} // It knows to compare individual style props and ignore the wrapper object.
// See https://reactjs.org/docs/react-component.html#shouldcomponentupdate
function shouldComponentUpdate(nextProps, nextState) {
return !areEqual(this.props, nextProps) || shallowDiffers(this.state, nextState);
}
/***/ }),
/***/ "../react-devtools-shared/src/storage.js":
/*!***********************************************!*\
!*** ../react-devtools-shared/src/storage.js ***!
\***********************************************/
/*! exports provided: localStorageGetItem, localStorageRemoveItem, localStorageSetItem, sessionStorageGetItem, sessionStorageRemoveItem, sessionStorageSetItem */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "localStorageGetItem", function() { return localStorageGetItem; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "localStorageRemoveItem", function() { return localStorageRemoveItem; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "localStorageSetItem", function() { return localStorageSetItem; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "sessionStorageGetItem", function() { return sessionStorageGetItem; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "sessionStorageRemoveItem", function() { return sessionStorageRemoveItem; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "sessionStorageSetItem", function() { return sessionStorageSetItem; });
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
function localStorageGetItem(key) {
try {
return localStorage.getItem(key);
} catch (error) {
return null;
}
}
function localStorageRemoveItem(key) {
try {
localStorage.removeItem(key);
} catch (error) {}
}
function localStorageSetItem(key, value) {
try {
return localStorage.setItem(key, value);
} catch (error) {}
}
function sessionStorageGetItem(key) {
try {
return sessionStorage.getItem(key);
} catch (error) {
return null;
}
}
function sessionStorageRemoveItem(key) {
try {
sessionStorage.removeItem(key);
} catch (error) {}
}
function sessionStorageSetItem(key, value) {
try {
return sessionStorage.setItem(key, value);
} catch (error) {}
}
/***/ }),
/***/ "../react-devtools-shared/src/types.js":
/*!*********************************************!*\
!*** ../react-devtools-shared/src/types.js ***!
\*********************************************/
/*! exports provided: ElementTypeClass, ElementTypeContext, ElementTypeFunction, ElementTypeForwardRef, ElementTypeHostComponent, ElementTypeMemo, ElementTypeOtherOrUnknown, ElementTypeProfiler, ElementTypeRoot, ElementTypeSuspense, ElementTypeSuspenseList, ComponentFilterElementType, ComponentFilterDisplayName, ComponentFilterLocation, ComponentFilterHOC */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ElementTypeClass", function() { return ElementTypeClass; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ElementTypeContext", function() { return ElementTypeContext; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ElementTypeFunction", function() { return ElementTypeFunction; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ElementTypeForwardRef", function() { return ElementTypeForwardRef; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ElementTypeHostComponent", function() { return ElementTypeHostComponent; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ElementTypeMemo", function() { return ElementTypeMemo; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ElementTypeOtherOrUnknown", function() { return ElementTypeOtherOrUnknown; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ElementTypeProfiler", function() { return ElementTypeProfiler; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ElementTypeRoot", function() { return ElementTypeRoot; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ElementTypeSuspense", function() { return ElementTypeSuspense; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ElementTypeSuspenseList", function() { return ElementTypeSuspenseList; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ComponentFilterElementType", function() { return ComponentFilterElementType; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ComponentFilterDisplayName", function() { return ComponentFilterDisplayName; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ComponentFilterLocation", function() { return ComponentFilterLocation; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ComponentFilterHOC", function() { return ComponentFilterHOC; });
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
// WARNING
// The values below are referenced by ComponentFilters (which are saved via localStorage).
// Do not change them or it will break previously saved user customizations.
// If new element types are added, use new numbers rather than re-ordering existing ones.
//
// Changing these types is also a backwards breaking change for the standalone shell,
// since the frontend and backend must share the same values-
// and the backend is embedded in certain environments (like React Native).
var ElementTypeClass = 1;
var ElementTypeContext = 2;
var ElementTypeFunction = 5;
var ElementTypeForwardRef = 6;
var ElementTypeHostComponent = 7;
var ElementTypeMemo = 8;
var ElementTypeOtherOrUnknown = 9;
var ElementTypeProfiler = 10;
var ElementTypeRoot = 11;
var ElementTypeSuspense = 12;
var ElementTypeSuspenseList = 13; // Different types of elements displayed in the Elements tree.
// These types may be used to visually distinguish types,
// or to enable/disable certain functionality.
// WARNING
// The values below are referenced by ComponentFilters (which are saved via localStorage).
// Do not change them or it will break previously saved user customizations.
// If new filter types are added, use new numbers rather than re-ordering existing ones.
var ComponentFilterElementType = 1;
var ComponentFilterDisplayName = 2;
var ComponentFilterLocation = 3;
var ComponentFilterHOC = 4;
/***/ }),
/***/ "../react-devtools-shared/src/utils.js":
/*!*********************************************!*\
!*** ../react-devtools-shared/src/utils.js ***!
\*********************************************/
/*! exports provided: getDisplayName, getUID, utfDecodeString, utfEncodeString, printOperationsArray, getDefaultComponentFilters, getSavedComponentFilters, saveComponentFilters, getAppendComponentStack, setAppendComponentStack, separateDisplayNameAndHOCs, shallowDiffers, getInObject, setInObject, getDataType, getDisplayNameForReactElement, formatDataForPreview */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getDisplayName", function() { return getDisplayName; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getUID", function() { return getUID; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "utfDecodeString", function() { return utfDecodeString; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "utfEncodeString", function() { return utfEncodeString; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "printOperationsArray", function() { return printOperationsArray; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getDefaultComponentFilters", function() { return getDefaultComponentFilters; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getSavedComponentFilters", function() { return getSavedComponentFilters; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "saveComponentFilters", function() { return saveComponentFilters; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getAppendComponentStack", function() { return getAppendComponentStack; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "setAppendComponentStack", function() { return setAppendComponentStack; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "separateDisplayNameAndHOCs", function() { return separateDisplayNameAndHOCs; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "shallowDiffers", function() { return shallowDiffers; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getInObject", function() { return getInObject; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "setInObject", function() { return setInObject; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getDataType", function() { return getDataType; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getDisplayNameForReactElement", function() { return getDisplayNameForReactElement; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "formatDataForPreview", function() { return formatDataForPreview; });
/* harmony import */ var es6_symbol__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! es6-symbol */ "../../node_modules/es6-symbol/index.js");
/* harmony import */ var es6_symbol__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(es6_symbol__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var lru_cache__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! lru-cache */ "../../node_modules/lru-cache/index.js");
/* harmony import */ var lru_cache__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(lru_cache__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var react_is__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-is */ "react-is");
/* harmony import */ var react_is__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react_is__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./constants */ "../react-devtools-shared/src/constants.js");
/* harmony import */ var react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react-devtools-shared/src/types */ "../react-devtools-shared/src/types.js");
/* harmony import */ var _storage__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./storage */ "../react-devtools-shared/src/storage.js");
/* harmony import */ var _devtools_views_utils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./devtools/views/utils */ "../react-devtools-shared/src/devtools/views/utils.js");
/* harmony import */ var _hydration__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./hydration */ "../react-devtools-shared/src/hydration.js");
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }
function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
*
*/
var cachedDisplayNames = new WeakMap(); // On large trees, encoding takes significant time.
// Try to reuse the already encoded strings.
var encodedStringCache = new lru_cache__WEBPACK_IMPORTED_MODULE_1___default.a({
max: 1000
});
function getDisplayName(type) {
var fallbackName = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'Anonymous';
var nameFromCache = cachedDisplayNames.get(type);
if (nameFromCache != null) {
return nameFromCache;
}
var displayName = fallbackName; // The displayName property is not guaranteed to be a string.
// It's only safe to use for our purposes if it's a string.
// github.com/facebook/react-devtools/issues/803
if (typeof type.displayName === 'string') {
displayName = type.displayName;
} else if (typeof type.name === 'string' && type.name !== '') {
displayName = type.name;
}
cachedDisplayNames.set(type, displayName);
return displayName;
}
var uidCounter = 0;
function getUID() {
return ++uidCounter;
}
function utfDecodeString(array) {
return String.fromCodePoint.apply(String, _toConsumableArray(array));
}
function utfEncodeString(string) {
var cached = encodedStringCache.get(string);
if (cached !== undefined) {
return cached;
}
var encoded = new Array(string.length);
for (var i = 0; i < string.length; i++) {
encoded[i] = string.codePointAt(i);
}
encodedStringCache.set(string, encoded);
return encoded;
}
function printOperationsArray(operations) {
// The first two values are always rendererID and rootID
var rendererID = operations[0];
var rootID = operations[1];
var logs = ["opertions for renderer:".concat(rendererID, " and root:").concat(rootID)];
var i = 2; // Reassemble the string table.
var stringTable = [null];
var stringTableSize = operations[i++];
var stringTableEnd = i + stringTableSize;
while (i < stringTableEnd) {
var nextLength = operations[i++];
var nextString = utfDecodeString(operations.slice(i, i + nextLength));
stringTable.push(nextString);
i += nextLength;
}
while (i < operations.length) {
var operation = operations[i];
switch (operation) {
case _constants__WEBPACK_IMPORTED_MODULE_3__["TREE_OPERATION_ADD"]:
{
var id = operations[i + 1];
var type = operations[i + 2];
i += 3;
if (type === react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_4__["ElementTypeRoot"]) {
logs.push("Add new root node ".concat(id));
i++; // supportsProfiling
i++; // hasOwnerMetadata
} else {
var parentID = operations[i];
i++;
i++; // ownerID
var displayNameStringID = operations[i];
var displayName = stringTable[displayNameStringID];
i++;
i++; // key
logs.push("Add node ".concat(id, " (").concat(displayName || 'null', ") as child of ").concat(parentID));
}
break;
}
case _constants__WEBPACK_IMPORTED_MODULE_3__["TREE_OPERATION_REMOVE"]:
{
var removeLength = operations[i + 1];
i += 2;
for (var removeIndex = 0; removeIndex < removeLength; removeIndex++) {
var _id = operations[i];
i += 1;
logs.push("Remove node ".concat(_id));
}
break;
}
case _constants__WEBPACK_IMPORTED_MODULE_3__["TREE_OPERATION_REORDER_CHILDREN"]:
{
var _id2 = operations[i + 1];
var numChildren = operations[i + 2];
i += 3;
var children = operations.slice(i, i + numChildren);
i += numChildren;
logs.push("Re-order node ".concat(_id2, " children ").concat(children.join(',')));
break;
}
case _constants__WEBPACK_IMPORTED_MODULE_3__["TREE_OPERATION_UPDATE_TREE_BASE_DURATION"]:
// Base duration updates are only sent while profiling is in progress.
// We can ignore them at this point.
// The profiler UI uses them lazily in order to generate the tree.
i += 3;
break;
default:
throw Error("Unsupported Bridge operation ".concat(operation));
}
}
console.log(logs.join('\n '));
}
function getDefaultComponentFilters() {
return [{
type: react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_4__["ComponentFilterElementType"],
value: react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_4__["ElementTypeHostComponent"],
isEnabled: true
}];
}
function getSavedComponentFilters() {
try {
var raw = Object(_storage__WEBPACK_IMPORTED_MODULE_5__["localStorageGetItem"])(_constants__WEBPACK_IMPORTED_MODULE_3__["LOCAL_STORAGE_FILTER_PREFERENCES_KEY"]);
if (raw != null) {
return JSON.parse(raw);
}
} catch (error) {}
return getDefaultComponentFilters();
}
function saveComponentFilters(componentFilters) {
Object(_storage__WEBPACK_IMPORTED_MODULE_5__["localStorageSetItem"])(_constants__WEBPACK_IMPORTED_MODULE_3__["LOCAL_STORAGE_FILTER_PREFERENCES_KEY"], JSON.stringify(componentFilters));
}
function getAppendComponentStack() {
try {
var raw = Object(_storage__WEBPACK_IMPORTED_MODULE_5__["localStorageGetItem"])(_constants__WEBPACK_IMPORTED_MODULE_3__["LOCAL_STORAGE_SHOULD_PATCH_CONSOLE_KEY"]);
if (raw != null) {
return JSON.parse(raw);
}
} catch (error) {}
return true;
}
function setAppendComponentStack(value) {
Object(_storage__WEBPACK_IMPORTED_MODULE_5__["localStorageSetItem"])(_constants__WEBPACK_IMPORTED_MODULE_3__["LOCAL_STORAGE_SHOULD_PATCH_CONSOLE_KEY"], JSON.stringify(value));
}
function separateDisplayNameAndHOCs(displayName, type) {
if (displayName === null) {
return [null, null];
}
var hocDisplayNames = null;
switch (type) {
case react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_4__["ElementTypeClass"]:
case react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_4__["ElementTypeForwardRef"]:
case react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_4__["ElementTypeFunction"]:
case react_devtools_shared_src_types__WEBPACK_IMPORTED_MODULE_4__["ElementTypeMemo"]:
if (displayName.indexOf('(') >= 0) {
var matches = displayName.match(/[^()]+/g);
if (matches != null) {
displayName = matches.pop();
hocDisplayNames = matches;
}
}
break;
default:
break;
}
return [displayName, hocDisplayNames];
} // Pulled from react-compat
// https://github.com/developit/preact-compat/blob/7c5de00e7c85e2ffd011bf3af02899b63f699d3a/src/index.js#L349
function shallowDiffers(prev, next) {
for (var attribute in prev) {
if (!(attribute in next)) {
return true;
}
}
for (var _attribute in next) {
if (prev[_attribute] !== next[_attribute]) {
return true;
}
}
return false;
}
function getInObject(object, path) {
return path.reduce(function (reduced, attr) {
if (reduced) {
if (hasOwnProperty.call(reduced, attr)) {
return reduced[attr];
}
if (typeof reduced[es6_symbol__WEBPACK_IMPORTED_MODULE_0___default.a.iterator] === 'function') {
// Convert iterable to array and return array[index]
//
// TRICKY
// Don't use [...spread] syntax for this purpose.
// This project uses @babel/plugin-transform-spread in "loose" mode which only works with Array values.
// Other types (e.g. typed arrays, Sets) will not spread correctly.
return Array.from(reduced)[attr];
}
}
return null;
}, object);
}
function setInObject(object, path, value) {
var length = path.length;
var last = path[length - 1];
if (object != null) {
var parent = getInObject(object, path.slice(0, length - 1));
if (parent) {
parent[last] = value;
}
}
}
/**
* Get a enhanced/artificial type string based on the object instance
*/
function getDataType(data) {
if (data === null) {
return 'null';
} else if (data === undefined) {
return 'undefined';
}
if (Object(react_is__WEBPACK_IMPORTED_MODULE_2__["isElement"])(data)) {
return 'react_element';
}
if (typeof HTMLElement !== 'undefined' && data instanceof HTMLElement) {
return 'html_element';
}
var type = _typeof(data);
switch (type) {
case 'bigint':
return 'bigint';
case 'boolean':
return 'boolean';
case 'function':
return 'function';
case 'number':
if (Number.isNaN(data)) {
return 'nan';
} else if (!Number.isFinite(data)) {
return 'infinity';
} else {
return 'number';
}
case 'object':
if (Array.isArray(data)) {
return 'array';
} else if (ArrayBuffer.isView(data)) {
return hasOwnProperty.call(data.constructor, 'BYTES_PER_ELEMENT') ? 'typed_array' : 'data_view';
} else if (data.constructor && data.constructor.name === 'ArrayBuffer') {
// HACK This ArrayBuffer check is gross; is there a better way?
// We could try to create a new DataView with the value.
// If it doesn't error, we know it's an ArrayBuffer,
// but this seems kind of awkward and expensive.
return 'array_buffer';
} else if (typeof data[es6_symbol__WEBPACK_IMPORTED_MODULE_0___default.a.iterator] === 'function') {
return 'iterator';
} else if (data.constructor && data.constructor.name === 'RegExp') {
return 'regexp';
} else if (Object.prototype.toString.call(data) === '[object Date]') {
return 'date';
}
return 'object';
case 'string':
return 'string';
case 'symbol':
return 'symbol';
default:
return 'unknown';
}
}
function getDisplayNameForReactElement(element) {
var elementType = Object(react_is__WEBPACK_IMPORTED_MODULE_2__["typeOf"])(element);
switch (elementType) {
case react_is__WEBPACK_IMPORTED_MODULE_2__["AsyncMode"]:
case react_is__WEBPACK_IMPORTED_MODULE_2__["ConcurrentMode"]:
return 'ConcurrentMode';
case react_is__WEBPACK_IMPORTED_MODULE_2__["ContextConsumer"]:
return 'ContextConsumer';
case react_is__WEBPACK_IMPORTED_MODULE_2__["ContextProvider"]:
return 'ContextProvider';
case react_is__WEBPACK_IMPORTED_MODULE_2__["ForwardRef"]:
return 'ForwardRef';
case react_is__WEBPACK_IMPORTED_MODULE_2__["Fragment"]:
return 'Fragment';
case react_is__WEBPACK_IMPORTED_MODULE_2__["Lazy"]:
return 'Lazy';
case react_is__WEBPACK_IMPORTED_MODULE_2__["Memo"]:
return 'Memo';
case react_is__WEBPACK_IMPORTED_MODULE_2__["Portal"]:
return 'Portal';
case react_is__WEBPACK_IMPORTED_MODULE_2__["Profiler"]:
return 'Profiler';
case react_is__WEBPACK_IMPORTED_MODULE_2__["StrictMode"]:
return 'StrictMode';
case react_is__WEBPACK_IMPORTED_MODULE_2__["Suspense"]:
return 'Suspense';
default:
var type = element.type;
if (typeof type === 'string') {
return type;
} else if (type != null) {
return getDisplayName(type, 'Anonymous');
} else {
return 'Element';
}
}
}
var MAX_PREVIEW_STRING_LENGTH = 50;
function truncateForDisplay(string) {
var length = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : MAX_PREVIEW_STRING_LENGTH;
if (string.length > length) {
return string.substr(0, length) + '…';
} else {
return string;
}
} // Attempts to mimic Chrome's inline preview for values.
// For example, the following value...
// {
// foo: 123,
// bar: "abc",
// baz: [true, false],
// qux: { ab: 1, cd: 2 }
// };
//
// Would show a preview of...
// {foo: 123, bar: "abc", baz: Array(2), qux: {…}}
//
// And the following value...
// [
// 123,
// "abc",
// [true, false],
// { foo: 123, bar: "abc" }
// ];
//
// Would show a preview of...
// [123, "abc", Array(2), {…}]
function formatDataForPreview(data, showFormattedValue) {
if (data != null && hasOwnProperty.call(data, _hydration__WEBPACK_IMPORTED_MODULE_7__["meta"].type)) {
return showFormattedValue ? data[_hydration__WEBPACK_IMPORTED_MODULE_7__["meta"].preview_long] : data[_hydration__WEBPACK_IMPORTED_MODULE_7__["meta"].preview_short];
}
var type = getDataType(data);
switch (type) {
case 'html_element':
return "<".concat(truncateForDisplay(data.tagName.toLowerCase()), " />");
case 'function':
return truncateForDisplay(data.name);
case 'string':
return "\"".concat(data, "\"");
case 'bigint':
return truncateForDisplay(data.toString() + 'n');
case 'regexp':
return truncateForDisplay(data.toString());
case 'symbol':
return truncateForDisplay(data.toString());
case 'react_element':
return "<".concat(truncateForDisplay(getDisplayNameForReactElement(data) || 'Unknown'), " />");
case 'array_buffer':
return "ArrayBuffer(".concat(data.byteLength, ")");
case 'data_view':
return "DataView(".concat(data.buffer.byteLength, ")");
case 'array':
if (showFormattedValue) {
var formatted = '';
for (var i = 0; i < data.length; i++) {
if (i > 0) {
formatted += ', ';
}
formatted += formatDataForPreview(data[i], false);
if (formatted.length > MAX_PREVIEW_STRING_LENGTH) {
// Prevent doing a lot of unnecessary iteration...
break;
}
}
return "[".concat(truncateForDisplay(formatted), "]");
} else {
var length = hasOwnProperty.call(data, _hydration__WEBPACK_IMPORTED_MODULE_7__["meta"].size) ? data[_hydration__WEBPACK_IMPORTED_MODULE_7__["meta"].size] : data.length;
return "Array(".concat(length, ")");
}
case 'typed_array':
var shortName = "".concat(data.constructor.name, "(").concat(data.length, ")");
if (showFormattedValue) {
var _formatted = '';
for (var _i = 0; _i < data.length; _i++) {
if (_i > 0) {
_formatted += ', ';
}
_formatted += data[_i];
if (_formatted.length > MAX_PREVIEW_STRING_LENGTH) {
// Prevent doing a lot of unnecessary iteration...
break;
}
}
return "".concat(shortName, " [").concat(truncateForDisplay(_formatted), "]");
} else {
return shortName;
}
case 'iterator':
var name = data.constructor.name;
if (showFormattedValue) {
// TRICKY
// Don't use [...spread] syntax for this purpose.
// This project uses @babel/plugin-transform-spread in "loose" mode which only works with Array values.
// Other types (e.g. typed arrays, Sets) will not spread correctly.
var array = Array.from(data);
var _formatted2 = '';
for (var _i2 = 0; _i2 < array.length; _i2++) {
var entryOrEntries = array[_i2];
if (_i2 > 0) {
_formatted2 += ', ';
} // TRICKY
// Browsers display Maps and Sets differently.
// To mimic their behavior, detect if we've been given an entries tuple.
// Map(2) {"abc" => 123, "def" => 123}
// Set(2) {"abc", 123}
if (Array.isArray(entryOrEntries)) {
var key = formatDataForPreview(entryOrEntries[0], true);
var value = formatDataForPreview(entryOrEntries[1], false);
_formatted2 += "".concat(key, " => ").concat(value);
} else {
_formatted2 += formatDataForPreview(entryOrEntries, false);
}
if (_formatted2.length > MAX_PREVIEW_STRING_LENGTH) {
// Prevent doing a lot of unnecessary iteration...
break;
}
}
return "".concat(name, "(").concat(data.size, ") {").concat(truncateForDisplay(_formatted2), "}");
} else {
return "".concat(name, "(").concat(data.size, ")");
}
case 'date':
return data.toString();
case 'object':
if (showFormattedValue) {
var keys = Object.keys(data).sort(_devtools_views_utils__WEBPACK_IMPORTED_MODULE_6__["alphaSortEntries"]);
var _formatted3 = '';
for (var _i3 = 0; _i3 < keys.length; _i3++) {
var _key = keys[_i3];
if (_i3 > 0) {
_formatted3 += ', ';
}
_formatted3 += "".concat(_key, ": ").concat(formatDataForPreview(data[_key], false));
if (_formatted3.length > MAX_PREVIEW_STRING_LENGTH) {
// Prevent doing a lot of unnecessary iteration...
break;
}
}
return "{".concat(truncateForDisplay(_formatted3), "}");
} else {
return '{…}';
}
case 'boolean':
case 'number':
case 'infinity':
case 'nan':
case 'null':
case 'undefined':
return data;
default:
try {
return truncateForDisplay('' + data);
} catch (error) {
return 'unserializable';
}
}
}
/***/ }),
/***/ "./src/constants.js":
/*!**************************!*\
!*** ./src/constants.js ***!
\**************************/
/*! exports provided: MESSAGE_TYPE_GET_SAVED_PREFERENCES, MESSAGE_TYPE_SAVED_PREFERENCES */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MESSAGE_TYPE_GET_SAVED_PREFERENCES", function() { return MESSAGE_TYPE_GET_SAVED_PREFERENCES; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "MESSAGE_TYPE_SAVED_PREFERENCES", function() { return MESSAGE_TYPE_SAVED_PREFERENCES; });
var MESSAGE_TYPE_GET_SAVED_PREFERENCES = 'React::DevTools::getSavedPreferences';
var MESSAGE_TYPE_SAVED_PREFERENCES = 'React::DevTools::savedPreferences';
/***/ }),
/***/ "./src/frontend.js":
/*!*************************!*\
!*** ./src/frontend.js ***!
\*************************/
/*! exports provided: initialize */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "initialize", function() { return initialize; });
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var react_devtools_shared_src_bridge__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-devtools-shared/src/bridge */ "../react-devtools-shared/src/bridge.js");
/* harmony import */ var react_devtools_shared_src_devtools_store__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-devtools-shared/src/devtools/store */ "../react-devtools-shared/src/devtools/store.js");
/* harmony import */ var react_devtools_shared_src_devtools_views_DevTools__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react-devtools-shared/src/devtools/views/DevTools */ "../react-devtools-shared/src/devtools/views/DevTools.js");
/* harmony import */ var react_devtools_shared_src_utils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react-devtools-shared/src/utils */ "../react-devtools-shared/src/utils.js");
/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./constants */ "./src/constants.js");
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function initialize(contentWindow) {
var onGetSavedPreferencesMessage = function onGetSavedPreferencesMessage(_ref) {
var data = _ref.data,
source = _ref.source;
if (source === 'react-devtools-content-script') {// Ignore messages from the DevTools browser extension.
}
switch (data.type) {
case _constants__WEBPACK_IMPORTED_MODULE_5__["MESSAGE_TYPE_GET_SAVED_PREFERENCES"]:
// This is the only message we're listening for,
// so it's safe to cleanup after we've received it.
window.removeEventListener('message', onGetSavedPreferencesMessage); // The renderer interface can't read saved preferences directly,
// because they are stored in localStorage within the context of the extension.
// Instead it relies on the extension to pass them through.
contentWindow.postMessage({
type: _constants__WEBPACK_IMPORTED_MODULE_5__["MESSAGE_TYPE_SAVED_PREFERENCES"],
appendComponentStack: Object(react_devtools_shared_src_utils__WEBPACK_IMPORTED_MODULE_4__["getAppendComponentStack"])(),
componentFilters: Object(react_devtools_shared_src_utils__WEBPACK_IMPORTED_MODULE_4__["getSavedComponentFilters"])()
}, '*');
break;
default:
break;
}
};
window.addEventListener('message', onGetSavedPreferencesMessage);
var bridge = new react_devtools_shared_src_bridge__WEBPACK_IMPORTED_MODULE_1__["default"]({
listen: function listen(fn) {
var onMessage = function onMessage(_ref2) {
var data = _ref2.data;
fn(data);
};
window.addEventListener('message', onMessage);
return function () {
window.removeEventListener('message', onMessage);
};
},
send: function send(event, payload, transferable) {
contentWindow.postMessage({
event: event,
payload: payload
}, '*', transferable);
}
});
var store = new react_devtools_shared_src_devtools_store__WEBPACK_IMPORTED_MODULE_2__["default"](bridge, {
supportsTraceUpdates: true
});
var ForwardRef = Object(react__WEBPACK_IMPORTED_MODULE_0__["forwardRef"])(function (props, ref) {
return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(react_devtools_shared_src_devtools_views_DevTools__WEBPACK_IMPORTED_MODULE_3__["default"], _extends({
ref: ref,
bridge: bridge,
store: store
}, props));
});
ForwardRef.displayName = 'DevTools';
return ForwardRef;
}
/***/ }),
/***/ "react":
/*!************************!*\
!*** external "react" ***!
\************************/
/*! no static exports found */
/***/ (function(module, exports) {
module.exports = require("react");
/***/ }),
/***/ "react-dom":
/*!****************************!*\
!*** external "react-dom" ***!
\****************************/
/*! no static exports found */
/***/ (function(module, exports) {
module.exports = require("react-dom");
/***/ }),
/***/ "react-is":
/*!***************************!*\
!*** external "react-is" ***!
\***************************/
/*! no static exports found */
/***/ (function(module, exports) {
module.exports = require("react-is");
/***/ }),
/***/ "scheduler":
/*!****************************!*\
!*** external "scheduler" ***!
\****************************/
/*! no static exports found */
/***/ (function(module, exports) {
module.exports = require("scheduler");
/***/ })
/******/ });