Skip to content

Commit 8d50de8

Browse files
author
Griko Nibras
committed
initial commit
0 parents  commit 8d50de8

File tree

14 files changed

+335
-0
lines changed

14 files changed

+335
-0
lines changed

.gitignore

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
**/node_modules/
2+
*.log
3+
.DS_Store
4+
.env*
5+
.eslintcache
6+
.pnp.*
7+
.yarn/*
8+
dist/
9+
package-lock.json
10+
yarn.lock
11+
12+
!.env.example
13+
!.yarn/patches
14+
!.yarn/plugins
15+
!.yarn/releases
16+
!.yarn/sdks
17+
!.yarn/versions

.husky/post-merge

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
#!/bin/sh
2+
. "$(dirname "$0")/_/husky.sh"
3+
4+
yarn install

.husky/pre-commit

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
#!/bin/sh
2+
. "$(dirname "$0")/_/husky.sh"
3+
4+
yarn lint-staged

.nvmrc

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
lts/*

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) 2021 Koding Ninja
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: 84 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,84 @@
1+
<!-- markdownlint-disable MD033 MD036 MD041 -->
2+
3+
# use-toggle
4+
5+
Toggle custom hook and component wrapper for React 🔦
6+
7+
---
8+
9+
**Table of contents**
10+
11+
- [Install](#install)
12+
- [Usage](#usage)
13+
- [Toggle hook](#toggle-hook)
14+
- [Toggle wrapper](#toggle-wrapper)
15+
- [Suggestions and/or questions](#suggestions-andor-questions)
16+
- [Maintainers](#maintainers)
17+
- [License](#license)
18+
19+
---
20+
21+
## Install
22+
23+
```sh
24+
# using npm
25+
npm install @kodingdotninja/use-toggle
26+
27+
# using yarn
28+
yarn add @kodingdotninja/use-toggle
29+
```
30+
31+
## Usage
32+
33+
### Toggle hook
34+
35+
```jsx
36+
import { useToggle } from "@kodingdotninja/use-toggle";
37+
38+
function App() {
39+
const { state, disable, enable, set, toggle } = useToggle();
40+
return (
41+
<div>
42+
<span>State: {state ? "enabled" : "disabled"}</span>
43+
<button onClick={disable}>toggle</button>
44+
<button onClick={enable}>toggle</button>
45+
<button onClick={() => set(true)}>set true</button>
46+
<button onClick={toggle}>toggle</button>
47+
</div>
48+
);
49+
}
50+
```
51+
52+
### Toggle wrapper
53+
54+
```jsx
55+
import { ToggleWrap } from "..";
56+
57+
export default function App() {
58+
return (
59+
<ToggleWrap>
60+
{({ state, disable, enable, set, toggle }) => (
61+
<div>
62+
<span>State: {state ? "enabled" : "disabled"}</span>
63+
<button onClick={disable}>toggle</button>
64+
<button onClick={enable}>toggle</button>
65+
<button onClick={() => set(true)}>set true</button>
66+
<button onClick={toggle}>toggle</button>
67+
</div>
68+
)}
69+
</ToggleWrap>
70+
);
71+
}
72+
```
73+
74+
## Suggestions and/or questions
75+
76+
Head over to our [dedicated Discord channel for `use-toggle`](https://discord.gg/KsHtDasn7e).
77+
78+
## Maintainers
79+
80+
- Griko Nibras ([@grikomsn](https://github.com/grikomsn))
81+
82+
## License
83+
84+
[MIT License, Copyright (c) 2021 Koding Ninja](./LICENSE)

examples/toggle-wrap.tsx

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import { ToggleWrap } from "..";
2+
3+
export default function ToggleWrapExample() {
4+
return (
5+
<ToggleWrap>
6+
{({ state, disable, enable, set, toggle }) => (
7+
<div>
8+
<span>State: {state ? "enabled" : "disabled"}</span>
9+
<button onClick={disable}>toggle</button>
10+
<button onClick={enable}>toggle</button>
11+
<button onClick={() => set(true)}>set true</button>
12+
<button onClick={toggle}>toggle</button>
13+
</div>
14+
)}
15+
</ToggleWrap>
16+
);
17+
}

examples/use-toggle.tsx

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
import { useToggle } from "..";
2+
3+
export default function UseToggleExample() {
4+
const { state, disable, enable, set, toggle } = useToggle();
5+
return (
6+
<div>
7+
<span>State: {state ? "enabled" : "disabled"}</span>
8+
<button onClick={disable}>toggle</button>
9+
<button onClick={enable}>toggle</button>
10+
<button onClick={() => set(true)}>set true</button>
11+
<button onClick={toggle}>toggle</button>
12+
</div>
13+
);
14+
}

package.json

Lines changed: 93 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,93 @@
1+
{
2+
"name": "@kodingdotninja/use-toggle",
3+
"description": "Toggle custom hook and component wrapper for React 🔦",
4+
"version": "0.0.1",
5+
"author": "Griko Nibras <[email protected]>",
6+
"homepage": "https://github.com/kodingdotninja/use-toggle",
7+
"repository": "https://github.com/kodingdotninja/use-toggle.git",
8+
"bugs": "https://github.com/kodingdotninja/use-toggle/issues",
9+
"files": [
10+
"dist"
11+
],
12+
"exports": {
13+
".": {
14+
"import": "./dist/index.mjs",
15+
"require": "./dist/index.js"
16+
}
17+
},
18+
"main": "dist/index.js",
19+
"module": "dist/index.mjs",
20+
"types": "dist/index.d.js",
21+
"sideEffects": false,
22+
"scripts": {
23+
"# general commands": "##################################################",
24+
"build": "tsup",
25+
"deduplicate": "npx yarn-deduplicate && yarn install",
26+
"dev": "tsup --watch src",
27+
"lint": "eslint --fix \"src/**/*.{js,jsx,ts,tsx}\"",
28+
"prepare": "husky install $PWD/.husky",
29+
"prepublishOnly": "yarn lint",
30+
"ship": "np",
31+
"type-check": "tsc --noEmit",
32+
"validate": "yarn lint && yarn type-check",
33+
"#": "###################################################################"
34+
},
35+
"devDependencies": {
36+
"@types/node": "^14",
37+
"@types/react": "^17",
38+
"eslint": "^7",
39+
"eslint-config-kdnj": "^1",
40+
"husky": "^7",
41+
"lint-staged": "^12",
42+
"np": "^7",
43+
"react": "^17",
44+
"react-dom": "^17",
45+
"tsup": "^5",
46+
"typescript": "^4"
47+
},
48+
"peerDependencies": {
49+
"react": ">=16.8"
50+
},
51+
"peerDependenciesMeta": {
52+
"react": {
53+
"optional": true
54+
}
55+
},
56+
"eslintConfig": {
57+
"extends": [
58+
"eslint-config-kdnj/react"
59+
],
60+
"ignorePatterns": [
61+
"dist"
62+
],
63+
"rules": {
64+
"react/react-in-jsx-scope": [
65+
"off"
66+
]
67+
},
68+
"root": true
69+
},
70+
"lint-staged": {
71+
"*.{js,json,md}": [
72+
"prettier --write"
73+
],
74+
"src/*.{js,jsx,ts,tsx}": [
75+
"eslint --fix"
76+
]
77+
},
78+
"prettier": {
79+
"endOfLine": "auto",
80+
"printWidth": 120,
81+
"semi": true,
82+
"singleQuote": false,
83+
"trailingComma": "all"
84+
},
85+
"keywords": [
86+
"kdnj",
87+
"kodingdotninja",
88+
"react",
89+
"toggle",
90+
"use-toggle"
91+
],
92+
"license": "MIT"
93+
}

src/index.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
export * from "./toggle-wrap";
2+
export * from "./use-toggle";

0 commit comments

Comments
 (0)