{"_id":"@byhuz/react-items-carousel","_rev":"21-7a593c08f8835e928fd94b2d1926a014","name":"@byhuz/react-items-carousel","dist-tags":{"latest":"1.0.0"},"versions":{"1.0.0":{"name":"@byhuz/react-items-carousel","version":"1.0.0","main":"./dist/react-items-carousel.js","module":"dist/react-items-carousel.js","scripts":{"predeploy:gh":"yarn build:gh","deploy:gh":"gh-pages -d gh-build","build:gh":"NODE_ENV=production webpack --config webpack.gh.config.js","start:gh":"NODE_ENV=development webpack-dev-server --config webpack.gh.config.js","prepublish":"yarn build","build":"webpack --config webpack.lib.config.js","lint":"eslint src"},"pre-commit":["lint"],"keywords":["react-items-carousel","react-component","carousel","slider"],"devDependencies":{"@babel/core":"^7.2.2","@babel/plugin-proposal-class-properties":"^7.3.0","@babel/preset-env":"^7.3.1","@babel/preset-react":"^7.0.0","antd":"^3.16.5","babel-eslint":"^10.0.1","babel-loader":"^8.0.5","cross-env":"^5.2.0","css-loader":"^2.1.1","eslint":"^5.13.0","eslint-plugin-react":"^7.12.4","express":"^4.13.4","file-loader":"^4.2.0","gh-pages":"^2.0.1","glob":"^7.1.1","html-webpack-plugin":"^3.2.0","pre-commit":"^1.2.2","raw-loader":"^2.0.0","react-ace":"^6.5.0","react-dom":"16.8.1","react-hot-loader":"^4.6.5","react-tap-event-plugin":"^3.0.3","style-loader":"^0.23.1","webpack":"^4.29.3","webpack-cli":"^3.2.3","webpack-dev-server":"^3.1.14","webpack-node-externals":"^1.7.2"},"dependencies":{"lodash.max":"^4.0.1","lodash.min":"^4.0.1","prop-types":"^15.5.8","react":"16.8.1","react-measure":"^2.2.4","react-motion":"^0.5.2","styled-components":"^4.1.3"},"gitHead":"8c9531b25bb06ac0b18031ae17dce1a975d28f5c","description":"react-items-carousel ---------------","_id":"@byhuz/react-items-carousel@1.0.0","_nodeVersion":"10.19.0","_npmVersion":"6.14.4","dist":{"integrity":"sha512-d6LcnqE+wYAYuyd5MHQbCIudCT8v/Go7bhHOF6efVohC+0+7BaHYdO0I7g6pS0TIwIufk2uH+xzCH5ahS3jn2w==","shasum":"4e5c1e8a0aff4e0a7c4bda0809d434b673cc25e9","tarball":"https://registry.npmjs.org/@byhuz/react-items-carousel/-/react-items-carousel-1.0.0.tgz","fileCount":4,"unpackedSize":33906,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh2CFjCRA9TVsSAnZWagAAlLEP/RZiLZq/0GpeyQwi8Mqq\na/Er6YZ8JyLBn+nWJNlWn9TNTv6CNCWDyPW6vbdycolF6qKCppoNOfGVAwMW\nMN7bwpaAfwmbi3CoUtJzUTreZnc4zbAbnYkNYHR1NGc3nO5WqEr9bHkUoRAP\n9WaNjIjbFtrnJr8YNrWoHOt/XVPQNkFx1GSQncFOwqnODBbFO6QhpM0BBPiU\not0k1RPsaDjFJVAg6QmLIcX+KcjS4/dgxoAQn7thNE058R+5WqBhVPoMAC8m\njRhLQaeJeP1mYLSlcO8s59gQmi6nqnj5hQDFNA+m7nIFUKJ+XtT6rd49RfR9\nvliby4Fw9JMijhatkW2PtXxEnl/b3E/nbP2Qecn1SJxaesQS/+BMvM24NE36\ndVpbNlL4bVXhNbK/gRmAncAQc/OgQMjSEE0ap5iziM+ym+XCi8/6fcvIfH80\nPRbgRtTgw2Yp+JsHcSsxYkGIVqfPQJuO5NgeYDYsfG1bhjfLHJ+YvG0yKf2l\n96Yg4/yMKWao3ej4j04xMWlZMjrklyzJ6pNzfidWJCT/RwCdAn0vo8vXkGr+\nbOoGVORyYKSLJr6o5u2yV5+LOEQ3unqUabs18TI+wO1kT/qN+jYLx8StS5Cv\nfyuKbBtKqUSBhDMaa6OIIIcPtJYZR4SXvLPGho+b9lcIgntAEUzMvfW0SNUU\ng2D5\r\n=8GJO\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDhCKDLADcWRhqxAeUKiZxD+/PZekntuYnUkXTdUufr+gIgHttel4u62/QoUDk05xc9Hn8SIG6Gav5vHoH+ukquVUE="}]},"maintainers":[{"name":"savasyilmaz","email":"savas.yilmaz@triodor.eu"},{"name":"alatella87","email":"a.latella@azerion.com"},{"name":"gokay-azerion","email":"b.erim@azerion.com"},{"name":"furkankursun","email":"f.kursun@azerion.com"},{"name":"e.buyuk","email":"e.boyuk@azerion.com"},{"name":"gboyraz","email":"gultekinboyraz@gmail.com"}],"_npmUser":{"name":"gokay-azerion","email":"b.erim@azerion.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-items-carousel_1.0.0_1587403401145_0.5545484958353948"},"_hasShrinkwrap":false}},"time":{"created":"2020-04-20T17:23:20.891Z","1.0.0":"2020-04-20T17:23:21.246Z","modified":"2023-06-06T12:57:24.744Z"},"maintainers":[{"email":"yagiz.aydin@azerion.com","name":"yagizaydin"},{"email":"demiremrece@gmail.com","name":"demiremrece"},{"email":"a.hulsman@azerion.com","name":"hulsman1986"},{"email":"gultekinboyraz@gmail.com","name":"gboyraz"}],"description":"react-items-carousel ---------------","keywords":["react-items-carousel","react-component","carousel","slider"],"readme":"react-items-carousel\n---------------\n\n# Installation\n```\n$ npm install react-items-carousel --save\n```\n\n# [Demos](https://bitriddler.github.io/react-items-carousel/)\n\n# Example\n\n```javascript\nimport React, { useState } from 'react';\nimport ItemsCarousel from 'react-items-carousel';\n\nexport default () => {\n const [activeItemIndex, setActiveItemIndex] = useState(0);\n const chevronWidth = 40;\n return (\n
\n {'<'}}\n rightChevron={}\n outsideChevron\n chevronWidth={chevronWidth}\n >\n
First card
\n
Second card
\n
Third card
\n
Fourth card
\n \n
\n );\n};\n```\n\n# Component Props\n\n| Property | Type | Default | Description |\n|--------------------------|----------------------------------|---------|---------------------------------------------------------------------------------------|\n| children * | node[] | | The cards to render in the carousel. You must specify a height for each card. |\n| requestToChangeActive * | function | | This function accepts the new activeItemIndex and should update your component state. |\n| activeItemIndex * | int | | This defines which item should be active. |\n| numberOfCards | number | 3 | Number of cards to show per slide. |\n| infiniteLoop | boolean | false | Enable infinite loop. see [Infinite loop limitations](#infinite-loop-limitations) |\n| gutter | number | 0 | Space between cards. |\n| showSlither | boolean | false | If true a slither of next card will be shown. |\n| firstAndLastGutter | boolean | false | If true first and last cards will have twice the space. |\n| enablePlaceholder | boolean | false | If true, component will render `placeholderItem` until children are passed. |\n| placeholderItem | node | null | If `enablePlaceholder` is true, this will be rendered until children are passed. |\n| numberOfPlaceholderItems | number | 0 | This controls how many `placeholderItem` to render if `enablePlaceholder` is true. |\n| activePosition | enum ('left', 'center', 'right') | left | The position of the active item. |\n| rightChevron | node | null | Right chevron node. |\n| leftChevron | node | null | Left chevron node. |\n| chevronWidth | number | 0 | This value should be the width of left and right chevron. |\n| outsideChevron | boolean | false | If true the chevron will be rendered outside the carousel. |\n| alwaysShowChevrons | boolean | false | If true the chevrons will always be visible even if there were no cards to scroll. |\n| slidesToScroll | number | 1 | Number of cards to scroll when right and left chevrons are clicked. |\n| disableSwipe | boolean | false | Disables left and right swiping on touch devices. |\n| onStateChange | func | null | This function will be called when state change with `{ isFirstScroll: Boolean, isLastScroll: Boolean }`. It can be used to fetch more data for example. |\n| classes | `{ wrapper: string, itemsWrapper: string, itemsInnerWrapper: string, itemWrapper: string, rightChevronWrapper: string, leftChevronWrapper: string }` | {} | An object of classes to pass to the carousel inner elements |\n\n\n# Infinite Loop Limitations\nIf `infiniteLoop` was set to true, the following props are ignored\n- `activePosition`: will always be `left`\n- `alwaysShowChevrons`: will always be `true`\n\n# Contributing\nTo contribute, follow these steps:\n- Fork this repo.\n- Clone your fork.\n- Run `yarn`\n- Run `yarn start:gh`\n- Goto `localhost:9000`\n- Add your patch then push to your fork and submit a pull request\n\n# License\nMIT\n","readmeFilename":"README.md"}