react-share/dist/index.d.cts

Social media share buttons for React.

import { CSSProperties } from 'react';
import { default as default_2 } from 'react';
import { ForwardRefExoticComponent } from 'react';
import { JSX } from 'react/jsx-runtime';
import { RefAttributes } from 'react';
import { SVGProps } from 'react';

export declare function BlueskyIcon(props: RawIconProps): JSX.Element;

export declare function BlueskyLegacyIcon(props: LegacyIconProps): JSX.Element;

declare function blueskyLink(url: string, { text, separator }: {
    text?: string;
    separator?: string;
}): string;

export declare const BlueskyShareButton: ForwardRefExoticComponent<Omit<ShareButtonProps<{
text?: string;
separator?: string;
}>, "title"> & {
separator?: string;
text?: string;
} & RefAttributes<HTMLButtonElement>>;

export declare const buildBlueskyShareUrl: typeof blueskyLink;

export declare const buildEmailShareUrl: typeof emailLink;

export declare const buildFacebookMessengerShareUrl: typeof facebookMessengerLink;

export declare const buildFacebookShareUrl: typeof facebookLink;

export declare const buildFarcasterShareUrl: typeof farcasterLink;

export declare const buildGabShareUrl: typeof gabLink;

export declare const buildHatenaShareUrl: typeof hatenaLink;

export declare const buildInstapaperShareUrl: typeof instapaperLink;

export declare const buildLineShareUrl: typeof lineLink;

export declare const buildLinkedinShareUrl: typeof linkedinLink;

export declare const buildLivejournalShareUrl: typeof livejournalLink;

export declare const buildMailruShareUrl: typeof mailruLink;

export declare const buildOKShareUrl: typeof okLink;

export declare const buildPinterestShareUrl: typeof pinterestLink;

export declare const buildRedditShareUrl: typeof redditLink;

export declare const buildTelegramShareUrl: typeof telegramLink;

export declare const buildThreadsShareUrl: typeof threadsLink;

export declare const buildTumblrShareUrl: typeof tumblrLink;

export declare const buildViberShareUrl: typeof viberLink;

export declare const buildVKShareUrl: typeof vkLink;

export declare const buildWeiboShareUrl: typeof weiboLink;

export declare const buildWhatsappShareUrl: typeof whatsappLink;

export declare const buildXShareUrl: typeof xLink;

export declare function canNativeShare(data?: NativeShareData): boolean;

export declare function EmailIcon(props: RawIconProps): JSX.Element;

export declare function EmailLegacyIcon(props: LegacyIconProps): JSX.Element;

declare function emailLink(url: string, { subject, body, separator, to }: Options): string;

export declare const EmailShareButton: ForwardRefExoticComponent<Omit<ShareButtonProps<Options>, "onClick" | "openShareDialogOnClick" | "openInNewTab"> & Options & RefAttributes<HTMLButtonElement>>;

export declare function FacebookIcon(props: RawIconProps): JSX.Element;

export declare function FacebookLegacyIcon(props: LegacyIconProps): JSX.Element;

declare function facebookLink(url: string, { hashtag }: {
    hashtag?: string;
}): string;

export declare function FacebookMessengerIcon(props: RawIconProps): JSX.Element;

export declare function FacebookMessengerLegacyIcon(props: LegacyIconProps): JSX.Element;

declare function facebookMessengerLink(url: string, { appId, redirectUri, to }: Options_2): string;

export declare const FacebookMessengerShareButton: ForwardRefExoticComponent<ShareButtonProps<Options_2> & Options_2 & RefAttributes<HTMLButtonElement>>;

export declare const FacebookShareButton: ForwardRefExoticComponent<ShareButtonProps<{
hashtag?: string;
}> & {
hashtag?: string;
} & RefAttributes<HTMLButtonElement>>;

export declare function FarcasterIcon(props: RawIconProps): JSX.Element;

export declare function FarcasterLegacyIcon(props: LegacyIconProps): JSX.Element;

