Olwiba's app-level package. Shells, sections, interactive blocks, and hooks.

Documentation

🪲 Report a bug · ✨ Feature request

@olwiba/ui is the app-level package in the Nexus ecosystem.

It provides application shells, auth surfaces, marketing sections, interactive components, motion primitives, and utility hooks - all built on @olwiba/cn.

Use @olwiba/docs for documentation layout and navigation primitives such as DocsLayout and DocsSidebar.

@olwiba/cn   -> base primitives and styling foundations
@olwiba/docs -> documentation layouts and docs shell components
@olwiba/ui   -> app shells, marketing sections, interactive blocks, and hooks

bun add @olwiba/ui @olwiba/cn

Peer dependencies: @olwiba/cn, react, react-dom

import { AppShell, EmptyState, OlwibaUIProvider } from "@olwiba/ui";

function App() {
  return (
    <OlwibaUIProvider mode="smooth">
      <AppShell pageTitle="Dashboard">
        <EmptyState
          title="No projects yet"
          description="Create your first project to get started."
        />
      </AppShell>
    </OlwibaUIProvider>
  );
}

App Surfaces AppShell, AuthSection, EmptyState, ErrorPage, UpgradePrompt
Marketing HeroSection, FeaturesSection, CtaSection, PricingSection, Navbar, Footer, and more
Interactive Spotlight, Dock, ContextMenu, ConfirmDialog
Cards GlassCard, FeatureCard, StatCard, TestimonialCard, PricingCard, ImageCard
Motion FadeIn, StaggerChildren, CountUp, PageTransition
Layering Underlay, Overlay
Hooks useMounted, useConfirm, useControlledOpen, useScrolledPast, and more

• @olwiba/cn - base primitives
• @olwiba/docs - documentation framework

Bug reports, pull requests & feature requests are welcome. Open an issue first for anything beyond a small fix.

Built with 💖 by Olwiba