Skip to content

Commit

Permalink
chore: remove support for rr 4, dependencies, and build improvements (#…
Browse files Browse the repository at this point in the history
…122)

* chore: remove support for rr 4, dependencies, and build improvements

* fix: small improvement to UMD build

* chore: remove unnecessary dependency

Co-authored-by: Justin Schrader <[email protected]>
  • Loading branch information
icd2k3 and jschrader-nr authored Jun 8, 2021
1 parent 9d2e185 commit b4c539a
Show file tree
Hide file tree
Showing 9 changed files with 1,186 additions and 1,772 deletions.
10 changes: 5 additions & 5 deletions .yarn/releases/yarn-berry.cjs → .yarn/releases/yarn-2.4.2.cjs

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion .yarnrc.yml
Original file line number Diff line number Diff line change
Expand Up @@ -4,4 +4,4 @@ plugins:
- path: .yarn/plugins/@yarnpkg/plugin-interactive-tools.cjs
spec: "@yarnpkg/plugin-interactive-tools"

yarnPath: .yarn/releases/yarn-berry.cjs
yarnPath: .yarn/releases/yarn-2.4.2.cjs
6 changes: 3 additions & 3 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
</p>

<p align="center">
A small (~1.6kb gzip), flexible, <a href="https://reactjs.org/docs/higher-order-components.html">higher order component</a> for rendering breadcrumbs with <a href="https://github.com/ReactTraining/react-router">react-router</a> 4 & 5
A small (~1.3kb compressed & gzipped), flexible, <a href="https://reactjs.org/docs/higher-order-components.html">higher order component</a> for rendering breadcrumbs with <a href="https://github.com/ReactTraining/react-router">react-router</a> 5
</p>