declare function farcasterLink(url: string, { channelKey, parentCastHash, text }: FarcasterOptions): string;

declare type FarcasterOptions = {
    channelKey?: string;
    parentCastHash?: string;
    text?: string;
};

export declare const FarcasterShareButton: ForwardRefExoticComponent<Omit<ShareButtonProps<FarcasterOptions>, "title"> & FarcasterOptions & RefAttributes<HTMLButtonElement>>;

export declare function GabIcon(props: RawIconProps): JSX.Element;

export declare function GabLegacyIcon(props: LegacyIconProps): JSX.Element;

declare function gabLink(url: string, { text }: {
    text?: string;
}): string;

export declare const GabShareButton: ForwardRefExoticComponent<Omit<ShareButtonProps<{
text?: string;
}>, "title"> & {
text?: string;
} & RefAttributes<HTMLButtonElement>>;

export declare function HatenaIcon(props: RawIconProps): JSX.Element;

export declare function HatenaLegacyIcon(props: LegacyIconProps): JSX.Element;

declare function hatenaLink(url: string, { shareTitle }: {
    shareTitle?: string;
}): string;

export declare const HatenaShareButton: ForwardRefExoticComponent<Omit<ShareButtonProps<{
shareTitle?: string;
}>, "title"> & {
shareTitle?: string;
} & RefAttributes<HTMLButtonElement>>;

declare type IconSvgProps = Omit<SVGProps<SVGSVGElement>, 'width' | 'height'>;

export declare function InstapaperIcon(props: RawIconProps): JSX.Element;

export declare function InstapaperLegacyIcon(props: LegacyIconProps): JSX.Element;

declare function instapaperLink(url: string, { shareTitle, description }: {
    shareTitle?: string;
    description?: string;
}): string;

export declare const InstapaperShareButton: ForwardRefExoticComponent<Omit<ShareButtonProps<{
shareTitle?: string;
description?: string;
}>, "title"> & {
description?: string;
shareTitle?: string;
} & RefAttributes<HTMLButtonElement>>;

declare type LegacyIconProps = IconSvgProps & {
    bgStyle?: CSSProperties;
    borderRadius?: number;
    iconFillColor?: string;
    round?: boolean;
    size?: number | string;
};

export declare function LineIcon(props: RawIconProps): JSX.Element;

export declare function LineLegacyIcon(props: LegacyIconProps): JSX.Element;

declare function lineLink(url: string, { text }: {
    text?: string;
}): string;

export declare const LineShareButton: ForwardRefExoticComponent<Omit<ShareButtonProps<{
text?: string;
}>, "title"> & {
text?: string;
} & RefAttributes<HTMLButtonElement>>;

declare type LinkBehavior = 'popup' | 'navigate';

export declare function LinkedinIcon(props: RawIconProps): JSX.Element;

export declare function LinkedinLegacyIcon(props: LegacyIconProps): JSX.Element;

declare function linkedinLink(url: string): string;

export declare const LinkedinShareButton: ForwardRefExoticComponent<LinkedinShareButtonProps & RefAttributes<HTMLButtonElement>>;

declare type LinkedinShareButtonProps = Omit<ShareButtonProps<Options_3>, 'title'>;

export declare function LivejournalIcon(props: RawIconProps): JSX.Element;

export declare function LivejournalLegacyIcon(props: LegacyIconProps): JSX.Element;

declare function livejournalLink(url: string, { shareTitle, description }: {
    shareTitle?: string;
    description?: string;
}): string;

export declare const LivejournalShareButton: ForwardRefExoticComponent<Omit<ShareButtonProps<{
shareTitle?: string;
description?: string;
}>, "title"> & {
description?: string;
shareTitle?: string;
} & RefAttributes<HTMLButtonElement>>;

export declare function MailruIcon(props: RawIconProps): JSX.Element;

export declare function MailruLegacyIcon(props: LegacyIconProps): JSX.Element;

