├── .nvmrc ├── docs └── .gitignore ├── .prettierignore ├── lib ├── .npmignore ├── tsconfig.json ├── vitestSetup.ts ├── tsup.config.cjs ├── vitest.config.cjs ├── mock │ └── server.ts ├── __tests__ │ └── use-viacep.test.ts ├── package.json ├── src │ └── index.ts └── README.md ├── .eslintignore ├── .github ├── FUNDING.yml ├── dependabot.yml └── workflows │ ├── size.yml │ └── ci.yml ├── pnpm-workspace.yaml ├── .npmrc ├── .husky ├── pre-push ├── commit-msg └── pre-commit ├── .prettierrc.json ├── .vscode └── extensions.json ├── example ├── vite.config.cjs ├── tsconfig.node.json ├── src │ ├── main.tsx │ └── App.tsx ├── index.html ├── package.json └── tsconfig.json ├── .lintstagedrc.json ├── .editorconfig ├── .gitignore ├── commitlint.config.js ├── tsconfig.json ├── .versionrc ├── .eslintrc.json ├── package.json └── README.md /.nvmrc: -------------------------------------------------------------------------------- 1 | v16 2 | -------------------------------------------------------------------------------- /docs/.gitignore: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /.prettierignore: -------------------------------------------------------------------------------- 1 | dist 2 | -------------------------------------------------------------------------------- /lib/.npmignore: -------------------------------------------------------------------------------- 1 | __tests__ 2 | mock 3 | -------------------------------------------------------------------------------- /.eslintignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | dist 3 | -------------------------------------------------------------------------------- /.github/FUNDING.yml: -------------------------------------------------------------------------------- 1 | github: raisiqueira 2 | ko_fi: raisiqueira 3 | -------------------------------------------------------------------------------- /pnpm-workspace.yaml: -------------------------------------------------------------------------------- 1 | packages: 2 | - 'lib' 3 | - 'example' 4 | -------------------------------------------------------------------------------- /.npmrc: -------------------------------------------------------------------------------- 1 | v16 2 | auto-install-peers=true 3 | strict-peer-dependencies=false 4 | -------------------------------------------------------------------------------- /.husky/pre-push: -------------------------------------------------------------------------------- 1 | #!/bin/sh 2 | . "$(dirname "$0")/_/husky.sh" 3 | 4 | pnpm run lint -------------------------------------------------------------------------------- /.husky/commit-msg: -------------------------------------------------------------------------------- 1 | #!/bin/sh 2 | . "$(dirname "$0")/_/husky.sh" 3 | 4 | pnpm exec commitlint --edit $1 5 | -------------------------------------------------------------------------------- /.husky/pre-commit: -------------------------------------------------------------------------------- 1 | #!/bin/sh 2 | . "$(dirname "$0")/_/husky.sh" 3 | 4 | pnpm exec lint-staged 5 | pnpm run type-check 6 | -------------------------------------------------------------------------------- /.prettierrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 100, 3 | "semi": true, 4 | "singleQuote": true, 5 | "trailingComma": "es5" 6 | } -------------------------------------------------------------------------------- /lib/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "compilerOptions": { 4 | "types": ["vitest/globals"] 5 | } 6 | } 7 | -------------------------------------------------------------------------------- /.vscode/extensions.json: -------------------------------------------------------------------------------- 1 | { 2 | "recommendations": [ 3 | "esbenp.prettier-vscode", 4 | "dbaeumer.vscode-eslint", 5 | "ZixuanChen.vitest-explorer", 6 | ], 7 | } -------------------------------------------------------------------------------- /.github/dependabot.yml: -------------------------------------------------------------------------------- 1 | version: 2 2 | updates: 3 | - package-ecosystem: npm 4 | directory: "/" 5 | schedule: 6 | interval: monthly 7 | open-pull-requests-limit: 10 8 | -------------------------------------------------------------------------------- /example/vite.config.cjs: -------------------------------------------------------------------------------- 1 | import react from '@vitejs/plugin-react'; 2 | import { defineConfig } from 'vite'; 3 | 4 | export default defineConfig({ 5 | plugins: [react()], 6 | }); 7 | -------------------------------------------------------------------------------- /.lintstagedrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "src/**/*.{js,jsx,ts,tsx}": [ 3 | "eslint --fix --max-warnings=0", 4 | "prettier --write" 5 | ], 6 | "src/**/*.{json,css,scss,md}": [ 7 | "prettier --write" 8 | ] 9 | } -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | # editorconfig.org 2 | root = true 3 | 4 | [*] 5 | indent_style = space 6 | indent_size = 2 7 | end_of_line = lf 8 | charset = utf-8 9 | trim_trailing_whitespace = true 10 | insert_final_newline = true -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | .env 3 | .env.local 4 | .env.development 5 | .env.development.local 6 | *.log 7 | yalc.lock 8 | 9 | .vercel/ 10 | .turbo/ 11 | .next/ 12 | .yalc/ 13 | build/ 14 | dist/ 15 | node_modules/ 16 | .vercel 17 | coverage/ 18 | -------------------------------------------------------------------------------- /example/tsconfig.node.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "composite": true, 4 | "module": "ESNext", 5 | "moduleResolution": "Node", 6 | "allowSyntheticDefaultImports": true 7 | }, 8 | "include": ["vite.config.cjs"] 9 | } 10 | -------------------------------------------------------------------------------- /lib/vitestSetup.ts: -------------------------------------------------------------------------------- 1 | import { beforeAll, afterEach, afterAll } from 'vitest'; 2 | 3 | import { server } from './mock/server'; 4 | 5 | beforeAll(() => server.listen({ onUnhandledRequest: 'bypass' })); 6 | afterAll(() => server.close()); 7 | afterEach(() => server.resetHandlers()); 8 | -------------------------------------------------------------------------------- /example/src/main.tsx: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom/client'; 3 | import App from './App'; 4 | 5 | ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render( 6 | 7 | 8 | 9 | ); 10 | -------------------------------------------------------------------------------- /lib/tsup.config.cjs: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'tsup'; 2 | 3 | export default defineConfig((options) => ({ 4 | entry: 'src/index.ts', 5 | sourcemap: !options.watch, 6 | minify: !options.watch, 7 | dts: true, 8 | format: ['esm', 'cjs'], 9 | loader: { 10 | '.js': 'jsx', 11 | }, 12 | })); 13 | -------------------------------------------------------------------------------- /lib/vitest.config.cjs: -------------------------------------------------------------------------------- 1 | /// 2 | 3 | import { defineConfig } from 'vite'; 4 | 5 | export default defineConfig({ 6 | test: { 7 | globals: true, 8 | environment: 'happy-dom', 9 | setupFiles: ['./vitestSetup.ts'], 10 | coverage: { 11 | provider: 'istanbul', 12 | }, 13 | }, 14 | }); 15 | -------------------------------------------------------------------------------- /commitlint.config.js: -------------------------------------------------------------------------------- 1 | /** @type {import('@commitlint/types').UserConfig} */ 2 | const CommitLintConfiguration = { 3 | extends: ["@commitlint/config-conventional"], 4 | // add your own scope here if needed 5 | // "scope-enum": [2, "always", ["components", "pages", "utils"]], 6 | "scope-case": [2, "always", "kebab-case"], 7 | }; 8 | 9 | module.exports = CommitLintConfiguration; 10 | -------------------------------------------------------------------------------- /example/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | PNPM Monorepo Lib example 8 | 9 | 10 |
11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /example/src/App.tsx: -------------------------------------------------------------------------------- 1 | import useViaCep from '@rsiqueira/use-viacep'; 2 | import React from 'react'; 3 | 4 | const Main = () => { 5 | const [value, setValue] = React.useState(''); 6 | const { cep, loading } = useViaCep(value); 7 | return ( 8 |
9 |

Test useViaCep - loading: {loading}

10 | setValue(e.target.value)} /> 11 | 
{JSON.stringify(cep, null, 2)}
12 |
13 | ); 14 | }; 15 | 16 | export default Main; 17 | -------------------------------------------------------------------------------- /example/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "example", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": { 7 | "dev": "vite" 8 | }, 9 | "devDependencies": { 10 | "@types/react": "^18.0.28", 11 | "@types/react-dom": "^18.0.11", 12 | "@vitejs/plugin-react": "^2.2.0", 13 | "typescript": "^4.9.5", 14 | "vite": "^3.2.5" 15 | }, 16 | "dependencies": { 17 | "@rsiqueira/use-viacep": "workspace:*", 18 | "react": "^18.2.0", 19 | "react-dom": "^18.2.0" 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "es2018", 4 | "lib": ["dom", "dom.iterable", "esnext"], 5 | "allowJs": true, 6 | "skipLibCheck": true, 7 | "strict": false, 8 | "forceConsistentCasingInFileNames": true, 9 | "esModuleInterop": true, 10 | "module": "esnext", 11 | "moduleResolution": "node", 12 | "resolveJsonModule": true, 13 | "isolatedModules": true, 14 | "jsx": "react", 15 | "noEmit": true 16 | }, 17 | "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", "**/*.js", "**/*.jsx", "lib/tsup.config.cjs"], 18 | "exclude": ["node_modules", "build", "dist", ".next"] 19 | } -------------------------------------------------------------------------------- /example/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ESNext", 4 | "useDefineForClassFields": true, 5 | "lib": ["DOM", "DOM.Iterable", "ESNext"], 6 | "allowJs": false, 7 | "skipLibCheck": true, 8 | "esModuleInterop": false, 9 | "allowSyntheticDefaultImports": true, 10 | "strict": true, 11 | "forceConsistentCasingInFileNames": true, 12 | "module": "ESNext", 13 | "moduleResolution": "Node", 14 | "resolveJsonModule": true, 15 | "isolatedModules": true, 16 | "noEmit": true, 17 | "jsx": "react-jsx" 18 | }, 19 | "include": ["src"], 20 | "references": [{ "path": "./tsconfig.node.json" }] 21 | } 22 | -------------------------------------------------------------------------------- /.versionrc: -------------------------------------------------------------------------------- 1 | { 2 | "types": [ 3 | { 4 | "type": "feat", 5 | "section": "Features" 6 | }, 7 | { 8 | "type": "fix", 9 | "section": "Bug Fixes" 10 | }, 11 | { 12 | "type": "refactor", 13 | "section": "Improvements" 14 | }, 15 | { 16 | "type": "test", 17 | "section": "Tests", 18 | "hidden": true 19 | }, 20 | { 21 | "type": "chore", 22 | "section": "Chores", 23 | "hidden": true 24 | }, 25 | { 26 | "type": "build", 27 | "section": "Build System", 28 | "hidden": true 29 | }, 30 | { 31 | "type": "revert", 32 | "section": "Reverts", 33 | "hidden": true 34 | }, 35 | { 36 | "type": "ci", 37 | "hidden": true 38 | } 39 | ] 40 | } -------------------------------------------------------------------------------- /lib/mock/server.ts: -------------------------------------------------------------------------------- 1 | import { rest } from 'msw'; 2 | import { setupServer } from 'msw/node'; 3 | 4 | export const SUCCESS_RESPONSE = { 5 | cep: '50690-708', 6 | logradouro: 'Rua Bom Jesus', 7 | complemento: '', 8 | bairro: 'Iputinga', 9 | localidade: 'Recife', 10 | uf: 'PE', 11 | ibge: '2611606', 12 | gia: '', 13 | ddd: '81', 14 | siafi: '2531', 15 | }; 16 | 17 | export const ERROR_RESPONSE = { 18 | erro: true, 19 | }; 20 | 21 | const apiHandlers = [ 22 | rest.get('https://viacep.com.br/ws/50690708/json/', (req, res, ctx) => { 23 | return res(ctx.status(200), ctx.json(SUCCESS_RESPONSE)); 24 | }), 25 | rest.get('https://viacep.com.br/ws/99999999/json/', (req, res, ctx) => { 26 | return res(ctx.status(200), ctx.json(ERROR_RESPONSE)); 27 | }), 28 | ]; 29 | 30 | export const server = setupServer(...apiHandlers); 31 | -------------------------------------------------------------------------------- /.github/workflows/size.yml: -------------------------------------------------------------------------------- 1 | name: size 2 | on: [pull_request] 3 | jobs: 4 | size: 5 | runs-on: ubuntu-latest 6 | strategy: 7 | matrix: 8 | node: ['16.x'] 9 | os: [ubuntu-latest] 10 | env: 11 | CI_JOB_NUMBER: 1 12 | steps: 13 | - name: Checkout repo 14 | uses: actions/checkout@v3 15 | 16 | - name: Install PNPM 17 | uses: pnpm/action-setup@v2.2.4 18 | with: 19 | version: 7 20 | 21 | - run: pnpm install --frozen-lockfile 22 | 23 | - name: Setup Node and install project dependencies 24 | uses: actions/setup-node@v3 25 | with: 26 | node-version: ${{ matrix.node }} 27 | 28 | - uses: preactjs/compressed-size-action@v2 29 | with: 30 | repo-token: ${{ secrets.GITHUB_TOKEN }} 31 | build-script: 'build' 32 | -------------------------------------------------------------------------------- /lib/__tests__/use-viacep.test.ts: -------------------------------------------------------------------------------- 1 | import { renderHook, waitFor } from '@testing-library/react'; 2 | import { describe, it, expect } from 'vitest'; 3 | 4 | import { ERROR_RESPONSE, SUCCESS_RESPONSE } from '../mock/server'; 5 | import useViaCep from '../src'; 6 | 7 | describe('useViaCep', () => { 8 | const setupHook = (cep?: string) => { 9 | return renderHook(() => useViaCep(cep)); 10 | }; 11 | it('should return an object with the response', async () => { 12 | const { result } = setupHook('50690708'); 13 | expect(result.current.loading).toBeTruthy(); 14 | await waitFor(() => expect(result.current.loading).toBeFalsy()); 15 | expect(result.current.cep).toEqual(SUCCESS_RESPONSE); 16 | expect(result.current.loading).toBeFalsy(); 17 | }); 18 | 19 | it("should return an object with the error if the cep doesn't exist", async () => { 20 | const { result } = setupHook('99999999'); 21 | expect(result.current.loading).toBeTruthy(); 22 | await waitFor(() => expect(result.current.loading).toBeFalsy()); 23 | expect(result.current.cep).toEqual(ERROR_RESPONSE); 24 | expect(result.current.loading).toBeFalsy(); 25 | }); 26 | }); 27 | -------------------------------------------------------------------------------- /.github/workflows/ci.yml: -------------------------------------------------------------------------------- 1 | name: CI 2 | on: [push] 3 | 4 | # cancel in-progress runs on new commits to same PR (gitub.event.number) 5 | concurrency: 6 | group: ${{ github.workflow }}-${{ github.event.number || github.sha }} 7 | cancel-in-progress: true 8 | 9 | jobs: 10 | build: 11 | name: Build, lint, and test on Node ${{ matrix.node }} and ${{ matrix.os }} 12 | 13 | runs-on: ${{ matrix.os }} 14 | strategy: 15 | matrix: 16 | node: ['16.x'] 17 | os: [ubuntu-latest] 18 | 19 | steps: 20 | - name: Checkout repo 21 | uses: actions/checkout@v3 22 | 23 | - name: Install PNPM 24 | uses: pnpm/action-setup@v2.2.4 25 | with: 26 | version: 7 27 | 28 | - run: pnpm install --frozen-lockfile 29 | 30 | - name: Cache node_modules 31 | uses: actions/cache@v3 32 | id: pnpm-cache 33 | with: 34 | path: '**/node_modules' 35 | key: ${{ runner.os }}-node-${{ hashFiles('**/pnpm-lock.yaml') }} 36 | restore-keys: | 37 | ${{ runner.os }}-node- 38 | - name: Setup Node and install project dependencies 39 | uses: actions/setup-node@v3 40 | with: 41 | node-version: ${{ matrix.node }} 42 | check-latest: true 43 | cache: 'pnpm' 44 | 45 | - name: Lint 46 | run: pnpm run lint 47 | 48 | - name: Test 49 | run: pnpm run test 50 | 51 | - name: Build 52 | run: pnpm run build 53 | -------------------------------------------------------------------------------- /lib/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@rsiqueira/use-viacep", 3 | "version": "1.5.3", 4 | "description": "React hook to fetch Brazilian CEP's using ViaCEP api.", 5 | "license": "MIT", 6 | "author": { 7 | "name": "Raí Siqueira", 8 | "email": "me@raisiqueira.io" 9 | }, 10 | "repository": "https://github.com/raisiqueira/use-viacep", 11 | "bugs": { 12 | "url": "https://github.com/raisiqueira/use-viacep/issues" 13 | }, 14 | "main": "./dist/index.js", 15 | "module": "./dist/index.mjs", 16 | "types": "./dist/index.d.ts", 17 | "files": [ 18 | "dist" 19 | ], 20 | "scripts": { 21 | "build": "tsup src", 22 | "dev": "tsup src --watch", 23 | "test": "vitest", 24 | "test:watch": "vitest watch", 25 | "coverage": "vitest run --coverage" 26 | }, 27 | "keywords": [ 28 | "react", 29 | "hook", 30 | "cep", 31 | "brazilian cep", 32 | "cep brasil", 33 | "via cep", 34 | "via-cep", 35 | "react-hooks", 36 | "hooks", 37 | "brazil-api" 38 | ], 39 | "devDependencies": { 40 | "@testing-library/react": "^13.4.0", 41 | "@types/react": "^18.0.28", 42 | "@types/react-dom": "^18.0.11", 43 | "@vitest/coverage-c8": "^0.27.3", 44 | "@vitest/coverage-istanbul": "^0.29.8", 45 | "happy-dom": "^6.0.4", 46 | "msw": "^0.49.3", 47 | "react": "^18.2.0", 48 | "react-dom": "^18.2.0", 49 | "vitest": "0.29.8" 50 | }, 51 | "peerDependencies": { 52 | "react": ">=16.8.0 || >=17.0.0 || >= 18.0.0" 53 | }, 54 | "publishConfig": { 55 | "access": "public" 56 | } 57 | } -------------------------------------------------------------------------------- /lib/src/index.ts: -------------------------------------------------------------------------------- 1 | import { useCallback, useEffect, useMemo, useState } from 'react'; 2 | 3 | type ViaCepResponse = { 4 | cep: string; 5 | logradouro: string; 6 | complemento: string; 7 | bairro: string; 8 | localidade: string; 9 | uf: string; 10 | ibge: string; 11 | gia: string; 12 | ddd: string; 13 | siafi: string; 14 | }; 15 | 16 | type UseViaCepHook = { 17 | cep: ViaCepResponse; 18 | error: string | null; 19 | loading: boolean; 20 | }; 21 | 22 | const useViaCep = (value: string | null = ''): UseViaCepHook => { 23 | const [cep, setCep] = useState({} as ViaCepResponse); 24 | const [error, setError] = useState(null); 25 | const [loading, setLoading] = useState(false); 26 | 27 | const cepFormatted = useMemo(() => { 28 | return String(value)?.replace(/\W/g, ''); 29 | }, [value]); 30 | 31 | const viaCepURL = useMemo(() => { 32 | return `https://viacep.com.br/ws/${cepFormatted}/json/`; 33 | }, [cepFormatted]); 34 | 35 | const fetchCep = useCallback(async () => { 36 | setLoading(true); 37 | try { 38 | const response = await fetch(viaCepURL, { method: 'GET' }); 39 | const json = await response.json(); 40 | 41 | setCep(json as ViaCepResponse); 42 | setError(json?.erro || null); // The VIA CEP API returns the 'erro' property. 43 | setLoading(false); 44 | } catch (err) { 45 | console.error('Error to get CEP: ', err); 46 | setLoading(false); 47 | setError('Error to get CEP'); 48 | } 49 | }, [viaCepURL]); 50 | 51 | useEffect(() => { 52 | if (cepFormatted.length === 8) { 53 | fetchCep(); 54 | } 55 | }, [cepFormatted.length, fetchCep]); 56 | 57 | return { cep, error, loading }; 58 | }; 59 | 60 | export default useViaCep; 61 | -------------------------------------------------------------------------------- /.eslintrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es2020": true, 5 | "jest": true, 6 | "node": true 7 | }, 8 | "settings": { 9 | "import/parsers": { 10 | "@typescript-eslint/parser": [".ts", ".tsx"] 11 | }, 12 | "import/resolver": { 13 | "typescript": {}, 14 | "node": { 15 | "extensions": [".js", ".jsx", ".ts", ".tsx"], 16 | "moduleDirectory": ["node_modules", "src/"] 17 | } 18 | }, 19 | "react": { 20 | "version": "detect" 21 | }, 22 | "ecmaFeatures": { 23 | "jsx": true 24 | } 25 | }, 26 | "extends": [ 27 | "eslint:recommended", 28 | "plugin:react/recommended", 29 | "plugin:@typescript-eslint/eslint-recommended", 30 | "plugin:@typescript-eslint/recommended", 31 | "plugin:prettier/recommended", 32 | "plugin:import/errors", 33 | "plugin:import/warnings", 34 | "plugin:import/typescript" 35 | ], 36 | "parser": "@typescript-eslint/parser", 37 | "parserOptions": { 38 | "ecmaFeatures": { 39 | "jsx": true 40 | }, 41 | "ecmaVersion": 11, 42 | "sourceType": "module" 43 | }, 44 | "plugins": ["import", "react", "react-hooks", "@typescript-eslint"], 45 | "rules": { 46 | "react-hooks/rules-of-hooks": "error", 47 | "react-hooks/exhaustive-deps": "warn", 48 | "react/prop-types": "off", 49 | "react/react-in-jsx-scope": "off", 50 | "@typescript-eslint/explicit-module-boundary-types": "off", 51 | "import/order": [ 52 | "warn", 53 | { 54 | "groups": [ 55 | ["builtin", "external"], 56 | ["internal", "parent"], 57 | ["sibling", "index"], 58 | "object" 59 | ], 60 | "newlines-between": "always", 61 | "alphabetize": { 62 | "order": "asc", 63 | "caseInsensitive": true 64 | } 65 | } 66 | ], 67 | "import/no-unresolved": "error" 68 | } 69 | } 70 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "pnpm-root", 3 | "private": true, 4 | "scripts": { 5 | "prebuild": "cp -r ./README.md ./lib/README.md", 6 | "build": "pnpm -F @rsiqueira/use-viacep build", 7 | "dev": "pnpm -F @rsiqueira/use-viacep dev", 8 | "test": "pnpm -F @rsiqueira/use-viacep test", 9 | "test:watch": "pnpm -F @rsiqueira/use-viacep test:watch", 10 | "coverage": "pnpm -F @rsiqueira/use-viacep coverage", 11 | "size": "size-limit", 12 | "prepare": "husky install", 13 | "prettier": "prettier", 14 | "lint": "eslint ./lib", 15 | "lint:fix": "eslint ./lib ./example --fix && yarn format", 16 | "type-check": "tsc --noEmit", 17 | "publish:dev": "pnpm run build && cd lib && npm publish --tag next", 18 | "publish:prod": "pnpm run build && cd lib && npm publish" 19 | }, 20 | "description": "PNPM monorepo template", 21 | "license": "MIT", 22 | "devDependencies": { 23 | "@commitlint/config-conventional": "^17.4.4", 24 | "@size-limit/preset-small-lib": "^8.2.4", 25 | "@typescript-eslint/eslint-plugin": "^5.54.0", 26 | "@typescript-eslint/parser": "^5.54.0", 27 | "commitlint": "^17.4.4", 28 | "eslint": "^8.35.0", 29 | "eslint-config-prettier": "^8.6.0", 30 | "eslint-import-resolver-typescript": "^3.5.3", 31 | "eslint-plugin-import": "^2.27.5", 32 | "eslint-plugin-prettier": "^4.2.1", 33 | "eslint-plugin-react": "^7.32.2", 34 | "eslint-plugin-react-hooks": "^4.6.0", 35 | "husky": "^8.0.3", 36 | "lint-staged": "^13.1.2", 37 | "prettier": "^2.8.4", 38 | "size-limit": "^8.2.4", 39 | "tsup": "^7.1.0", 40 | "typescript": "^5.0.3", 41 | "vite": "^4.2.1", 42 | "vitest": "0.29.8" 43 | }, 44 | "packageManager": "pnpm@7.9.0", 45 | "size-limit": [ 46 | { 47 | "path": "./lib/dist/index.js", 48 | "limit": "15 kb" 49 | }, 50 | { 51 | "path": "./lib/dist/index.mjs", 52 | "limit": "15 kb" 53 | } 54 | ] 55 | } -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # useViaCep 2 | 3 |