<hr/>
Expand Down Expand Up @@ -75,9 +75,9 @@ Start seeing generated breadcrumbs right away with this simple example ([codesan
import withBreadcrumbs from 'react-router-breadcrumbs-hoc';

const Breadcrumbs = ({ breadcrumbs }) => (
<React.Fragment>
<>
{breadcrumbs.map(({ breadcrumb }) => breadcrumb)}
</React.Fragment>
</>
)

export default withBreadcrumbs()(Breadcrumbs);
Expand Down
2 changes: 1 addition & 1 deletion babel.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,6 @@ module.exports = function(api) {
'@babel/preset-react',
'@babel/preset-typescript'
],
plugins: [],
plugins: ['@babel/plugin-transform-runtime'],
};
};
39 changes: 18 additions & 21 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "react-router-breadcrumbs-hoc",
"version": "3.4.0",
"version": "4.0.0",
"description": "small, flexible, higher order component for rendering breadcrumbs with react-router 4.x",
"repository": "icd2k3/react-router-breadcrumbs-hoc",
"main": "dist/cjs/index.js",
Expand All @@ -21,49 +21,46 @@
"license": "MIT",
"peerDependencies": {
"react": ">=16.8",
"react-router": ">=4"
"react-router": ">=5"
},
"devDependencies": {
"@babel/cli": "^7.14.3",
"@babel/core": "^7.14.3",
"@babel/preset-env": "^7.14.2",
"@babel/plugin-transform-runtime": "^7.14.3",
"@babel/preset-env": "^7.14.4",
"@babel/preset-react": "^7.13.13",
"@babel/preset-typescript": "^7.13.0",
"@commitlint/cli": "^12.1.4",
"@commitlint/config-conventional": "^12.1.4",
"@rollup/plugin-commonjs": "^19.0.0",
"@rollup/plugin-node-resolve": "^13.0.0",
"@types/node": "^15.6.1",
"@types/react": "^17.0.8",
"@types/react-dom": "^17.0.5",
"@types/react-router": "^5.1.14",
"@typescript-eslint/eslint-plugin": "^4.25.0",
"@typescript-eslint/parser": "^4.25.0",
"@rollup/plugin-babel": "^5.3.0",
"@rollup/plugin-typescript": "^8.2.1",
"@types/react": "^17.0.9",
"@types/react-dom": "^17.0.6",
"@types/react-router": "^5.1.15",
"@typescript-eslint/eslint-plugin": "^4.26.1",
"@typescript-eslint/parser": "^4.26.1",
"@wojtekmaj/enzyme-adapter-react-17": "^0.6.1",
"babel-eslint": "^10.1.0",
"babel-jest": "^27.0.1",
"coveralls": "^3.1.0",
"enzyme": "^3.11.0",
"eslint": "^7.27.0",
"eslint": "^7.28.0",
"eslint-config-airbnb": "^18.2.1",
"eslint-plugin-import": "^2.23.3",
"eslint-plugin-import": "^2.23.4",
"eslint-plugin-jsx-a11y": "^6.4.1",
"eslint-plugin-react": "^7.23.2",
"eslint-plugin-react-hooks": "^4.2.0",
"eslint-plugin-react": "^7.24.0",
"husky": "^6.0.0",
"jest": "^27.0.1",
"jest": "^27.0.4",
"jsdom": "^16.6.0",
"jsdom-global": "^3.0.2",
"pinst": "^2.1.6",
"prop-types": "^15.7.2",
"react": "17.0.2",
"react-dom": "17.0.2",
"react-router": "^5.2.0",
"rollup": "^2.50.1",
"rollup-plugin-babel": "^4.4.0",
"rollup": "^2.51.1",
"rollup-plugin-size": "^0.2.2",
"rollup-plugin-terser": "^7.0.2",
"rollup-plugin-typescript2": "^0.30.0",
"typescript": "4.1.5"
"typescript": "4.3.2"
},
"keywords": [
"react",
Expand Down
52 changes: 23 additions & 29 deletions rollup.config.js
Original file line number Diff line number Diff line change
@@ -1,57 +1,51 @@
import babel from 'rollup-plugin-babel';
import commonjs from '@rollup/plugin-commonjs';
import resolve from '@rollup/plugin-node-resolve';
import typescript from 'rollup-plugin-typescript2';
import ts from 'typescript';
import babel from '@rollup/plugin-babel';
import typescript from '@rollup/plugin-typescript';
import size from 'rollup-plugin-size';
import { terser } from 'rollup-plugin-terser';

const pkg = require('./package.json');

const external = Object.keys(pkg.peerDependencies);
const external = Object.keys(pkg.peerDependencies).concat(/@babel\/runtime/);

const extensions = ['.js', '.tsx'];

const plugins = [
typescript({
useTsconfigDeclarationDir: true,
tsconfigOverride: {
typescript: ts,
compilerOptions: {
module: 'es2015',
},
},
}),
const sharedPlugins = [
typescript(),
babel({
babelHelpers: 'runtime',
exclude: 'node_modules/**',
extensions,
}),
resolve({
mainFields: ['module', 'main', 'umd'],
extensions,
}),
size(),
];

const formats = [
{ format: 'cjs', file: pkg.main, plugins: plugins.concat([commonjs(), terser()]) },
{ format: 'umd', file: pkg.umd, plugins: plugins.concat([commonjs(), terser()]) },
{ format: 'es', file: pkg.module, plugins },
{ format: 'umd', file: pkg.umd, plugins: sharedPlugins.concat([terser({ format: { comments: false } })]) },
{ format: 'cjs', file: pkg.main, plugins: sharedPlugins },
{ format: 'es', file: pkg.module, plugins: sharedPlugins },
];

const globals = {
react: 'React',
'react-router': 'ReactRouter',
};

export default formats.map((item) => ({
export default formats.map(({ plugins, file, format }) => ({
input: 'src/index.tsx',
plugins: item.plugins,
plugins,
external,
output: {
exports: 'named',
file: item.file,
format: item.format,
file,
format,
name: 'react-router-breadcrumbs-hoc',
globals,
sourcemap: true,
globals: format !== 'umd'
? globals
: {
...globals,
'@babel/runtime/helpers/toConsumableArray': '_toConsumableArray',
'@babel/runtime/helpers/defineProperty': '_defineProperty',
'@babel/runtime/helpers/objectWithoutProperties': '_objectWithoutProperties',
},
},
}));
54 changes: 18 additions & 36 deletions src/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@
*/

import React, { createElement } from 'react';
import { useLocation, matchPath, withRouter } from 'react-router';
import { useLocation, matchPath } from 'react-router';

const DEFAULT_MATCH_OPTIONS = { exact: true };
const NO_BREADCRUMB = 'NO_BREADCRUMB';
Expand Down Expand Up @@ -269,48 +269,30 @@ const flattenRoutes = (routes: BreadcrumbsRoute[]) => (routes)
}, [] as BreadcrumbsRoute[]);

/**
* This is the main default HOC wrapper component. There is some
* logic in here for legacy react-router v4 support
* Accepts optional routes array and options and returns an array of
* breadcrumbs.
*
* @example
* import withBreadcrumbs from 'react-router-breadcrumbs-hoc';
* const Breadcrumbs = ({ breadcrumbs }) => (
* <>{breadcrumbs.map(({ breadcrumb }) => breadcrumb)}</>
* )
* export default withBreadcrumbs()(Breadcrumbs);
*/
export default (
const withBreadcrumbs = (
routes?: BreadcrumbsRoute[],
options?: Options,
) => (
Component: React.ComponentType<{
breadcrumbs: Array<React.ReactNode | string>
}>,
) => {
const sharedBreadcrumbProps = {
) => (props: any) => React.createElement(Component, {
...props,
breadcrumbs: getBreadcrumbs({
options,
routes: flattenRoutes(routes || []),
};

// use the location hook if available (5.x)
/* istanbul ignore else */
if (useLocation) {
return (props: any) => React.createElement(Component, {
...props,
breadcrumbs: getBreadcrumbs({
...sharedBreadcrumbProps,
location: useLocation(),
}),
});
}
location: useLocation(),
}),
});

// fallback to withRouter for older react-router versions (4.x)
/* istanbul ignore next */
return withRouter(
(props: { location: Location }) => {
// eslint-disable-next-line no-console
console.warn('[react-router-breadcrumbs-hoc]: react-router v4 support will be deprecated in the next major release. Please consider upgrading react-router and react-router-dom to >= 5.1.0');

return createElement(Component, {
...props,
breadcrumbs: getBreadcrumbs({
...sharedBreadcrumbProps,
location: props.location,
}),
});
},
);
};
export default withBreadcrumbs;
23 changes: 6 additions & 17 deletions tsconfig.json
Original file line number Diff line number Diff line change
@@ -1,25 +1,14 @@
{
"compilerOptions": {
"allowJs": true,
"checkJs": true,
"esModuleInterop": true,
"forceConsistentCasingInFileNames": true,
"jsx": "react",
"lib": ["es2015", "dom"],
"module": "commonjs",
"module": "esnext",
"moduleResolution": "node",
"noEmit": true,
"noImplicitAny": true,
"noImplicitReturns": true,
"noImplicitThis": true,
"noUnusedLocals": true,
"noUnusedParameters": true,
"outDir": "./dist",
"strictFunctionTypes": true,
"strictNullChecks": true,
"strictPropertyInitialization": true,
"target": "es5",
"declaration": true,
"declarationDir": "./dist"
"outDir": "dist",
"removeComments": true,
"strict": true,
"target": "es6"
},
"files": [
"src/index.tsx"
Expand Down
Loading

0 comments on commit b4c539a

Please sign in to comment.