Elixir UI

Installation

npx shadcn@latest add https://ui.elixirlabs.in/registry/on-this-page.json

Usage

Import the component from the components directory

import { OnThisPage } from "@/components/ui/on-this-page";

<OnThisPage
sections={[
  {
    items: [
      { title: "Introduction", href: "#introduction" },
      { title: "information", href: "#information" },
      { title: "info", href: "#info" },
    ],
  },
]}
/>

Props Table

Prop	Type	Default
`sections`	`OnThisPageSection[]`	Required
`activeClassName`	`string`	`"text-white"`
`inactiveClassName`	`string`	`"text-neutral-400 hover:text-white"`
`indicatorClassName`	`string`	`"bg-gradient-to-b from-purple-400 to-purple-500"`
`rootMargin`	`string`	`"-20% 0% -70% 0%"`
`scrollBehavior`	`"smooth"` \| `"auto"`	`"smooth"`
`renderItem`	`(item: OnThisPageItem, isActive: boolean) => ReactNode`	undefined

Elixir UI

/ Components

on this page

Installation

Usage

Props Table