{"_id":"@anthonyjeamme/use-autohide-scrollbar","_rev":"2-f2343e3dbdb483ba357e63aaaa9a1303","name":"@anthonyjeamme/use-autohide-scrollbar","dist-tags":{"latest":"1.0.3"},"versions":{"1.0.0":{"name":"@anthonyjeamme/use-autohide-scrollbar","version":"1.0.0","description":"A JavaScript utility for CSS modules.","main":"dist/use-autohide-scrollbar.js","types":"dist/use-autohide-scrollbar.d.ts","repository":{"type":"git","url":"git+https://github.com/anthonyjeamme/use-autohide-scrollbar.git"},"bugs":{"url":"https://github.com/anthonyjeamme/use-autohide-scrollbar/issues"},"private":false,"homepage":"https://github.com/anthonyjeamme/use-autohide-scrollbar#readme","scripts":{"build":"tsc","test":"jest"},"author":{"name":"anthonyjeamme"},"license":"MIT","devDependencies":{"@testing-library/react-hooks":"^8.0.1","@types/jest":"^29.5.6","@types/react":"^17.0.69","jest":"^29.7.0","jest-environment-jsdom":"^29.7.0","react":"^17.0.2","react-dom":"^17.0.2","react-test-renderer":"^17.0.2","ts-jest":"^29.1.1","typescript":"^5.2.2"},"peerDependencies":{"react":">=16.8.0"},"_id":"@anthonyjeamme/use-autohide-scrollbar@1.0.0","_nodeVersion":"18.18.0","_npmVersion":"9.8.1","dist":{"integrity":"sha512-d8YFNYfXx+pQNPOtW0ikt3vKeYjKRyPHAhDM9P/wOGg4b2dxDJOmOlyFGhvgX7MsEG0X9gCTgUUM4/SS7bmhfQ==","shasum":"07d93f0ba495ddc4325ce23609fe7ee8ca8f400c","tarball":"https://registry.npmjs.org/@anthonyjeamme/use-autohide-scrollbar/-/use-autohide-scrollbar-1.0.0.tgz","fileCount":2,"unpackedSize":3388,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDYVbg+JhU2UnMepNhCPs4bS0V2CexaoOGR9lMp6N4oQAIhAPmN88zYTYRqI+rwqMzrpA8hosXz81DJnNFOaF9niwge"}]},"_npmUser":{"name":"anthonyjeamme","email":"anthony@jeamme.fr"},"directories":{},"maintainers":[{"name":"anthonyjeamme","email":"anthony@jeamme.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/use-autohide-scrollbar_1.0.0_1698682109967_0.024506274674820583"},"_hasShrinkwrap":false},"1.0.1":{"name":"@anthonyjeamme/use-autohide-scrollbar","version":"1.0.1","description":"A JavaScript utility for CSS modules.","main":"dist/use-autohide-scrollbar.js","types":"dist/use-autohide-scrollbar.d.ts","repository":{"type":"git","url":"git+https://github.com/anthonyjeamme/use-autohide-scrollbar.git"},"bugs":{"url":"https://github.com/anthonyjeamme/use-autohide-scrollbar/issues"},"private":false,"homepage":"https://github.com/anthonyjeamme/use-autohide-scrollbar#readme","scripts":{"build":"tsc","test":"jest"},"author":{"name":"anthonyjeamme"},"license":"MIT","devDependencies":{"@testing-library/react-hooks":"^8.0.1","@types/jest":"^29.5.6","@types/react":"^17.0.69","jest":"^29.7.0","jest-environment-jsdom":"^29.7.0","react":"^17.0.2","react-dom":"^17.0.2","react-test-renderer":"^17.0.2","ts-jest":"^29.1.1","typescript":"^5.2.2"},"peerDependencies":{"react":">=16.8.0"},"_id":"@anthonyjeamme/use-autohide-scrollbar@1.0.1","_nodeVersion":"18.18.0","_npmVersion":"9.8.1","dist":{"integrity":"sha512-VacULM3Dj+L7+OthEo0B9LBFqhvx8BPn+3RRMhFik1uy9Pow0Q96xS6CVWB1Ogln8MjCt2Pof7SYIvMQ/ugYyg==","shasum":"f55130c543a4d27b8c2fb2539fd144a7b6d2fcbb","tarball":"https://registry.npmjs.org/@anthonyjeamme/use-autohide-scrollbar/-/use-autohide-scrollbar-1.0.1.tgz","fileCount":6,"unpackedSize":6534,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCh3zjKWkgquDnyRO17FHD5lFY04yVj/nUuBUyO5obGagIhAPicbS9PYlgg+gAdCV9PMfBWYWJdjbns8pjZsl4VZAIs"}]},"_npmUser":{"name":"anthonyjeamme","email":"anthony@jeamme.fr"},"directories":{},"maintainers":[{"name":"anthonyjeamme","email":"anthony@jeamme.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/use-autohide-scrollbar_1.0.1_1698682193870_0.6395787199445195"},"_hasShrinkwrap":false},"1.0.3":{"name":"@anthonyjeamme/use-autohide-scrollbar","version":"1.0.3","description":"A JavaScript utility for CSS modules.","main":"dist/use-autohide-scrollbar.js","types":"dist/use-autohide-scrollbar.d.ts","repository":{"type":"git","url":"git+https://github.com/anthonyjeamme/use-autohide-scrollbar.git"},"bugs":{"url":"https://github.com/anthonyjeamme/use-autohide-scrollbar/issues"},"private":false,"homepage":"https://github.com/anthonyjeamme/use-autohide-scrollbar#readme","scripts":{"build":"tsc","test":"jest"},"author":{"name":"anthonyjeamme"},"license":"MIT","devDependencies":{"@testing-library/react-hooks":"^8.0.1","@types/jest":"^29.5.6","@types/react":"^17.0.69","jest":"^29.7.0","jest-environment-jsdom":"^29.7.0","react":"^17.0.2","react-dom":"^17.0.2","react-test-renderer":"^17.0.2","ts-jest":"^29.1.1","typescript":"^5.2.2"},"peerDependencies":{"react":">=16.8.0"},"_id":"@anthonyjeamme/use-autohide-scrollbar@1.0.3","_nodeVersion":"18.18.0","_npmVersion":"9.8.1","dist":{"integrity":"sha512-pDDQDHlUpWh6DKAFuxW49kkJf7mpLa7UG1N4x9ZHDBeqQ30NNSqF8VoLIdF/VmHd55z38zRwF61jI9cmEkavUA==","shasum":"0637fbce85874c58371cf4de2d3ed37ad9d0eae9","tarball":"https://registry.npmjs.org/@anthonyjeamme/use-autohide-scrollbar/-/use-autohide-scrollbar-1.0.3.tgz","fileCount":6,"unpackedSize":6534,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHSmX12gscTZHIYejMYwSxIyDOIsUx/lcsBvJeqi6K5WAiEAtXbTgt13Wzc8ev6AY5RAfs1aZFGapH4Y9xA8uV69JMI="}]},"_npmUser":{"name":"anthonyjeamme","email":"anthony@jeamme.fr"},"directories":{},"maintainers":[{"name":"anthonyjeamme","email":"anthony@jeamme.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/use-autohide-scrollbar_1.0.3_1698682358193_0.9305201532951477"},"_hasShrinkwrap":false}},"time":{"created":"2023-10-30T16:08:29.877Z","1.0.0":"2023-10-30T16:08:30.166Z","modified":"2023-10-30T16:12:38.596Z","1.0.1":"2023-10-30T16:09:54.020Z","1.0.3":"2023-10-30T16:12:38.435Z"},"maintainers":[{"name":"anthonyjeamme","email":"anthony@jeamme.fr"}],"description":"A JavaScript utility for CSS modules.","homepage":"https://github.com/anthonyjeamme/use-autohide-scrollbar#readme","repository":{"type":"git","url":"git+https://github.com/anthonyjeamme/use-autohide-scrollbar.git"},"author":{"name":"anthonyjeamme"},"bugs":{"url":"https://github.com/anthonyjeamme/use-autohide-scrollbar/issues"},"license":"MIT","readme":"> A JavaScript utility for CSS/SCSS modules.\r\n\r\n<p>\r\n  <a aria-label=\"NPM version\" href=\"https://www.npmjs.com/package/@anthonyjeamme/classname\">\r\n    <img alt=\"\" src=\"https://img.shields.io/npm/v/@anthonyjeamme/classname.svg\">\r\n  </a>\r\n  <a aria-label=\"License\" href=\"#\">\r\n    <img alt=\"\" src=\"https://img.shields.io/npm/l/classnames.svg\">\r\n  </a>\r\n</p>\r\n\r\n# Installation :\r\n\r\n```bash\r\nnpm i @anthonyjeamme/classname\r\n```\r\n\r\n# Usage\r\n\r\n_Component.tsx_ :\r\n\r\n```tsx\r\nimport classNameModule from \"@anthonyjeamme/classname\";\r\nimport styles from \"./Component.module.scss\";\r\nconst className = classNameModule(styles);\r\n\r\nconst Component = () => {\r\n  return <div {...className(\"Component\")}>Component</div>;\r\n};\r\n```\r\n\r\n_Component.module.scss_ :\r\n\r\n```scss\r\n.Component {\r\n  background: red;\r\n}\r\n```\r\n\r\n# Using variables\r\n\r\n_Component.tsx_ :\r\n\r\n```tsx\r\nimport classNameModule from \"@anthonyjeamme/classname\";\r\nimport styles from \"./Component.module.scss\";\r\nconst className = classNameModule(styles);\r\n\r\nconst Component = () => {\r\n  const [active, setActive] = useState(false);\r\n  const [type, setType] = useState(\"user\");\r\n\r\n  return <div {...className(\"Component\", { active, type })}>Component</div>;\r\n};\r\n```\r\n\r\n_Component.module.scss_ :\r\n\r\n```scss\r\n.Component {\r\n  background: red;\r\n\r\n  &.active {\r\n    background: blue;\r\n  }\r\n\r\n  &.type-user {\r\n    border: 2px solid purple;\r\n  }\r\n}\r\n```\r\n\r\n# Global classes\r\n\r\nPrefixing with `:` allows to use global classes :\r\n\r\n```js\r\nclassName(\":flex\");\r\n```\r\n\r\n_global.css_ :\r\n\r\n```css\r\n.flex {\r\n  display: flex;\r\n}\r\n```\r\n\r\n## Custom prefix\r\n\r\nCustom prefix can be set this way :\r\n\r\n```js\r\nconst className = classNameModule(styles, { globalPrefix: \"@\" });\r\n\r\nclassName(\"@flex\"); // Returns '.flex'\r\n```\r\n\r\n# Advanced configuration\r\n\r\n## Log unfound classes\r\n\r\n```js\r\nconst className = classNameModule(styles, { logUnfoundValues: true });\r\n```\r\n\r\nThen, this example will log a warning :\r\n\r\n```js\r\nclassName(\"UnknownClass\");\r\n```\r\n\r\n## Retaining Unfound Classes\r\n\r\nThis is an alternative way to use global variables :\r\n\r\n```js\r\nconst className = classNameModule(styles, { keepUnfoundValues: false });\r\nclassName(\"UnknownClass\"); // Returns ``\r\n```\r\n\r\n```js\r\nconst className = classNameModule(styles, { keepUnfoundValues: true });\r\nclassName(\"UnknownClass\"); // Returns `.UnknownClass`\r\n```\r\n","readmeFilename":"README.md"}