Social Links

The Social component can create "share links" for a wide variety of social networks. It works through specially formatted urls available for each network, so it does not require heavy third party embeds.

<div>
  <p>
    Pass in a supported social network (listed below), a 
    link to share, and a message that will be the default 
    post.
  </p> 
  <p>
    <Social 
      type={Social.types.FACEBOOK} 
      url="http://revelry.co" 
      message="Sharing via a text link!"
    >
      Share via Facebook
    </Social>
  </p>
  <p>
    <Social 
      type={Social.types.TWITTER} 
      url="http://revelry.co" 
      message="Sharing via a text link!"
    >
      Share via Twitter
    </Social>
  </p>           
  <p>
    <Social 
      type={Social.types.BUFFER} 
      url="http://revelry.co" 
      message="Sharing via a text link!"
    >
      Share via Buffer
    </Social>
  </p>
  <p>
    <Social 
      type={Social.types.DIGG} 
      url="http://revelry.co" 
      message="Sharing via a text link!"
    >
      Share via Digg
    </Social>
  </p>
  <p>
    <Social 
      type={Social.types.EMAIL} 
      url="http://revelry.co" 
      message="Sharing via a text link!"
    >
      Share via email
    </Social>
  </p>
</div>

<div>
  <p>
    Pass in a supported social network (listed below), a 
    link to share, and a message that will be the default 
    post.
  </p> 
  <p>
    <Social 
      type={Social.types.FACEBOOK} 
      url="http://revelry.co" 
      message="Sharing via a text link!"
    >
      Share via Facebook
    </Social>
  </p>
  <p>
    <Social 
      type={Social.types.TWITTER} 
      url="http://revelry.co" 
      message="Sharing via a text link!"
    >
      Share via Twitter
    </Social>
  </p>           
  <p>
    <Social 
      type={Social.types.BUFFER} 
      url="http://revelry.co" 
      message="Sharing via a text link!"
    >
      Share via Buffer
    </Social>
  </p>
  <p>
    <Social 
      type={Social.types.DIGG} 
      url="http://revelry.co" 
      message="Sharing via a text link!"
    >
      Share via Digg
    </Social>
  </p>
  <p>
    <Social 
      type={Social.types.EMAIL} 
      url="http://revelry.co" 
      message="Sharing via a text link!"
    >
      Share via email
    </Social>
  </p>
</div>

<div>
  <p>
    Pass an icon or image as a child and the link will 
    wrap it.
  </p>
  <p>
    <Social 
      type={Social.types.FACEBOOK} 
      url="http://revelry.co" 
      message="Sharing via a clickable icon!"
    >
      <Icon className="stat" i="like" />
    </Social>
  </p>
  <p>
    Add a <code>componentClass={'{Button}'}</code>
    prop and the link will render as a button.
  </p>
  <p>
    <Social 
      type={Social.types.TWITTER} 
      url="http://revelry.co" 
      message="Sharing via a button!" 
      componentClass={Button}
    >
      Share on Twitter!
    </Social>
  </p>
</div>

<div>
  <p>
    Pass an icon or image as a child and the link will 
    wrap it.
  </p>
  <p>
    <Social 
      type={Social.types.FACEBOOK} 
      url="http://revelry.co" 
      message="Sharing via a clickable icon!"
    >
      <Icon className="stat" i="like" />
    </Social>
  </p>
  <p>
    Add a <code>componentClass={'{Button}'}</code>
    prop and the link will render as a button.
  </p>
  <p>
    <Social 
      type={Social.types.TWITTER} 
      url="http://revelry.co" 
      message="Sharing via a button!" 
      componentClass={Button}
    >
      Share on Twitter!
    </Social>
  </p>
</div>