Files
motia/.npm-cache/_cacache/content-v2/sha512/2a/bc/00effdb0d4a7f5e3bf275b9cfae41f6c8109760665daec060398937794772cc943fb9c29f955a8f96a4fab22b12409a918d40cdae059ee8877dfecd365e1
2025-10-19 14:57:07 +00:00

1 line
18 KiB
Plaintext

{"_id":"react-use-resizable","_rev":"3-48b4d0f021af95ad8d3944f272e12541","name":"react-use-resizable","dist-tags":{"latest":"0.2.0"},"versions":{"0.1.2":{"name":"react-use-resizable","version":"0.1.2","description":"A react hook for creating resizable elements","main":"lib/index.js","types":"lib/index.d.ts","scripts":{"test":"jest --config jestconfig.json","build":"tsc","format":"prettier --write \"src/**/*.ts\" \"src/**/*.js\""},"repository":{"type":"git","url":"git+https://github.com/MikkelWestermann/react-use-resizable.git"},"author":{"name":"Mikkel Westermann"},"license":"ISC","bugs":{"url":"https://github.com/MikkelWestermann/react-use-resizable/issues"},"homepage":"https://github.com/MikkelWestermann/react-use-resizable#readme","keywords":["react","hook","resizable","resize","element"],"devDependencies":{"@types/jest":"^29.1.1","@types/react":"^18.0.21","@typescript-eslint/eslint-plugin":"^5.38.1","@typescript-eslint/parser":"^5.38.1","eslint":"^8.24.0","eslint-plugin-react":"^7.31.8","jest":"^29.1.2","prettier":"^2.7.1","ts-jest":"^29.0.3","typescript":"^4.8.4"},"peerDependencies":{"react":">=16.8.0"},"gitHead":"a124534679c63b028adefdbe034f9bd4b6be387e","_id":"react-use-resizable@0.1.2","_nodeVersion":"16.17.1","_npmVersion":"8.15.0","dist":{"integrity":"sha512-PKhBZg97gRey0ThtEeOCAWH3fl1qOj4X8GHjRr5ZVwW/S1fW8gteTAIlA9eTPxaLxfLwwVnY5h9rWaBLci7MLg==","shasum":"c7f0e39678789919bf3487e590c13edd0207b0be","tarball":"https://registry.npmjs.org/react-use-resizable/-/react-use-resizable-0.1.2.tgz","fileCount":2,"unpackedSize":6283,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIBcq72jgc4CiqWs8ETF2WYjdA6/+Uh4pkBMUWtbqXGFBAiAD0A+ytT7pS7h8lwu8Du4huIs9YNpGsSGNAahyNbqziQ=="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjS8w1ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpPMQ//SECvVjh9bGKK07fe6Ljj/oqrks7YFagAy+8m+IVIUsoZTi+j\r\nTrnx0334q0fuMhthzDc1WBzBDz+pdGgvNcJG4ismY0vZhruoBqTa6TWn0gcF\r\nqew9nHnLkyoONufNbldeoygeOiaU86clCjDeXWaOKFFwBuRM+3EsWrSVP1z7\r\nEu5NUmc19MWx6vhi5COvloJMCckPK1KhR46AdhB6m6keeUtbkjoxa/081gad\r\nWGPVutB29tPgoIIi1GGEOPhVuj7ycLHu4o8FE9kBBW8zs/FnaXm4+9ifpXsl\r\nuvWEVtfRLpPCsAQcRdbUNccI/D3jCv6Utb0VlWs4gHppLIhssPEY8rYR1+cc\r\nfjdrLbohRIqtp5dyYYn1inLPKWiJ4fF1/sn/HYpmt4lenT1w3s6AA3AAL1K5\r\nSlcD45OAQfXvg50wkeyx/XRm7Uyv8iMt9aS0cv/uRW8ZG5uZntEjPXERQWyA\r\neJMJO6IKn0RKrjbei51MzO5Ge9hYAHk02yjtWT8h7dTl0lc2UUJKeP5M+GtN\r\nTjuPhfo9lTjTqt8wU7W5OS0ZZyE1bZObkS8rSRQDO2GcSLhTdpwmkG4/5SA8\r\noUuBfsQszRKGujS1NU1x+62vmDePr10WxfbtGBq4IOTIhUKP7phI77PVIqof\r\nW9dloSOwQ1XM7xQQcQQBNxwC50pL+YYgGD8=\r\n=mh26\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"mikkelwestermann","email":"mikkel.westermann.98@gmail.com"},"directories":{},"maintainers":[{"name":"mikkelwestermann","email":"mikkel.westermann.98@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-use-resizable_0.1.2_1665911861579_0.2617410929499111"},"_hasShrinkwrap":false},"0.1.3":{"name":"react-use-resizable","version":"0.1.3","description":"A react hook for creating resizable elements","main":"lib/index.js","types":"lib/index.d.ts","scripts":{"test":"jest --config jestconfig.json","build":"tsc","format":"prettier --write \"src/**/*.ts\" \"src/**/*.js\""},"repository":{"type":"git","url":"git+https://github.com/MikkelWestermann/react-use-resizable.git"},"author":{"name":"Mikkel Westermann"},"license":"ISC","bugs":{"url":"https://github.com/MikkelWestermann/react-use-resizable/issues"},"homepage":"https://github.com/MikkelWestermann/react-use-resizable#readme","keywords":["react","hook","resizable","resize","element"],"devDependencies":{"@types/jest":"^29.1.1","@types/react":"^18.0.21","@typescript-eslint/eslint-plugin":"^5.38.1","@typescript-eslint/parser":"^5.38.1","eslint":"^8.24.0","eslint-plugin-react":"^7.31.8","jest":"^29.1.2","prettier":"^2.7.1","ts-jest":"^29.0.3","typescript":"^4.8.4"},"peerDependencies":{"react":">=16.8.0"},"gitHead":"4516f5fd902a53acb5fd0cba82e5e7e30e6ca5b9","_id":"react-use-resizable@0.1.3","_nodeVersion":"16.17.1","_npmVersion":"8.15.0","dist":{"integrity":"sha512-H1hpkjlWCNWCMR6J54sodp7WI50QQ6CWLhdsaHoPwQA1kUS+IlqViJ81130FoPF/V0/7gMaRbrMcWmfRZj+10g==","shasum":"1c5180aa93c7ae979a6d5fac4322caa4ddf69edd","tarball":"https://registry.npmjs.org/react-use-resizable/-/react-use-resizable-0.1.3.tgz","fileCount":4,"unpackedSize":16734,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCozJr5PSlk3gjigALJs57lNXyzB3u4q9ZFLZfIDB+CjQIhAM0OEIXhCTO7ERWY3scrP08LZvtHX8ZFjU7OOi14SYMV"}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjS8/nACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpTNhAApQ9TEc99Sf6RrqcG0w6vW91BXV35oOnMumOZ9HvZ1MjNkist\r\nvLRLJPCN8HBJSY0sgQOpoXfWKLmeBOKceIulWW62XshsgXLat59v3XX1ap6P\r\n4k+DsEJ1F1KPB9edMjMgzcKTiOxovh2SdMB34Cuz1keK1e5SKGB7jlHFtPfH\r\neA1g3FKkvtBWauhlZPyKgj+NECNjXlSSOGG7A9RhqMaz4L8pKiK/fsJ31gI8\r\ntAb++1MkliYiqTRpZlgLrWpnkwHEna5+VnF7mTaz3uOfAONQPR12292EzqUD\r\nPhuWY2Eawi1XvKxlRx3aproR9DcHt0dr2WV6etFN/xUX8LSYCGIfUEtEleaJ\r\n2c5CbIO7U5CWgzbRZNLS/Eu/v97FbwaYWO4eahwfc9Q78Zh5d8aMAs6F2QZe\r\naKbuIHBeO4u/Dmg8CEzcPxjzkhckHai9bBuWkLWs4Cpo+Jid1hdxICvDguBt\r\nrNZkh8MI+uhorlOFzF0ZfPBHS05Iq7fcA1P+rdnIE6blOKdGMdD6+M/hH9Ls\r\nfThzkHkRT/HvU4lgR6nI1vdzvk6vA0/8kXStpKyL6f2FP2Q0jvqpnV4/a5aq\r\nRjHlb2nhHaumuIB3QetQau2B47a8csa7e92ECiDTL2DWVL3qbmgHxFupPW/r\r\nZLpgp9uzXisvS1zW2bztTYa6rGIlq+u589I=\r\n=lzew\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"mikkelwestermann","email":"mikkel.westermann.98@gmail.com"},"directories":{},"maintainers":[{"name":"mikkelwestermann","email":"mikkel.westermann.98@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-use-resizable_0.1.3_1665912807070_0.6741413885081109"},"_hasShrinkwrap":false},"0.1.4":{"name":"react-use-resizable","version":"0.1.4","description":"A react hook for creating resizable elements","main":"lib/index.js","types":"lib/index.d.ts","scripts":{"test":"jest --config jestconfig.json","build":"tsc","format":"prettier --write \"src/**/*.ts\" \"src/**/*.js\""},"repository":{"type":"git","url":"git+https://github.com/MikkelWestermann/react-use-resizable.git"},"author":{"name":"Mikkel Westermann"},"license":"ISC","bugs":{"url":"https://github.com/MikkelWestermann/react-use-resizable/issues"},"homepage":"https://github.com/MikkelWestermann/react-use-resizable#readme","keywords":["react","hook","resizable","resize","element"],"devDependencies":{"@types/jest":"^29.1.1","@types/react":"^18.0.21","@typescript-eslint/eslint-plugin":"^5.38.1","@typescript-eslint/parser":"^5.38.1","eslint":"^8.24.0","eslint-plugin-react":"^7.31.8","jest":"^29.1.2","prettier":"^2.7.1","ts-jest":"^29.0.3","typescript":"^4.8.4"},"peerDependencies":{"react":">=16.8.0"},"gitHead":"3d673b366046886ab144ccc66a8ba804a494b736","_id":"react-use-resizable@0.1.4","_nodeVersion":"16.17.1","_npmVersion":"8.15.0","dist":{"integrity":"sha512-1jaSFuIKM/An2N5TGcrnE700aU8cX9IfhnVVjZ1WmE0gzrtZZfYpV62MqEjgn5tL+jhnE8AIvs3o5NTccz8UVg==","shasum":"f5d14f1200a793865aece67904892b9007604609","tarball":"https://registry.npmjs.org/react-use-resizable/-/react-use-resizable-0.1.4.tgz","fileCount":4,"unpackedSize":16756,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDMv9YvaPQoGm9Dwjl9PNtDAjqMGSN9F7ZhMocq7r+hCwIgfI4sLH6BG12naNcuLFNmifxMJuj4sk2E/xuxtbMxYGw="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjS9TjACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmq/JA/+M/hcSdP36StoXoiIx9qq45qDRKZWE+wAAaR/F+eYeeNrr0Zm\r\nAmaJNiX2XsG479/UZ6oOxypuxePAPqaO5GpJCAgNt9Ax46mGyMoahFpRZjtA\r\nv3ZeR7GWXf9ko8fK6q2QSB6vGcGt+l+Po3IHS2kcqrK6vLuVEJD5482jzWG6\r\nMpy57TbNpoxKdAOCEsgGvmlqtlUAKlBayHdjX3Yb68pOGWKV7CdYSJKfJFmp\r\nTin+GhwlannDWD27dtESIHL2zzvqqH74KSwq1Bdv2JzL9xPtAGYCwEL8nQ4F\r\nixhZOjWF6iZlkf+aV5GgUmT49EvUEYnDS1WSzvhUg75r+WF0wgpEd8BCmkks\r\nWgnX5jd+s8tQDPr04huTgp1Me+3UJOAVWYbeV51qhZcnLsywwPEJ/uhtistP\r\nCUXnY9V0iTMk9Z0KQaQDufqTRrO08Z8NNnzwFenNwNJt0kHbxFSM5UGs2gD1\r\nQUK6W4T0wNpR4nJ2hS89HbGyWpohtnOrj+p3RCEHWYIEDCnIAoNPCD12ECAY\r\ninLiFsW6veku/7mb8WMImbqhX+SHchlTza3bdFG2gNFnk3pjARODUw5ekgcg\r\nF4QqDGnMzWOe6o1MDgZj2Ih39XEqum3MYpMIfp5EgNG/mN0jkziIiHR3nAWF\r\n500zI1v144lq9HiIZcM1JN4wtFMvhQ6rINg=\r\n=CMHz\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"mikkelwestermann","email":"mikkel.westermann.98@gmail.com"},"directories":{},"maintainers":[{"name":"mikkelwestermann","email":"mikkel.westermann.98@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-use-resizable_0.1.4_1665914083305_0.14856209089122507"},"_hasShrinkwrap":false},"0.2.0":{"name":"react-use-resizable","version":"0.2.0","description":"A react hook for creating resizable elements","main":"lib/index.js","types":"lib/index.d.ts","scripts":{"test":"jest --config jestconfig.json","build":"tsc","format":"prettier --write \"src/**/*.ts\" \"src/**/*.js\""},"repository":{"type":"git","url":"git+https://github.com/MikkelWestermann/react-use-resizable.git"},"author":{"name":"Mikkel Westermann"},"license":"ISC","bugs":{"url":"https://github.com/MikkelWestermann/react-use-resizable/issues"},"homepage":"https://github.com/MikkelWestermann/react-use-resizable#readme","keywords":["react","hook","resizable","resize","element"],"devDependencies":{"@types/jest":"^29.1.1","@types/react":"^18.0.21","@typescript-eslint/eslint-plugin":"^5.38.1","@typescript-eslint/parser":"^5.38.1","eslint":"^8.24.0","eslint-plugin-react":"^7.31.8","jest":"^29.1.2","prettier":"^2.7.1","ts-jest":"^29.0.3","typescript":"^4.8.4"},"peerDependencies":{"react":">=16.8.0"},"gitHead":"27dbf3945dfddfdbc3ae194501a2900888d95c24","_id":"react-use-resizable@0.2.0","_nodeVersion":"16.17.1","_npmVersion":"8.15.0","dist":{"integrity":"sha512-gp1cSSNzRDuRouWTYYxKE7f8VC/4cqdGpgbN9rDNdaFSwCfze/ki+WJL0Zouab/HILDpfIGW2JqAz94VmfroLA==","shasum":"febf25e30c2a4b8fc17549d4e9aa07451a8ca053","tarball":"https://registry.npmjs.org/react-use-resizable/-/react-use-resizable-0.2.0.tgz","fileCount":4,"unpackedSize":18033,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDVNgHkbXVJt5ikFXrsD5ufuDyn2XpxLjLLO3hFIadhWwIhALnVSwTNipuqG9Pj1psNOX0fuA/4agPYF6WQeoy8n56c"}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjTsIWACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmokTg//QINwXfy4qp+wmk0fWluwdYX65mEuUtGdONxzNTIyWxyLZE/m\r\nfyupHA3fPAFGK2ERSoAKAAW5fkwtgU0J+o7/Cu898bOcqqV653jvSoVnNWaG\r\ntnPEIODt8AVKCXQPYIpXK7rnwR3cmkwoWO9heIeqLolf4APzgfjUmQlwIfl6\r\nGkri3sPz3O5pOm+s0Pt8gEjlJZ+IsC+XrUCfdQEbLk6QH+AbQ2sDfYlj20+j\r\nqUgY75OuUKHA6uJe8v3hmvbO6w60bhLsaEdiMUxKC2UoUyNSmACh0fTQpQx8\r\nXB7EL6C0w5yxnuUWTrAU4y6k/RnK8Ak6bAf/C4ynyb61nquZLIhg4XCmAEk7\r\nCDe1RZV65E135Dk5C0S9EgFIiS1HvNkPIjyGLbnf53Pb9TLImjgCNkZ7dKiH\r\nahxdVGlpbiRFsLddfqk+KFdY2rMWHSlj3oZ8XHxKo584liF6k5FdWngC0ZNO\r\n4j1aEs8JtRqewUSxq+Q6evt4BEmm9C6xiuhZg4prDuuuGESoQxCoPjbdMyf9\r\npRoxzwVJ5HMSfhu68/sCfRYLOOMGfBV1bwmhpYmqpl2AMce4gZEk9CNwLHUP\r\nSvNvVpf0aaYPyfF2tMeUo02sHp2/jYOrGIHl/qImOIbwM6IGrMtjKp1ATZ4K\r\n0efi0K6h/5Y2Qdx+tDhjTg1UQ5+QO194VKU=\r\n=7vQ7\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"mikkelwestermann","email":"mikkel.westermann.98@gmail.com"},"directories":{},"maintainers":[{"name":"mikkelwestermann","email":"mikkel.westermann.98@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-use-resizable_0.2.0_1666105878171_0.12994009316656152"},"_hasShrinkwrap":false}},"time":{"created":"2022-10-16T09:17:41.578Z","0.1.2":"2022-10-16T09:17:41.799Z","modified":"2022-10-18T15:11:18.447Z","0.1.3":"2022-10-16T09:33:27.223Z","0.1.4":"2022-10-16T09:54:43.447Z","0.2.0":"2022-10-18T15:11:18.357Z"},"maintainers":[{"name":"mikkelwestermann","email":"mikkel.westermann.98@gmail.com"}],"description":"A react hook for creating resizable elements","homepage":"https://github.com/MikkelWestermann/react-use-resizable#readme","keywords":["react","hook","resizable","resize","element"],"repository":{"type":"git","url":"git+https://github.com/MikkelWestermann/react-use-resizable.git"},"author":{"name":"Mikkel Westermann"},"bugs":{"url":"https://github.com/MikkelWestermann/react-use-resizable/issues"},"license":"ISC","readme":"# React Resizable Hook\n\nA lightweight (1.3kB gzipped!), hooks-based, easy-to-use alternative to [react-resizable](https://www.npmjs.com/package/react-resizable).\n\nCheck out the **[demo](https://mikkelwestermann.github.io/react-use-resizable/)**\n\n## Installation\n\n```\nnpm i react-use-resizable\n```\n\n## How to use\n\nThe hook returns an object with the following properties:\n- `rootRef`: A ref to the root element of the resizable component\n- `getRootProps`: A function that returns the props to be spread on the root element\n- `getHandleProps`: A function that returns the props to be spread on the handle element\n\n\nThe hooks behavior can be customized by passing an options object to the hook. The options object can have the following properties:\n| Property | Type | Description | Optional | Default |\n| --- | --- | --- | --- | --- |\n| `maxHeight` | `number` | The maximum height of the component | Yes | `Infinity` |\n| `maxWidth` | `number` | The maximum width of the component | Yes | `Infinity` |\n| `minHeight` | `number` | The minimum height of the component | Yes | `0` |\n| `minWidth` | `number` | The minimum width of the component | Yes | `0` |\n| `lockHorizontal` | `boolean` | Whether the component should be horizontally resizable | Yes | `false` |\n| `lockVertical` | `boolean` | Whether the component should be vertically resizable | Yes | `false` |\n| `onResize` | `function` | A callback function that is called when the component is resized | Yes | `() => {}` |\n| `onDragEnd` | `function` | A callback function that is called when the component is done resizing | Yes | `() => {}` |\n| `onDragStart` | `function` | A callback function that is called when the component starts resizing | Yes | `() => {}` |\n| `disabled` | `boolean` | Whether the component should be resizable | Yes | `false` |\n| `interval` | `number` | The interval at which the resize will occur (i.e. which sizes the component will snap to) | Yes | `1` |\n| `initialHeight` | `number` | The initial height of the component | Yes | `100` |\n| `initialWidth` | `number` | The initial width of the component | Yes | `100` |\n| `maintainAspectRatio` | `boolean` | Whether the component should maintain its aspect ratio (ratio between `initialHeight` and `initialWidth`) when resizing | Yes | `false` |\n\nMost of these properties can be overridden for each handle by passing passing an options object to the `getHandleProps` function. The options object can have the following properties:\n| Property | Type | Description | Optional | Default |\n| --- | --- | --- | --- | --- |\n| `maxHeight` | `number` | The maximum height of the component | Yes | `Infinity` |\n| `maxWidth` | `number` | The maximum width of the component | Yes | `Infinity` |\n| `minHeight` | `number` | The minimum height of the component | Yes | `0` |\n| `minWidth` | `number` | The minimum width of the component | Yes | `0` |\n| `lockHorizontal` | `boolean` | Whether the component should be horizontally resizable | Yes | `false` |\n| `lockVertical` | `boolean` | Whether the component should be vertically resizable | Yes | `false` |\n| `onResize` | `function` | A callback function that is called when the component is resized | Yes | `() => {}` |\n| `onDragEnd` | `function` | A callback function that is called when the component is done resizing | Yes | `() => {}` |\n| `onDragStart` | `function` | A callback function that is called when the component starts resizing | Yes | `() => {}` |\n| `disabled` | `boolean` | Whether the component should be resizable | Yes | `false` |\n| `interval` | `number` | The interval at which the resize will occur (i.e. which sizes the component will snap to) | Yes | `1` |\n| `maintainAspectRatio` | `boolean` | Whether the component should maintain its aspect ratio (ratio between `initialHeight` and `initialWidth`) when resizing | Yes | `false` |\n| `parent` | `RefObject<HTMLElement>` | A ref to the parent element of the handle | Yes | `null` |\n| `reverse` | `boolean` | Whether the handle should be reversed | Yes | `false` |\n\nPassing the same property to both the hook and the `getHandleProps` function will override the hook's property with the `getHandleProps` property.\n\nThe `onResize`, `onDragEnd` and `onDragStart` functions will be invoked with an object containing the following properties:\n| Property | Type | Description |\n| --- | --- | --- |\n`newHeight` | `number` | The new height of the component |\n`heightDiff` | `number` | The difference in height between the previous and the new height |\n`newWidth` | `number` | The new width of the component |\n`widthDiff` | `number` | The difference in width between the previous and the new width |\n\n\n## Example\n\nA simple example of how to use the hook:\n\n```jsx\nimport React from 'react';\nimport { useResizable } from 'react-use-resizable';\n\nconst FreeMoving = () => {\n const { getRootProps, getHandleProps } = useResizable({\n initialWidth: 150,\n initialHeight: 150\n });\n\n return (\n <div>\n <div\n className=\"bg-blue-500 relative rounded flex justify-center items-center\"\n {...getRootProps()}\n >\n <div className=\"text-white text-center\">Free moving</div>\n\n <div\n className=\"bg-blue-700 absolute bottom-0 right-0 p-2 rounded-tl-lg rounded-br text-white\"\n {...getHandleProps()}\n >\n Handle\n </div>\n </div>\n </div>\n );\n};\n```\n\nMany more examples can be found in the [demo](https://mikkelwestermann.github.io/react-use-resizable/).\n","readmeFilename":"README.md"}