@fortawesome/free-regular-svg-icons#faCopy TypeScript Examples

The following examples show how to use @fortawesome/free-regular-svg-icons#faCopy. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: HashDisp.tsx    From devex with GNU General Public License v3.0 6 votes vote down vote up 
HashDisp: React.FC<IProps> = ({ hash }) => {

  const [showToast, setShowToast] = useState(false)

  return (
    <>
      {showToast &&
        <CustomToast setShowToast={setShowToast} isSuccess bodyText='Copied' />
      }
      <div className='d-flex'>
        <h6 className='mono mr-2'>
          {hash}
        </h6>
        <div
          onClick={() => {
            navigator.clipboard.writeText(hash)
            setShowToast(true)
          }}
          className='disp-btn'>
          <FontAwesomeIcon size='sm' icon={faCopy} />
        </div>
      </div>
    </>
  )
}
Example #2
Source File: CodeBlock.tsx    From website-docs with MIT License 6 votes vote down vote up 
CodeBlock = (props: { html: string; content: string }) => {
  const { html, content } = props
  const [isCopied, setIscopied] = useState(false)

  const handleButtonsContent = (e: any) => {
    if (isCopied) {
      return
    }
    setIscopied(true)
    setTimeout(() => {
      setIscopied(false)
    }, 2000)
  }

  const handleBtnClick = (e: any) => {
    handleButtonsContent(e)
    copy(content)
  }

  return (
    <>
      <div
        className={styles.codeContent}
        dangerouslySetInnerHTML={{ __html: html }}></div>
      <button
        className={clsx('button', 'is-small', styles.copyBtn)}
        onClick={handleBtnClick}>
        <span className="icon is-small">
          {isCopied ? (
            <FontAwesomeIcon icon={faCheck} />
          ) : (
            <FontAwesomeIcon icon={faCopy} />
          )}
        </span>
      </button>
    </>
  )
}
Example #3
Source File: AddressDisp.tsx    From devex with GNU General Public License v3.0 5 votes vote down vote up 
AddressDisp: React.FC<IProps> = ({ addr, isLinked }) => {

  const [showToast, setShowToast] = useState(false)
  const [addrPair, setAddrPair] = useState<string[] | null>(null) // [bech32, hex]
  const [toggle, setToggle] = useState(0)

  useEffect(() => {
    if (isValidAddr(addr)) {
      if (validation.isBech32(addr))
        setAddrPair([addr, fromBech32Address(addr).toLowerCase()])
      else {
        try {
          setAddrPair([toBech32Address(addr), addr])
        }
        catch(e) {
          //Ignore the catch
        }
      }
    }
  }, [addr])

  return (
    addrPair &&
    <>
      {showToast &&
        <CustomToast setShowToast={setShowToast} isSuccess bodyText='Copied' />
      }
      <div className='d-flex'>
        <h6 className='mr-2 mono'>
          {isLinked
            ? <QueryPreservingLink to={`/address/${addrPair[toggle]}`}>
              {addrPair[toggle]}
            </QueryPreservingLink>
            : addrPair[toggle]
          }
        </h6>
        <div
          onClick={() => {
            setToggle((prevToggle) => prevToggle === 0 ? 1 : 0)
          }}
          className='mr-2 disp-btn'>
          <FontAwesomeIcon size='sm' icon={faRetweet} />
        </div>
        <div
          onClick={() => {
            navigator.clipboard.writeText(addrPair[toggle])
            setShowToast(true)
          }}
          className='disp-btn'>
          <FontAwesomeIcon size='sm' icon={faCopy} />
        </div>
      </div>
    </>
  )
}
Example #4
Source File: manager.ts    From obsidian-admonition with MIT License 5 votes vote down vote up 
/** Load Font Awesome Library */
library.add(fas, far, fab, faCopy);