4 | 5 |

6 | 7 | ![use-viacep](https://badgen.net/bundlephobia/minzip/@rsiqueira/use-viacep) 8 | 9 | React hook to fetch Brazilian CEP's using ViaCEP api. 10 | 11 | ## Install 12 | 13 | ```bash 14 | npm i --save @rsiqueira/use-viacep # or yarn add @rsiqueira/use-viacep 15 | ``` 16 | 17 | ## Usage 18 | 19 | ```tsx 20 | import * as React from 'react'; 21 | import * as ReactDOM from 'react-dom'; 22 | import useViaCep from '@rsiqueira/use-viacep'; 23 | 24 | const App = () => { 25 | const [data, setData] = React.useState(''); 26 | const { cep, loading, error } = useViaCep(data); 27 | 28 | if (loading) { 29 | return

loading...

; 30 | } 31 | 32 | return ( 33 |
34 | setData(e.target.value)} /> 35 |
36 | ); 37 | }; 38 | 39 | ReactDOM.render(, document.getElementById('root')); 40 | ``` 41 | 42 | ## Contributing 43 | 44 | Clone this repository and run `pnpm install`. If you don't have pnpm, install it with `npm install -g pnpm`. 45 | 46 | ### Folder structure 47 | 48 | - `example` - A folder with an example project. Think as playground. 49 | - `lib` - The source of `@rsiqueira/use-viacep`. 50 | 51 | ### What is in this repository? 52 | 53 | - [PNPM](https://pnpm.io/workspaces) as workspace manager and package manager. 54 | - [TSUP](https://tsup.egoist.dev/) as a TypeScript universal package. 55 | - [Vitest](https://vitest.dev/) as a test runner. 56 | - [Size Limit](https://github.com/ai/size-limit) as a size limit plugin. 57 | - [Prettier](https://prettier.io/) as a code formatter. 58 | - [ESLint](https://eslint.org/) as a code linter. 59 | 60 | ### Using the Playground 61 | 62 | In the root of the repository, run the following command: 63 | 64 | ```bash 65 | pnpm run dev # to build the library (with --watch flag) 66 | pnpm -F example dev 67 | ``` 68 | 69 | The command will run the example project with [Vite](https://vitejs.dev/). 70 | 71 | ## Sponsors 72 | 73 | [![Sponsors](https://cdn.jsdelivr.net/gh/raisiqueira/static@master/sponsors.svg)](https://github.com/sponsors/raisiqueira) 74 | 75 | ## License 76 | 77 | MIT @ Rai Siqueira 78 | -------------------------------------------------------------------------------- /lib/README.md: -------------------------------------------------------------------------------- 1 | # useViaCep 2 | 3 |

