react-shareable-buttons/dist/types.d.ts

Social media share buttons and share counts for React and Nextjs.

import { Ref, CSSProperties } from 'react';

//=============LINK TYPES



// Email Link: TYPE
type EmailLinkParams = {
  body?: string
  separator?: string
  subject?: string
}
// Facebook Link: TYPE
type FacebookLinkParams = { quote?: string; hashtag?: string }
// Facebook Messenger Link: TYPE
type FacebookMessengerLinkParams = {
  appId: string
  redirectUri?: string
  to?: string
}
// Gab Link: TYPE
type GapLinkParams = { title?: string }
// Hatena Link: TYPE
type HatenaLinkParams = { title?: string }
// InstaPaper Link: TYPE
type InstaPaperLinkParams = { title?: string; description?: string }
// Line Link: TYPE
type LineLinkParams = { title?: string }
// Linkedin Link: TYPE
type LinkedInLinkParams = {
  title?: string
  summary?: string
  source?: string
}
// LiveJournal Link: TYPE
type LiveJournalLinkParams = { title?: string; description?: string }
// Mailru Link: TYPE
type MailruLinkParams = {
  title?: string
  description?: string
  imageUrl?: string
}
// Pinterest Link: TYPE
type PinterestLinkParams = { media: string; description?: string }
// Pocket Link: TYPE
type PocketLinkParams = { title?: string }
// Reddit Link: TYPE
type RedditLinkParams = { title?: string }
// Telegram Link: TYPE
type TelegramLinkParams = { title?: string }
// Tumblr Link: TYPE
type TumblrLinkParams = {
  title?: string
  caption?: string
  tags?: string
  posttype?: 'link' | string
}
// Twitter Link: TYPE
type TwitterLinkParams = {
  title?: string
  via?: string
  hashtags?: string[]
  related?: string[]
}
// Viber Link: TYPE
type ViberLinkParams = { title?: string; separator?: string }
// VK Link: TYPE
type VKShareLinkParams = {
  title?: string
  image?: string
  noParse?: boolean
  noVkLinks?: boolean
}
// Weibo Link: TYPE
type WeiboShareLinkParams = { title?: string; image?: string }
// WhatsApp Link: TYPE
type WhatsAppLinkParams = { title?: string; separator?: string }
// Workplace Link: TYPE
type WorkplaceLinkParams = {
  quote?: string
  hashtag?: string
}

//======= HOC TYPES
type SocialMediaShareCountProps =
  React.HTMLAttributes<HTMLSpanElement> & {
    children?: (shareCount: number) => React.ReactNode
    getCount: (
      url: string,
      callback: (shareCount?: number) => void,
      appId?: string,
      appSecret?: string,
    ) => void
    url: string
    appId?: string
    appSecret?: string
  }

type StateTypes = {
  count?: number
  isLoading: boolean
}

//======= ICON TYPES
type SocialIcon = {
  color: string
  name: string
  path: string
}

type SocialIcons = {
  [key: string]: SocialIcon
}

//======= SOCIAL SHARE TYPES

type NetworkLink<LinkOptions> = (
  url: string,
  options: LinkOptions,
) => string

type WindowPosition = 'windowCenter' | 'screenCenter'

type CustomProps<LinkOptions> = {
  buttonTitle?: string
  /**
   * Disables click action and adds `disabled` class
   */
  disabled?: boolean
  /**
   * Style when button is disabled
   * @default { opacity: 0.6 }
   */
  disabledStyle?: React.CSSProperties
  forwardedRef?: Ref<HTMLButtonElement>
  networkName: string
  networkLink: NetworkLink<LinkOptions>
  onClick?: (event: React.MouseEvent<HTMLButtonElement>, link: string) => void
  openShareDialogOnClick?: boolean
  opts: LinkOptions
  /**
   * URL of the shared page
   */
  url: string
  style?: React.CSSProperties
  windowWidth?: number
  windowHeight?: number
  windowPosition?: WindowPosition
  /**
   *  Takes a function that returns a Promise to be fulfilled before calling
   * `onClick`. If you do not return promise, `onClick` is called immediately.
   */
  beforeOnClick?: () => Promise<void> | void
  /**
   * Takes a function to be called after closing share dialog.
   */
  onShareWindowClose?: () => void
  resetButtonStyle?: boolean
  blankTarget?: boolean
  size?: number
  round?: boolean
  borderRadius?: number
  iconStyle?: CSSProperties
  iconFillColor?: string
  bgColor?: string
}

type IconProps = {
  network: string
  color?: React.CSSProperties['color']
  background?: React.CSSProperties['backgroundColor']
  round?: boolean
  size?: number
  borderRadius?: React.CSSProperties['borderRadius']
}

export type { CustomProps, EmailLinkParams, FacebookLinkParams, FacebookMessengerLinkParams, GapLinkParams, HatenaLinkParams, IconProps, InstaPaperLinkParams, LineLinkParams, LinkedInLinkParams, LiveJournalLinkParams, MailruLinkParams, NetworkLink, PinterestLinkParams, PocketLinkParams, RedditLinkParams, SocialIcon, SocialIcons, SocialMediaShareCountProps, StateTypes, TelegramLinkParams, TumblrLinkParams, TwitterLinkParams, VKShareLinkParams, ViberLinkParams, WeiboShareLinkParams, WhatsAppLinkParams, WindowPosition, WorkplaceLinkParams };