https://github.com/tatchi/bs-react-virtual

BuckleScript bindings for react-virtual
https://github.com/tatchi/bs-react-virtual

bucklescript react-virtual reasonml

Last synced: about 2 months ago
JSON representation

BuckleScript bindings for react-virtual

• Host: GitHub
• URL: https://github.com/tatchi/bs-react-virtual
• Owner: tatchi
• License: mit
• Created: 2020-05-16T05:57:22.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2023-01-06T06:07:46.000Z (about 2 years ago)
• Last Synced: 2024-11-14T17:47:17.505Z (about 2 months ago)
• Topics: bucklescript, react-virtual, reasonml
• Language: Reason
• Homepage:
• Size: 718 KB
• Stars: 3
• Watchers: 2
• Forks: 0
• Open Issues: 11
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-list - bs-react-virtual - virtual | tatchi | 2 | (Reason)

README

        
# bs-react-virtual

[BuckleScript](https://github.com/bucklescript/bucklescript) bindings for [react-virtual](https://github.com/tannerlinsley/react-virtual)

![Build](https://github.com/tatchi/bs-react-virtual/workflows/Build/badge.svg)

## Installation

```sh

npm install --save @tatchi/bs-react-virtual

```

Then add `@tatchi/bs-react-virtual` to `bs-dependencies` in your `bsconfig.json`:

```js

{

  ...

  "bs-dependencies": ["@tatchi/bs-react-virtual"]

}

```

## Example

```reason

[@react.component]

let make = () => {

  let parentRef = React.useRef(Js.Nullable.null);

  let rowVirtualizer =

    ReactVirtual.useVirtual(

      ReactVirtual.options(

        ~size=10000,

        ~parentRef,

        ~estimateSize=React.useCallback0(_ => 35),

        ~scrollToFn=(offset, defaultScrollToFn) => defaultScrollToFn(offset),

        (),

      ),

    );

  


    

        rowVirtualizer.scrollToIndex(.

          ~index=0,

          ~options=Some({align: ReactVirtual.Align.auto}),

        )

      }>

      {React.string("ScrollToIndex")}

    

    

        rowVirtualizer.scrollToOffset(. ~offset=100, ~options=None)

      }>

      {React.string("ScrollToOffset")}

    

    


      


        {rowVirtualizer.virtualItems

         ->Belt.Array.map(virtualRow =>

             


               {React.string("Row " ++ string_of_int(virtualRow.index))}

             

           )

         ->ReasonReact.array}

      

    

  
;

};

```