tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

TextNode.js (2215B)


      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  createElement,
      9  createRef,
     10  Fragment,
     11  PureComponent,
     12 } = require("resource://devtools/client/shared/vendor/react.mjs");
     13 const dom = require("resource://devtools/client/shared/vendor/react-dom-factories.js");
     14 const PropTypes = require("resource://devtools/client/shared/vendor/react-prop-types.mjs");
     15 const {
     16  editableItem,
     17 } = require("resource://devtools/client/shared/inplace-editor.js");
     18 
     19 const {
     20  getStr,
     21  getFormatStr,
     22 } = require("resource://devtools/client/inspector/markup/utils/l10n.js");
     23 
     24 class TextNode extends PureComponent {
     25  static get propTypes() {
     26    return {
     27      showTextEditor: PropTypes.func.isRequired,
     28      type: PropTypes.string.isRequired,
     29      value: PropTypes.string.isRequired,
     30    };
     31  }
     32 
     33  constructor(props) {
     34    super(props);
     35 
     36    this.state = {
     37      value: this.props.value,
     38    };
     39 
     40    this.valuePreRef = createRef();
     41  }
     42 
     43  componentDidMount() {
     44    editableItem(
     45      {
     46        element: this.valuePreRef.current,
     47        trigger: "dblclick",
     48      },
     49      element => {
     50        this.props.showTextEditor(element);
     51      }
     52    );
     53  }
     54 
     55  render() {
     56    const { value } = this.state;
     57    const isComment = this.props.type === "comment";
     58    const isWhiteSpace = !/[^\s]/.exec(value);
     59 
     60    return createElement(
     61      Fragment,
     62      null,
     63      isComment ? dom.span({}, "<!--") : null,
     64      dom.pre(
     65        {
     66          className: isWhiteSpace ? "whitespace" : "",
     67          ref: this.valuePreRef,
     68          style: {
     69            display: "inline-block",
     70            whiteSpace: "normal",
     71          },
     72          tabIndex: -1,
     73          title: isWhiteSpace
     74            ? getFormatStr(
     75                "markupView.whitespaceOnly",
     76                value.replace(/\n/g, "⏎").replace(/\t/g, "⇥").replace(/ /g, "◦")
     77              )
     78            : "",
     79          "data-label": getStr("markupView.whitespaceOnly.label"),
     80        },
     81        value
     82      ),
     83      isComment ? dom.span({}, "-->") : null
     84    );
     85  }
     86 }
     87 
     88 module.exports = TextNode;