declare function mailruLink(url: string, { shareTitle, description, imageUrl, }: {
    shareTitle?: string;
    description?: string;
    imageUrl?: string;
}): string;

export declare const MailruShareButton: ForwardRefExoticComponent<Omit<ShareButtonProps<{
shareTitle?: string;
description?: string;
imageUrl?: string;
}>, "title"> & {
description?: string;
imageUrl?: string;
shareTitle?: string;
} & RefAttributes<HTMLButtonElement>>;

declare type MobileBehavior = 'web' | 'app' | 'auto';

declare type NativeButtonProps = Omit<default_2.ButtonHTMLAttributes<HTMLButtonElement>, 'onClick'>;

declare type NativeButtonProps_2 = Omit<default_2.ButtonHTMLAttributes<HTMLButtonElement>, 'title'>;

export declare const NativeShareButton: default_2.ForwardRefExoticComponent<NativeButtonProps_2 & NativeShareData & {
    beforeOnClick?: () => Promise<void> | void;
    children: default_2.ReactNode;
    disabled?: boolean;
    disabledStyle?: default_2.CSSProperties;
    htmlTitle?: HTMLButtonElement["title"];
    resetButtonStyle?: boolean;
} & default_2.RefAttributes<HTMLButtonElement>>;

export declare type NativeShareData = Pick<ShareData, 'files' | 'text' | 'title' | 'url'>;

export declare function NativeShareIcon(props: RawIconProps): JSX.Element;

export declare function NativeShareLegacyIcon(props: LegacyIconProps): JSX.Element;

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

export declare function OKIcon(props: RawIconProps): JSX.Element;

export declare function OKLegacyIcon(props: LegacyIconProps): JSX.Element;

declare function okLink(url: string, { shareTitle, description, image }: {
    shareTitle?: string;
    description?: string;
    image?: string;
}): string;

export declare const OKShareButton: ForwardRefExoticComponent<Omit<ShareButtonProps<{
shareTitle?: string;
description?: string;
image?: string;
}>, "title"> & {
description?: string;
image?: string;
shareTitle?: string;
} & RefAttributes<HTMLButtonElement>>;

export declare function openShareWindow(url: string, { height, newTab, onClose, position, width, }?: ShareWindowOptions): Window | null;

declare type Options = {
    body?: string;
    separator?: string;
    subject?: string;
    /** Recipient address, or several addresses. */
    to?: string | string[];
};

declare type Options_2 = {
    /** Your app's unique identifier. */
    appId: string;
    /** Best-effort mobile strategy. `app` and `auto` prefer a Messenger deep link. */
    mobileBehavior?: MobileBehavior;
    /** The URL to redirect to after a person clicks a button on the dialog.
     * Required when using URL redirection. */
    redirectUri?: string;
    /** A user ID of a recipient. Once the dialog comes up, the sender can
     * specify additional people as recipients. */
    to?: string;
};

declare type Options_3 = Record<string, never>;

declare type Options_4 = {
    postTitle?: string;
    caption?: string;
    /** The post content for post types other than `link`, such as the quote text or photo URL. */
    content?: string;
    posttype?: TumblrPostType;
};

declare type Options_5 = {
    shareTitle?: string;
    image?: string;
    noParse?: boolean;
    noVkLinks?: boolean;
};

export declare function PinterestIcon(props: RawIconProps): JSX.Element;

export declare function PinterestLegacyIcon(props: LegacyIconProps): JSX.Element;

declare function pinterestLink(url: string, { media, description, pinId }: PinterestShareProps): string;

export declare const PinterestShareButton: ForwardRefExoticComponent<ShareButtonProps<PinterestShareProps> & PinterestShareProps & RefAttributes<HTMLButtonElement>>;

declare type PinterestShareProps = {
    media: string;
    description?: string;
    pinId?: string;
};

