Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/patelka2211/sharer
Seamlessly Share URLs and Generate SharerQR Codes!
https://github.com/patelka2211/sharer
kpverse npm npm-package sharer typescript
Last synced: 13 days ago
JSON representation
Seamlessly Share URLs and Generate SharerQR Codes!
- Host: GitHub
- URL: https://github.com/patelka2211/sharer
- Owner: patelka2211
- License: mit
- Created: 2022-10-10T15:15:57.000Z (about 2 years ago)
- Default Branch: main
- Last Pushed: 2024-01-14T06:59:14.000Z (10 months ago)
- Last Synced: 2024-03-14T18:36:24.262Z (8 months ago)
- Topics: kpverse, npm, npm-package, sharer, typescript
- Language: TypeScript
- Homepage: https://kpverse.in/sharer/
- Size: 2.94 MB
- Stars: 5
- Watchers: 3
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
[](https://kpverse.in/sharer/ "Sharer from KPVERSE")
###
---
## Installation
[](https://www.npmjs.com/package/@patelka2211/sharer)
[](https://bundlephobia.com/package/@patelka2211/[email protected])
[](https://www.npmjs.com/package/@patelka2211/sharer)
[](https://cdn.jsdelivr.net/gh/patelka2211/[email protected]/)
To install Sharer from NPM, run the following command:
```sh
npm i @patelka2211/sharer
```
Alternatively, you can visit [this page](kpverse.in/sharer/#install) and configure Sharer to work the best way and directly in your website using a HTML `` tag. Or simply paste the below given code as high as possible in your website or web app's `<head>` tag .
```html
<!-- Sharer scripts start -->
<script src="https://cdn.jsdelivr.net/gh/patelka2211/[email protected]/DynamicColors.js">
```
---
## Available APIs
### open - type _`function`_
```ts
/**
* Opens the Sharer with the specified options.
* @param option — Optional configuration for the Sharer.
*/
function openSharer(option?: { url?: string; text?: string }): void;
```
### close - type _`function`_
```ts
/**
* Closes the Sharer.
*
* @returns {void}
*/
function closeSharer(): void;
```
### setColor - type _`function`_
```ts
/**
* Sets Sharer color.
*
* @param {string | undefined} newColor - The new color value.
* @returns {object} An object containing open and close functions.
* @property {function} open - The function to open the Sharer.
* @property {function} close - The function to close the Sharer.
*/
function setColor(newColor?: string): object;
```
---
### button - type _`object`_
Sharer button is an object containing [`activate`](#buttonactivate---activates-the-sharer-button) and [`deactivate`](#buttondeactivate---deactivates-the-sharer-button) functions.
```ts
const button: {
activate: () => void;
deactivate: () => void;
};
```
#### `button.activate` - Activates the Sharer button.
#### `button.deactivate` - Deactivates the Sharer button.
---
### Method chaining
You can use method chaining in [`setColor`](#setcolor---type-function) function.
Suppose you need to [set color](#setcolor---type-function) theme of Sharer and then you immediately want to [open Sharer](#open---type-function), you can do this using method chaining with just single line of code.
```js
// The given example code will set color theme to "#2596D1" and will open Sharer.
// There is only one line of code present in the given example. It looks like 4 lines of code because it is formatted, to make sure it is easily readable.
setColor("#2596D1").open({
url: "https://kpverse.in/",
text: "The official KPVERSE website.",
});
```
---
### License
[MIT License](./LICENSE)
---
© 2023 Kartavya Patel. All rights reserved.