ꦫꦣꦺꦤ꧀ꦄꦤ꧀ꦠꦱꦺꦤ

PATH: home / letacommog / morandas1 / wp-content / plugins / envato-elements / src / js / react / components

import React, { Component } from "react"

import styles from "./ProjectName.module.css"
import { modal } from "../util/modal"
import { config } from "../util/config"

export default class ProjectName extends Component {
  constructor(props) {
    super(props)
    this.iconRef = null
    this.txt = null
    this.state = {
      projectNameEdit: false,
      projectName: config.get("elements_project"),
    }
  }

updateProjectName = (e) => {
    const { projectName } = this.state
    if (projectName !== this.txt.innerText) {
      this.setState({ projectName: this.txt.innerText })
      if (this.iconRef) {
        this.iconRef.className = "dashicons dashicons-update"
      }
      if (this.txt.innerText.length > 0) {
        config.persist("elements_project", this.txt.innerText).then(
          () => {
            if (this.iconRef) {
              this.iconRef.className = "dashicons dashicons-yes"
            }
          },
          () => {},
        )
      }
    }
  }

shouldComponentUpdate(nextProps, nextState, nextContext) {
    // Otherwise our contentEditable div looses its location input
    return false
  }

editProjectName = () => {
    this.txt.focus()
    document.execCommand("selectAll", false, null)
  }

render() {
    const { projectName } = this.state

return (
      <span className={styles.wrap}>
        <span
          className={styles.projectNameView}
          contentEditable
          onInput={this.updateProjectName}
          onBlur={this.updateProjectName}
          onKeyPress={(e) => {
            const keycode = e.charCode || e.keyCode
            if (keycode === 13) {
              e.preventDefault()
              return false
            }
          }}
          ref={(txt) => {
            this.txt = txt
          }}
          dangerouslySetInnerHTML={{ __html: projectName }}
        />
        <button type="text" onClick={this.editProjectName} className={styles.projectNameButton}>
          <span
            ref={(icon) => {
              this.iconRef = icon
            }}
            className="dashicons dashicons-edit"
          />
        </button>
      </span>
    )
  }
}

ProjectName.propTypes = {}

[+] ..
[+] LibraryResultsElementor
[-] LibrarySearchElementor.jsx [edit]
[-] LibraryResultsLayout.module.css [edit]
[-] Photos.jsx [edit]
[-] LibraryResultsElementorBlocks.module.css [edit]
[-] ElementorBlocks.module.css [edit]
[-] LibrarySearchBeaverBuilder.jsx [edit]
[-] LibraryHeader.module.css [edit]
[-] BeaverBuilder.jsx [edit]
[-] LibrarySearchElementorFilters.jsx [edit]
[-] Global.jsx [edit]
[-] LibraryResultsElementorLayout.jsx [edit]
[-] LoadingSpinner.jsx [edit]
[-] LibraryResultsPhotos.jsx [edit]
[-] LibraryResultsBeaverBuilder.module.css [edit]
[-] Settings.module.css [edit]
[-] ElementorBlocks.jsx [edit]
[-] Importer.jsx [edit]
[-] LibraryResultsElementorBlocks.jsx [edit]
[-] LibrarySearch.module.css [edit]
[-] LibraryResultsBeaverBuilder.jsx [edit]
[-] LicenseButton.jsx [edit]
[-] LibraryResults.jsx [edit]
[-] Importer.module.css [edit]
[-] Settings.jsx [edit]
[-] Inserter.jsx [edit]
[-] LibraryResultsLayout.jsx [edit]
[-] Elementor.module.css [edit]
[-] Photos.module.css [edit]
[-] ProjectName.jsx [edit]
[-] LoadingSpinner.module.css [edit]
[-] LibrarySearchElementorBlocks.jsx [edit]
[-] LibraryHeader.jsx [edit]
[-] Inserter.module.css [edit]
[-] ProjectName.module.css [edit]
[-] LibrarySearchPhotos.jsx [edit]
[-] Global.module.css [edit]
[-] Header.jsx [edit]
[-] LibraryResultsRows.module.css [edit]
[-] Home.jsx [edit]
[-] Elementor.jsx [edit]
[-] LibrarySearch.jsx [edit]
[-] LibraryResults.module.css [edit]
[-] LibraryResultsRows.jsx [edit]
[-] LibraryResultsPhotos.module.css [edit]
[-] Header.module.css [edit]
[-] LicenseButton.module.css [edit]