NPM Error when adding package as a peer dependency - node.js

Question

I've 2 projects, where I use the same global components, and I decided to create a private npm package, when I moved my dependencies to peer dependencies it gives errors. I want to install packages without error, and when I try to install the npm package in my projects, I want to install it without npm i --legacy-peer-deps or npm i --force. My package.json file:
"dependencies": {
"react-helmet": "^6.1.0"
},
"devDependencies": {
"#babel/preset-env": "^7.14.1",
"#babel/preset-react": "^7.13.13",
"#rollup/plugin-babel": "^5.3.0",
"#rollup/plugin-commonjs": "^19.0.0",
"#rollup/plugin-node-resolve": "^13.0.0",
"#semantic-release/commit-analyzer": "8.0.1",
"#semantic-release/git": "9.0.0",
"#semantic-release/github": "7.2.3",
"#semantic-release/npm": "7.1.3",
"#semantic-release/release-notes-generator": "9.0.2",
"#storybook/addon-actions": "6.2.9",
"#storybook/addon-essentials": "6.2.9",
"#storybook/addon-info": "5.3.21",
"#storybook/addon-links": "6.2.9",
"#storybook/addons": "6.2.9",
"#storybook/react": "6.2.9",
"#testing-library/jest-dom": "5.11.9",
"#testing-library/react": "11.1.0",
"#testing-library/user-event": "12.6.3",
"#types/humps": "2.0.0",
"#types/jest": "26.0.15",
"#types/react-dom": "16.9.8",
"#types/react-helmet": "6.1.1",
"#types/react-router-dom": "5.1.7",
"#types/react-window": "1.8.2",
"#types/react-window-infinite-loader": "1.0.3",
"#typescript-eslint/eslint-plugin": "4.5.0",
"#typescript-eslint/parser": "4.5.0",
"eslint": "7.12.0",
"eslint-config-airbnb": "18.2.0",
"eslint-import-resolver-alias": "1.1.2",
"eslint-import-resolver-webpack": "0.13.0",
"eslint-plugin-import": "2.22.1",
"eslint-plugin-import-helpers": "1.1.0",
"eslint-plugin-jest": "24.1.0",
"eslint-plugin-jsx-a11y": "6.4.0",
"eslint-plugin-react": "7.21.5",
"eslint-plugin-react-hooks": "4.2.0",
"file-loader": "6.1.1",
"html-webpack-plugin": "4.5.0",
"jest": "26.6.1",
"prettier": "2.2.1",
"rollup": "^2.50.4",
"rollup-plugin-cleaner": "^1.0.0",
"rollup-plugin-delete": "^2.0.0",
"rollup-plugin-peer-deps-external": "^2.2.4",
"rollup-plugin-svg": "^2.0.0",
"rollup-plugin-typescript2": "^0.30.0",
"semantic-release": "17.4.2",
"size-limit": "4.10.2",
"style-loader": "2.0.0",
"ts-jest": "26.5.6",
"typescript-transform-paths": "2.2.3"
},
"peerDependencies": {
"#date-io/date-fns": "1.3.13",
"#hookform/resolvers": "1.3.0",
"#material-ui/core": "4.11.0",
"#material-ui/icons": "4.11.2",
"#material-ui/lab": "4.0.0-alpha.57",
"#material-ui/pickers": "3.2.10",
"#size-limit/preset-small-lib": "4.10.2",
"clsx": "1.1.1",
"date-fns": "2.17.0",
"humps": "2.0.1",
"i18next": "19.8.7",
"keycloak-js": "^12.0.4",
"memoize-one": "^5.1.1",
"notistack": "^1.0.6",
"react": ">=17.0.1",
"react-dom": "17.0.1",
"react-hook-form": "6.9.6",
"react-hotkeys-hook": "^3.2.1",
"react-i18next": "11.8.5",
"react-if": "^4.0.1",
"react-router": "5.2.0",
"react-router-dom": "5.2.0",
"react-virtualized-auto-sizer": "^1.0.4",
"react-window": "1.8.5",
"react-window-infinite-loader": "^1.0.7",
"yup": "0.29.3"
}
NPM ERROR:
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: #picsart/pa-backoffice-shared#1.0.0
npm ERR! Found: react#17.0.2
npm ERR! node_modules/react
npm ERR! peer react#">=16.0.0" from the root project
npm ERR! peer react#">=16.3.0" from react-helmet#6.1.0
npm ERR! node_modules/react-helmet
npm ERR! react-helmet#"^6.1.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"^16.8.0" from react-hook-form#6.9.6
npm ERR! node_modules/react-hook-form
npm ERR! peer react-hook-form#"6.9.6" from the root project
npm ERR! peer react-hook-form#">=6.6.0" from #hookform/resolvers#1.3.0
npm ERR! node_modules/#hookform/resolvers
npm ERR! peer #hookform/resolvers#"1.3.0" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See /Users/tikopicsart/.npm/eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/tikopicsart/.npm/_logs/2021-06-02T07_25_09_846Z-debug.log
How can I resolve it without npm i --legacy-peer-deps or npm i --force.