{"_id":"@alitajs/inspx","_rev":"5-9f8d829a5225f17e9795c85ef05cc585","name":"@alitajs/inspx","dist-tags":{"latest":"0.0.2"},"versions":{"0.0.1-alpha.6":{"version":"0.0.1-alpha.6","license":"MIT","main":"dist/index.js","typings":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"start":"tsdx watch","build":"tsdx build","test":"tsdx test --passWithNoTests","lint":"tsdx lint","prepare":"tsdx build"},"peerDependencies":{"react":">=16"},"husky":{"hooks":{"pre-commit":"tsdx lint"}},"prettier":{"printWidth":120,"semi":true,"singleQuote":true,"trailingComma":"es5"},"name":"@alitajs/inspx","author":{"name":"raunofreiberg"},"module":"dist/inspx.esm.js","devDependencies":{"@types/react":"^17.0.3","@types/react-dom":"^17.0.3","husky":"^6.0.0","postcss":"^8.2.12","react":"^17.0.2","react-dom":"^17.0.2","rollup-plugin-postcss":"^4.0.0","tsdx":"^0.14.1","tslib":"^2.2.0","typescript":"^4.2.4"},"dependencies":{"@radix-ui/popper":"^0.0.10"},"description":"Pixel perfect layout inspection.","repository":{"type":"git","url":"git+https://github.com/raunofreiberg/inspx.git"},"bugs":{"url":"https://github.com/raunofreiberg/inspx/issues"},"homepage":"https://github.com/raunofreiberg/inspx#readme","publishConfig":{"access":"public"},"gitHead":"1edf0e01b64bf0a518db0713c5795ec11002097e","_id":"@alitajs/inspx@0.0.1-alpha.6","_nodeVersion":"14.16.1","_npmVersion":"6.14.12","dist":{"integrity":"sha512-2+08ZTExVDcLiWpWxS6cU7ybfNNeykKfyW/zMuMQtGDjs+hn6ujp99w4DhKvM43xlnaBJFgCXWjcObGH2nlPIQ==","shasum":"04717f9216bc95329c5bcde6d5522f88222a71dd","tarball":"https://registry.npmjs.org/@alitajs/inspx/-/inspx-0.0.1-alpha.6.tgz","fileCount":13,"unpackedSize":127382,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgmNdzCRA9TVsSAnZWagAAwiwP/ji7KZlOxDACMK/eRvOB\nthfzFgLKHVGLvVNHta8g0B3NpgzpdDZAgmBXdDyVwSYcXDp4HEdTi4y/aSYm\nQwebpFQgTyDdZE3sCozWSVFyDb0B7AAFtJvUHD8uA9dBg9BOLjINMF45xsty\n22Adx8uXUZwemi9PdAdsHXDZ0z61g5b28awGAzNDauSRfzpsNTU35A+pc+pS\nD4WcB/OddzhlWXC4iU0R46UI3bq5Ci+WrG4y0QHURgJGNqT3sTPkK5CTr/+u\nwo9W52BeMmRR/GIHNw52PkwjEERvFt/ntyQ/cJPR1fplNbgdUbnBUr1Xm4y2\nuQv2TiM6c0PEGeqIz3hoTxnib0IvMZOQYPsVZmrUmxvp41/95eVWld8f76Gb\nF4FX7AmNvsYga4c8Poselo6ln4GqtxsQzDmaoWI/zs7fZMmgOJs+WZOnMTpL\ndnVYZy1atu1/1F53CzAPvuhMugjDm9VDb/OAQBOoFxaPA+/jagIDdIDg3uk1\nG+L00dTrhsz0KYcG9RjrikMmpzK/DJHGGHJ0v2SzmAT58kosY6xThiUO1mGv\nIQlPYw4geySv+nh32yzVjKFHA57STS0hSw4LYMNA+cxo6kg4lEeSMo4rGfH2\nxas/lGPC4m+zM5fMei6Ly8VuMajz1/TjfFFnaeN2+zBM3ZyBR6+cIeZNu1MW\ncMoe\r\n=pPYU\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHfRYd8rmZcvH7Vema3NTGBEbi3To5sQzw6srHsE7kHaAiBkdE/Iv+pTbdrus8soMW4UyjsycZ66c0y+KcwSJuZdNg=="}]},"_npmUser":{"name":"xiaohuoni","email":"448627663@qq.com"},"directories":{},"maintainers":[{"name":"hammersjs","email":"1270253618@qq.com"},{"name":"xiaohuoni","email":"448627663@qq.com"},{"name":"imhele","email":"work@imhele.com"},{"name":"wangxingkang","email":"156148958@qq.com"},{"name":"shawdanon","email":"shawdanon@foxmail.com"},{"name":"cjy0208","email":"fanluan058@gmail.com"},{"name":"sorrycc","email":"sorrycc@gmail.com"},{"name":"hang1017","email":"437132124@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/inspx_0.0.1-alpha.6_1620629362985_0.5006866438090147"},"_hasShrinkwrap":false},"0.0.2":{"version":"0.0.2","license":"MIT","main":"dist/index.js","typings":"dist/index.d.ts","engines":{"node":">=10"},"scripts":{"start":"tsdx watch","build":"tsdx build","test":"tsdx test --passWithNoTests","lint":"tsdx lint","prepare":"tsdx build"},"peerDependencies":{"react":">=16"},"husky":{"hooks":{"pre-commit":"tsdx lint"}},"prettier":{"printWidth":120,"semi":true,"singleQuote":true,"trailingComma":"es5"},"name":"@alitajs/inspx","author":{"name":"raunofreiberg"},"module":"dist/inspx.esm.js","devDependencies":{"@types/react":"^17.0.3","@types/react-dom":"^17.0.3","husky":"^6.0.0","postcss":"^8.2.12","react":"^17.0.2","react-dom":"^17.0.2","rollup-plugin-postcss":"^4.0.0","tsdx":"^0.14.1","tslib":"^2.2.0","typescript":"^4.2.4"},"dependencies":{"@radix-ui/popper":"^0.0.10"},"description":"Pixel perfect layout inspection.","repository":{"type":"git","url":"git+https://github.com/raunofreiberg/inspx.git"},"bugs":{"url":"https://github.com/raunofreiberg/inspx/issues"},"homepage":"https://github.com/raunofreiberg/inspx#readme","publishConfig":{"access":"public"},"gitHead":"2cc211dd50e4660ea2f2df706fd2931b6935f5fe","_id":"@alitajs/inspx@0.0.2","_nodeVersion":"14.16.1","_npmVersion":"6.14.12","dist":{"integrity":"sha512-aaF3vC66aa8WcuGg8DtkLkcn6qAy0zrTxoeg2fqCLPLWFfW1XOpQ8VGxx9gFqQCSEmgegHTTLf25M/wI25/ZQw==","shasum":"10cd0765277020e1e2872b1fa7a294c37a1a79f6","tarball":"https://registry.npmjs.org/@alitajs/inspx/-/inspx-0.0.2.tgz","fileCount":13,"unpackedSize":127791,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgnI++CRA9TVsSAnZWagAAJ24P/i2pSwlrJJC1RQN5EbCt\n5LQTxRPDot9iBTFW/DI6Ipgz+kYurjLvHSzo5RRZicgTNwONFDO8GZiZKuWR\nKiTbskLNiTdFUFMXRw9eSx4UwZ3j4Jr8Jw0UcSZd1xcUT4j/FoGIJRXEUtLu\noPvG7j9k4+oIZWchUdg6GOsKYngALRwUg1yWfUTRWexjx0ysMvgzq9WqBU9Z\n7gGaY2R2EQtslh2wYJcs9cFgpCE3aw8G8nbuwoTlFDf6VEPbCthQ2wc5daIo\nedxd5VlK7MVYNMS5TkKe5K00zCeonY8ZNe55jVxvQIQR/RH1gUb7qnhE50Tb\n1YIM7odpVlYFdfW5pFpIfvqnEI0gNa9guJR36Z4bx0ziZYQBkabApqI/UqZh\nhNfoDw2YNyqVlGKsiG1iyuj6jm5+enJRyE/xGWSNZQkX6LjJJauQ1jPthbdA\nuRvMK5OpfdpSHYWmWE/JFrqCmFN6Pt8MafzCQsGJhVwDKmWNQYVBWCiQ8XsU\nI5b7uhVP4r0tD5E61wouDwCcW46tgyXk/w6ttlsisG50KKvWyfRT6UMPq79C\nU7RTbSOKjXZt7Wvao5pIkF1XAeHyPjYaBI1YfnrEaXEqiNqaw6tjgp8NBmwy\nWioVqokdsHLpYwwxQ2Rw68Ju5iQ+CpdwLFsdtckYPtAZBYYSfEPVSbDFheMW\nDzlb\r\n=oR6/\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIG30cqMuEE2weERelyBgSiiC2HYUjnCsMMaNiW8Zn9rzAiAGLZr6N3gfg04OAQuBSlvCzHrND0pj7/pRy3feiBX0JA=="}]},"_npmUser":{"name":"xiaohuoni","email":"448627663@qq.com"},"directories":{},"maintainers":[{"name":"hammersjs","email":"1270253618@qq.com"},{"name":"xiaohuoni","email":"448627663@qq.com"},{"name":"imhele","email":"work@imhele.com"},{"name":"wangxingkang","email":"156148958@qq.com"},{"name":"shawdanon","email":"shawdanon@foxmail.com"},{"name":"cjy0208","email":"fanluan058@gmail.com"},{"name":"sorrycc","email":"sorrycc@gmail.com"},{"name":"hang1017","email":"437132124@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/inspx_0.0.2_1620873150392_0.6410361253761236"},"_hasShrinkwrap":false}},"time":{"created":"2021-05-10T06:49:22.701Z","0.0.1-alpha.6":"2021-05-10T06:49:23.087Z","modified":"2022-06-07T09:42:33.773Z","0.0.2":"2021-05-13T02:32:30.519Z"},"maintainers":[{"email":"pt370390794@126.com","name":"pengyh"},{"email":"savebtc11@gmail.com","name":"ashoka_j"},{"email":"13067111941x@gmail.com","name":"diyc"},{"email":"448627663@qq.com","name":"xiaohuoni"},{"email":"work@imhele.com","name":"imhele"},{"email":"156148958@qq.com","name":"wangxingkang"},{"email":"292973338@qq.com","name":"shawdanon"},{"email":"fanluan058@gmail.com","name":"cjy0208"},{"email":"sorrycc@gmail.com","name":"sorrycc"},{"email":"437132124@qq.com","name":"hang1017"},{"email":"1270253618@qq.com","name":"hammersjs"}],"description":"Pixel perfect layout inspection.","homepage":"https://github.com/raunofreiberg/inspx#readme","repository":{"type":"git","url":"git+https://github.com/raunofreiberg/inspx.git"},"author":{"name":"raunofreiberg"},"bugs":{"url":"https://github.com/raunofreiberg/inspx/issues"},"license":"MIT","readme":"![image](/www/public/og.png)\n\n## inspx\n\n![npm](https://img.shields.io/npm/v/inspx?style=flat&colorA=000000&colorB=000000)\n\nPixel perfect layout inspection.\n\n> Built for React as a proof of concept.\n\n## Setup\n\nInstall the package:\n\n```sh\nnpm install inspx --save-dev\n```\n\nWrap the root of your application or arbitrary component trees:\n\n```tsx\nimport Inspect from 'inspx';\n\n<Inspect>\n  <App />\n</Inspect>\n```\n\n## Usage\n\nInspect elements by hovering an element and holding <kbd>Option (⌥)</kbd> simultaneously.\n\n![demo](/public/demo.gif)\n\nBy default, any element with padding, margin, or width and height is inspectable.\n\nYou can disable certain properties:\n\n```tsx\n<Inspect \n  margin \n  size={false} \n  padding={false}\n>\n  <App />\n</Inspect>\n```\n\n## Configuration\n\nBy default, the component will only be enabled in the development environment.\n\nYou can configure this behavior with the `disabled` prop:\n\n```tsx\n<Inspect\n  disabled={\n    process.env.NODE_ENV === 'staging' || \n    process.env.NODE_ENV === 'production'\n  }\n>\n  <App />\n</Inspect>\n```\n\nOptionally, you can leverage code splitting by wrapping the exported component and using your own instead.\n\n> The library is lightweight enough for this to likely be a premature and insignificant optimization.\n\n```tsx\nimport * as React from 'react';\nimport { InspectProps } from 'inspx';\n\nconst Inspect = React.lazy(() => import('inspx'));\n\nexport default function Loader(props: InspectProps) {\n  if (process.env.NODE_ENV === 'production') {\n    return props.children;\n  }\n  return (\n    <React.Suspense fallback={null}>\n      <Inspect disabled={false} {...props} />\n    </React.Suspense>\n  );\n}\n```\n","readmeFilename":"README.md"}