Nacho Printing Machine

    chakra-ui-carousel
    TypeScript icon, indicating that this package has built-in type declarations

    0.3.7 • Public • Published

    Chakra UI Carousel

    This is a Carousel library built using Chakra UI. Currently it is not much customizable by passing the Chakra props, but we are planning to add it in the furthur releases.

    Note: This lib is in Beta and is not recommended to use in production. If you find any issues, please open an issue on here. Or if you want to propose a feature, feel free to open a PR.

    Installation

    $ yarn add chakra-ui-carousel
    
    # or
    
    $ npm i chakra-ui-carousel

    Usage

    To use the Carousel, please follow the steps below:

    1. Wrap your carousel content with the <Provider> component.
    import { Provider } from "chakra-ui-carousel";
    
    function Example() {
      return (
        <Box>
          <Provider>
            // Carousel content
          </Provider>
        </Box>
      );
    }
    1. Move your Carousel contents to the Carousel component imported from chakra-ui-carousel library. You need to pass the gap between the slides as a prop.
    import { Carousel } from "chakra-ui-carousel";
    
    function Example() {
      return (
        <Box>
          <Provider>
            <Carousel>
              // Carousel content
            </Carousel>
          </Provider>
        </Box>
      );
    }
    1. Add LeftButton and RightButton components to your Carousel to control the current element on the Carousel. You can display these buttons anywhere around your carousel, just make sure that these buttons should be in the Provider Wrapper.
    import { LeftButton, RightButton } from "chakra-ui-carousel";
    
    function Example() {
      return (
        <Box>
          <Provider>
            <Carousel>
              // Carousel content
            </Carousel>
            <LeftButton />
            <RightButton />
          </Provider>
        </Box>
      );
    }

    Install

    npm i chakra-ui-carousel

    DownloadsWeekly Downloads

    72

    Version

    0.3.7

    License

    MIT

    Unpacked Size

    42 kB

    Total Files

    15

    Last publish

    Collaborators

    • nazeeh2000