Skip to content

Commit d4a0fc3

Browse files
erikgiovanierikgiovani
authored
Hidden From Bots React
0 parents  commit d4a0fc3

File tree

9 files changed

+614
-0
lines changed

9 files changed

+614
-0
lines changed

‎CODE_OF_CONDUCT.md‎

Lines changed: 128 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,128 @@
1+
# Contributor Covenant Code of Conduct
2+
3+
## Our Pledge
4+
5+
We as members, contributors, and leaders pledge to make participation in our
6+
community a harassment-free experience for everyone, regardless of age, body
7+
size, visible or invisible disability, ethnicity, sex characteristics, gender
8+
identity and expression, level of experience, education, socio-economic status,
9+
nationality, personal appearance, race, religion, or sexual identity
10+
and orientation.
11+
12+
We pledge to act and interact in ways that contribute to an open, welcoming,
13+
diverse, inclusive, and healthy community.
14+
15+
## Our Standards
16+
17+
Examples of behavior that contributes to a positive environment for our
18+
community include:
19+
20+
- Demonstrating empathy and kindness toward other people
21+
- Being respectful of differing opinions, viewpoints, and experiences
22+
- Giving and gracefully accepting constructive feedback
23+
- Accepting responsibility and apologizing to those affected by our mistakes,
24+
and learning from the experience
25+
- Focusing on what is best not just for us as individuals, but for the
26+
overall community
27+
28+
Examples of unacceptable behavior include:
29+
30+
- The use of sexualized language or imagery, and sexual attention or
31+
advances of any kind
32+
- Trolling, insulting or derogatory comments, and personal or political attacks
33+
- Public or private harassment
34+
- Publishing others' private information, such as a physical or email
35+
address, without their explicit permission
36+
- Other conduct which could reasonably be considered inappropriate in a
37+
professional setting
38+
39+
## Enforcement Responsibilities
40+
41+
Community leaders are responsible for clarifying and enforcing our standards of
42+
acceptable behavior and will take appropriate and fair corrective action in
43+
response to any behavior that they deem inappropriate, threatening, offensive,
44+
or harmful.
45+
46+
Community leaders have the right and responsibility to remove, edit, or reject
47+
comments, commits, code, wiki edits, issues, and other contributions that are
48+
not aligned to this Code of Conduct, and will communicate reasons for moderation
49+
decisions when appropriate.
50+
51+
## Scope
52+
53+
This Code of Conduct applies within all community spaces, and also applies when
54+
an individual is officially representing the community in public spaces.
55+
Examples of representing our community include using an official e-mail address,
56+
posting via an official social media account, or acting as an appointed
57+
representative at an online or offline event.
58+
59+
## Enforcement
60+
61+
Instances of abusive, harassing, or otherwise unacceptable behavior may be
62+
reported to the community leaders responsible for enforcement at
63+
[Hidden From Bots](https://github.com/ErikGIovani/hidden-from-bots-react/issues).
64+
All complaints will be reviewed and investigated promptly and fairly.
65+
66+
All community leaders are obligated to respect the privacy and security of the
67+
reporter of any incident.
68+
69+
## Enforcement Guidelines
70+
71+
Community leaders will follow these Community Impact Guidelines in determining
72+
the consequences for any action they deem in violation of this Code of Conduct:
73+
74+
### 1. Correction
75+
76+
**Community Impact**: Use of inappropriate language or other behavior deemed
77+
unprofessional or unwelcome in the community.
78+
79+
**Consequence**: A private, written warning from community leaders, providing
80+
clarity around the nature of the violation and an explanation of why the
81+
behavior was inappropriate. A public apology may be requested.
82+
83+
### 2. Warning
84+
85+
**Community Impact**: A violation through a single incident or series
86+
of actions.
87+
88+
**Consequence**: A warning with consequences for continued behavior. No
89+
interaction with the people involved, including unsolicited interaction with
90+
those enforcing the Code of Conduct, for a specified period of time. This
91+
includes avoiding interactions in community spaces as well as external channels
92+
like social media. Violating these terms may lead to a temporary or
93+
permanent ban.
94+
95+
### 3. Temporary Ban
96+
97+
**Community Impact**: A serious violation of community standards, including
98+
sustained inappropriate behavior.
99+
100+
**Consequence**: A temporary ban from any sort of interaction or public
101+
communication with the community for a specified period of time. No public or
102+
private interaction with the people involved, including unsolicited interaction
103+
with those enforcing the Code of Conduct, is allowed during this period.
104+
Violating these terms may lead to a permanent ban.
105+
106+
### 4. Permanent Ban
107+
108+
**Community Impact**: Demonstrating a pattern of violation of community
109+
standards, including sustained inappropriate behavior, harassment of an
110+
individual, or aggression toward or disparagement of classes of individuals.
111+
112+
**Consequence**: A permanent ban from any sort of public interaction within
113+
the community.
114+
115+
## Attribution
116+
117+
This Code of Conduct is adapted from the [Contributor Covenant][homepage],
118+
version 2.0, available at
119+
https://www.contributor-covenant.org/version/2/0/code_of_conduct.html.
120+
121+
Community Impact Guidelines were inspired by [Mozilla's code of conduct
122+
enforcement ladder](https://github.com/mozilla/diversity).
123+
124+
[homepage]: https://www.contributor-covenant.org
125+
126+
For answers to common questions about this code of conduct, see the FAQ at
127+
https://www.contributor-covenant.org/faq. Translations are available at
128+
https://www.contributor-covenant.org/translations.

‎LICENSE‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
MIT License
2+
3+
Copyright (c) 2022 Erik Giovani
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

‎README.md‎

Lines changed: 138 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,138 @@
1+
<div align="center">
2+
<img width="15%" src="https://hiddenfrombots.vercel.app/assets/images/bot.png" alt="#">
3+
<h1>Hidden From Bots</h1
4+
5+
**Say goodbye to bots looking for emails and phone numbers**
6+
7+
<p>Normally on the internet there are bots, crawlers or spiders, they are all the same with a different name and are dedicated to searching the internet for data such as emails, phone numbers and other data, although not all of them are bad like of google that is in charge to analyze your site to be able to index it in their search engine, there are others that are, although you can create a robots.txt file and add a configuration to avoid bots, some people can create bots to ignore if there is a robots file .txt and they can scan still your site and collect your email or phone number to be able to send spam, make phone scams or sell that data to companies so they can send you unwanted advertising.</p>
8+
9+
<p>Luckily with Hidden From Bots you can avoid most of these annoying bots by hiding these elements from the dom.</p>
10+
11+
<a href="https://www.buymeacoffee.com/erikgiovani" target="_blank">
12+
<img width="20%" src="https://helloimjessa.files.wordpress.com/2021/06/bmc-button.png">
13+
</a>
14+
</div>
15+
16+
<div align="center">
17+
<h2>Installation</h2>
18+
19+
**NPM**
20+
21+
```console
22+
npm i hidden-from-bots-react
23+
```
24+
**Yarn**
25+
26+
```console
27+
yarn add hidden-from-bots-react
28+
```
29+
</div>
30+
31+
<div align="center">
32+
<h2>Usage</h2>
33+
34+
Using **Hidden From Bots** with **React** is very easy, you can do it with **create-react-app** or with **Vite**, only need to install **hidden-from-bots-react** in your project with your favorite package manager and import it in your project.
35+
</div>
36+
37+
```jsx
38+
import "./App.css";
39+
import { Email } from "hidden-from-bots-react";
40+
41+
function App() {
42+
return <div className="App">...</div>;
43+
}
44+
45+
export default App;
46+
```
47+
48+
<div align="center">
49+
50+
In this case, I import **Email** to hide an email.
51+
</div>
52+
53+
```js
54+
import { Email } from "hidden-from-bots-react";
55+
```
56+
57+
<div align="center">
58+
59+
But you can also import **Phone** to hide a phone number.
60+
</div>
61+
62+
```js
63+
import { Phone } from "hidden-from-bots-react";
64+
```
65+
66+
<div align="center">
67+
68+
To hide an email you need to pass the email prop to the **Email** component and to hide a phone number you have to pass the phone prop to the **Phone** component.
69+
</div>
70+
71+
```jsx
72+
import "./App.css";
73+
import { Email, Phone } from "hidden-from-bots-react";
74+
75+
function App() {
76+
return (
77+
<div className="App">
78+
<Email email="[email protected]">Email</Email>
79+
<Phone phone="57123456789">Phone Number</Phone>
80+
</div>
81+
);
82+
}
83+
84+
export default App;
85+
```
86+
87+
<div align="center">
88+
89+
You can also use css , css modules, sass, sass modules or style to style them to your liking, and you can switch the content between the **Phone** or **Email** tags to add custom text or an icon.
90+
</div>
91+
92+
```jsx
93+
import "./App.css";
94+
import styles from "./App.module.css";
95+
import { Email, Phone } from "hidden-from-bots-react";
96+
97+
function App() {
98+
return (
99+
<div className="App">
100+
<Email className={styles.email} email="[email protected]">
101+
Email
102+
</Email>
103+
<Phone style={{ color: "red" }} phone="57123456789">
104+
Phone Number
105+
</Phone>
106+
</div>
107+
);
108+
}
109+
110+
export default App;
111+
```
112+
113+
<div align="center">
114+
<h2>Base64</h2>
115+
116+
To hide an email or phone number from more advanced bots you can import **EmailBase64** for an email or **PhoneBase64** for a phone number, the steps to use them are the same as the previous examples with just one extra step, in the email and phone prop we have to pass the email or the phone number in Base64, you can use the following link [https://hiddenfrombots.js.org/encoder](https://hiddenfrombots.js.org/encoder) so you can transform them to Base64 or you can use the page you like to transform them to Base64.
117+
</div>
118+
119+
```jsx
120+
import "./App.css";
121+
import styles from "./App.module.css";
122+
import { EmailBase64, PhoneBase64 } from "hidden-from-bots-react";
123+
124+
function App() {
125+
return (
126+
<div className="App">
127+
<EmailBase64 className={styles.email} email="aGVsbG9Ad29ybGQuY29t">
128+
Email
129+
</EmailBase64>
130+
<PhoneBase64 style={{ color: "red" }} phone="NTcxMjM0NTY3ODk=">
131+
Phone Number
132+
</PhoneBase64>
133+
</div>
134+
);
135+
}
136+
137+
export default App;
138+
```

‎build/index.d.ts‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
import React from "react";
2+
declare type PropsEmail = {
3+
children: React.ReactNode;
4+
email: string;
5+
style?: React.CSSProperties;
6+
className?: string;
7+
};
8+
declare type PropsPhone = {
9+
children: React.ReactNode;
10+
phone: string;
11+
style?: React.CSSProperties;
12+
className?: string;
13+
};
14+
declare function Email({ children, email, style, className }: PropsEmail): JSX.Element;
15+
declare function Phone({ children, phone, style, className }: PropsPhone): JSX.Element;
16+
declare function EmailBase64({ children, email, style, className, }: PropsEmail): JSX.Element;
17+
declare function PhoneBase64({ children, phone, style, className, }: PropsPhone): JSX.Element;
18+
export { Email, Phone, EmailBase64, PhoneBase64 };

‎build/index.js‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
"use strict";
2+
var __importDefault = (this && this.__importDefault) || function (mod) {
3+
return (mod && mod.__esModule) ? mod : { "default": mod };
4+
};
5+
Object.defineProperty(exports, "__esModule", { value: true });
6+
exports.PhoneBase64 = exports.EmailBase64 = exports.Phone = exports.Email = void 0;
7+
const react_1 = __importDefault(require("react"));
8+
function Email({ children, email, style = {}, className = "" }) {
9+
return (react_1.default.createElement("p", { style: Object.keys(style).length > 0
10+
? Object.assign(Object.assign({}, style), { cursor: "pointer" }) : { cursor: "pointer" }, className: className, onClick: (e) => (window.location.href = `mailto:${email}`) }, children));
11+
}
12+
exports.Email = Email;
13+
function Phone({ children, phone, style = {}, className = "" }) {
14+
return (react_1.default.createElement("p", { style: Object.keys(style).length > 0
15+
? Object.assign(Object.assign({}, style), { cursor: "pointer" }) : { cursor: "pointer" }, className: className, onClick: (e) => (window.location.href = `tel:${phone}`) }, children));
16+
}
17+
exports.Phone = Phone;
18+
function EmailBase64({ children, email, style = {}, className = "", }) {
19+
return (react_1.default.createElement("p", { style: Object.keys(style).length > 0
20+
? Object.assign(Object.assign({}, style), { cursor: "pointer" }) : { cursor: "pointer" }, className: className, onClick: (e) => (window.location.href = `mailto:${atob(email)}`) }, children));
21+
}
22+
exports.EmailBase64 = EmailBase64;
23+
function PhoneBase64({ children, phone, style = {}, className = "", }) {
24+
return (react_1.default.createElement("p", { style: Object.keys(style).length > 0
25+
? Object.assign(Object.assign({}, style), { cursor: "pointer" }) : { cursor: "pointer" }, className: className, onClick: (e) => (window.location.href = `tel:${atob(phone)}`) }, children));
26+
}
27+
exports.PhoneBase64 = PhoneBase64;

‎package.json‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
{
2+
"name": "hidden-from-bots-react",
3+
"version": "1.0.0",
4+
"description": "Say goodbye to bots looking for emails and phone numbers.",
5+
"main": "build/index.js",
6+
"types": "build/index.d.ts",
7+
"scripts": {
8+
"build": "npx tsc -p ."
9+
},
10+
"repository": {
11+
"type": "git",
12+
"url": "git+https://github.com/ErikGIovani/hidden-from-bots-react.git"
13+
},
14+
"keywords": [
15+
"webs",
16+
"email",
17+
"number",
18+
"phone",
19+
"bots",
20+
"hide",
21+
"react"
22+
],
23+
"author": "Erik Giovani",
24+
"license": "MIT",
25+
"bugs": {
26+
"url": "https://github.com/ErikGIovani/hidden-from-bots-react/issues"
27+
},
28+
"homepage": "https://hiddenfrombots.js.org/",
29+
"peerDependencies": {
30+
"react": ">=16.11.0"
31+
},
32+
"devDependencies": {
33+
"@types/react": "^18.0.15",
34+
"react": "^18.2.0",
35+
"typescript": "^4.7.4"
36+
}
37+
}

0 commit comments

Comments
 (0)