1.1.0 - The project has been migrated to Typescript.
parent
e9528df03b
commit
da0a363429
|
|
@ -0,0 +1,2 @@
|
|||
node_modules
|
||||
dist
|
||||
|
|
@ -0,0 +1,32 @@
|
|||
{
|
||||
"root": true,
|
||||
"extends": [
|
||||
"prettier",
|
||||
"plugin:prettier/recommended",
|
||||
"eslint:recommended",
|
||||
"plugin:react/recommended",
|
||||
"plugin:@typescript-eslint/eslint-recommended",
|
||||
"plugin:@typescript-eslint/recommended"
|
||||
],
|
||||
"parser": "@typescript-eslint/parser",
|
||||
"plugins": ["@typescript-eslint", "prettier", "react", "react-hooks"],
|
||||
"rules": {
|
||||
"react-hooks/rules-of-hooks": "error",
|
||||
"react-hooks/exhaustive-deps": "warn",
|
||||
"@typescript-eslint/no-non-null-assertion": "off",
|
||||
"@typescript-eslint/ban-ts-comment": "off",
|
||||
"@typescript-eslint/no-explicit-any": "off"
|
||||
},
|
||||
"settings": {
|
||||
"react": {
|
||||
"version": "detect"
|
||||
}
|
||||
},
|
||||
"env": {
|
||||
"browser": true,
|
||||
"node": true
|
||||
},
|
||||
"globals": {
|
||||
"JSX": true
|
||||
}
|
||||
}
|
||||
|
|
@ -1,4 +1,3 @@
|
|||
|
||||
# See https://help.github.com/ignore-files/ for more about ignoring files.
|
||||
|
||||
# dependencies
|
||||
|
|
@ -6,18 +5,12 @@ node_modules
|
|||
|
||||
# builds
|
||||
build
|
||||
lib
|
||||
dist
|
||||
.rpt2_cache
|
||||
|
||||
# misc
|
||||
.DS_Store
|
||||
.env
|
||||
.env.local
|
||||
.env.development.local
|
||||
.env.test.local
|
||||
.env.production.local
|
||||
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
example/package-lock.json
|
||||
example/package-lock.json
|
||||
|
||||
coverage
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
#!/bin/sh
|
||||
. "$(dirname "$0")/_/husky.sh"
|
||||
|
||||
npm run precommit
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
//lab.code-rove.com/:_authToken=${OWN_NPM_TOKEN}
|
||||
@flare:registry=https://lab.code-rove.com/public-node-registry
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
{
|
||||
"bracketSpacing": true,
|
||||
"arrowParens": "avoid",
|
||||
"printWidth": 120,
|
||||
"trailingComma": "none",
|
||||
"singleQuote": false,
|
||||
"endOfLine": "auto"
|
||||
}
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
MIT License
|
||||
|
||||
Copyright (c) 2023 Tudor Stanciu
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining
|
||||
a copy of this software and associated documentation files (the
|
||||
"Software"), to deal in the Software without restriction, including
|
||||
without limitation the rights to use, copy, modify, merge, publish,
|
||||
distribute, sublicense, and/or sell copies of the Software, and to
|
||||
permit persons to whom the Software is furnished to do so, subject to
|
||||
the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be
|
||||
included in all copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
||||
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
||||
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
||||
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
|
||||
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
|
||||
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
|
||||
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||
|
|
@ -22,4 +22,6 @@ import { useWindowSize, useLink, useTitle } from "@flare/react-hooks";
|
|||
|
||||
## Changelog
|
||||
|
||||
**1.0.0** - This version includes the initial version of react-hooks package.
|
||||
**1.0.0** - This version includes the initial version of react-hooks package.
|
||||
**1.0.1** - Small changes related to appearance (domain and readme updates).
|
||||
**1.1.0** - The project has been migrated to Typescript.
|
||||
|
|
|
|||
|
|
@ -0,0 +1,17 @@
|
|||
{
|
||||
"transform": {
|
||||
"^.+\\.(t|j)sx?$": "ts-jest"
|
||||
},
|
||||
"testRegex": "(/tests/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$",
|
||||
"moduleFileExtensions": ["ts", "tsx", "js", "jsx", "json", "node"],
|
||||
"testEnvironment": "jsdom",
|
||||
"collectCoverage": true,
|
||||
"coverageThreshold": {
|
||||
"global": {
|
||||
"branches": 50,
|
||||
"functions": 50,
|
||||
"lines": 50,
|
||||
"statements": 50
|
||||
}
|
||||
}
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
115
package.json
115
package.json
|
|
@ -1,38 +1,22 @@
|
|||
{
|
||||
"name": "@flare/react-hooks",
|
||||
"version": "1.0.1",
|
||||
"description": "React hooks",
|
||||
"author": {
|
||||
"name": "Tudor Stanciu",
|
||||
"email": "tudor.stanciu94@gmail.com",
|
||||
"url": "https://lab.code-rove.com/tsp"
|
||||
},
|
||||
"license": "MIT",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://dev.azure.com/tstanciu94/Packages/_git/react-hooks"
|
||||
},
|
||||
"private": true,
|
||||
"keywords": [
|
||||
"flare",
|
||||
"react-hooks"
|
||||
],
|
||||
"main": "./src/index.js",
|
||||
"babel": {
|
||||
"presets": [
|
||||
"@babel/preset-react"
|
||||
]
|
||||
},
|
||||
"version": "1.1.0",
|
||||
"description": "react-hooks is an npm package that brings together multiple react hooks useful both in the development of the ecosystem in my home lab and for the general public.",
|
||||
"main": "./dist/cjs/index.js",
|
||||
"module": "./dist/esm/index.js",
|
||||
"types": "./dist/esm/index.d.ts",
|
||||
"scripts": {
|
||||
"prebuild": "rimraf build",
|
||||
"build": "npm run build:cjs && npm run build:copy-files",
|
||||
"build:cjs": "babel src -d build --copy-files",
|
||||
"build:copy-files": "node ./scripts/copy-files.js",
|
||||
"precommit": "lint-staged",
|
||||
"prepare": "husky install",
|
||||
"test": "echo \"Error: no test specified\" && exit 1",
|
||||
"build": "npm run build:esm && npm run build:cjs",
|
||||
"build:esm": "tsc",
|
||||
"build:cjs": "tsc --module commonjs --outDir dist/cjs",
|
||||
"test": "jest --config jestconfig.json",
|
||||
"format": "prettier --write \"{src,tests}/**/*.{js,ts,jsx,tsx}\"",
|
||||
"lint": "eslint \"{**/*,*}.{js,ts,jsx,tsx}\"",
|
||||
"prepublishOnly": "npm test && npm run lint",
|
||||
"prepush": "npm run build",
|
||||
"push": "cd build && npm publish --registry https://lab.code-rove.com/public-node-registry",
|
||||
"preversion": "npm run lint",
|
||||
"version": "npm run format",
|
||||
"push": "npm publish",
|
||||
"push:major": "npm run version:major && npm run push",
|
||||
"push:minor": "npm run version:minor && npm run push",
|
||||
"push:patch": "npm run version:patch && npm run push",
|
||||
|
|
@ -40,37 +24,52 @@
|
|||
"version:minor": "npm version minor --no-git-tag-version",
|
||||
"version:patch": "npm version patch --no-git-tag-version"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/cli": "^7.16.7",
|
||||
"@babel/core": "^7.16.7",
|
||||
"@babel/node": "^7.16.7",
|
||||
"@babel/preset-env": "^7.16.7",
|
||||
"@babel/preset-react": "^7.8.0",
|
||||
"rimraf": "^3.0.2",
|
||||
"fs-extra": "^10.0.0",
|
||||
"husky": "^7.0.4",
|
||||
"lint-staged": "^12.2.2",
|
||||
"prettier": "^2.5.1"
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://lab.code-rove.com/gitea/bricks/react-hooks"
|
||||
},
|
||||
"keywords": [
|
||||
"flare",
|
||||
"react-hooks"
|
||||
],
|
||||
"author": {
|
||||
"name": "Tudor Stanciu",
|
||||
"email": "tudor.stanciu94@gmail.com",
|
||||
"url": "https://lab.code-rove.com/tsp"
|
||||
},
|
||||
"license": "MIT",
|
||||
"bugs": {
|
||||
"url": "https://lab.code-rove.com/gitea/bricks/react-hooks/issues"
|
||||
},
|
||||
"homepage": "https://lab.code-rove.com/gitea/bricks/react-hooks#readme",
|
||||
"files": [
|
||||
"dist",
|
||||
"LICENSE",
|
||||
"README.md"
|
||||
],
|
||||
"peerDependencies": {
|
||||
"prop-types": "^15.8.1",
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0",
|
||||
"react-scripts": "5.0.1"
|
||||
"react-dom": "^18.2.0"
|
||||
},
|
||||
"dependencies": {},
|
||||
"prettier": {
|
||||
"trailingComma": "none",
|
||||
"tabWidth": 2,
|
||||
"semi": true,
|
||||
"singleQuote": false,
|
||||
"arrowParens": "avoid"
|
||||
},
|
||||
"lint-staged": {
|
||||
"**/*.+(js|md|ts|css|sass|less|graphql|scss|json|vue)": [
|
||||
"prettier --write",
|
||||
"git add"
|
||||
]
|
||||
"devDependencies": {
|
||||
"@testing-library/react": "^12.1.5",
|
||||
"@testing-library/react-hooks": "^7.0.2",
|
||||
"@types/jest": "^29.4.0",
|
||||
"@types/react": "^18.0.27",
|
||||
"@typescript-eslint/eslint-plugin": "^5.51.0",
|
||||
"@typescript-eslint/parser": "^5.51.0",
|
||||
"eslint": "^8.34.0",
|
||||
"eslint-config-prettier": "^8.6.0",
|
||||
"eslint-plugin-prettier": "^4.2.1",
|
||||
"eslint-plugin-react": "^7.32.2",
|
||||
"eslint-plugin-react-hooks": "^4.6.0",
|
||||
"jest": "^29.4.2",
|
||||
"jest-environment-jsdom": "^29.4.2",
|
||||
"prettier": "^2.8.4",
|
||||
"react": "^16.14.0",
|
||||
"react-dom": "16.14.0",
|
||||
"ts-jest": "^29.0.5",
|
||||
"typescript": "^4.9.5"
|
||||
},
|
||||
"publishConfig": {
|
||||
"registry": "https://lab.code-rove.com/public-node-registry"
|
||||
|
|
|
|||
|
|
@ -1,87 +0,0 @@
|
|||
/* eslint-disable no-console */
|
||||
const path = require("path");
|
||||
const fse = require("fs-extra");
|
||||
const glob = require("glob");
|
||||
|
||||
const packagePath = process.cwd();
|
||||
const buildPath = path.join(packagePath, "./build");
|
||||
const srcPath = path.join(packagePath, "./src");
|
||||
|
||||
/**
|
||||
* Puts a package.json into every immediate child directory of rootDir.
|
||||
* That package.json contains information about esm for bundlers so that imports
|
||||
* like import Typography from '@material-ui/core/Typography' are tree-shakeable.
|
||||
*
|
||||
* It also tests that an this import can be used in typescript by checking
|
||||
* if an index.d.ts is present at that path.
|
||||
*
|
||||
* @param {string} rootDir
|
||||
*/
|
||||
// async function createModulePackages({ from, to }) {
|
||||
// const directoryPackages = glob.sync('*/index.js', { cwd: from }).map(path.dirname);
|
||||
|
||||
// await Promise.all(
|
||||
// directoryPackages.map(async directoryPackage => {
|
||||
// const packageJson = {
|
||||
// sideEffects: false,
|
||||
// module: path.join('../esm', directoryPackage, 'index.js'),
|
||||
// typings: './index.d.ts',
|
||||
// };
|
||||
// const packageJsonPath = path.join(to, directoryPackage, 'package.json');
|
||||
|
||||
// /*const [typingsExist] =*/ await Promise.all([
|
||||
// //fse.exists(path.join(to, directoryPackage, 'index.d.ts')),
|
||||
// fse.writeFile(packageJsonPath, JSON.stringify(packageJson, null, 2)),
|
||||
// ]);
|
||||
|
||||
// // if (!typingsExist) {
|
||||
// // throw new Error(`index.d.ts for ${directoryPackage} is missing`);
|
||||
// // }
|
||||
|
||||
// return packageJsonPath;
|
||||
// }),
|
||||
// );
|
||||
// }
|
||||
|
||||
async function createPackageFile() {
|
||||
const packageData = await fse.readFile(
|
||||
path.resolve(packagePath, "./package.json"),
|
||||
"utf8"
|
||||
);
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
const { nyc, scripts, devDependencies, workspaces, ...packageDataOther } =
|
||||
JSON.parse(packageData);
|
||||
const newPackageData = {
|
||||
...packageDataOther,
|
||||
private: false,
|
||||
main: "./index.js"
|
||||
};
|
||||
const targetPath = path.resolve(buildPath, "./package.json");
|
||||
|
||||
await fse.writeFile(
|
||||
targetPath,
|
||||
JSON.stringify(newPackageData, null, 2),
|
||||
"utf8"
|
||||
);
|
||||
console.log(`Created package.json in ${targetPath}`);
|
||||
|
||||
fse.copy("./README.md", `${buildPath}/README.md`, err => {
|
||||
if (err) throw err;
|
||||
console.log("README file was copied to destination");
|
||||
});
|
||||
|
||||
return newPackageData;
|
||||
}
|
||||
|
||||
async function run() {
|
||||
try {
|
||||
await createPackageFile();
|
||||
|
||||
//await createModulePackages({ from: srcPath, to: buildPath });
|
||||
} catch (err) {
|
||||
console.error(err);
|
||||
process.exit(1);
|
||||
}
|
||||
}
|
||||
|
||||
run();
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
import { useEffect } from "react";
|
||||
|
||||
const useLink = (href, rel) => {
|
||||
const useLink = (href: string, rel: string) => {
|
||||
useEffect(() => {
|
||||
const link = document.createElement("link");
|
||||
link.href = href;
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
import { useEffect } from "react";
|
||||
|
||||
const useTitle = title => {
|
||||
const useTitle = (title: string): void => {
|
||||
useEffect(() => {
|
||||
const prevTitle = document.title;
|
||||
document.title = title;
|
||||
|
|
@ -1,53 +0,0 @@
|
|||
import { useState, useEffect } from "react";
|
||||
|
||||
const screenSizeLimit = {
|
||||
mobile: 768,
|
||||
tablet: 992
|
||||
};
|
||||
|
||||
const useWindowSize = () => {
|
||||
const [windowSize, setWindowSize] = useState({
|
||||
width: undefined,
|
||||
height: undefined
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
// Handler to call on window resize
|
||||
function handleResize() {
|
||||
// Set window width/height to state
|
||||
setWindowSize({
|
||||
width: window.innerWidth,
|
||||
height: window.innerHeight
|
||||
});
|
||||
}
|
||||
// Add event listener
|
||||
window.addEventListener("resize", handleResize);
|
||||
|
||||
// Call handler right away so state gets updated with initial window size
|
||||
handleResize();
|
||||
|
||||
// Remove event listener on cleanup
|
||||
return () => window.removeEventListener("resize", handleResize);
|
||||
}, []); // Empty array ensures that effect is only run on mount
|
||||
|
||||
const isMobile = windowSize.width < screenSizeLimit.mobile;
|
||||
const isTablet =
|
||||
windowSize.width >= screenSizeLimit.mobile &&
|
||||
windowSize.width < screenSizeLimit.tablet;
|
||||
const isDesktop = windowSize.width >= screenSizeLimit.tablet;
|
||||
|
||||
return {
|
||||
windowSize,
|
||||
isMobile,
|
||||
isTablet,
|
||||
isDesktop
|
||||
};
|
||||
};
|
||||
|
||||
export default useWindowSize;
|
||||
|
||||
/* Test it:
|
||||
<div>
|
||||
{windowSize.width}px / {windowSize.height}px
|
||||
</div>
|
||||
*/
|
||||
|
|
@ -0,0 +1,62 @@
|
|||
import { useState, useEffect, useMemo } from "react";
|
||||
|
||||
const screenSizeLimits = {
|
||||
mobile: 768,
|
||||
tablet: 992
|
||||
};
|
||||
|
||||
type WindowsSize = {
|
||||
width: number;
|
||||
height: number;
|
||||
};
|
||||
|
||||
const useWindowSize = (delay = 0) => {
|
||||
const [windowSize, setWindowSize] = useState<WindowsSize>({
|
||||
width: window.innerWidth,
|
||||
height: window.innerHeight
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
let resizeTimeout: NodeJS.Timeout;
|
||||
|
||||
// Handler to call on window resize
|
||||
function handleResize() {
|
||||
clearTimeout(resizeTimeout);
|
||||
resizeTimeout = setTimeout(() => {
|
||||
// Set window width/height to state
|
||||
setWindowSize({
|
||||
width: window.innerWidth,
|
||||
height: window.innerHeight
|
||||
});
|
||||
}, delay);
|
||||
}
|
||||
// Add event listener
|
||||
window.addEventListener("resize", handleResize);
|
||||
|
||||
// Call handler right away so state gets updated with initial window size
|
||||
handleResize();
|
||||
|
||||
return () => {
|
||||
clearTimeout(resizeTimeout);
|
||||
|
||||
// Remove event listener on cleanup
|
||||
window.removeEventListener("resize", handleResize);
|
||||
};
|
||||
}, [delay]);
|
||||
|
||||
const isMobile = useMemo(() => !!windowSize && windowSize.width < screenSizeLimits.mobile, [windowSize]);
|
||||
const isTablet = useMemo(
|
||||
() => !!windowSize && windowSize.width >= screenSizeLimits.mobile && windowSize.width < screenSizeLimits.tablet,
|
||||
[windowSize]
|
||||
);
|
||||
const isDesktop = useMemo(() => !!windowSize && windowSize.width >= screenSizeLimits.tablet, [windowSize]);
|
||||
|
||||
return {
|
||||
windowSize,
|
||||
isMobile,
|
||||
isTablet,
|
||||
isDesktop
|
||||
};
|
||||
};
|
||||
|
||||
export default useWindowSize;
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
{
|
||||
"include": ["src"],
|
||||
"exclude": ["dist", "node_modules"],
|
||||
"compilerOptions": {
|
||||
"target": "es5",
|
||||
"module": "esnext",
|
||||
"lib": ["dom", "esnext"],
|
||||
"importHelpers": true,
|
||||
"declaration": true,
|
||||
"sourceMap": true,
|
||||
"rootDir": "./src",
|
||||
"outDir": "./dist/esm",
|
||||
"strict": true,
|
||||
"noImplicitReturns": true,
|
||||
"noFallthroughCasesInSwitch": true,
|
||||
"noUnusedLocals": true,
|
||||
"noUnusedParameters": true,
|
||||
"moduleResolution": "node",
|
||||
"jsx": "react",
|
||||
"allowJs": false,
|
||||
"esModuleInterop": true,
|
||||
"skipLibCheck": true,
|
||||
"forceConsistentCasingInFileNames": true
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue