{"_id":"ink-scrollbar","_rev":"3-0e618a8fdb35d1bd02f50004b0a21585","name":"ink-scrollbar","dist-tags":{"latest":"1.0.0"},"versions":{"0.1.0":{"name":"ink-scrollbar","version":"0.1.0","description":"Scrollbar Component for Ink","main":"lib/index.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"repository":{"type":"git","url":"git+https://github.com/karaggeorge/ink-scrollbar.git"},"keywords":["ink","scrollbar","component","scroll","list"],"author":{"name":"George Karagkiaouris"},"license":"MIT","bugs":{"url":"https://github.com/karaggeorge/ink-scrollbar/issues"},"homepage":"https://github.com/karaggeorge/ink-scrollbar#readme","_id":"ink-scrollbar@0.1.0","_npmVersion":"5.6.0","_nodeVersion":"6.11.3","_npmUser":{"name":"gkaragkiaouris","email":"gkaragkiaouris2@gmail.com"},"dist":{"integrity":"sha512-D36SokcvOh+AIbzoNXn7J8mSy125WbH9bpaqX+Se9Gihw1aeVY4+EEYBOi76hgsjvAoy4D0EU19d0pR0EwUchA==","shasum":"038e72b113cbe8d0f31f2e665700e255ddb9a5cd","tarball":"https://registry.npmjs.org/ink-scrollbar/-/ink-scrollbar-0.1.0.tgz","fileCount":1,"unpackedSize":610,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEx7KpNhfYFB4hGR4bX/6V6sUCIyw4Ls4JwXddk9adwwAiA0Ssa/vA8Du7XjGjetAnhZ6wMNMbGl2U6JlEvI8Hli6Q=="}]},"maintainers":[{"name":"gkaragkiaouris","email":"gkaragkiaouris2@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ink-scrollbar_0.1.0_1522157008765_0.052036699082604665"},"_hasShrinkwrap":false},"1.0.0":{"name":"ink-scrollbar","version":"1.0.0","description":"Scrollbar Component for Ink","main":"lib/index.js","scripts":{"build":"babel src --out-dir lib","build-example":"babel example/index.js -o example/example.js","release":"npm run build && npm test && npm publish","pretest":"npm run build","test":"xo && ava"},"engines":{"node":">=6"},"files":["lib"],"repository":{"type":"git","url":"git+https://github.com/karaggeorge/ink-scrollbar.git"},"keywords":["ink","scrollbar","component","scroll","list"],"babel":{"plugins":[["transform-react-jsx",{"pragma":"h","useBuiltIns":true}]]},"ava":{"babel":{"presets":["@ava/stage-4"],"plugins":[["transform-react-jsx",{"pragma":"h","useBuiltIns":true}]]}},"xo":{"extends":["xo-react"],"space":2,"rules":{"react/prop-types":0,"react/jsx-key":0,"react/no-unused-prop-types":0,"react/require-default-props":0},"ignores":["example/*.js","lib/**/*.js"],"settings":{"react":{"pragma":"h"}}},"devDependencies":{"ava":"^0.20.0","babel-cli":"^6.24.1","babel-plugin-transform-react-jsx":"^6.24.1","eslint-config-xo-react":"^0.13.0","eslint-plugin-react":"^7.1.0","ink":"0.4.0","xo":"^0.18.2"},"peerDependencies":{"ink":"^0.4.0"},"dependencies":{"figures":"^2.0.0","prop-types":"^15.5.10"},"author":{"name":"George Karagkiaouris"},"license":"MIT","bugs":{"url":"https://github.com/karaggeorge/ink-scrollbar/issues"},"homepage":"https://github.com/karaggeorge/ink-scrollbar#readme","gitHead":"c46ca1321da279e4c562f24f6712a353519c5419","_id":"ink-scrollbar@1.0.0","_npmVersion":"5.6.0","_nodeVersion":"6.11.3","_npmUser":{"name":"gkaragkiaouris","email":"gkaragkiaouris2@gmail.com"},"dist":{"integrity":"sha512-gYyIiEgcGByZ8uYbpN6oBP03S11GqxRywiOxzKinG6toGar1Wvw8G8H5skxU4KMUYbJGf17VYPZQ0JRwJeUDmg==","shasum":"e893b9eb9d43e571222ffd81fc5abf8af85c1d0f","tarball":"https://registry.npmjs.org/ink-scrollbar/-/ink-scrollbar-1.0.0.tgz","fileCount":5,"unpackedSize":7871,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFFtnRyIUc+PEmIUEhA8uKTLOw45ynFaQcVSs3KVzBnRAiA8fTHKf5ZO3Lc/7hXTyaepLzYc0Vdrj4ywBGKdkA6FJA=="}]},"maintainers":[{"name":"gkaragkiaouris","email":"gkaragkiaouris2@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ink-scrollbar_1.0.0_1522182940762_0.14117481051535719"},"_hasShrinkwrap":false}},"time":{"created":"2018-03-27T13:23:28.764Z","0.1.0":"2018-03-27T13:23:28.904Z","modified":"2022-05-05T22:45:04.326Z","1.0.0":"2018-03-27T20:35:40.974Z"},"maintainers":[{"name":"gkaragkiaouris","email":"gkaragkiaouris2@gmail.com"}],"description":"Scrollbar Component for Ink","homepage":"https://github.com/karaggeorge/ink-scrollbar#readme","keywords":["ink","scrollbar","component","scroll","list"],"repository":{"type":"git","url":"git+https://github.com/karaggeorge/ink-scrollbar.git"},"author":{"name":"George Karagkiaouris"},"bugs":{"url":"https://github.com/karaggeorge/ink-scrollbar/issues"},"license":"MIT","readme":"# ink-scrollbar [![Build Status](https://travis-ci.org/karaggeorge/ink-scrollbar.svg?branch=master)](https://travis-ci.org/karaggeorge/ink-scrollbar) [![XO code style](https://img.shields.io/badge/code_style-XO-5ed9c7.svg)](https://github.com/sindresorhus/xo)\n\n> Scrollbar Component for [Ink](https://github.com/vadimdemedes/ink)\n\nUseful if you want to show a big list of items and don't want to display all of them at the same time.\n\nDemo\n---\n\nNormal scrolling (code in the example below):\n\n![Demo Image](./media/demo.gif)\n\nAdding items to the list:\n\n![Demo Image](./media/demo2.gif)\n\nInstall\n---\n\n```\n$ npm install ink-scrollbar\n```\n\nUsage\n---\n\n```js\nconst {h, render, Component, Text} = require('ink');\nconst Scrollbar = require('../lib');\n\nconst items = Array.apply(null, Array(15)).map((s, i) => i);\n\nclass Example extends Component {\n  constructor() {\n    super();\n    this.state = {\n      cursor: 0,\n    };\n\n    this.getCursor = this.getCursor.bind(this);\n  }\n\n  render() {\n    return (\n      <Scrollbar show={5} current={this.state.cursor} padding={3} highlight>\n        {items.map(i => <Text>{this.getCursor(i)}{i}</Text>)}\n      </Scrollbar>\n    );\n  }\n\n  componentDidMount() {\n    this.timer = setInterval(() => {\n      this.setState({cursor: (this.state.cursor + 1) % items.length});\n    }, 300);\n  }\n\n  componentWillUnmount() {\n    clearInterval(this.timer);\n  }\n\n  getCursor(i) {\n    const {cursor} = this.state;\n    if(i==cursor) {\n      return '❯\\u00A0';\n    } else {\n      return '\\u00A0\\u00A0';\n    }\n  }\n}\n\nconst unmount = render(<Example/>);\n\n```\n\n## Props\n\n### Scrollbar\n\n#### show\n\nType: `Number`\nDefault: `1`\n\nAmount of items to show. If this is larger or equal to the amount of children given, all the items will be displayed and the scrollbar will not be rendered.\n\n#### current\n\nType: `Number`\nDefault: `0`\n\nThe index of the currently selected item. This item will always be visible.\n\n#### thumbCharacter\n\nType: `string`\nDefault: `┃`\n\nThis character is used for the thumb of the scrollbar.\n\n#### padding\n\nType: `Number`\nDefault: `1`\n\nAmount of space between the items and the scrollbar.\n\n#### highlight\nType: `Boolean | Object`\nDefault: `false`\n\nWether to highlight or not the current item. If an object is passed, it will be passed to the wrapping `Text` component as props.\n\nLICENSE\n---\n\nMIT © 2018 [George Karagkiaouris](https://github.com/karaggeorge)\n","readmeFilename":"README.md"}