TickLabels.js (1138B)
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 PureComponent, 9 } = require("resource://devtools/client/shared/vendor/react.mjs"); 10 const PropTypes = require("resource://devtools/client/shared/vendor/react-prop-types.mjs"); 11 const dom = require("resource://devtools/client/shared/vendor/react-dom-factories.js"); 12 13 /** 14 * This component is intended to show tick labels on the header. 15 */ 16 class TickLabels extends PureComponent { 17 static get propTypes() { 18 return { 19 ticks: PropTypes.array.isRequired, 20 }; 21 } 22 23 render() { 24 const { ticks } = this.props; 25 26 return dom.div( 27 { 28 className: "tick-labels", 29 }, 30 ticks.map(tick => 31 dom.div( 32 { 33 className: "tick-label", 34 style: { 35 marginInlineStart: `${tick.position}%`, 36 maxWidth: `${tick.width}px`, 37 }, 38 }, 39 tick.label 40 ) 41 ) 42 ); 43 } 44 } 45 46 module.exports = TickLabels;