FlexItemList.js (1796B)
1 /* This Source Code Form is subject to the terms of the Mozilla Public 2 * License, v. 2.0. If a copy of the MPL was not distributed with this 3 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ 4 5 "use strict"; 6 7 const { 8 createFactory, 9 PureComponent, 10 } = require("resource://devtools/client/shared/vendor/react.mjs"); 11 const dom = require("resource://devtools/client/shared/vendor/react-dom-factories.js"); 12 const PropTypes = require("resource://devtools/client/shared/vendor/react-prop-types.mjs"); 13 const { 14 getStr, 15 } = require("resource://devtools/client/inspector/layout/utils/l10n.js"); 16 17 const FlexItem = createFactory( 18 require("resource://devtools/client/inspector/flexbox/components/FlexItem.js") 19 ); 20 21 const Types = require("resource://devtools/client/inspector/flexbox/types.js"); 22 23 class FlexItemList extends PureComponent { 24 static get propTypes() { 25 return { 26 dispatch: PropTypes.func.isRequired, 27 flexItems: PropTypes.arrayOf(PropTypes.shape(Types.flexItem)).isRequired, 28 scrollToTop: PropTypes.func.isRequired, 29 setSelectedNode: PropTypes.func.isRequired, 30 }; 31 } 32 33 render() { 34 const { dispatch, flexItems, scrollToTop, setSelectedNode } = this.props; 35 36 return dom.div( 37 { className: "flex-item-list" }, 38 dom.div( 39 { 40 className: "flex-item-list-header", 41 role: "heading", 42 "aria-level": "3", 43 }, 44 !flexItems.length 45 ? getStr("flexbox.noFlexItems") 46 : getStr("flexbox.flexItems") 47 ), 48 flexItems.map((flexItem, index) => 49 FlexItem({ 50 key: flexItem.actorID, 51 dispatch, 52 flexItem, 53 index: index + 1, 54 scrollToTop, 55 setSelectedNode, 56 }) 57 ) 58 ); 59 } 60 } 61 62 module.exports = FlexItemList;