declare interface Props<LinkOptions> extends NativeButtonProps {
    /**
     *  Takes a function that returns a Promise to be fulfilled before calling
     * `onClick`. If you do not return promise, `onClick` is called immediately.
     * When a Promise is returned, the share popup opens immediately and loads the
     * share URL once the Promise resolves. Rejecting the Promise cancels sharing
     * and closes the popup.
     */
    beforeOnClick?: () => Promise<void> | void;
    children: default_2.ReactNode;
    className?: string;
    /** Disables click action and adds `disabled` class */
    disabled?: boolean;
    /**
     * Style when button is disabled
     * @default { opacity: 0.6 }
     */
    disabledStyle?: default_2.CSSProperties;
    forwardedRef?: default_2.Ref<HTMLButtonElement>;
    /**
     * Passes as the native `title` attribute for the `button` element.
     * This uses `htmlTitle` instead of `title` so it does not collide with
     * share payload props exposed by the button components.
     */
    htmlTitle?: HTMLButtonElement['title'];
    linkBehavior?: LinkBehavior;
    networkName: string;
    networkLink: NetworkLink<LinkOptions>;
    onClick?: (event: default_2.MouseEvent<HTMLButtonElement>, link: string) => void;
    /**
     * Takes a function to be called after closing share dialog.
     */
    onShareWindowClose?: () => void;
    /**
     * Takes a function to be called with the opened share window, or `null`
     * when a popup blocker prevented it from opening.
     */
    onShareWindowOpen?: (shareWindow: Window | null) => void;
    openShareDialogOnClick?: boolean;
    /**
     * Opens the share page in a regular browser tab instead of a popup window.
     * `windowWidth`, `windowHeight`, and `windowPosition` are ignored in that case.
     * @default false
     */
    openInNewTab?: boolean;
    opts: LinkOptions;
    resetButtonStyle?: boolean;
    /**
     * URL of the shared page
     */
    url: string;
    style?: default_2.CSSProperties;
    windowWidth?: number;
    windowHeight?: number;
    windowPosition?: WindowPosition;
}

declare type RawIconProps = Omit<SVGProps<SVGSVGElement>, 'width' | 'height'> & {
    size?: number | string;
};

export declare function RedditIcon(props: RawIconProps): JSX.Element;

export declare function RedditLegacyIcon(props: LegacyIconProps): JSX.Element;

declare function redditLink(url: string, { shareTitle }: {
    shareTitle?: string;
}): string;

export declare const RedditShareButton: ForwardRefExoticComponent<Omit<ShareButtonProps<{
shareTitle?: string;
}>, "title"> & {
shareTitle?: string;
} & RefAttributes<HTMLButtonElement>>;

declare type ShareButtonProps<LinkOptions extends Record<string, unknown>> = Omit<Props<LinkOptions>, 'forwardedRef' | 'linkBehavior' | 'networkLink' | 'networkName' | 'opts'>;

export declare function shareNative(data: NativeShareData): Promise<void>;

export declare type ShareWindowOptions = {
    height?: number;
    /** Open a regular browser tab instead of a sized popup window. */
    newTab?: boolean;
    onClose?: (dialog: Window | null) => void;
    position?: WindowPosition;
    width?: number;
};

export declare function TelegramIcon(props: RawIconProps): JSX.Element;

export declare function TelegramLegacyIcon(props: LegacyIconProps): JSX.Element;

declare function telegramLink(url: string, { text }: {
    text?: string;
}): string;

export declare const TelegramShareButton: ForwardRefExoticComponent<Omit<ShareButtonProps<{
text?: string;
}>, "title"> & {
mobileBehavior?: MobileBehavior;
text?: string;
} & RefAttributes<HTMLButtonElement>>;

export declare function ThreadsIcon(props: RawIconProps): JSX.Element;

export declare function ThreadsLegacyIcon(props: LegacyIconProps): JSX.Element;

declare function threadsLink(url: string, { text }: {
    text?: string;
}): string;

export declare const ThreadsShareButton: ForwardRefExoticComponent<Omit<ShareButtonProps<{
text?: string;
}>, "title"> & {
text?: string;
} & RefAttributes<HTMLButtonElement>>;