4 | 5 |

6 | 7 | ![use-viacep](https://badgen.net/bundlephobia/minzip/@rsiqueira/use-viacep) 8 | 9 | React hook to fetch Brazilian CEP's using ViaCEP api. 10 | 11 | ## Install 12 | 13 | Use your prefer package manager 14 | 15 | ```bash 16 | npm i --save @rsiqueira/use-viacep 17 | # or 18 | yarn add @rsiqueira/use-viacep 19 | # or 20 | pnpm add @rsiqueira/use-viacep 21 | ``` 22 | 23 | ## Usage 24 | 25 | ```tsx 26 | import * as React from 'react'; 27 | import * as ReactDOM from 'react-dom'; 28 | import useViaCep from '@rsiqueira/use-viacep'; 29 | 30 | const App = () => { 31 | const [data, setData] = React.useState(''); 32 | const { cep, loading, error } = useViaCep(data); 33 | 34 | if (loading) { 35 | return

loading...

; 36 | } 37 | 38 | return ( 39 |
40 | setData(e.target.value)} /> 41 |
42 | ); 43 | }; 44 | 45 | ReactDOM.render(, document.getElementById('root')); 46 | ``` 47 | 48 | ## Contributing 49 | 50 | Clone this repository and run `pnpm install`. If you don't have pnpm, install it with `npm install -g pnpm`. 51 | 52 | ### Folder structure 53 | 54 | - `example` - A folder with an example project. Think as playground. 55 | - `lib` - The source of `@rsiqueira/use-viacep`. 56 | 57 | ### What is in this repository? 58 | 59 | - [PNPM](https://pnpm.io/workspaces) as workspace manager and package manager. 60 | - [TSUP](https://tsup.egoist.dev/) as a TypeScript universal package. 61 | - [Vitest](https://vitest.dev/) as a test runner. 62 | - [Size Limit](https://github.com/ai/size-limit) as a size limit plugin. 63 | - [Prettier](https://prettier.io/) as a code formatter. 64 | - [ESLint](https://eslint.org/) as a code linter. 65 | 66 | ### Using the Playground 67 | 68 | In the root of the repository, run the following command: 69 | 70 | ```bash 71 | pnpm run dev # to build the library (with --watch flag) 72 | pnpm -F example dev 73 | ``` 74 | 75 | The command will run the example project with [Vite](https://vitejs.dev/). 76 | 77 | ## Sponsors 78 | 79 | [![Sponsors](https://cdn.jsdelivr.net/gh/raisiqueira/static@master/sponsors.svg)](https://github.com/sponsors/raisiqueira) 80 | 81 | ## License 82 | 83 | MIT @ Rai Siqueira 84 | --------------------------------------------------------------------------------