{"version":3,"sources":["webpack:///./node_modules/gatsby/node_modules/@babel/runtime/helpers/esm/assertThisInitialized.js","webpack:///./node_modules/react-window/dist/index.esm.js","webpack:///./node_modules/react-use-dimensions/es/index.js","webpack:///./src/components/EstuariesList/SearchBar.jsx","webpack:///./src/components/EstuariesList/SortBar.jsx","webpack:///./src/components/EstuariesList/ListItem.jsx","webpack:///./src/components/EstuariesList/index.jsx","webpack:///./src/pages/explore.jsx"],"names":["_assertThisInitialized","self","ReferenceError","now","performance","Date","cancelTimeout","timeoutID","cancelAnimationFrame","id","requestTimeout","callback","delay","start","requestAnimationFrame","tick","call","cachedRTLResult","getRTLOffsetType","recalculate","outerDiv","document","createElement","outerStyle","style","width","height","overflow","direction","innerDiv","innerStyle","appendChild","body","scrollLeft","removeChild","defaultItemKey$1","index","data","createListComponent","_ref","_class","_temp","getItemOffset","getEstimatedTotalSize","getItemSize","getOffsetForIndexAndAlignment","getStartIndexForOffset","getStopIndexForStartIndex","initInstanceProps","shouldResetStyleCacheOnItemSizeChange","validateProps","_PureComponent","List","props","_this","this","_instanceProps","_outerRef","_resetIsScrollingTimeoutId","state","instance","isScrolling","scrollDirection","scrollOffset","initialScrollOffset","scrollUpdateWasRequested","_callOnItemsRendered","overscanStartIndex","overscanStopIndex","visibleStartIndex","visibleStopIndex","onItemsRendered","_callOnScroll","onScroll","_getItemStyle","_this$props","itemSize","layout","itemStyleCache","_getItemStyleCache","hasOwnProperty","_offset","size","isHorizontal","isRtl","offsetHorizontal","position","left","undefined","right","top","_","__","___","_onScrollHorizontal","event","_event$currentTarget","currentTarget","clientWidth","scrollWidth","setState","prevState","Math","max","min","_resetIsScrollingDebounced","_onScrollVertical","_event$currentTarget2","clientHeight","scrollHeight","scrollTop","_outerRefSetter","ref","outerRef","current","_resetIsScrolling","getDerivedStateFromProps","nextProps","validateSharedProps$1","_proto","prototype","scrollTo","scrollToItem","align","itemCount","componentDidMount","_this$props2","_callPropsCallbacks","componentDidUpdate","_this$props3","_this$state","componentWillUnmount","render","_this$props4","children","className","innerRef","innerElementType","innerTagName","itemData","_this$props4$itemKey","itemKey","outerElementType","outerTagName","useIsScrolling","_this$_getRangeToRend","_getRangeToRender","startIndex","stopIndex","items","_index","push","key","estimatedTotalSize","WebkitOverflowScrolling","willChange","pointerEvents","_this$_getRangeToRend2","_overscanStartIndex","_overscanStopIndex","_visibleStartIndex","_visibleStopIndex","_this$state2","_scrollDirection","_scrollOffset","_scrollUpdateWasRequested","_this$props5","overscanCount","_this$state3","overscanBackward","overscanForward","defaultProps","_ref2","_ref3","FixedSizeList","_ref4","lastItemOffset","maxOffset","minOffset","middleOffset","round","ceil","floor","_ref5","offset","_ref6","numVisibleItems","_ref7","getDimensionObject","node","rect","getBoundingClientRect","x","y","bottom","arguments","length","_ref$liveMeasure","liveMeasure","_useState","dimensions","setDimensions","_useState2","setNode","measure","window","addEventListener","removeEventListener","Wrapper","styled","div","themeGet","InnerWrapper","Flex","attrs","alignItems","flexWrap","SearchIcon","FaSearch","ClearIcon","FaRegTimesCircle","visibility","Input","input","SearchBar","value","placeholder","onChange","newValue","target","onClick","memo","Text","textAlign","Option","span","active","SortBar","options","map","idx","label","fontSize","theme","colors","primary","Name","ListItem","name","type","acres","stateNames","estuaryTypes","formatNumber","prevID","sortOptions","sortFunc","a","b","get","flex","flexDirection","Count","ListWrapper","NoResults","Box","EstuariesList","onSelect","useContext","CrossfilterContext","filterDispatch","dispatch","listRef","useRef","useDimensions","listWrapperRef","listHeight","useState","sortIdx","setSortIdx","sortedData","sort","px","Map","SET_FILTER","payload","field","filterValue","toJS","i","listData","item","Help","ExpandableParagraph","Explore","useData","selectedId","setSelectedId","PNWBounds","bounds","setBounds","location","setLocation","handleSelect","console","log","Crossfilter","filters","Layout","SEO","title","Sidebar","allowScroll","EstuaryDetails","toString","onBack","onZoomTo","icon","snippet","record","selectedFeature","onSelectFeature"],"mappings":"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","file":"component---src-pages-explore-jsx-e4d4ec1eae6e1fc7b102.js","sourcesContent":["export default function _assertThisInitialized(self) {\n if (self === void 0) {\n throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\");\n }\n\n return self;\n}","import _extends from '@babel/runtime/helpers/esm/extends';\nimport _inheritsLoose from '@babel/runtime/helpers/esm/inheritsLoose';\nimport _assertThisInitialized from '@babel/runtime/helpers/esm/assertThisInitialized';\nimport memoizeOne from 'memoize-one';\nimport { createElement, PureComponent } from 'react';\nimport _objectWithoutPropertiesLoose from '@babel/runtime/helpers/esm/objectWithoutPropertiesLoose'; // Animation frame based implementation of setTimeout.\n// Inspired by Joe Lambert, https://gist.github.com/joelambert/1002116#file-requesttimeout-js\n\nvar hasNativePerformanceNow = typeof performance === 'object' && typeof performance.now === 'function';\nvar now = hasNativePerformanceNow ? function () {\n return performance.now();\n} : function () {\n return Date.now();\n};\n\nfunction cancelTimeout(timeoutID) {\n cancelAnimationFrame(timeoutID.id);\n}\n\nfunction requestTimeout(callback, delay) {\n var start = now();\n\n function tick() {\n if (now() - start >= delay) {\n callback.call(null);\n } else {\n timeoutID.id = requestAnimationFrame(tick);\n }\n }\n\n var timeoutID = {\n id: requestAnimationFrame(tick)\n };\n return timeoutID;\n}\n\nvar size = -1; // This utility copied from \"dom-helpers\" package.\n\nfunction getScrollbarSize(recalculate) {\n if (recalculate === void 0) {\n recalculate = false;\n }\n\n if (size === -1 || recalculate) {\n var div = document.createElement('div');\n var style = div.style;\n style.width = '50px';\n style.height = '50px';\n style.overflow = 'scroll';\n document.body.appendChild(div);\n size = div.offsetWidth - div.clientWidth;\n document.body.removeChild(div);\n }\n\n return size;\n}\n\nvar cachedRTLResult = null; // TRICKY According to the spec, scrollLeft should be negative for RTL aligned elements.\n// Chrome does not seem to adhere; its scrollLeft values are positive (measured relative to the left).\n// Safari's elastic bounce makes detecting this even more complicated wrt potential false positives.\n// The safest way to check this is to intentionally set a negative offset,\n// and then verify that the subsequent \"scroll\" event matches the negative offset.\n// If it does not match, then we can assume a non-standard RTL scroll implementation.\n\nfunction getRTLOffsetType(recalculate) {\n if (recalculate === void 0) {\n recalculate = false;\n }\n\n if (cachedRTLResult === null || recalculate) {\n var outerDiv = document.createElement('div');\n var outerStyle = outerDiv.style;\n outerStyle.width = '50px';\n outerStyle.height = '50px';\n outerStyle.overflow = 'scroll';\n outerStyle.direction = 'rtl';\n var innerDiv = document.createElement('div');\n var innerStyle = innerDiv.style;\n innerStyle.width = '100px';\n innerStyle.height = '100px';\n outerDiv.appendChild(innerDiv);\n document.body.appendChild(outerDiv);\n\n if (outerDiv.scrollLeft > 0) {\n cachedRTLResult = 'positive-descending';\n } else {\n outerDiv.scrollLeft = 1;\n\n if (outerDiv.scrollLeft === 0) {\n cachedRTLResult = 'negative';\n } else {\n cachedRTLResult = 'positive-ascending';\n }\n }\n\n document.body.removeChild(outerDiv);\n return cachedRTLResult;\n }\n\n return cachedRTLResult;\n}\n\nvar IS_SCROLLING_DEBOUNCE_INTERVAL = 150;\n\nvar defaultItemKey = function defaultItemKey(_ref) {\n var columnIndex = _ref.columnIndex,\n data = _ref.data,\n rowIndex = _ref.rowIndex;\n return rowIndex + \":\" + columnIndex;\n}; // In DEV mode, this Set helps us only log a warning once per component instance.\n// This avoids spamming the console every time a render happens.\n\n\nvar devWarningsOverscanCount = null;\nvar devWarningsOverscanRowsColumnsCount = null;\nvar devWarningsTagName = null;\n\nif (process.env.NODE_ENV !== 'production') {\n if (typeof window !== 'undefined' && typeof window.WeakSet !== 'undefined') {\n devWarningsOverscanCount =\n /*#__PURE__*/\n new WeakSet();\n devWarningsOverscanRowsColumnsCount =\n /*#__PURE__*/\n new WeakSet();\n devWarningsTagName =\n /*#__PURE__*/\n new WeakSet();\n }\n}\n\nfunction createGridComponent(_ref2) {\n var _class, _temp;\n\n var getColumnOffset = _ref2.getColumnOffset,\n getColumnStartIndexForOffset = _ref2.getColumnStartIndexForOffset,\n getColumnStopIndexForStartIndex = _ref2.getColumnStopIndexForStartIndex,\n getColumnWidth = _ref2.getColumnWidth,\n getEstimatedTotalHeight = _ref2.getEstimatedTotalHeight,\n getEstimatedTotalWidth = _ref2.getEstimatedTotalWidth,\n getOffsetForColumnAndAlignment = _ref2.getOffsetForColumnAndAlignment,\n getOffsetForRowAndAlignment = _ref2.getOffsetForRowAndAlignment,\n getRowHeight = _ref2.getRowHeight,\n getRowOffset = _ref2.getRowOffset,\n getRowStartIndexForOffset = _ref2.getRowStartIndexForOffset,\n getRowStopIndexForStartIndex = _ref2.getRowStopIndexForStartIndex,\n initInstanceProps = _ref2.initInstanceProps,\n shouldResetStyleCacheOnItemSizeChange = _ref2.shouldResetStyleCacheOnItemSizeChange,\n validateProps = _ref2.validateProps;\n return _temp = _class =\n /*#__PURE__*/\n function (_PureComponent) {\n _inheritsLoose(Grid, _PureComponent); // Always use explicit constructor for React components.\n // It produces less code after transpilation. (#26)\n // eslint-disable-next-line no-useless-constructor\n\n\n function Grid(props) {\n var _this;\n\n _this = _PureComponent.call(this, props) || this;\n _this._instanceProps = initInstanceProps(_this.props, _assertThisInitialized(_assertThisInitialized(_this)));\n _this._resetIsScrollingTimeoutId = null;\n _this._outerRef = void 0;\n _this.state = {\n instance: _assertThisInitialized(_assertThisInitialized(_this)),\n isScrolling: false,\n horizontalScrollDirection: 'forward',\n scrollLeft: typeof _this.props.initialScrollLeft === 'number' ? _this.props.initialScrollLeft : 0,\n scrollTop: typeof _this.props.initialScrollTop === 'number' ? _this.props.initialScrollTop : 0,\n scrollUpdateWasRequested: false,\n verticalScrollDirection: 'forward'\n };\n _this._callOnItemsRendered = void 0;\n _this._callOnItemsRendered = memoizeOne(function (overscanColumnStartIndex, overscanColumnStopIndex, overscanRowStartIndex, overscanRowStopIndex, visibleColumnStartIndex, visibleColumnStopIndex, visibleRowStartIndex, visibleRowStopIndex) {\n return _this.props.onItemsRendered({\n overscanColumnStartIndex: overscanColumnStartIndex,\n overscanColumnStopIndex: overscanColumnStopIndex,\n overscanRowStartIndex: overscanRowStartIndex,\n overscanRowStopIndex: overscanRowStopIndex,\n visibleColumnStartIndex: visibleColumnStartIndex,\n visibleColumnStopIndex: visibleColumnStopIndex,\n visibleRowStartIndex: visibleRowStartIndex,\n visibleRowStopIndex: visibleRowStopIndex\n });\n });\n _this._callOnScroll = void 0;\n _this._callOnScroll = memoizeOne(function (scrollLeft, scrollTop, horizontalScrollDirection, verticalScrollDirection, scrollUpdateWasRequested) {\n return _this.props.onScroll({\n horizontalScrollDirection: horizontalScrollDirection,\n scrollLeft: scrollLeft,\n scrollTop: scrollTop,\n verticalScrollDirection: verticalScrollDirection,\n scrollUpdateWasRequested: scrollUpdateWasRequested\n });\n });\n _this._getItemStyle = void 0;\n\n _this._getItemStyle = function (rowIndex, columnIndex) {\n var _this$props = _this.props,\n columnWidth = _this$props.columnWidth,\n direction = _this$props.direction,\n rowHeight = _this$props.rowHeight;\n\n var itemStyleCache = _this._getItemStyleCache(shouldResetStyleCacheOnItemSizeChange && columnWidth, shouldResetStyleCacheOnItemSizeChange && direction, shouldResetStyleCacheOnItemSizeChange && rowHeight);\n\n var key = rowIndex + \":\" + columnIndex;\n var style;\n\n if (itemStyleCache.hasOwnProperty(key)) {\n style = itemStyleCache[key];\n } else {\n var _offset = getColumnOffset(_this.props, columnIndex, _this._instanceProps);\n\n var isRtl = direction === 'rtl';\n itemStyleCache[key] = style = {\n position: 'absolute',\n left: isRtl ? undefined : _offset,\n right: isRtl ? _offset : undefined,\n top: getRowOffset(_this.props, rowIndex, _this._instanceProps),\n height: getRowHeight(_this.props, rowIndex, _this._instanceProps),\n width: getColumnWidth(_this.props, columnIndex, _this._instanceProps)\n };\n }\n\n return style;\n };\n\n _this._getItemStyleCache = void 0;\n _this._getItemStyleCache = memoizeOne(function (_, __, ___) {\n return {};\n });\n\n _this._onScroll = function (event) {\n var _event$currentTarget = event.currentTarget,\n clientHeight = _event$currentTarget.clientHeight,\n clientWidth = _event$currentTarget.clientWidth,\n scrollLeft = _event$currentTarget.scrollLeft,\n scrollTop = _event$currentTarget.scrollTop,\n scrollHeight = _event$currentTarget.scrollHeight,\n scrollWidth = _event$currentTarget.scrollWidth;\n\n _this.setState(function (prevState) {\n if (prevState.scrollLeft === scrollLeft && prevState.scrollTop === scrollTop) {\n // Scroll position may have been updated by cDM/cDU,\n // In which case we don't need to trigger another render,\n // And we don't want to update state.isScrolling.\n return null;\n }\n\n var direction = _this.props.direction; // TRICKY According to the spec, scrollLeft should be negative for RTL aligned elements.\n // This is not the case for all browsers though (e.g. Chrome reports values as positive, measured relative to the left).\n // It's also easier for this component if we convert offsets to the same format as they would be in for ltr.\n // So the simplest solution is to determine which browser behavior we're dealing with, and convert based on it.\n\n var calculatedScrollLeft = scrollLeft;\n\n if (direction === 'rtl') {\n switch (getRTLOffsetType()) {\n case 'negative':\n calculatedScrollLeft = -scrollLeft;\n break;\n\n case 'positive-descending':\n calculatedScrollLeft = scrollWidth - clientWidth - scrollLeft;\n break;\n }\n } // Prevent Safari's elastic scrolling from causing visual shaking when scrolling past bounds.\n\n\n calculatedScrollLeft = Math.max(0, Math.min(calculatedScrollLeft, scrollWidth - clientWidth));\n var calculatedScrollTop = Math.max(0, Math.min(scrollTop, scrollHeight - clientHeight));\n return {\n isScrolling: true,\n horizontalScrollDirection: prevState.scrollLeft < scrollLeft ? 'forward' : 'backward',\n scrollLeft: calculatedScrollLeft,\n scrollTop: calculatedScrollTop,\n verticalScrollDirection: prevState.scrollTop < scrollTop ? 'forward' : 'backward',\n scrollUpdateWasRequested: false\n };\n }, _this._resetIsScrollingDebounced);\n };\n\n _this._outerRefSetter = function (ref) {\n var outerRef = _this.props.outerRef;\n _this._outerRef = ref;\n\n if (typeof outerRef === 'function') {\n outerRef(ref);\n } else if (outerRef != null && typeof outerRef === 'object' && outerRef.hasOwnProperty('current')) {\n outerRef.current = ref;\n }\n };\n\n _this._resetIsScrollingDebounced = function () {\n if (_this._resetIsScrollingTimeoutId !== null) {\n cancelTimeout(_this._resetIsScrollingTimeoutId);\n }\n\n _this._resetIsScrollingTimeoutId = requestTimeout(_this._resetIsScrolling, IS_SCROLLING_DEBOUNCE_INTERVAL);\n };\n\n _this._resetIsScrolling = function () {\n _this._resetIsScrollingTimeoutId = null;\n\n _this.setState({\n isScrolling: false\n }, function () {\n // Clear style cache after state update has been committed.\n // This way we don't break pure sCU for items that don't use isScrolling param.\n _this._getItemStyleCache(-1);\n });\n };\n\n return _this;\n }\n\n Grid.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, prevState) {\n validateSharedProps(nextProps, prevState);\n validateProps(nextProps);\n return null;\n };\n\n var _proto = Grid.prototype;\n\n _proto.scrollTo = function scrollTo(_ref3) {\n var scrollLeft = _ref3.scrollLeft,\n scrollTop = _ref3.scrollTop;\n\n if (scrollLeft !== undefined) {\n scrollLeft = Math.max(0, scrollLeft);\n }\n\n if (scrollTop !== undefined) {\n scrollTop = Math.max(0, scrollTop);\n }\n\n this.setState(function (prevState) {\n if (scrollLeft === undefined) {\n scrollLeft = prevState.scrollLeft;\n }\n\n if (scrollTop === undefined) {\n scrollTop = prevState.scrollTop;\n }\n\n if (prevState.scrollLeft === scrollLeft && prevState.scrollTop === scrollTop) {\n return null;\n }\n\n return {\n horizontalScrollDirection: prevState.scrollLeft < scrollLeft ? 'forward' : 'backward',\n scrollLeft: scrollLeft,\n scrollTop: scrollTop,\n scrollUpdateWasRequested: true,\n verticalScrollDirection: prevState.scrollTop < scrollTop ? 'forward' : 'backward'\n };\n }, this._resetIsScrollingDebounced);\n };\n\n _proto.scrollToItem = function scrollToItem(_ref4) {\n var _ref4$align = _ref4.align,\n align = _ref4$align === void 0 ? 'auto' : _ref4$align,\n columnIndex = _ref4.columnIndex,\n rowIndex = _ref4.rowIndex;\n var _this$props2 = this.props,\n columnCount = _this$props2.columnCount,\n height = _this$props2.height,\n rowCount = _this$props2.rowCount,\n width = _this$props2.width;\n var _this$state = this.state,\n scrollLeft = _this$state.scrollLeft,\n scrollTop = _this$state.scrollTop;\n var scrollbarSize = getScrollbarSize();\n\n if (columnIndex !== undefined) {\n columnIndex = Math.max(0, Math.min(columnIndex, columnCount - 1));\n }\n\n if (rowIndex !== undefined) {\n rowIndex = Math.max(0, Math.min(rowIndex, rowCount - 1));\n }\n\n var estimatedTotalHeight = getEstimatedTotalHeight(this.props, this._instanceProps);\n var estimatedTotalWidth = getEstimatedTotalWidth(this.props, this._instanceProps); // The scrollbar size should be considered when scrolling an item into view,\n // to ensure it's fully visible.\n // But we only need to account for its size when it's actually visible.\n\n var horizontalScrollbarSize = estimatedTotalWidth > width ? scrollbarSize : 0;\n var verticalScrollbarSize = estimatedTotalHeight > height ? scrollbarSize : 0;\n this.scrollTo({\n scrollLeft: columnIndex !== undefined ? getOffsetForColumnAndAlignment(this.props, columnIndex, align, scrollLeft, this._instanceProps, verticalScrollbarSize) : scrollLeft,\n scrollTop: rowIndex !== undefined ? getOffsetForRowAndAlignment(this.props, rowIndex, align, scrollTop, this._instanceProps, horizontalScrollbarSize) : scrollTop\n });\n };\n\n _proto.componentDidMount = function componentDidMount() {\n var _this$props3 = this.props,\n initialScrollLeft = _this$props3.initialScrollLeft,\n initialScrollTop = _this$props3.initialScrollTop;\n\n if (this._outerRef != null) {\n var outerRef = this._outerRef;\n\n if (typeof initialScrollLeft === 'number') {\n outerRef.scrollLeft = initialScrollLeft;\n }\n\n if (typeof initialScrollTop === 'number') {\n outerRef.scrollTop = initialScrollTop;\n }\n }\n\n this._callPropsCallbacks();\n };\n\n _proto.componentDidUpdate = function componentDidUpdate() {\n var direction = this.props.direction;\n var _this$state2 = this.state,\n scrollLeft = _this$state2.scrollLeft,\n scrollTop = _this$state2.scrollTop,\n scrollUpdateWasRequested = _this$state2.scrollUpdateWasRequested;\n\n if (scrollUpdateWasRequested && this._outerRef != null) {\n // TRICKY According to the spec, scrollLeft should be negative for RTL aligned elements.\n // This is not the case for all browsers though (e.g. Chrome reports values as positive, measured relative to the left).\n // So we need to determine which browser behavior we're dealing with, and mimic it.\n var outerRef = this._outerRef;\n\n if (direction === 'rtl') {\n switch (getRTLOffsetType()) {\n case 'negative':\n outerRef.scrollLeft = -scrollLeft;\n break;\n\n case 'positive-ascending':\n outerRef.scrollLeft = scrollLeft;\n break;\n\n default:\n var clientWidth = outerRef.clientWidth,\n scrollWidth = outerRef.scrollWidth;\n outerRef.scrollLeft = scrollWidth - clientWidth - scrollLeft;\n break;\n }\n } else {\n outerRef.scrollLeft = Math.max(0, scrollLeft);\n }\n\n outerRef.scrollTop = Math.max(0, scrollTop);\n }\n\n this._callPropsCallbacks();\n };\n\n _proto.componentWillUnmount = function componentWillUnmount() {\n if (this._resetIsScrollingTimeoutId !== null) {\n cancelTimeout(this._resetIsScrollingTimeoutId);\n }\n };\n\n _proto.render = function render() {\n var _this$props4 = this.props,\n children = _this$props4.children,\n className = _this$props4.className,\n columnCount = _this$props4.columnCount,\n direction = _this$props4.direction,\n height = _this$props4.height,\n innerRef = _this$props4.innerRef,\n innerElementType = _this$props4.innerElementType,\n innerTagName = _this$props4.innerTagName,\n itemData = _this$props4.itemData,\n _this$props4$itemKey = _this$props4.itemKey,\n itemKey = _this$props4$itemKey === void 0 ? defaultItemKey : _this$props4$itemKey,\n outerElementType = _this$props4.outerElementType,\n outerTagName = _this$props4.outerTagName,\n rowCount = _this$props4.rowCount,\n style = _this$props4.style,\n useIsScrolling = _this$props4.useIsScrolling,\n width = _this$props4.width;\n var isScrolling = this.state.isScrolling;\n\n var _this$_getHorizontalR = this._getHorizontalRangeToRender(),\n columnStartIndex = _this$_getHorizontalR[0],\n columnStopIndex = _this$_getHorizontalR[1];\n\n var _this$_getVerticalRan = this._getVerticalRangeToRender(),\n rowStartIndex = _this$_getVerticalRan[0],\n rowStopIndex = _this$_getVerticalRan[1];\n\n var items = [];\n\n if (columnCount > 0 && rowCount) {\n for (var _rowIndex = rowStartIndex; _rowIndex <= rowStopIndex; _rowIndex++) {\n for (var _columnIndex = columnStartIndex; _columnIndex <= columnStopIndex; _columnIndex++) {\n items.push(createElement(children, {\n columnIndex: _columnIndex,\n data: itemData,\n isScrolling: useIsScrolling ? isScrolling : undefined,\n key: itemKey({\n columnIndex: _columnIndex,\n data: itemData,\n rowIndex: _rowIndex\n }),\n rowIndex: _rowIndex,\n style: this._getItemStyle(_rowIndex, _columnIndex)\n }));\n }\n }\n } // Read this value AFTER items have been created,\n // So their actual sizes (if variable) are taken into consideration.\n\n\n var estimatedTotalHeight = getEstimatedTotalHeight(this.props, this._instanceProps);\n var estimatedTotalWidth = getEstimatedTotalWidth(this.props, this._instanceProps);\n return createElement(outerElementType || outerTagName || 'div', {\n className: className,\n onScroll: this._onScroll,\n ref: this._outerRefSetter,\n style: _extends({\n position: 'relative',\n height: height,\n width: width,\n overflow: 'auto',\n WebkitOverflowScrolling: 'touch',\n willChange: 'transform',\n direction: direction\n }, style)\n }, createElement(innerElementType || innerTagName || 'div', {\n children: items,\n ref: innerRef,\n style: {\n height: estimatedTotalHeight,\n pointerEvents: isScrolling ? 'none' : undefined,\n width: estimatedTotalWidth\n }\n }));\n };\n\n _proto._callPropsCallbacks = function _callPropsCallbacks() {\n var _this$props5 = this.props,\n columnCount = _this$props5.columnCount,\n onItemsRendered = _this$props5.onItemsRendered,\n onScroll = _this$props5.onScroll,\n rowCount = _this$props5.rowCount;\n\n if (typeof onItemsRendered === 'function') {\n if (columnCount > 0 && rowCount > 0) {\n var _this$_getHorizontalR2 = this._getHorizontalRangeToRender(),\n _overscanColumnStartIndex = _this$_getHorizontalR2[0],\n _overscanColumnStopIndex = _this$_getHorizontalR2[1],\n _visibleColumnStartIndex = _this$_getHorizontalR2[2],\n _visibleColumnStopIndex = _this$_getHorizontalR2[3];\n\n var _this$_getVerticalRan2 = this._getVerticalRangeToRender(),\n _overscanRowStartIndex = _this$_getVerticalRan2[0],\n _overscanRowStopIndex = _this$_getVerticalRan2[1],\n _visibleRowStartIndex = _this$_getVerticalRan2[2],\n _visibleRowStopIndex = _this$_getVerticalRan2[3];\n\n this._callOnItemsRendered(_overscanColumnStartIndex, _overscanColumnStopIndex, _overscanRowStartIndex, _overscanRowStopIndex, _visibleColumnStartIndex, _visibleColumnStopIndex, _visibleRowStartIndex, _visibleRowStopIndex);\n }\n }\n\n if (typeof onScroll === 'function') {\n var _this$state3 = this.state,\n _horizontalScrollDirection = _this$state3.horizontalScrollDirection,\n _scrollLeft = _this$state3.scrollLeft,\n _scrollTop = _this$state3.scrollTop,\n _scrollUpdateWasRequested = _this$state3.scrollUpdateWasRequested,\n _verticalScrollDirection = _this$state3.verticalScrollDirection;\n\n this._callOnScroll(_scrollLeft, _scrollTop, _horizontalScrollDirection, _verticalScrollDirection, _scrollUpdateWasRequested);\n }\n }; // Lazily create and cache item styles while scrolling,\n // So that pure component sCU will prevent re-renders.\n // We maintain this cache, and pass a style prop rather than index,\n // So that List can clear cached styles and force item re-render if necessary.\n\n\n _proto._getHorizontalRangeToRender = function _getHorizontalRangeToRender() {\n var _this$props6 = this.props,\n columnCount = _this$props6.columnCount,\n overscanColumnCount = _this$props6.overscanColumnCount,\n overscanColumnsCount = _this$props6.overscanColumnsCount,\n overscanCount = _this$props6.overscanCount,\n rowCount = _this$props6.rowCount;\n var _this$state4 = this.state,\n horizontalScrollDirection = _this$state4.horizontalScrollDirection,\n isScrolling = _this$state4.isScrolling,\n scrollLeft = _this$state4.scrollLeft;\n var overscanCountResolved = overscanColumnCount || overscanColumnsCount || overscanCount || 1;\n\n if (columnCount === 0 || rowCount === 0) {\n return [0, 0, 0, 0];\n }\n\n var startIndex = getColumnStartIndexForOffset(this.props, scrollLeft, this._instanceProps);\n var stopIndex = getColumnStopIndexForStartIndex(this.props, startIndex, scrollLeft, this._instanceProps); // Overscan by one item in each direction so that tab/focus works.\n // If there isn't at least one extra item, tab loops back around.\n\n var overscanBackward = !isScrolling || horizontalScrollDirection === 'backward' ? Math.max(1, overscanCountResolved) : 1;\n var overscanForward = !isScrolling || horizontalScrollDirection === 'forward' ? Math.max(1, overscanCountResolved) : 1;\n return [Math.max(0, startIndex - overscanBackward), Math.max(0, Math.min(columnCount - 1, stopIndex + overscanForward)), startIndex, stopIndex];\n };\n\n _proto._getVerticalRangeToRender = function _getVerticalRangeToRender() {\n var _this$props7 = this.props,\n columnCount = _this$props7.columnCount,\n overscanCount = _this$props7.overscanCount,\n overscanRowCount = _this$props7.overscanRowCount,\n overscanRowsCount = _this$props7.overscanRowsCount,\n rowCount = _this$props7.rowCount;\n var _this$state5 = this.state,\n isScrolling = _this$state5.isScrolling,\n verticalScrollDirection = _this$state5.verticalScrollDirection,\n scrollTop = _this$state5.scrollTop;\n var overscanCountResolved = overscanRowCount || overscanRowsCount || overscanCount || 1;\n\n if (columnCount === 0 || rowCount === 0) {\n return [0, 0, 0, 0];\n }\n\n var startIndex = getRowStartIndexForOffset(this.props, scrollTop, this._instanceProps);\n var stopIndex = getRowStopIndexForStartIndex(this.props, startIndex, scrollTop, this._instanceProps); // Overscan by one item in each direction so that tab/focus works.\n // If there isn't at least one extra item, tab loops back around.\n\n var overscanBackward = !isScrolling || verticalScrollDirection === 'backward' ? Math.max(1, overscanCountResolved) : 1;\n var overscanForward = !isScrolling || verticalScrollDirection === 'forward' ? Math.max(1, overscanCountResolved) : 1;\n return [Math.max(0, startIndex - overscanBackward), Math.max(0, Math.min(rowCount - 1, stopIndex + overscanForward)), startIndex, stopIndex];\n };\n\n return Grid;\n }(PureComponent), _class.defaultProps = {\n direction: 'ltr',\n itemData: undefined,\n useIsScrolling: false\n }, _temp;\n}\n\nvar validateSharedProps = function validateSharedProps(_ref5, _ref6) {\n var children = _ref5.children,\n direction = _ref5.direction,\n height = _ref5.height,\n innerTagName = _ref5.innerTagName,\n outerTagName = _ref5.outerTagName,\n overscanColumnsCount = _ref5.overscanColumnsCount,\n overscanCount = _ref5.overscanCount,\n overscanRowsCount = _ref5.overscanRowsCount,\n width = _ref5.width;\n var instance = _ref6.instance;\n\n if (process.env.NODE_ENV !== 'production') {\n if (typeof overscanCount === 'number') {\n if (devWarningsOverscanCount && !devWarningsOverscanCount.has(instance)) {\n devWarningsOverscanCount.add(instance);\n console.warn('The overscanCount prop has been deprecated. ' + 'Please use the overscanColumnCount and overscanRowCount props instead.');\n }\n }\n\n if (typeof overscanColumnsCount === 'number' || typeof overscanRowsCount === 'number') {\n if (devWarningsOverscanRowsColumnsCount && !devWarningsOverscanRowsColumnsCount.has(instance)) {\n devWarningsOverscanRowsColumnsCount.add(instance);\n console.warn('The overscanColumnsCount and overscanRowsCount props have been deprecated. ' + 'Please use the overscanColumnCount and overscanRowCount props instead.');\n }\n }\n\n if (innerTagName != null || outerTagName != null) {\n if (devWarningsTagName && !devWarningsTagName.has(instance)) {\n devWarningsTagName.add(instance);\n console.warn('The innerTagName and outerTagName props have been deprecated. ' + 'Please use the innerElementType and outerElementType props instead.');\n }\n }\n\n if (children == null) {\n throw Error('An invalid \"children\" prop has been specified. ' + 'Value should be a React component. ' + (\"\\\"\" + (children === null ? 'null' : typeof children) + \"\\\" was specified.\"));\n }\n\n switch (direction) {\n case 'ltr':\n case 'rtl':\n // Valid values\n break;\n\n default:\n throw Error('An invalid \"direction\" prop has been specified. ' + 'Value should be either \"ltr\" or \"rtl\". ' + (\"\\\"\" + direction + \"\\\" was specified.\"));\n }\n\n if (typeof width !== 'number') {\n throw Error('An invalid \"width\" prop has been specified. ' + 'Grids must specify a number for width. ' + (\"\\\"\" + (width === null ? 'null' : typeof width) + \"\\\" was specified.\"));\n }\n\n if (typeof height !== 'number') {\n throw Error('An invalid \"height\" prop has been specified. ' + 'Grids must specify a number for height. ' + (\"\\\"\" + (height === null ? 'null' : typeof height) + \"\\\" was specified.\"));\n }\n }\n};\n\nvar DEFAULT_ESTIMATED_ITEM_SIZE = 50;\n\nvar getEstimatedTotalHeight = function getEstimatedTotalHeight(_ref, _ref2) {\n var rowCount = _ref.rowCount;\n var rowMetadataMap = _ref2.rowMetadataMap,\n estimatedRowHeight = _ref2.estimatedRowHeight,\n lastMeasuredRowIndex = _ref2.lastMeasuredRowIndex;\n var totalSizeOfMeasuredRows = 0; // Edge case check for when the number of items decreases while a scroll is in progress.\n // https://github.com/bvaughn/react-window/pull/138\n\n if (lastMeasuredRowIndex >= rowCount) {\n lastMeasuredRowIndex = rowCount - 1;\n }\n\n if (lastMeasuredRowIndex >= 0) {\n var itemMetadata = rowMetadataMap[lastMeasuredRowIndex];\n totalSizeOfMeasuredRows = itemMetadata.offset + itemMetadata.size;\n }\n\n var numUnmeasuredItems = rowCount - lastMeasuredRowIndex - 1;\n var totalSizeOfUnmeasuredItems = numUnmeasuredItems * estimatedRowHeight;\n return totalSizeOfMeasuredRows + totalSizeOfUnmeasuredItems;\n};\n\nvar getEstimatedTotalWidth = function getEstimatedTotalWidth(_ref3, _ref4) {\n var columnCount = _ref3.columnCount;\n var columnMetadataMap = _ref4.columnMetadataMap,\n estimatedColumnWidth = _ref4.estimatedColumnWidth,\n lastMeasuredColumnIndex = _ref4.lastMeasuredColumnIndex;\n var totalSizeOfMeasuredRows = 0; // Edge case check for when the number of items decreases while a scroll is in progress.\n // https://github.com/bvaughn/react-window/pull/138\n\n if (lastMeasuredColumnIndex >= columnCount) {\n lastMeasuredColumnIndex = columnCount - 1;\n }\n\n if (lastMeasuredColumnIndex >= 0) {\n var itemMetadata = columnMetadataMap[lastMeasuredColumnIndex];\n totalSizeOfMeasuredRows = itemMetadata.offset + itemMetadata.size;\n }\n\n var numUnmeasuredItems = columnCount - lastMeasuredColumnIndex - 1;\n var totalSizeOfUnmeasuredItems = numUnmeasuredItems * estimatedColumnWidth;\n return totalSizeOfMeasuredRows + totalSizeOfUnmeasuredItems;\n};\n\nvar getItemMetadata = function getItemMetadata(itemType, props, index, instanceProps) {\n var itemMetadataMap, itemSize, lastMeasuredIndex;\n\n if (itemType === 'column') {\n itemMetadataMap = instanceProps.columnMetadataMap;\n itemSize = props.columnWidth;\n lastMeasuredIndex = instanceProps.lastMeasuredColumnIndex;\n } else {\n itemMetadataMap = instanceProps.rowMetadataMap;\n itemSize = props.rowHeight;\n lastMeasuredIndex = instanceProps.lastMeasuredRowIndex;\n }\n\n if (index > lastMeasuredIndex) {\n var offset = 0;\n\n if (lastMeasuredIndex >= 0) {\n var itemMetadata = itemMetadataMap[lastMeasuredIndex];\n offset = itemMetadata.offset + itemMetadata.size;\n }\n\n for (var i = lastMeasuredIndex + 1; i <= index; i++) {\n var size = itemSize(i);\n itemMetadataMap[i] = {\n offset: offset,\n size: size\n };\n offset += size;\n }\n\n if (itemType === 'column') {\n instanceProps.lastMeasuredColumnIndex = index;\n } else {\n instanceProps.lastMeasuredRowIndex = index;\n }\n }\n\n return itemMetadataMap[index];\n};\n\nvar findNearestItem = function findNearestItem(itemType, props, instanceProps, offset) {\n var itemMetadataMap, lastMeasuredIndex;\n\n if (itemType === 'column') {\n itemMetadataMap = instanceProps.columnMetadataMap;\n lastMeasuredIndex = instanceProps.lastMeasuredColumnIndex;\n } else {\n itemMetadataMap = instanceProps.rowMetadataMap;\n lastMeasuredIndex = instanceProps.lastMeasuredRowIndex;\n }\n\n var lastMeasuredItemOffset = lastMeasuredIndex > 0 ? itemMetadataMap[lastMeasuredIndex].offset : 0;\n\n if (lastMeasuredItemOffset >= offset) {\n // If we've already measured items within this range just use a binary search as it's faster.\n return findNearestItemBinarySearch(itemType, props, instanceProps, lastMeasuredIndex, 0, offset);\n } else {\n // If we haven't yet measured this high, fallback to an exponential search with an inner binary search.\n // The exponential search avoids pre-computing sizes for the full set of items as a binary search would.\n // The overall complexity for this approach is O(log n).\n return findNearestItemExponentialSearch(itemType, props, instanceProps, Math.max(0, lastMeasuredIndex), offset);\n }\n};\n\nvar findNearestItemBinarySearch = function findNearestItemBinarySearch(itemType, props, instanceProps, high, low, offset) {\n while (low <= high) {\n var middle = low + Math.floor((high - low) / 2);\n var currentOffset = getItemMetadata(itemType, props, middle, instanceProps).offset;\n\n if (currentOffset === offset) {\n return middle;\n } else if (currentOffset < offset) {\n low = middle + 1;\n } else if (currentOffset > offset) {\n high = middle - 1;\n }\n }\n\n if (low > 0) {\n return low - 1;\n } else {\n return 0;\n }\n};\n\nvar findNearestItemExponentialSearch = function findNearestItemExponentialSearch(itemType, props, instanceProps, index, offset) {\n var itemCount = itemType === 'column' ? props.columnCount : props.rowCount;\n var interval = 1;\n\n while (index < itemCount && getItemMetadata(itemType, props, index, instanceProps).offset < offset) {\n index += interval;\n interval *= 2;\n }\n\n return findNearestItemBinarySearch(itemType, props, instanceProps, Math.min(index, itemCount - 1), Math.floor(index / 2), offset);\n};\n\nvar getOffsetForIndexAndAlignment = function getOffsetForIndexAndAlignment(itemType, props, index, align, scrollOffset, instanceProps, scrollbarSize) {\n var size = itemType === 'column' ? props.width : props.height;\n var itemMetadata = getItemMetadata(itemType, props, index, instanceProps); // Get estimated total size after ItemMetadata is computed,\n // To ensure it reflects actual measurements instead of just estimates.\n\n var estimatedTotalSize = itemType === 'column' ? getEstimatedTotalWidth(props, instanceProps) : getEstimatedTotalHeight(props, instanceProps);\n var maxOffset = Math.max(0, Math.min(estimatedTotalSize - size, itemMetadata.offset));\n var minOffset = Math.max(0, itemMetadata.offset - size + scrollbarSize + itemMetadata.size);\n\n if (align === 'smart') {\n if (scrollOffset >= minOffset - size && scrollOffset <= maxOffset + size) {\n align = 'auto';\n } else {\n align = 'center';\n }\n }\n\n switch (align) {\n case 'start':\n return maxOffset;\n\n case 'end':\n return minOffset;\n\n case 'center':\n return Math.round(minOffset + (maxOffset - minOffset) / 2);\n\n case 'auto':\n default:\n if (scrollOffset >= minOffset && scrollOffset <= maxOffset) {\n return scrollOffset;\n } else if (minOffset > maxOffset) {\n // Because we only take into account the scrollbar size when calculating minOffset\n // this value can be larger than maxOffset when at the end of the list\n return minOffset;\n } else if (scrollOffset < minOffset) {\n return minOffset;\n } else {\n return maxOffset;\n }\n\n }\n};\n\nvar VariableSizeGrid =\n/*#__PURE__*/\ncreateGridComponent({\n getColumnOffset: function getColumnOffset(props, index, instanceProps) {\n return getItemMetadata('column', props, index, instanceProps).offset;\n },\n getColumnStartIndexForOffset: function getColumnStartIndexForOffset(props, scrollLeft, instanceProps) {\n return findNearestItem('column', props, instanceProps, scrollLeft);\n },\n getColumnStopIndexForStartIndex: function getColumnStopIndexForStartIndex(props, startIndex, scrollLeft, instanceProps) {\n var columnCount = props.columnCount,\n width = props.width;\n var itemMetadata = getItemMetadata('column', props, startIndex, instanceProps);\n var maxOffset = scrollLeft + width;\n var offset = itemMetadata.offset + itemMetadata.size;\n var stopIndex = startIndex;\n\n while (stopIndex < columnCount - 1 && offset < maxOffset) {\n stopIndex++;\n offset += getItemMetadata('column', props, stopIndex, instanceProps).size;\n }\n\n return stopIndex;\n },\n getColumnWidth: function getColumnWidth(props, index, instanceProps) {\n return instanceProps.columnMetadataMap[index].size;\n },\n getEstimatedTotalHeight: getEstimatedTotalHeight,\n getEstimatedTotalWidth: getEstimatedTotalWidth,\n getOffsetForColumnAndAlignment: function getOffsetForColumnAndAlignment(props, index, align, scrollOffset, instanceProps, scrollbarSize) {\n return getOffsetForIndexAndAlignment('column', props, index, align, scrollOffset, instanceProps, scrollbarSize);\n },\n getOffsetForRowAndAlignment: function getOffsetForRowAndAlignment(props, index, align, scrollOffset, instanceProps, scrollbarSize) {\n return getOffsetForIndexAndAlignment('row', props, index, align, scrollOffset, instanceProps, scrollbarSize);\n },\n getRowOffset: function getRowOffset(props, index, instanceProps) {\n return getItemMetadata('row', props, index, instanceProps).offset;\n },\n getRowHeight: function getRowHeight(props, index, instanceProps) {\n return instanceProps.rowMetadataMap[index].size;\n },\n getRowStartIndexForOffset: function getRowStartIndexForOffset(props, scrollTop, instanceProps) {\n return findNearestItem('row', props, instanceProps, scrollTop);\n },\n getRowStopIndexForStartIndex: function getRowStopIndexForStartIndex(props, startIndex, scrollTop, instanceProps) {\n var rowCount = props.rowCount,\n height = props.height;\n var itemMetadata = getItemMetadata('row', props, startIndex, instanceProps);\n var maxOffset = scrollTop + height;\n var offset = itemMetadata.offset + itemMetadata.size;\n var stopIndex = startIndex;\n\n while (stopIndex < rowCount - 1 && offset < maxOffset) {\n stopIndex++;\n offset += getItemMetadata('row', props, stopIndex, instanceProps).size;\n }\n\n return stopIndex;\n },\n initInstanceProps: function initInstanceProps(props, instance) {\n var _ref5 = props,\n estimatedColumnWidth = _ref5.estimatedColumnWidth,\n estimatedRowHeight = _ref5.estimatedRowHeight;\n var instanceProps = {\n columnMetadataMap: {},\n estimatedColumnWidth: estimatedColumnWidth || DEFAULT_ESTIMATED_ITEM_SIZE,\n estimatedRowHeight: estimatedRowHeight || DEFAULT_ESTIMATED_ITEM_SIZE,\n lastMeasuredColumnIndex: -1,\n lastMeasuredRowIndex: -1,\n rowMetadataMap: {}\n };\n\n instance.resetAfterColumnIndex = function (columnIndex, shouldForceUpdate) {\n if (shouldForceUpdate === void 0) {\n shouldForceUpdate = true;\n }\n\n instance.resetAfterIndices({\n columnIndex: columnIndex,\n shouldForceUpdate: shouldForceUpdate\n });\n };\n\n instance.resetAfterRowIndex = function (rowIndex, shouldForceUpdate) {\n if (shouldForceUpdate === void 0) {\n shouldForceUpdate = true;\n }\n\n instance.resetAfterIndices({\n rowIndex: rowIndex,\n shouldForceUpdate: shouldForceUpdate\n });\n };\n\n instance.resetAfterIndices = function (_ref6) {\n var columnIndex = _ref6.columnIndex,\n rowIndex = _ref6.rowIndex,\n _ref6$shouldForceUpda = _ref6.shouldForceUpdate,\n shouldForceUpdate = _ref6$shouldForceUpda === void 0 ? true : _ref6$shouldForceUpda;\n\n if (typeof columnIndex === 'number') {\n instanceProps.lastMeasuredColumnIndex = Math.min(instanceProps.lastMeasuredColumnIndex, columnIndex - 1);\n }\n\n if (typeof rowIndex === 'number') {\n instanceProps.lastMeasuredRowIndex = Math.min(instanceProps.lastMeasuredRowIndex, rowIndex - 1);\n } // We could potentially optimize further by only evicting styles after this index,\n // But since styles are only cached while scrolling is in progress-\n // It seems an unnecessary optimization.\n // It's unlikely that resetAfterIndex() will be called while a user is scrolling.\n\n\n instance._getItemStyleCache(-1);\n\n if (shouldForceUpdate) {\n instance.forceUpdate();\n }\n };\n\n return instanceProps;\n },\n shouldResetStyleCacheOnItemSizeChange: false,\n validateProps: function validateProps(_ref7) {\n var columnWidth = _ref7.columnWidth,\n rowHeight = _ref7.rowHeight;\n\n if (process.env.NODE_ENV !== 'production') {\n if (typeof columnWidth !== 'function') {\n throw Error('An invalid \"columnWidth\" prop has been specified. ' + 'Value should be a function. ' + (\"\\\"\" + (columnWidth === null ? 'null' : typeof columnWidth) + \"\\\" was specified.\"));\n } else if (typeof rowHeight !== 'function') {\n throw Error('An invalid \"rowHeight\" prop has been specified. ' + 'Value should be a function. ' + (\"\\\"\" + (rowHeight === null ? 'null' : typeof rowHeight) + \"\\\" was specified.\"));\n }\n }\n }\n});\nvar IS_SCROLLING_DEBOUNCE_INTERVAL$1 = 150;\n\nvar defaultItemKey$1 = function defaultItemKey(index, data) {\n return index;\n}; // In DEV mode, this Set helps us only log a warning once per component instance.\n// This avoids spamming the console every time a render happens.\n\n\nvar devWarningsDirection = null;\nvar devWarningsTagName$1 = null;\n\nif (process.env.NODE_ENV !== 'production') {\n if (typeof window !== 'undefined' && typeof window.WeakSet !== 'undefined') {\n devWarningsDirection =\n /*#__PURE__*/\n new WeakSet();\n devWarningsTagName$1 =\n /*#__PURE__*/\n new WeakSet();\n }\n}\n\nfunction createListComponent(_ref) {\n var _class, _temp;\n\n var getItemOffset = _ref.getItemOffset,\n getEstimatedTotalSize = _ref.getEstimatedTotalSize,\n getItemSize = _ref.getItemSize,\n getOffsetForIndexAndAlignment = _ref.getOffsetForIndexAndAlignment,\n getStartIndexForOffset = _ref.getStartIndexForOffset,\n getStopIndexForStartIndex = _ref.getStopIndexForStartIndex,\n initInstanceProps = _ref.initInstanceProps,\n shouldResetStyleCacheOnItemSizeChange = _ref.shouldResetStyleCacheOnItemSizeChange,\n validateProps = _ref.validateProps;\n return _temp = _class =\n /*#__PURE__*/\n function (_PureComponent) {\n _inheritsLoose(List, _PureComponent); // Always use explicit constructor for React components.\n // It produces less code after transpilation. (#26)\n // eslint-disable-next-line no-useless-constructor\n\n\n function List(props) {\n var _this;\n\n _this = _PureComponent.call(this, props) || this;\n _this._instanceProps = initInstanceProps(_this.props, _assertThisInitialized(_assertThisInitialized(_this)));\n _this._outerRef = void 0;\n _this._resetIsScrollingTimeoutId = null;\n _this.state = {\n instance: _assertThisInitialized(_assertThisInitialized(_this)),\n isScrolling: false,\n scrollDirection: 'forward',\n scrollOffset: typeof _this.props.initialScrollOffset === 'number' ? _this.props.initialScrollOffset : 0,\n scrollUpdateWasRequested: false\n };\n _this._callOnItemsRendered = void 0;\n _this._callOnItemsRendered = memoizeOne(function (overscanStartIndex, overscanStopIndex, visibleStartIndex, visibleStopIndex) {\n return _this.props.onItemsRendered({\n overscanStartIndex: overscanStartIndex,\n overscanStopIndex: overscanStopIndex,\n visibleStartIndex: visibleStartIndex,\n visibleStopIndex: visibleStopIndex\n });\n });\n _this._callOnScroll = void 0;\n _this._callOnScroll = memoizeOne(function (scrollDirection, scrollOffset, scrollUpdateWasRequested) {\n return _this.props.onScroll({\n scrollDirection: scrollDirection,\n scrollOffset: scrollOffset,\n scrollUpdateWasRequested: scrollUpdateWasRequested\n });\n });\n _this._getItemStyle = void 0;\n\n _this._getItemStyle = function (index) {\n var _this$props = _this.props,\n direction = _this$props.direction,\n itemSize = _this$props.itemSize,\n layout = _this$props.layout;\n\n var itemStyleCache = _this._getItemStyleCache(shouldResetStyleCacheOnItemSizeChange && itemSize, shouldResetStyleCacheOnItemSizeChange && layout, shouldResetStyleCacheOnItemSizeChange && direction);\n\n var style;\n\n if (itemStyleCache.hasOwnProperty(index)) {\n style = itemStyleCache[index];\n } else {\n var _offset = getItemOffset(_this.props, index, _this._instanceProps);\n\n var size = getItemSize(_this.props, index, _this._instanceProps); // TODO Deprecate direction \"horizontal\"\n\n var isHorizontal = direction === 'horizontal' || layout === 'horizontal';\n var isRtl = direction === 'rtl';\n var offsetHorizontal = isHorizontal ? _offset : 0;\n itemStyleCache[index] = style = {\n position: 'absolute',\n left: isRtl ? undefined : offsetHorizontal,\n right: isRtl ? offsetHorizontal : undefined,\n top: !isHorizontal ? _offset : 0,\n height: !isHorizontal ? size : '100%',\n width: isHorizontal ? size : '100%'\n };\n }\n\n return style;\n };\n\n _this._getItemStyleCache = void 0;\n _this._getItemStyleCache = memoizeOne(function (_, __, ___) {\n return {};\n });\n\n _this._onScrollHorizontal = function (event) {\n var _event$currentTarget = event.currentTarget,\n clientWidth = _event$currentTarget.clientWidth,\n scrollLeft = _event$currentTarget.scrollLeft,\n scrollWidth = _event$currentTarget.scrollWidth;\n\n _this.setState(function (prevState) {\n if (prevState.scrollOffset === scrollLeft) {\n // Scroll position may have been updated by cDM/cDU,\n // In which case we don't need to trigger another render,\n // And we don't want to update state.isScrolling.\n return null;\n }\n\n var direction = _this.props.direction;\n var scrollOffset = scrollLeft;\n\n if (direction === 'rtl') {\n // TRICKY According to the spec, scrollLeft should be negative for RTL aligned elements.\n // This is not the case for all browsers though (e.g. Chrome reports values as positive, measured relative to the left).\n // It's also easier for this component if we convert offsets to the same format as they would be in for ltr.\n // So the simplest solution is to determine which browser behavior we're dealing with, and convert based on it.\n switch (getRTLOffsetType()) {\n case 'negative':\n scrollOffset = -scrollLeft;\n break;\n\n case 'positive-descending':\n scrollOffset = scrollWidth - clientWidth - scrollLeft;\n break;\n }\n } // Prevent Safari's elastic scrolling from causing visual shaking when scrolling past bounds.\n\n\n scrollOffset = Math.max(0, Math.min(scrollOffset, scrollWidth - clientWidth));\n return {\n isScrolling: true,\n scrollDirection: prevState.scrollOffset < scrollLeft ? 'forward' : 'backward',\n scrollOffset: scrollOffset,\n scrollUpdateWasRequested: false\n };\n }, _this._resetIsScrollingDebounced);\n };\n\n _this._onScrollVertical = function (event) {\n var _event$currentTarget2 = event.currentTarget,\n clientHeight = _event$currentTarget2.clientHeight,\n scrollHeight = _event$currentTarget2.scrollHeight,\n scrollTop = _event$currentTarget2.scrollTop;\n\n _this.setState(function (prevState) {\n if (prevState.scrollOffset === scrollTop) {\n // Scroll position may have been updated by cDM/cDU,\n // In which case we don't need to trigger another render,\n // And we don't want to update state.isScrolling.\n return null;\n } // Prevent Safari's elastic scrolling from causing visual shaking when scrolling past bounds.\n\n\n var scrollOffset = Math.max(0, Math.min(scrollTop, scrollHeight - clientHeight));\n return {\n isScrolling: true,\n scrollDirection: prevState.scrollOffset < scrollOffset ? 'forward' : 'backward',\n scrollOffset: scrollOffset,\n scrollUpdateWasRequested: false\n };\n }, _this._resetIsScrollingDebounced);\n };\n\n _this._outerRefSetter = function (ref) {\n var outerRef = _this.props.outerRef;\n _this._outerRef = ref;\n\n if (typeof outerRef === 'function') {\n outerRef(ref);\n } else if (outerRef != null && typeof outerRef === 'object' && outerRef.hasOwnProperty('current')) {\n outerRef.current = ref;\n }\n };\n\n _this._resetIsScrollingDebounced = function () {\n if (_this._resetIsScrollingTimeoutId !== null) {\n cancelTimeout(_this._resetIsScrollingTimeoutId);\n }\n\n _this._resetIsScrollingTimeoutId = requestTimeout(_this._resetIsScrolling, IS_SCROLLING_DEBOUNCE_INTERVAL$1);\n };\n\n _this._resetIsScrolling = function () {\n _this._resetIsScrollingTimeoutId = null;\n\n _this.setState({\n isScrolling: false\n }, function () {\n // Clear style cache after state update has been committed.\n // This way we don't break pure sCU for items that don't use isScrolling param.\n _this._getItemStyleCache(-1, null);\n });\n };\n\n return _this;\n }\n\n List.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, prevState) {\n validateSharedProps$1(nextProps, prevState);\n validateProps(nextProps);\n return null;\n };\n\n var _proto = List.prototype;\n\n _proto.scrollTo = function scrollTo(scrollOffset) {\n scrollOffset = Math.max(0, scrollOffset);\n this.setState(function (prevState) {\n if (prevState.scrollOffset === scrollOffset) {\n return null;\n }\n\n return {\n scrollDirection: prevState.scrollOffset < scrollOffset ? 'forward' : 'backward',\n scrollOffset: scrollOffset,\n scrollUpdateWasRequested: true\n };\n }, this._resetIsScrollingDebounced);\n };\n\n _proto.scrollToItem = function scrollToItem(index, align) {\n if (align === void 0) {\n align = 'auto';\n }\n\n var itemCount = this.props.itemCount;\n var scrollOffset = this.state.scrollOffset;\n index = Math.max(0, Math.min(index, itemCount - 1));\n this.scrollTo(getOffsetForIndexAndAlignment(this.props, index, align, scrollOffset, this._instanceProps));\n };\n\n _proto.componentDidMount = function componentDidMount() {\n var _this$props2 = this.props,\n direction = _this$props2.direction,\n initialScrollOffset = _this$props2.initialScrollOffset,\n layout = _this$props2.layout;\n\n if (typeof initialScrollOffset === 'number' && this._outerRef != null) {\n var outerRef = this._outerRef; // TODO Deprecate direction \"horizontal\"\n\n if (direction === 'horizontal' || layout === 'horizontal') {\n outerRef.scrollLeft = initialScrollOffset;\n } else {\n outerRef.scrollTop = initialScrollOffset;\n }\n }\n\n this._callPropsCallbacks();\n };\n\n _proto.componentDidUpdate = function componentDidUpdate() {\n var _this$props3 = this.props,\n direction = _this$props3.direction,\n layout = _this$props3.layout;\n var _this$state = this.state,\n scrollOffset = _this$state.scrollOffset,\n scrollUpdateWasRequested = _this$state.scrollUpdateWasRequested;\n\n if (scrollUpdateWasRequested && this._outerRef != null) {\n var outerRef = this._outerRef; // TODO Deprecate direction \"horizontal\"\n\n if (direction === 'horizontal' || layout === 'horizontal') {\n if (direction === 'rtl') {\n // TRICKY According to the spec, scrollLeft should be negative for RTL aligned elements.\n // This is not the case for all browsers though (e.g. Chrome reports values as positive, measured relative to the left).\n // So we need to determine which browser behavior we're dealing with, and mimic it.\n switch (getRTLOffsetType()) {\n case 'negative':\n outerRef.scrollLeft = -scrollOffset;\n break;\n\n case 'positive-ascending':\n outerRef.scrollLeft = scrollOffset;\n break;\n\n default:\n var clientWidth = outerRef.clientWidth,\n scrollWidth = outerRef.scrollWidth;\n outerRef.scrollLeft = scrollWidth - clientWidth - scrollOffset;\n break;\n }\n } else {\n outerRef.scrollLeft = scrollOffset;\n }\n } else {\n outerRef.scrollTop = scrollOffset;\n }\n }\n\n this._callPropsCallbacks();\n };\n\n _proto.componentWillUnmount = function componentWillUnmount() {\n if (this._resetIsScrollingTimeoutId !== null) {\n cancelTimeout(this._resetIsScrollingTimeoutId);\n }\n };\n\n _proto.render = function render() {\n var _this$props4 = this.props,\n children = _this$props4.children,\n className = _this$props4.className,\n direction = _this$props4.direction,\n height = _this$props4.height,\n innerRef = _this$props4.innerRef,\n innerElementType = _this$props4.innerElementType,\n innerTagName = _this$props4.innerTagName,\n itemCount = _this$props4.itemCount,\n itemData = _this$props4.itemData,\n _this$props4$itemKey = _this$props4.itemKey,\n itemKey = _this$props4$itemKey === void 0 ? defaultItemKey$1 : _this$props4$itemKey,\n layout = _this$props4.layout,\n outerElementType = _this$props4.outerElementType,\n outerTagName = _this$props4.outerTagName,\n style = _this$props4.style,\n useIsScrolling = _this$props4.useIsScrolling,\n width = _this$props4.width;\n var isScrolling = this.state.isScrolling; // TODO Deprecate direction \"horizontal\"\n\n var isHorizontal = direction === 'horizontal' || layout === 'horizontal';\n var onScroll = isHorizontal ? this._onScrollHorizontal : this._onScrollVertical;\n\n var _this$_getRangeToRend = this._getRangeToRender(),\n startIndex = _this$_getRangeToRend[0],\n stopIndex = _this$_getRangeToRend[1];\n\n var items = [];\n\n if (itemCount > 0) {\n for (var _index = startIndex; _index <= stopIndex; _index++) {\n items.push(createElement(children, {\n data: itemData,\n key: itemKey(_index, itemData),\n index: _index,\n isScrolling: useIsScrolling ? isScrolling : undefined,\n style: this._getItemStyle(_index)\n }));\n }\n } // Read this value AFTER items have been created,\n // So their actual sizes (if variable) are taken into consideration.\n\n\n var estimatedTotalSize = getEstimatedTotalSize(this.props, this._instanceProps);\n return createElement(outerElementType || outerTagName || 'div', {\n className: className,\n onScroll: onScroll,\n ref: this._outerRefSetter,\n style: _extends({\n position: 'relative',\n height: height,\n width: width,\n overflow: 'auto',\n WebkitOverflowScrolling: 'touch',\n willChange: 'transform',\n direction: direction\n }, style)\n }, createElement(innerElementType || innerTagName || 'div', {\n children: items,\n ref: innerRef,\n style: {\n height: isHorizontal ? '100%' : estimatedTotalSize,\n pointerEvents: isScrolling ? 'none' : undefined,\n width: isHorizontal ? estimatedTotalSize : '100%'\n }\n }));\n };\n\n _proto._callPropsCallbacks = function _callPropsCallbacks() {\n if (typeof this.props.onItemsRendered === 'function') {\n var itemCount = this.props.itemCount;\n\n if (itemCount > 0) {\n var _this$_getRangeToRend2 = this._getRangeToRender(),\n _overscanStartIndex = _this$_getRangeToRend2[0],\n _overscanStopIndex = _this$_getRangeToRend2[1],\n _visibleStartIndex = _this$_getRangeToRend2[2],\n _visibleStopIndex = _this$_getRangeToRend2[3];\n\n this._callOnItemsRendered(_overscanStartIndex, _overscanStopIndex, _visibleStartIndex, _visibleStopIndex);\n }\n }\n\n if (typeof this.props.onScroll === 'function') {\n var _this$state2 = this.state,\n _scrollDirection = _this$state2.scrollDirection,\n _scrollOffset = _this$state2.scrollOffset,\n _scrollUpdateWasRequested = _this$state2.scrollUpdateWasRequested;\n\n this._callOnScroll(_scrollDirection, _scrollOffset, _scrollUpdateWasRequested);\n }\n }; // Lazily create and cache item styles while scrolling,\n // So that pure component sCU will prevent re-renders.\n // We maintain this cache, and pass a style prop rather than index,\n // So that List can clear cached styles and force item re-render if necessary.\n\n\n _proto._getRangeToRender = function _getRangeToRender() {\n var _this$props5 = this.props,\n itemCount = _this$props5.itemCount,\n overscanCount = _this$props5.overscanCount;\n var _this$state3 = this.state,\n isScrolling = _this$state3.isScrolling,\n scrollDirection = _this$state3.scrollDirection,\n scrollOffset = _this$state3.scrollOffset;\n\n if (itemCount === 0) {\n return [0, 0, 0, 0];\n }\n\n var startIndex = getStartIndexForOffset(this.props, scrollOffset, this._instanceProps);\n var stopIndex = getStopIndexForStartIndex(this.props, startIndex, scrollOffset, this._instanceProps); // Overscan by one item in each direction so that tab/focus works.\n // If there isn't at least one extra item, tab loops back around.\n\n var overscanBackward = !isScrolling || scrollDirection === 'backward' ? Math.max(1, overscanCount) : 1;\n var overscanForward = !isScrolling || scrollDirection === 'forward' ? Math.max(1, overscanCount) : 1;\n return [Math.max(0, startIndex - overscanBackward), Math.max(0, Math.min(itemCount - 1, stopIndex + overscanForward)), startIndex, stopIndex];\n };\n\n return List;\n }(PureComponent), _class.defaultProps = {\n direction: 'ltr',\n itemData: undefined,\n layout: 'vertical',\n overscanCount: 2,\n useIsScrolling: false\n }, _temp;\n} // NOTE: I considered further wrapping individual items with a pure ListItem component.\n// This would avoid ever calling the render function for the same index more than once,\n// But it would also add the overhead of a lot of components/fibers.\n// I assume people already do this (render function returning a class component),\n// So my doing it would just unnecessarily double the wrappers.\n\n\nvar validateSharedProps$1 = function validateSharedProps(_ref2, _ref3) {\n var children = _ref2.children,\n direction = _ref2.direction,\n height = _ref2.height,\n layout = _ref2.layout,\n innerTagName = _ref2.innerTagName,\n outerTagName = _ref2.outerTagName,\n width = _ref2.width;\n var instance = _ref3.instance;\n\n if (process.env.NODE_ENV !== 'production') {\n if (innerTagName != null || outerTagName != null) {\n if (devWarningsTagName$1 && !devWarningsTagName$1.has(instance)) {\n devWarningsTagName$1.add(instance);\n console.warn('The innerTagName and outerTagName props have been deprecated. ' + 'Please use the innerElementType and outerElementType props instead.');\n }\n } // TODO Deprecate direction \"horizontal\"\n\n\n var isHorizontal = direction === 'horizontal' || layout === 'horizontal';\n\n switch (direction) {\n case 'horizontal':\n case 'vertical':\n if (devWarningsDirection && !devWarningsDirection.has(instance)) {\n devWarningsDirection.add(instance);\n console.warn('The direction prop should be either \"ltr\" (default) or \"rtl\". ' + 'Please use the layout prop to specify \"vertical\" (default) or \"horizontal\" orientation.');\n }\n\n break;\n\n case 'ltr':\n case 'rtl':\n // Valid values\n break;\n\n default:\n throw Error('An invalid \"direction\" prop has been specified. ' + 'Value should be either \"ltr\" or \"rtl\". ' + (\"\\\"\" + direction + \"\\\" was specified.\"));\n }\n\n switch (layout) {\n case 'horizontal':\n case 'vertical':\n // Valid values\n break;\n\n default:\n throw Error('An invalid \"layout\" prop has been specified. ' + 'Value should be either \"horizontal\" or \"vertical\". ' + (\"\\\"\" + layout + \"\\\" was specified.\"));\n }\n\n if (children == null) {\n throw Error('An invalid \"children\" prop has been specified. ' + 'Value should be a React component. ' + (\"\\\"\" + (children === null ? 'null' : typeof children) + \"\\\" was specified.\"));\n }\n\n if (isHorizontal && typeof width !== 'number') {\n throw Error('An invalid \"width\" prop has been specified. ' + 'Horizontal lists must specify a number for width. ' + (\"\\\"\" + (width === null ? 'null' : typeof width) + \"\\\" was specified.\"));\n } else if (!isHorizontal && typeof height !== 'number') {\n throw Error('An invalid \"height\" prop has been specified. ' + 'Vertical lists must specify a number for height. ' + (\"\\\"\" + (height === null ? 'null' : typeof height) + \"\\\" was specified.\"));\n }\n }\n};\n\nvar DEFAULT_ESTIMATED_ITEM_SIZE$1 = 50;\n\nvar getItemMetadata$1 = function getItemMetadata(props, index, instanceProps) {\n var _ref = props,\n itemSize = _ref.itemSize;\n var itemMetadataMap = instanceProps.itemMetadataMap,\n lastMeasuredIndex = instanceProps.lastMeasuredIndex;\n\n if (index > lastMeasuredIndex) {\n var offset = 0;\n\n if (lastMeasuredIndex >= 0) {\n var itemMetadata = itemMetadataMap[lastMeasuredIndex];\n offset = itemMetadata.offset + itemMetadata.size;\n }\n\n for (var i = lastMeasuredIndex + 1; i <= index; i++) {\n var size = itemSize(i);\n itemMetadataMap[i] = {\n offset: offset,\n size: size\n };\n offset += size;\n }\n\n instanceProps.lastMeasuredIndex = index;\n }\n\n return itemMetadataMap[index];\n};\n\nvar findNearestItem$1 = function findNearestItem(props, instanceProps, offset) {\n var itemMetadataMap = instanceProps.itemMetadataMap,\n lastMeasuredIndex = instanceProps.lastMeasuredIndex;\n var lastMeasuredItemOffset = lastMeasuredIndex > 0 ? itemMetadataMap[lastMeasuredIndex].offset : 0;\n\n if (lastMeasuredItemOffset >= offset) {\n // If we've already measured items within this range just use a binary search as it's faster.\n return findNearestItemBinarySearch$1(props, instanceProps, lastMeasuredIndex, 0, offset);\n } else {\n // If we haven't yet measured this high, fallback to an exponential search with an inner binary search.\n // The exponential search avoids pre-computing sizes for the full set of items as a binary search would.\n // The overall complexity for this approach is O(log n).\n return findNearestItemExponentialSearch$1(props, instanceProps, Math.max(0, lastMeasuredIndex), offset);\n }\n};\n\nvar findNearestItemBinarySearch$1 = function findNearestItemBinarySearch(props, instanceProps, high, low, offset) {\n while (low <= high) {\n var middle = low + Math.floor((high - low) / 2);\n var currentOffset = getItemMetadata$1(props, middle, instanceProps).offset;\n\n if (currentOffset === offset) {\n return middle;\n } else if (currentOffset < offset) {\n low = middle + 1;\n } else if (currentOffset > offset) {\n high = middle - 1;\n }\n }\n\n if (low > 0) {\n return low - 1;\n } else {\n return 0;\n }\n};\n\nvar findNearestItemExponentialSearch$1 = function findNearestItemExponentialSearch(props, instanceProps, index, offset) {\n var itemCount = props.itemCount;\n var interval = 1;\n\n while (index < itemCount && getItemMetadata$1(props, index, instanceProps).offset < offset) {\n index += interval;\n interval *= 2;\n }\n\n return findNearestItemBinarySearch$1(props, instanceProps, Math.min(index, itemCount - 1), Math.floor(index / 2), offset);\n};\n\nvar getEstimatedTotalSize = function getEstimatedTotalSize(_ref2, _ref3) {\n var itemCount = _ref2.itemCount;\n var itemMetadataMap = _ref3.itemMetadataMap,\n estimatedItemSize = _ref3.estimatedItemSize,\n lastMeasuredIndex = _ref3.lastMeasuredIndex;\n var totalSizeOfMeasuredItems = 0; // Edge case check for when the number of items decreases while a scroll is in progress.\n // https://github.com/bvaughn/react-window/pull/138\n\n if (lastMeasuredIndex >= itemCount) {\n lastMeasuredIndex = itemCount - 1;\n }\n\n if (lastMeasuredIndex >= 0) {\n var itemMetadata = itemMetadataMap[lastMeasuredIndex];\n totalSizeOfMeasuredItems = itemMetadata.offset + itemMetadata.size;\n }\n\n var numUnmeasuredItems = itemCount - lastMeasuredIndex - 1;\n var totalSizeOfUnmeasuredItems = numUnmeasuredItems * estimatedItemSize;\n return totalSizeOfMeasuredItems + totalSizeOfUnmeasuredItems;\n};\n\nvar VariableSizeList =\n/*#__PURE__*/\ncreateListComponent({\n getItemOffset: function getItemOffset(props, index, instanceProps) {\n return getItemMetadata$1(props, index, instanceProps).offset;\n },\n getItemSize: function getItemSize(props, index, instanceProps) {\n return instanceProps.itemMetadataMap[index].size;\n },\n getEstimatedTotalSize: getEstimatedTotalSize,\n getOffsetForIndexAndAlignment: function getOffsetForIndexAndAlignment(props, index, align, scrollOffset, instanceProps) {\n var direction = props.direction,\n height = props.height,\n layout = props.layout,\n width = props.width; // TODO Deprecate direction \"horizontal\"\n\n var isHorizontal = direction === 'horizontal' || layout === 'horizontal';\n var size = isHorizontal ? width : height;\n var itemMetadata = getItemMetadata$1(props, index, instanceProps); // Get estimated total size after ItemMetadata is computed,\n // To ensure it reflects actual measurements instead of just estimates.\n\n var estimatedTotalSize = getEstimatedTotalSize(props, instanceProps);\n var maxOffset = Math.max(0, Math.min(estimatedTotalSize - size, itemMetadata.offset));\n var minOffset = Math.max(0, itemMetadata.offset - size + itemMetadata.size);\n\n if (align === 'smart') {\n if (scrollOffset >= minOffset - size && scrollOffset <= maxOffset + size) {\n align = 'auto';\n } else {\n align = 'center';\n }\n }\n\n switch (align) {\n case 'start':\n return maxOffset;\n\n case 'end':\n return minOffset;\n\n case 'center':\n return Math.round(minOffset + (maxOffset - minOffset) / 2);\n\n case 'auto':\n default:\n if (scrollOffset >= minOffset && scrollOffset <= maxOffset) {\n return scrollOffset;\n } else if (scrollOffset < minOffset) {\n return minOffset;\n } else {\n return maxOffset;\n }\n\n }\n },\n getStartIndexForOffset: function getStartIndexForOffset(props, offset, instanceProps) {\n return findNearestItem$1(props, instanceProps, offset);\n },\n getStopIndexForStartIndex: function getStopIndexForStartIndex(props, startIndex, scrollOffset, instanceProps) {\n var direction = props.direction,\n height = props.height,\n itemCount = props.itemCount,\n layout = props.layout,\n width = props.width; // TODO Deprecate direction \"horizontal\"\n\n var isHorizontal = direction === 'horizontal' || layout === 'horizontal';\n var size = isHorizontal ? width : height;\n var itemMetadata = getItemMetadata$1(props, startIndex, instanceProps);\n var maxOffset = scrollOffset + size;\n var offset = itemMetadata.offset + itemMetadata.size;\n var stopIndex = startIndex;\n\n while (stopIndex < itemCount - 1 && offset < maxOffset) {\n stopIndex++;\n offset += getItemMetadata$1(props, stopIndex, instanceProps).size;\n }\n\n return stopIndex;\n },\n initInstanceProps: function initInstanceProps(props, instance) {\n var _ref4 = props,\n estimatedItemSize = _ref4.estimatedItemSize;\n var instanceProps = {\n itemMetadataMap: {},\n estimatedItemSize: estimatedItemSize || DEFAULT_ESTIMATED_ITEM_SIZE$1,\n lastMeasuredIndex: -1\n };\n\n instance.resetAfterIndex = function (index, shouldForceUpdate) {\n if (shouldForceUpdate === void 0) {\n shouldForceUpdate = true;\n }\n\n instanceProps.lastMeasuredIndex = Math.min(instanceProps.lastMeasuredIndex, index - 1); // We could potentially optimize further by only evicting styles after this index,\n // But since styles are only cached while scrolling is in progress-\n // It seems an unnecessary optimization.\n // It's unlikely that resetAfterIndex() will be called while a user is scrolling.\n\n instance._getItemStyleCache(-1);\n\n if (shouldForceUpdate) {\n instance.forceUpdate();\n }\n };\n\n return instanceProps;\n },\n shouldResetStyleCacheOnItemSizeChange: false,\n validateProps: function validateProps(_ref5) {\n var itemSize = _ref5.itemSize;\n\n if (process.env.NODE_ENV !== 'production') {\n if (typeof itemSize !== 'function') {\n throw Error('An invalid \"itemSize\" prop has been specified. ' + 'Value should be a function. ' + (\"\\\"\" + (itemSize === null ? 'null' : typeof itemSize) + \"\\\" was specified.\"));\n }\n }\n }\n});\nvar FixedSizeGrid =\n/*#__PURE__*/\ncreateGridComponent({\n getColumnOffset: function getColumnOffset(_ref, index) {\n var columnWidth = _ref.columnWidth;\n return index * columnWidth;\n },\n getColumnWidth: function getColumnWidth(_ref2, index) {\n var columnWidth = _ref2.columnWidth;\n return columnWidth;\n },\n getRowOffset: function getRowOffset(_ref3, index) {\n var rowHeight = _ref3.rowHeight;\n return index * rowHeight;\n },\n getRowHeight: function getRowHeight(_ref4, index) {\n var rowHeight = _ref4.rowHeight;\n return rowHeight;\n },\n getEstimatedTotalHeight: function getEstimatedTotalHeight(_ref5) {\n var rowCount = _ref5.rowCount,\n rowHeight = _ref5.rowHeight;\n return rowHeight * rowCount;\n },\n getEstimatedTotalWidth: function getEstimatedTotalWidth(_ref6) {\n var columnCount = _ref6.columnCount,\n columnWidth = _ref6.columnWidth;\n return columnWidth * columnCount;\n },\n getOffsetForColumnAndAlignment: function getOffsetForColumnAndAlignment(_ref7, columnIndex, align, scrollLeft, instanceProps, scrollbarSize) {\n var columnCount = _ref7.columnCount,\n columnWidth = _ref7.columnWidth,\n width = _ref7.width;\n var lastColumnOffset = Math.max(0, columnCount * columnWidth - width);\n var maxOffset = Math.min(lastColumnOffset, columnIndex * columnWidth);\n var minOffset = Math.max(0, columnIndex * columnWidth - width + scrollbarSize + columnWidth);\n\n if (align === 'smart') {\n if (scrollLeft >= minOffset - width && scrollLeft <= maxOffset + width) {\n align = 'auto';\n } else {\n align = 'center';\n }\n }\n\n switch (align) {\n case 'start':\n return maxOffset;\n\n case 'end':\n return minOffset;\n\n case 'center':\n // \"Centered\" offset is usually the average of the min and max.\n // But near the edges of the list, this doesn't hold true.\n var middleOffset = Math.round(minOffset + (maxOffset - minOffset) / 2);\n\n if (middleOffset < Math.ceil(width / 2)) {\n return 0; // near the beginning\n } else if (middleOffset > lastColumnOffset + Math.floor(width / 2)) {\n return lastColumnOffset; // near the end\n } else {\n return middleOffset;\n }\n\n case 'auto':\n default:\n if (scrollLeft >= minOffset && scrollLeft <= maxOffset) {\n return scrollLeft;\n } else if (minOffset > maxOffset) {\n // Because we only take into account the scrollbar size when calculating minOffset\n // this value can be larger than maxOffset when at the end of the list\n return minOffset;\n } else if (scrollLeft < minOffset) {\n return minOffset;\n } else {\n return maxOffset;\n }\n\n }\n },\n getOffsetForRowAndAlignment: function getOffsetForRowAndAlignment(_ref8, rowIndex, align, scrollTop, instanceProps, scrollbarSize) {\n var rowHeight = _ref8.rowHeight,\n height = _ref8.height,\n rowCount = _ref8.rowCount;\n var lastRowOffset = Math.max(0, rowCount * rowHeight - height);\n var maxOffset = Math.min(lastRowOffset, rowIndex * rowHeight);\n var minOffset = Math.max(0, rowIndex * rowHeight - height + scrollbarSize + rowHeight);\n\n if (align === 'smart') {\n if (scrollTop >= minOffset - height && scrollTop <= maxOffset + height) {\n align = 'auto';\n } else {\n align = 'center';\n }\n }\n\n switch (align) {\n case 'start':\n return maxOffset;\n\n case 'end':\n return minOffset;\n\n case 'center':\n // \"Centered\" offset is usually the average of the min and max.\n // But near the edges of the list, this doesn't hold true.\n var middleOffset = Math.round(minOffset + (maxOffset - minOffset) / 2);\n\n if (middleOffset < Math.ceil(height / 2)) {\n return 0; // near the beginning\n } else if (middleOffset > lastRowOffset + Math.floor(height / 2)) {\n return lastRowOffset; // near the end\n } else {\n return middleOffset;\n }\n\n case 'auto':\n default:\n if (scrollTop >= minOffset && scrollTop <= maxOffset) {\n return scrollTop;\n } else if (minOffset > maxOffset) {\n // Because we only take into account the scrollbar size when calculating minOffset\n // this value can be larger than maxOffset when at the end of the list\n return minOffset;\n } else if (scrollTop < minOffset) {\n return minOffset;\n } else {\n return maxOffset;\n }\n\n }\n },\n getColumnStartIndexForOffset: function getColumnStartIndexForOffset(_ref9, scrollLeft) {\n var columnWidth = _ref9.columnWidth,\n columnCount = _ref9.columnCount;\n return Math.max(0, Math.min(columnCount - 1, Math.floor(scrollLeft / columnWidth)));\n },\n getColumnStopIndexForStartIndex: function getColumnStopIndexForStartIndex(_ref10, startIndex, scrollLeft) {\n var columnWidth = _ref10.columnWidth,\n columnCount = _ref10.columnCount,\n width = _ref10.width;\n var left = startIndex * columnWidth;\n var numVisibleColumns = Math.ceil((width + scrollLeft - left) / columnWidth);\n return Math.max(0, Math.min(columnCount - 1, startIndex + numVisibleColumns - 1 // -1 is because stop index is inclusive\n ));\n },\n getRowStartIndexForOffset: function getRowStartIndexForOffset(_ref11, scrollTop) {\n var rowHeight = _ref11.rowHeight,\n rowCount = _ref11.rowCount;\n return Math.max(0, Math.min(rowCount - 1, Math.floor(scrollTop / rowHeight)));\n },\n getRowStopIndexForStartIndex: function getRowStopIndexForStartIndex(_ref12, startIndex, scrollTop) {\n var rowHeight = _ref12.rowHeight,\n rowCount = _ref12.rowCount,\n height = _ref12.height;\n var top = startIndex * rowHeight;\n var numVisibleRows = Math.ceil((height + scrollTop - top) / rowHeight);\n return Math.max(0, Math.min(rowCount - 1, startIndex + numVisibleRows - 1 // -1 is because stop index is inclusive\n ));\n },\n initInstanceProps: function initInstanceProps(props) {// Noop\n },\n shouldResetStyleCacheOnItemSizeChange: true,\n validateProps: function validateProps(_ref13) {\n var columnWidth = _ref13.columnWidth,\n rowHeight = _ref13.rowHeight;\n\n if (process.env.NODE_ENV !== 'production') {\n if (typeof columnWidth !== 'number') {\n throw Error('An invalid \"columnWidth\" prop has been specified. ' + 'Value should be a number. ' + (\"\\\"\" + (columnWidth === null ? 'null' : typeof columnWidth) + \"\\\" was specified.\"));\n }\n\n if (typeof rowHeight !== 'number') {\n throw Error('An invalid \"rowHeight\" prop has been specified. ' + 'Value should be a number. ' + (\"\\\"\" + (rowHeight === null ? 'null' : typeof rowHeight) + \"\\\" was specified.\"));\n }\n }\n }\n});\nvar FixedSizeList =\n/*#__PURE__*/\ncreateListComponent({\n getItemOffset: function getItemOffset(_ref, index) {\n var itemSize = _ref.itemSize;\n return index * itemSize;\n },\n getItemSize: function getItemSize(_ref2, index) {\n var itemSize = _ref2.itemSize;\n return itemSize;\n },\n getEstimatedTotalSize: function getEstimatedTotalSize(_ref3) {\n var itemCount = _ref3.itemCount,\n itemSize = _ref3.itemSize;\n return itemSize * itemCount;\n },\n getOffsetForIndexAndAlignment: function getOffsetForIndexAndAlignment(_ref4, index, align, scrollOffset) {\n var direction = _ref4.direction,\n height = _ref4.height,\n itemCount = _ref4.itemCount,\n itemSize = _ref4.itemSize,\n layout = _ref4.layout,\n width = _ref4.width; // TODO Deprecate direction \"horizontal\"\n\n var isHorizontal = direction === 'horizontal' || layout === 'horizontal';\n var size = isHorizontal ? width : height;\n var lastItemOffset = Math.max(0, itemCount * itemSize - size);\n var maxOffset = Math.min(lastItemOffset, index * itemSize);\n var minOffset = Math.max(0, index * itemSize - size + itemSize);\n\n if (align === 'smart') {\n if (scrollOffset >= minOffset - size && scrollOffset <= maxOffset + size) {\n align = 'auto';\n } else {\n align = 'center';\n }\n }\n\n switch (align) {\n case 'start':\n return maxOffset;\n\n case 'end':\n return minOffset;\n\n case 'center':\n {\n // \"Centered\" offset is usually the average of the min and max.\n // But near the edges of the list, this doesn't hold true.\n var middleOffset = Math.round(minOffset + (maxOffset - minOffset) / 2);\n\n if (middleOffset < Math.ceil(size / 2)) {\n return 0; // near the beginning\n } else if (middleOffset > lastItemOffset + Math.floor(size / 2)) {\n return lastItemOffset; // near the end\n } else {\n return middleOffset;\n }\n }\n\n case 'auto':\n default:\n if (scrollOffset >= minOffset && scrollOffset <= maxOffset) {\n return scrollOffset;\n } else if (scrollOffset < minOffset) {\n return minOffset;\n } else {\n return maxOffset;\n }\n\n }\n },\n getStartIndexForOffset: function getStartIndexForOffset(_ref5, offset) {\n var itemCount = _ref5.itemCount,\n itemSize = _ref5.itemSize;\n return Math.max(0, Math.min(itemCount - 1, Math.floor(offset / itemSize)));\n },\n getStopIndexForStartIndex: function getStopIndexForStartIndex(_ref6, startIndex, scrollOffset) {\n var direction = _ref6.direction,\n height = _ref6.height,\n itemCount = _ref6.itemCount,\n itemSize = _ref6.itemSize,\n layout = _ref6.layout,\n width = _ref6.width; // TODO Deprecate direction \"horizontal\"\n\n var isHorizontal = direction === 'horizontal' || layout === 'horizontal';\n var offset = startIndex * itemSize;\n var size = isHorizontal ? width : height;\n var numVisibleItems = Math.ceil((size + scrollOffset - offset) / itemSize);\n return Math.max(0, Math.min(itemCount - 1, startIndex + numVisibleItems - 1 // -1 is because stop index is inclusive\n ));\n },\n initInstanceProps: function initInstanceProps(props) {// Noop\n },\n shouldResetStyleCacheOnItemSizeChange: true,\n validateProps: function validateProps(_ref7) {\n var itemSize = _ref7.itemSize;\n\n if (process.env.NODE_ENV !== 'production') {\n if (typeof itemSize !== 'number') {\n throw Error('An invalid \"itemSize\" prop has been specified. ' + 'Value should be a number. ' + (\"\\\"\" + (itemSize === null ? 'null' : typeof itemSize) + \"\\\" was specified.\"));\n }\n }\n }\n}); // Pulled from react-compat\n// https://github.com/developit/preact-compat/blob/7c5de00e7c85e2ffd011bf3af02899b63f699d3a/src/index.js#L349\n\nfunction shallowDiffers(prev, next) {\n for (var attribute in prev) {\n if (!(attribute in next)) {\n return true;\n }\n }\n\n for (var _attribute in next) {\n if (prev[_attribute] !== next[_attribute]) {\n return true;\n }\n }\n\n return false;\n} // It knows to compare individual style props and ignore the wrapper object.\n// See https://reactjs.org/docs/react-api.html#reactmemo\n\n\nfunction areEqual(prevProps, nextProps) {\n var prevStyle = prevProps.style,\n prevRest = _objectWithoutPropertiesLoose(prevProps, [\"style\"]);\n\n var nextStyle = nextProps.style,\n nextRest = _objectWithoutPropertiesLoose(nextProps, [\"style\"]);\n\n return !shallowDiffers(prevStyle, nextStyle) && !shallowDiffers(prevRest, nextRest);\n} // It knows to compare individual style props and ignore the wrapper object.\n// See https://reactjs.org/docs/react-component.html#shouldcomponentupdate\n\n\nfunction shouldComponentUpdate(nextProps, nextState) {\n return !areEqual(this.props, nextProps) || shallowDiffers(this.state, nextState);\n}\n\nexport { VariableSizeGrid, VariableSizeList, FixedSizeGrid, FixedSizeList, areEqual, shouldComponentUpdate };","import { useState, useCallback, useLayoutEffect } from \"react\";\n\nfunction getDimensionObject(node) {\n var rect = node.getBoundingClientRect();\n return {\n width: rect.width,\n height: rect.height,\n top: \"x\" in rect ? rect.x : rect.top,\n left: \"y\" in rect ? rect.y : rect.left,\n x: \"x\" in rect ? rect.x : rect.left,\n y: \"y\" in rect ? rect.y : rect.top,\n right: rect.right,\n bottom: rect.bottom\n };\n}\n\nfunction useDimensions() {\n var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},\n _ref$liveMeasure = _ref.liveMeasure,\n liveMeasure = _ref$liveMeasure === undefined ? true : _ref$liveMeasure;\n\n var _useState = useState({}),\n dimensions = _useState[0],\n setDimensions = _useState[1];\n\n var _useState2 = useState(null),\n node = _useState2[0],\n setNode = _useState2[1];\n\n var ref = useCallback(function (node) {\n setNode(node);\n }, []);\n useLayoutEffect(function () {\n if (node) {\n var measure = function measure() {\n return window.requestAnimationFrame(function () {\n return setDimensions(getDimensionObject(node));\n });\n };\n\n measure();\n\n if (liveMeasure) {\n window.addEventListener(\"resize\", measure);\n window.addEventListener(\"scroll\", measure);\n return function () {\n window.removeEventListener(\"resize\", measure);\n window.removeEventListener(\"scroll\", measure);\n };\n }\n }\n }, [node]);\n return [ref, dimensions, node];\n}\n\nexport default useDimensions;","import React, { memo } from 'react'\r\nimport PropTypes from 'prop-types'\r\n\r\nimport { FaSearch, FaRegTimesCircle } from 'react-icons/fa'\r\nimport { Flex } from 'components/Grid'\r\n\r\nimport styled, { themeGet } from 'util/style'\r\n\r\nexport const Wrapper = styled.div`\r\n background-color: ${themeGet('colors.grey.200')};\r\n padding: 0.5rem 1rem;\r\n margin-top: 0.25rem;\r\n`\r\n\r\nexport const InnerWrapper = styled(Flex).attrs({\r\n alignItems: 'center',\r\n flexWrap: 'nowrap',\r\n})`\r\n padding: 0.25rem 0.5rem;\r\n border-radius: 0.25rem;\r\n background: #fff;\r\n border: none;\r\n color: ${themeGet('colors.grey.600')};\r\n`\r\n\r\nexport const SearchIcon = styled(FaSearch).attrs({\r\n size: '1rem',\r\n})`\r\n width: 1rem;\r\n height: 1rem;\r\n`\r\n\r\nexport const ClearIcon = styled(FaRegTimesCircle).attrs({\r\n size: '1rem',\r\n})`\r\n width: 1rem;\r\n height: 1rem;\r\n cursor: pointer;\r\n\r\n visibility: ${({ visibility }) => visibility};\r\n\r\n &:hover {\r\n color: ${themeGet('colors.grey.800')};\r\n }\r\n`\r\n\r\nexport const Input = styled.input`\r\n flex: 1 1 auto;\r\n font-size: 0.8rem;\r\n outline: none;\r\n border: none;\r\n padding: 0.1em 0.5em;\r\n color: ${themeGet('colors.grey.600')};\r\n\r\n &:active,\r\n &:focus {\r\n color: ${themeGet('colors.grey.800')};\r\n }\r\n`\r\n\r\nconst SearchBar = ({ value, placeholder, onChange }) => {\r\n const handleChange = ({ target: { value: newValue } }) => {\r\n onChange(newValue)\r\n }\r\n\r\n const handleClear = () => {\r\n onChange('')\r\n }\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n )\r\n}\r\n\r\nSearchBar.propTypes = {\r\n value: PropTypes.string.isRequired,\r\n placeholder: PropTypes.string,\r\n onChange: PropTypes.func.isRequired,\r\n}\r\n\r\nSearchBar.defaultProps = {\r\n placeholder: '',\r\n}\r\n\r\n// only rerender on value change\r\nexport default memo(\r\n SearchBar,\r\n ({ value: prevValue }, { value: nextValue }) => prevValue === nextValue\r\n)\r\n","import React, { memo } from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport { Text } from 'rebass'\r\n\r\nimport styled, { themeGet } from 'util/style'\r\n\r\nexport const Wrapper = styled(Text).attrs({\r\n textAlign: ['left', 'right'],\r\n})`\r\n color: ${themeGet('colors.grey.600')};\r\n font-size: 0.8rem;\r\n /* padding: 0 1rem; */\r\n line-height: 1.2;\r\n`\r\n\r\nexport const Option = styled.span`\r\n cursor: pointer;\r\n font-weight: bold;\r\n margin-left: 0.5em;\r\n\r\n color: ${({ active }) =>\r\n active ? themeGet('colors.highlight.500') : 'inherit'};\r\n\r\n &:not(:first-child) {\r\n padding-left: 0.5em;\r\n border-left: 1px solid ${themeGet('colors.grey.400')};\r\n }\r\n`\r\n\r\nconst SortBar = ({ index, options, onChange }) => (\r\n \r\n sort:\r\n {options.map(({ label }, idx) => (\r\n \r\n ))}\r\n \r\n)\r\n\r\nSortBar.propTypes = {\r\n index: PropTypes.number.isRequired,\r\n options: PropTypes.arrayOf(\r\n PropTypes.shape({\r\n label: PropTypes.string.isRequired,\r\n })\r\n ).isRequired,\r\n onChange: PropTypes.func.isRequired,\r\n}\r\n\r\n// only rerender on index change\r\nexport default memo(\r\n SortBar,\r\n ({ index: prevIndex }, { index: nextIndex }) => prevIndex === nextIndex\r\n)\r\n","import React, { memo } from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport { Text } from 'rebass'\r\n\r\nimport { Columns, Column } from 'components/Grid'\r\nimport styled, { themeGet, theme } from 'util/style'\r\nimport { formatNumber } from 'util/format'\r\nimport { stateNames, estuaryTypes } from '../../../config/constants'\r\n\r\nconst Wrapper = styled(Text).attrs({\r\n fontSize: ['0.9rem', '0.8rem', '0.9rem'],\r\n})`\r\n line-height: 1.2;\r\n padding: 0.5rem 1rem;\r\n cursor: pointer;\r\n\r\n color: ${themeGet('colors.grey.600')};\r\n font-weight: 100;\r\n\r\n &:hover {\r\n background-color: ${theme.colors.primary[100]}50;\r\n }\r\n\r\n &:not(:first-child) {\r\n border-top: 1px solid ${themeGet('colors.grey.100')};\r\n padding-top: 0.5rem;\r\n }\r\n`\r\n\r\nconst Name = styled.div`\r\n color: ${themeGet('colors.primary.500')};\r\n font-size: 1rem;\r\n font-weight: normal;\r\n`\r\n\r\nconst ListItem = ({ name, type, state, acres, ...props }) => (\r\n \r\n \r\n \r\n {name}\r\n {stateNames[state] || ''}\r\n \r\n \r\n \r\n {estuaryTypes[type].label}\r\n
({formatNumber(acres, 0)} acres)\r\n
\r\n
\r\n
\r\n
\r\n)\r\n\r\nListItem.propTypes = {\r\n id: PropTypes.number.isRequired,\r\n name: PropTypes.string.isRequired,\r\n type: PropTypes.number.isRequired,\r\n state: PropTypes.string.isRequired,\r\n acres: PropTypes.number.isRequired,\r\n}\r\n\r\n// only rerender on ID change\r\nexport default memo(\r\n ListItem,\r\n ({ id: prevID }, { id: nextID }) => nextID === prevID\r\n)\r\n","import React, { useState, useRef, useContext } from 'react'\r\nimport PropTypes from 'prop-types'\r\nimport { Map } from 'immutable'\r\nimport { FixedSizeList as List } from 'react-window'\r\nimport useDimensions from 'react-use-dimensions'\r\n\r\nimport {\r\n Context as CrossfilterContext,\r\n SET_FILTER,\r\n} from 'components/Crossfilter'\r\nimport { Box, Flex, Columns, Column } from 'components/Grid'\r\nimport styled, { themeGet } from 'util/style'\r\nimport SearchBar from './SearchBar'\r\nimport SortBar from './SortBar'\r\nimport ListItem from './ListItem'\r\n\r\nconst sortOptions = [\r\n {\r\n label: 'name',\r\n sortFunc: (a, b) => (a.get('name') > b.get('name') ? 1 : -1),\r\n },\r\n { label: 'size', sortFunc: (a, b) => b.get('acres') - a.get('acres') },\r\n { label: 'north to south', sortFunc: (a, b) => b.get('lat') - a.get('lat') },\r\n]\r\n\r\nexport const Wrapper = styled(Flex).attrs({\r\n flex: '1 1 auto',\r\n flexDirection: 'column',\r\n})``\r\n\r\nexport const Count = styled.span`\r\n color: ${themeGet('colors.grey.600')};\r\n font-size: 0.8em;\r\n line-height: 1.2;\r\n`\r\n\r\nexport const ListWrapper = styled.div`\r\n flex: 1 1 auto;\r\n`\r\n\r\nexport const NoResults = styled(Box)`\r\n color: ${themeGet('colors.grey.600')};\r\n margin-top: 2rem;\r\n text-align: center;\r\n`\r\n\r\nconst EstuariesList = ({ onSelect }) => {\r\n const { state, dispatch: filterDispatch } = useContext(CrossfilterContext)\r\n\r\n const listRef = useRef(null)\r\n const [listWrapperRef, { height: listHeight }] = useDimensions()\r\n const [sortIdx, setSortIdx] = useState(2) // default: north to south\r\n\r\n const handleQueryChange = value => {\r\n filterDispatch({\r\n type: SET_FILTER,\r\n payload: {\r\n field: 'name',\r\n filterValue: value,\r\n },\r\n })\r\n }\r\n\r\n const handleSortChange = idx => {\r\n if (idx === sortIdx) return\r\n\r\n setSortIdx(idx)\r\n\r\n // reset list to top\r\n if (listRef.current) {\r\n listRef.current.scrollTo(0)\r\n }\r\n }\r\n\r\n const data = state.get('data')\r\n const sortedData = data.sort(sortOptions[sortIdx].sortFunc)\r\n\r\n return (\r\n \r\n \r\n \r\n {data.size} currently visible\r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n\r\n {data.size > 0 ? (\r\n \r\n {listHeight ? (\r\n items[i].id}\r\n >\r\n {({ index, data: listData, style }) => {\r\n const item = listData[index]\r\n return (\r\n onSelect(item.id)}\r\n {...item}\r\n style={style}\r\n />\r\n )\r\n }}\r\n \r\n ) : null}\r\n \r\n ) : (\r\n No visible estuaries...\r\n )}\r\n \r\n )\r\n}\r\n\r\nEstuariesList.propTypes = {\r\n onSelect: PropTypes.func.isRequired,\r\n}\r\n\r\nexport default EstuariesList\r\n","import React, { useState, useRef } from 'react'\r\nimport { List } from 'immutable'\r\n\r\nimport { useData } from 'components/Data'\r\nimport {\r\n Provider as CrossfilterProvider,\r\n FilteredMap,\r\n} from 'components/Crossfilter'\r\nimport Layout from 'components/Layout'\r\nimport SEO from 'components/SEO'\r\nimport { Flex } from 'components/Grid'\r\nimport Sidebar, { SidebarHeader } from 'components/Sidebar'\r\nimport ExpandableParagraph from 'components/elements/ExpandableParagraph'\r\nimport EstuariesList from 'components/EstuariesList'\r\nimport EstuaryDetails from 'components/EstuaryDetails'\r\nimport styled, { themeGet } from 'util/style'\r\nimport { PNWBounds } from '../../config/constants'\r\nimport { filters } from '../../config/filters'\r\n\r\nconst Wrapper = styled(Flex)`\r\n height: 100%;\r\n`\r\n\r\nconst Help = styled(ExpandableParagraph)`\r\n font-size: 0.8rem;\r\n margin: 0 1rem 1rem;\r\n color: ${themeGet('colors.grey.700')};\r\n`\r\n\r\nconst Explore = () => {\r\n const [data, index] = useData()\r\n const [selectedId, setSelectedId] = useState(null)\r\n const [bounds, setBounds] = useState(List(PNWBounds))\r\n const [location, setLocation] = useState(null)\r\n\r\n const handleSelect = id => {\r\n console.log('onSelect', id)\r\n setSelectedId(() => id)\r\n }\r\n\r\n const handleSelectFromList = id => {\r\n const record = index.get(id.toString())\r\n setLocation(() => [record.get('lon'), record.get('lat')])\r\n handleSelect(id)\r\n }\r\n\r\n const handleZoomTo = () => {\r\n setBounds(() => index.get(selectedId.toString()).get('bounds'))\r\n }\r\n\r\n const handleBack = () => {\r\n setSelectedId(null)\r\n }\r\n\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n {selectedId !== null ? (\r\n \r\n ) : (\r\n <>\r\n \r\n \r\n Click on an estuary in the list below or in the map for more\r\n detailed information. Estuary boundaries will show on the map\r\n when you have zoomed far enough in. This list only shows\r\n estuaries visible in the map.\r\n \r\n \r\n \r\n )}\r\n \r\n \r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default Explore\r\n"],"sourceRoot":""}