export declare function TumblrIcon(props: RawIconProps): JSX.Element;

export declare function TumblrLegacyIcon(props: LegacyIconProps): JSX.Element;

declare function tumblrLink(url: string, { postTitle, caption, tags, posttype, content, }: {
    postTitle?: string;
    caption?: string;
    tags?: string;
    posttype?: TumblrPostType;
    content?: string;
}): string;

declare type TumblrPostType = 'link' | 'text' | 'quote' | 'photo' | 'chat' | 'video' | (string & {});

export declare const TumblrShareButton: ForwardRefExoticComponent<Omit<ShareButtonProps<Options_4 & {
tags: string;
}>, "title"> & Options_4 & {
tags?: string[];
} & RefAttributes<HTMLButtonElement>>;

export declare function ViberIcon(props: RawIconProps): JSX.Element;

export declare function ViberLegacyIcon(props: LegacyIconProps): JSX.Element;

declare function viberLink(url: string, { message, separator }: {
    message?: string;
    separator?: string;
}): string;

export declare const ViberShareButton: ForwardRefExoticComponent<Omit<ShareButtonProps<{
message?: string;
separator?: string;
}>, "title"> & {
message?: string;
mobileBehavior?: MobileBehavior;
separator?: string;
} & RefAttributes<HTMLButtonElement>>;

export declare function VKIcon(props: RawIconProps): JSX.Element;

export declare function VKLegacyIcon(props: LegacyIconProps): JSX.Element;

declare function vkLink(url: string, { shareTitle, image, noParse, noVkLinks }: Options_5): string;

export declare const VKShareButton: ForwardRefExoticComponent<Omit<ShareButtonProps<Options_5>, "title"> & Options_5 & RefAttributes<HTMLButtonElement>>;

export declare function WeiboIcon(props: RawIconProps): JSX.Element;

export declare function WeiboLegacyIcon(props: LegacyIconProps): JSX.Element;

declare function weiboLink(url: string, { shareTitle, image }: {
    shareTitle?: string;
    image?: string;
}): string;

export declare const WeiboShareButton: ForwardRefExoticComponent<Omit<ShareButtonProps<{
shareTitle?: string;
image?: string;
}>, "title"> & {
image?: string;
shareTitle?: string;
} & RefAttributes<HTMLButtonElement>>;

export declare function WhatsappIcon(props: RawIconProps): JSX.Element;

export declare function WhatsappLegacyIcon(props: LegacyIconProps): JSX.Element;

declare function whatsappLink(url: string, { message, phone, separator }: WhatsappOptions): string;

declare type WhatsappOptions = {
    message?: string;
    phone?: string;
    separator?: string;
};

export declare const WhatsappShareButton: ForwardRefExoticComponent<Omit<ShareButtonProps<WhatsappOptions>, "title"> & {
message?: string;
mobileBehavior?: MobileBehavior;
/** Recipient phone number in international format, for example `+358401234567`. */
phone?: string;
separator?: string;
} & RefAttributes<HTMLButtonElement>>;

export declare type WindowPosition = 'windowCenter' | 'screenCenter';

export declare function XIcon(props: RawIconProps): JSX.Element;

export declare function XLegacyIcon(props: LegacyIconProps): JSX.Element;

declare function xLink(url: string | undefined, { text, via, hashtags, related, }: {
    text?: string;
    via?: string;
    hashtags?: string[];
    related?: string[];
}): string;

export declare const XShareButton: ForwardRefExoticComponent<Omit<ShareButtonProps<{
text?: string;
via?: string;
hashtags?: string[];
related?: string[];
}>, "title" | "url"> & {
/** URL of the shared page. Optional when `text` is set, for text-only posts. */
url?: string;
text?: string;
via?: string;
hashtags?: string[];
related?: string[];
} & RefAttributes<HTMLButtonElement>>;

export { }