diff --git a/CHANGELOG.md b/CHANGELOG.md index d7f437d..29f4073 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -7,6 +7,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ## [Unreleased] +### Added + +- Add prop to submenu component to set the default open value + ### Changed - Update readme diff --git a/README.md b/README.md index 23c6329..653e2a3 100644 --- a/README.md +++ b/README.md @@ -154,7 +154,7 @@ import { Link } from 'react-router-dom'; - - SubMenu + SubMenu title string | ReactNode Title for the submenu @@ -166,6 +166,12 @@ import { Link } from 'react-router-dom'; Icon for submenu - + + defaultOpen + boolean + Set if the submenu is open by default + false + diff --git a/demo/package.json b/demo/package.json index 2f5cfe9..eb8916a 100644 --- a/demo/package.json +++ b/demo/package.json @@ -11,7 +11,6 @@ "react-dom": "^16.13.1", "react-icons": "^3.10.0", "react-intl": "^4.5.2", - "react-pro-sidebar": "^0.1.0-beta.1", "react-scripts": "3.4.1", "react-switch": "^5.0.1" }, diff --git a/demo/yarn.lock b/demo/yarn.lock index ffff7b3..783bdd8 100644 --- a/demo/yarn.lock +++ b/demo/yarn.lock @@ -2898,11 +2898,6 @@ class-utils@^0.3.5: isobject "^3.0.0" static-extend "^0.1.1" -classnames@^2.2.6: - version "2.2.6" - resolved "https://registry.yarnpkg.com/classnames/-/classnames-2.2.6.tgz#43935bffdd291f326dad0a205309b38d00f650ce" - integrity sha512-JR/iSQOSt+LQIWwrwEzJ9uk0xfN3mTVYMwt1Ir5mUcSN6pU+V4zQFFaJsclJbPuAUQH+yfWef6tm7l1quW3C8Q== - clean-css@^4.2.3: version "4.2.3" resolved "https://registry.yarnpkg.com/clean-css/-/clean-css-4.2.3.tgz#507b5de7d97b48ee53d84adb0160ff6216380f78" @@ -8887,11 +8882,6 @@ react-app-polyfill@^1.0.6: regenerator-runtime "^0.13.3" whatwg-fetch "^3.0.0" -react-button-test@^0.1.1: - version "0.1.1" - resolved "https://registry.yarnpkg.com/react-button-test/-/react-button-test-0.1.1.tgz#b41b8ec5e59feacddc26b5b13c26af2b62b423d2" - integrity sha512-KyXTU1c7fpBuqyhq1hJ162FCMgblSnNYWAT23ADpDD+s0RgzxzBdCmZPBjGLNLRdae9/yrRYAvdIvp4GDEV4lg== - react-dev-utils@^10.2.1: version "10.2.1" resolved "https://registry.yarnpkg.com/react-dev-utils/-/react-dev-utils-10.2.1.tgz#f6de325ae25fa4d546d09df4bb1befdc6dd19c19" @@ -8967,14 +8957,6 @@ react-is@^16.12.0, react-is@^16.7.0, react-is@^16.8.1, react-is@^16.8.4: resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4" integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ== -react-pro-sidebar@^0.1.0-beta.1: - version "0.1.0-beta.1" - resolved "https://registry.yarnpkg.com/react-pro-sidebar/-/react-pro-sidebar-0.1.0-beta.1.tgz#66b1938764aff7045b2cdf5b20f57c270ddca560" - integrity sha512-5YgcTlme6RrckA1qcYtv/2SsqjIE1pYzPCAz2UA/OGGOtN+Vlsq/hF4qaJuHSSVYgRWyqERFLqm7GNxY/X+IBw== - dependencies: - classnames "^2.2.6" - react-slidedown "^2.4.5" - react-scripts@3.4.1: version "3.4.1" resolved "https://registry.yarnpkg.com/react-scripts/-/react-scripts-3.4.1.tgz#f551298b5c71985cc491b9acf3c8e8c0ae3ada0a" @@ -9035,13 +9017,6 @@ react-scripts@3.4.1: optionalDependencies: fsevents "2.1.2" -react-slidedown@^2.4.5: - version "2.4.5" - resolved "https://registry.yarnpkg.com/react-slidedown/-/react-slidedown-2.4.5.tgz#d575404256fa0ba81e60161547a8fa9ff62b935d" - integrity sha512-zFDhgqQ1ZLfRr+rQA7p+13OTT/+zUR/+3v3JnwrnXPM8R+1KHhuTNseYHU8jYN3QfxjJXtqve0rgbWCBiFkpiw== - dependencies: - tslib "^1.9.0" - react-switch@^5.0.1: version "5.0.1" resolved "https://registry.yarnpkg.com/react-switch/-/react-switch-5.0.1.tgz#449277f4c3aed5286fffd0f50d5cbc2a23330406" diff --git a/src/ProSidebar/SubMenu.tsx b/src/ProSidebar/SubMenu.tsx index c0d622c..988459b 100644 --- a/src/ProSidebar/SubMenu.tsx +++ b/src/ProSidebar/SubMenu.tsx @@ -6,17 +6,16 @@ export interface Props { className?: string; icon?: React.ReactNode; title?: React.ReactNode; + defaultOpen?: boolean; } const SubMenu: React.ForwardRefRenderFunction = ( - { children, icon, className, title, ...rest }, + { children, icon, className, title, defaultOpen = false, ...rest }, ref, ) => { - const [height, setHeight] = useState(0); - const [closed, setClosed] = useState(true); + const [closed, setClosed] = useState(!defaultOpen); const handleToggleSubMenu = () => { - setHeight(height === 0 ? 'auto' : 0); setClosed(!closed); }; @@ -25,7 +24,7 @@ const SubMenu: React.ForwardRefRenderFunction = ( return (