{"_id":"@aloushek/react-detectable-overflow","_rev":"3-a1284dd1cf28dda8014d8bcfd440e857","name":"@aloushek/react-detectable-overflow","dist-tags":{"latest":"0.7.0"},"versions":{"0.6.2":{"name":"@aloushek/react-detectable-overflow","version":"0.6.2","description":"A React component that informs when the overflowed status is changed.","author":{"name":"Hotaka Kanazawa","email":"kanazawahotaka@gmail.com"},"license":"MIT","keywords":["react","react-component","text-overflow","ellipsis"],"repository":{"type":"git","url":"git+ssh://git@github.com/h-kanazawa/react-detectable-overflow.git"},"bugs":{"url":"https://github.com/h-kanazawa/react-detectable-overflow/issues"},"engines":{"node":">=12.14.0"},"main":"dist/index.js","types":"dist/index.d.ts","scripts":{"build":"rimraf ./dist/* && tsc --build tsconfig.json","jest":"jest","test":"yarn jest"},"devDependencies":{"@types/enzyme":"^3.10.9","@types/enzyme-adapter-react-16":"^1.0.6","@types/jest":"^26.0.24","@types/react":"^17.0.14","@types/react-dom":"^17.0.9","@types/sinon":"^7.5.1","enzyme":"^3.11.0","enzyme-adapter-react-16":"^1.15.6","jest":"26.6.0","react":"^17.0.2","react-dom":"^17.0.2","rimraf":"^3.0.2","sinon":"^8.0.4","ts-jest":"26.5.0","typescript":"^4.3.5"},"dependencies":{"react-resize-detector":"^6.7.4"},"peerDependencies":{"react":">=16.0.0","react-dom":">=16.0.0"},"jest":{"transform":{"^.+\\.tsx?$":"ts-jest"},"testRegex":"test/.*\\.test\\.(tsx?)$","moduleFileExtensions":["ts","tsx","js","json"],"setupFilesAfterEnv":["/test/setup.ts"]},"gitHead":"24f470a95392599d9b16ea10f069933220eb90f8","homepage":"https://github.com/h-kanazawa/react-detectable-overflow#readme","_id":"@aloushek/react-detectable-overflow@0.6.2","_nodeVersion":"16.6.1","_npmVersion":"7.20.3","dist":{"integrity":"sha512-MDrT/NTSOlvuQYiB1eiVtZwsYtKYHw2KuAx6qqu6xlSfh3Uhkoqk3vWcR7x7pKXoZcmi7x8EtMarnOTeupyBQw==","shasum":"fb2cf664b4755f8ff6e87eb891f51ad04e1f0405","tarball":"https://registry.npmjs.org/@aloushek/react-detectable-overflow/-/react-detectable-overflow-0.6.2.tgz","fileCount":19,"unpackedSize":15893,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhEThuCRA9TVsSAnZWagAAk8AP/0XP4R6YwpdOOusJjxmV\nDsc9SipMoyTWPtBg+PCrSOcMHhDOdl0KyNuWyfC+G9qHEhq2dTP1YN7m2aCR\ncPq7n++Twr8yz3zctH4bU4hXUSpxtveZcim8OtyBFq1/G9MPxWZ6gSsZdStc\nocycrMsIiGlVQhCAV+Xl14WM5OMshr/Jesei/dDHqM1k8zLVw1YhLpidNmb/\n4h44i/5Gnb5cz3u0/yVyB8kVHsCKvVIch7hGRf8+3XgzvytM0ZZxfTn0g8CD\njBXuL4R4+xxoe5jXK0Dvp0EeHO8BY0puSlyOsaGuLHzMBCViWjjVU3YeHveA\nIlVOlAoXxxC56BiCjzh9Xhr/Z7pfl0kmzRZbU+fOmpP9Nf32LJZF/IcR71N2\n5mvPptLootEnvl6E3ub18ON/J6WSoXc09vgkM4tVgeQwD60VrS4tBsoVJDvC\nDwaOuWDKsDjApCZkWLuf9ly+9wKYVl9QI7+Wzon4nivA1WXIPHmau2nZp8Bi\n6RrimTtZa6DN0VkFDqtQSlKppfS4sCM6MkYMKEY2EtPNEH3Bv0ip2A/jw506\nugbZMYo2MU94Oi6URewyU/18aGrB8D/65elQ8faC9b1rN/RC4CoV7edfP67v\nZVtQoQ18rNGJbtmR9exETQ5hzfaIXiicuGVul9IufuXMphsQyo+8s0d8O4Xa\nZRqX\r\n=cg13\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCeHzMAfmRi/3IzGX05zpAARYdI6zoYyfiU1bfypxO4xwIgJa6rvmx/L3Z73E1ufU5iZOM04TyalhwqTEGtN0zMEf8="}]},"_npmUser":{"name":"aloushek","email":"aloushdopita@gmail.com"},"directories":{},"maintainers":[{"name":"aloushek","email":"aloushdopita@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-detectable-overflow_0.6.2_1628518510620_0.41332448069076255"},"_hasShrinkwrap":false},"0.6.3":{"name":"@aloushek/react-detectable-overflow","version":"0.6.3","description":"A React component that informs when the overflowed status is changed.","author":{"name":"Hotaka Kanazawa","email":"kanazawahotaka@gmail.com"},"license":"MIT","keywords":["react","react-component","text-overflow","ellipsis"],"repository":{"type":"git","url":"git+ssh://git@github.com/h-kanazawa/react-detectable-overflow.git"},"bugs":{"url":"https://github.com/h-kanazawa/react-detectable-overflow/issues"},"engines":{"node":">=12.14.0"},"main":"dist/index.js","types":"dist/index.d.ts","scripts":{"build":"rimraf ./dist/* && tsc --build tsconfig.json","jest":"jest","test":"yarn jest"},"devDependencies":{"@types/enzyme":"^3.10.9","@types/enzyme-adapter-react-16":"^1.0.6","@types/jest":"^26.0.24","@types/react":"^17.0.14","@types/react-dom":"^17.0.9","@types/sinon":"^7.5.1","enzyme":"^3.11.0","enzyme-adapter-react-16":"^1.15.6","jest":"26.6.0","react":"^17.0.2","react-dom":"^17.0.2","rimraf":"^3.0.2","sinon":"^8.0.4","ts-jest":"26.5.0","typescript":"^4.3.5"},"dependencies":{"react-resize-detector":"^6.7.6"},"peerDependencies":{"react":">=16.0.0","react-dom":">=16.0.0"},"jest":{"transform":{"^.+\\.tsx?$":"ts-jest"},"testRegex":"test/.*\\.test\\.(tsx?)$","moduleFileExtensions":["ts","tsx","js","json"],"setupFilesAfterEnv":["/test/setup.ts"]},"gitHead":"46caf1fad30092598d05934b8336862ebb988a2a","homepage":"https://github.com/h-kanazawa/react-detectable-overflow#readme","_id":"@aloushek/react-detectable-overflow@0.6.3","_nodeVersion":"16.6.1","_npmVersion":"7.20.3","dist":{"integrity":"sha512-+y9p3VJSsfHvUsnSIOcEWrk3/818mYetDcW6diykVa7fXcZFNO0vwdBsOSb/zQmN47t5BNyrp2k3ACNghLfv6w==","shasum":"ab4024a5fb2f815d1b2ad7adbb052335ae20763a","tarball":"https://registry.npmjs.org/@aloushek/react-detectable-overflow/-/react-detectable-overflow-0.6.3.tgz","fileCount":19,"unpackedSize":15913,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiMFT6ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqWVw/8CB+Z2aGjYjArZYqFFvYiLgBGHKDNQ3/bXUQFIk0SZc6rjKDe\r\nvpMy8UkUE2dYZa9Jv6yPRzOoO++/ZzXsCjGVnGAnOWHnDImCrTrmvBZBNNWr\r\nBhPn7POQTbhVLOYyj4mIuwFyeD1P2JEIdYhckyIQMfRnhRGI8kMtQwHleNxY\r\nhJfYcZIbQZIlABgkk2ruYixwBTh1mISSXyy8GvfZ4MayyQ8SlpguiULTjask\r\nsoesr7aCGI6XgQxKMtEMBLdA7MdwioFpZqF+P7foFicljxIAwSMWdiuFFuYg\r\nnwltHRdcIzlU6yx9kQBuqxycjOw6x2OIdeUB18T8dJ8/ez6isNvJH4IiTu3r\r\nfORaaue3TsLBtCAg5G0cdhjz9lLp039P0YpjoFFmvQRA/k/dUCGv4yMN6OD3\r\naS8nmsrJEdOfpr8YDvQcqy7xlDW+NCt0g8FWRgyVJ0u9aiBJRjg0ydN5Cu4n\r\nZ+DLj4yHzJO3ndNN++IX4d3Gqb/H15WHNpFOto/AdonYxHqF99Bj7XDikFAB\r\nCe52DLAIUN1Kym5vKrrBiHVfLXDeuRvxnhJjJQqoCjoOeJCM+iBT7Hzojyh0\r\nskZHfI509a3rG8OHG7rTBfrO7vujvWfA5Qmf62ZrvbNbJORdoREquQE0PxVQ\r\noaa9r8qkcwr+AoLqAAAzOONpvevj61/gl20=\r\n=tk6m\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAcZGGAdy0Me7WcssZQlsE2whAUyHBYtUo+QZPgpdl48AiBMhFqmpwWXk5hqAdmXg01iUMaUo/EiU1H6Wd8iV8IICA=="}]},"_npmUser":{"name":"aloushek","email":"aloushdopita@gmail.com"},"directories":{},"maintainers":[{"name":"aloushek","email":"aloushdopita@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-detectable-overflow_0.6.3_1647334650211_0.7998663366069185"},"_hasShrinkwrap":false},"0.7.0":{"name":"@aloushek/react-detectable-overflow","version":"0.7.0","description":"A React component that informs when the overflowed status is changed.","author":{"name":"Hotaka Kanazawa","email":"kanazawahotaka@gmail.com"},"license":"MIT","keywords":["react","react-component","text-overflow","ellipsis"],"repository":{"type":"git","url":"git+ssh://git@github.com/h-kanazawa/react-detectable-overflow.git"},"bugs":{"url":"https://github.com/h-kanazawa/react-detectable-overflow/issues"},"engines":{"node":">=12.14.0"},"main":"dist/index.js","types":"dist/index.d.ts","scripts":{"build":"rimraf ./dist/* && tsc --build tsconfig.json","jest":"jest","test":"yarn jest"},"devDependencies":{"@types/enzyme":"^3.10.9","@types/enzyme-adapter-react-16":"^1.0.6","@types/jest":"^26.0.24","@types/react":"^18.0.14","@types/react-dom":"^18.0.5","@types/sinon":"^7.5.1","enzyme":"^3.11.0","enzyme-adapter-react-16":"^1.15.6","jest":"26.6.0","react":"^18.2.0","react-dom":"^18.2.0","rimraf":"^3.0.2","sinon":"^8.0.4","ts-jest":"26.5.0","typescript":"^4.3.5"},"dependencies":{"react-resize-detector":"^6.7.4"},"jest":{"transform":{"^.+\\.tsx?$":"ts-jest"},"testRegex":"test/.*\\.test\\.(tsx?)$","moduleFileExtensions":["ts","tsx","js","json"],"setupFilesAfterEnv":["/test/setup.ts"]},"gitHead":"58e3bb01359760f55f301768d5b7f43710a5e982","homepage":"https://github.com/h-kanazawa/react-detectable-overflow#readme","_id":"@aloushek/react-detectable-overflow@0.7.0","_nodeVersion":"16.6.1","_npmVersion":"7.20.3","dist":{"integrity":"sha512-QLF0O7xBYa64jh2b2joCBlS1MXbmkMP35jlFIhyClRYoi9z9scXvsyT98uj0SXDF4KY6q9npzAZm62pNyv2fZg==","shasum":"15d7e37b201a96940ef9d58517c21c43df391a64","tarball":"https://registry.npmjs.org/@aloushek/react-detectable-overflow/-/react-detectable-overflow-0.7.0.tgz","fileCount":19,"unpackedSize":16055,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDag825eB5R6/Fb47BIaOcvvKRFzqnx/0nWNA+Hus3+pAIhAMAJWkM6HG6JZoKL1A236+EMPRHmJ4mMXvGJWvAzWfeB"}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJitGm3ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqcNg//VFBSlgKZ77iSvxhQc1KNP6gDWb4EcRmb2U0y1cJtcYl/grKU\r\n03BUplFeuISDvDJxz+mU5Jvq/Gu40JMcg/qcjkVwciQgqfDarY1sz6JN6jzb\r\ns7PZuxvOe024Rdxb8zd/bTwS576jyfZRJhOQfFZQ1VsA0/CKvNo0H25HS9qx\r\nUan1J10rp4g/9W7aRcCOYRLqxreN+pHg/RLbgaZm7UXQiUhyQH1bh1iiXHFU\r\n/XwF+CzV+UVMaBw8DcC3P9s8XqvHMQrbLskNftjceod2NEsRI9KSE5DqPYYa\r\nois7Q9GuKn42YTGDT2zmWMrYywdcnLoV32a/FkET/wZI4V3/7eNMcAjmlJ0N\r\nJOeyau33wgaezHMkiZEnvss4g/1ANqYwR63YgQZuMrLyiiU0ysKWf/0N9dhE\r\nMrH7coMHd5LuHsgIR5UVWfcmmZETePNUH0zeVY2RRMJR0s4URsTnc0eilIVN\r\n65s+XGd1KtAD0TcdXi69VR/kSMaRZHSQfH6Kc4hERA1gbycHORnRMqtPeW3+\r\np8jkCMnPqY3jgp3JD17utmD5jCORTKTfQTrdnqAqFwmkLxo3aWg53Yjm4LRW\r\n7zfuNuMOmc307pnFrGdFG6y7OkVJW78U3UzR6NUJ3QhMD35JHxLjhuu7KG/p\r\nlllcuigZ38DJsGXgw78haaWAH+q9ab0q8bU=\r\n=rFfe\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"aloushek","email":"aloushdopita@gmail.com"},"directories":{},"maintainers":[{"name":"aloushek","email":"aloushdopita@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-detectable-overflow_0.7.0_1655990711788_0.34770839890191163"},"_hasShrinkwrap":false}},"time":{"created":"2021-08-09T14:15:10.514Z","0.6.2":"2021-08-09T14:15:10.766Z","modified":"2022-06-23T13:25:11.994Z","0.6.3":"2022-03-15T08:57:30.391Z","0.7.0":"2022-06-23T13:25:11.920Z"},"maintainers":[{"name":"aloushek","email":"aloushdopita@gmail.com"}],"description":"A React component that informs when the overflowed status is changed.","homepage":"https://github.com/h-kanazawa/react-detectable-overflow#readme","keywords":["react","react-component","text-overflow","ellipsis"],"repository":{"type":"git","url":"git+ssh://git@github.com/h-kanazawa/react-detectable-overflow.git"},"author":{"name":"Hotaka Kanazawa","email":"kanazawahotaka@gmail.com"},"bugs":{"url":"https://github.com/h-kanazawa/react-detectable-overflow/issues"},"license":"MIT","readme":"# Fork changes\r\n- correct detection while zoomed out\r\n- react-resize-detector with polyfill (https://caniuse.com/resizeobserver)\r\n\r\n# React Detectable Overflow\r\n\r\n[![Circle Status](https://circleci.com/gh/h-kanazawa/react-detectable-overflow.svg?style=shield&circle-token=bdff2eda82abf6802195c4c9935852b1f276745f)](https://circleci.com/gh/h-kanazawa/react-detectable-overflow)\r\n[![npm version](https://badge.fury.io/js/react-detectable-overflow.svg)](https://badge.fury.io/js/react-detectable-overflow)\r\n\r\nA React component which is able to detect changes in the state that the contents is overflowed.\r\n\r\n## [Demo](https://h-kanazawa.github.io/react-detectable-overflow/index.html)\r\n\r\n## Install\r\n\r\n```\r\nnpm install react-detectable-overflow\r\n```\r\nor\r\n```\r\nyarn add react-detectable-overflow\r\n```\r\n\r\n## Props\r\n\r\n|prop|required|type|description|default|\r\n|:--|:--|:--|:--|:--|\r\n|tag||string|element type (e.g. `'p'`, `'div'`)|'div'|\r\n|style||object|css style of the element|{
width: '100%',
textOverflow: 'ellipsis',
whiteSpace: 'nowrap',
overflow: 'hidden',
}|\r\n|className||string|class names|''|\r\n|onChange||(isOverflowed: boolean) => void|callback function called when its overflowing status is changed|\r\n\r\n## Example\r\n\r\n```jsx\r\nimport * as React from 'react';\r\nimport DetectableOverflow from 'react-detectable-overflow';\r\n\r\nclass SampleComponent extends React.Component {\r\n\r\n constructor(props) {\r\n super(props);\r\n this.handleChange = this.handleChange.bind(this);\r\n }\r\n\r\n handleChange(isOverflowed) {\r\n // do something\r\n }\r\n\r\n render {\r\n return (\r\n \r\n This is a sample text.\r\n \r\n );\r\n }\r\n}\r\n```\r\n\r\n## Caution\r\n\r\nBe careful when you change the length of `children` contents by onChange callback. The following code perhaps causes the infinite loop of changing `isOverflowed` state.\r\n\r\n```jsx\r\n// DO NOT WRITE LIKE THIS!\r\n {\r\n if (isOverflowed) {\r\n this.setState({ value: 'short' });\r\n } else {\r\n this.setState({ value: 'loooooooooooooooooooooooooooooooooooooong' });\r\n }\r\n }}\r\n >\r\n {this.state.value}\r\n\r\n```\r\n\r\n## License\r\n\r\nThis package is released under the MIT License, see [LICENSE](./LICENSE)\r\n\r\n## Changelog\r\n\r\n#### 0.4.0\r\n\r\n- BREAKING CHANGE: Support vertical overflow detection\r\n","readmeFilename":"README.md"}