Share Button library

share-button

About

Light and ready to use share-button component for React apps.

Install

Installing as a package:

npm install @npm_leadtech/share-button

Usage Example

import React from "react";
import ShareButton from "@npm-leadtech/share-button";

function Example() {
  return <ShareButton />;
}

Component props

<ShareButton />

| Prop name | Type | Default | Required | Description | | :-----------: | :----------------: | :-----: | :------: | :-------------------------------------------------------------: | | color | string | | No | Defines the primary color of the share button | | className | string | | No | Adds custom CSS classes to the button for additional styling | | description | string | | No | Descriptive text that will be shared when the button is clicked | | title | string | | No | Title that will be displayed or shared along with the content | | buttonContent | React.ReactElement | | No | Custom React element to display inside the button | | icon | React.ReactElement | | No | Custom Icon |

Component service

isShareSupported()

Type: () => boolean

Description:

Determines if the Web Share API is supported in the current browser environment. Returns true if the browser supports the navigator.share method, enabling native sharing capabilities. Returns false if the Web Share API is not available.

Usage Example

import React from "react";
import ShareButton from "@npm-leadtech/share-button";
import isShareSupported() from "@npm-leadtech/share-button";


function Example() {
  return (
    <>
      {
        isShareSupported() && (
        <div className='action-buttons'>
          <ShareButton />
        </div>
        )
      }
    </>
  );
}