@byjohann/ui

A collection of Vue.js components for my projects.

Setup

# pnpm
pnpm add @byjohann/ui

# npm
npm i @byjohann/ui

# yarn
yarn add @byjohann/ui

Nuxt Usage

Nuxt is supported out of the box. The Vue components provided by this library need to be transpiled for the server-side rendering to work. All you need to do is to add the @byjohann/ui/nuxt module to your nuxt.config.ts:

export default defineNuxtConfig({
  modules: ["@byjohann/ui/nuxt"],
});

Components

This library provides a collection of Vue.js components. Here is a list of all available components:

• AutoGrowTextarea
• DetailsContent
• DetailsGroup
• DetailsItem
• DotPattern
• GridBlock
• GridPattern
• Marquee
• MasonryGrid
• MediumZoom
• ModalsPortal
• MotionText
• Primitive
• ScreenreaderOnly
• ScrollObserver
• ScrollReactor
• ScrollReactorGroup
• ScrollReveal
• ScrollTrigger
• ScrollTriggerGroup
• SkeletonZone
• SliderGroup
• SliderItem
• SliderPagination
• SpotlightCard
• TextReveal
• TextRevealToken
• TextShimmer

Composables

When working with specific features, you can use the provided composables. Here is a list of all available composables:

• Modals

Mapbox Tools

This library supports Mapbox. Here is a list of all available Mapbox components and composables:

• useMap
• MapboxCluster
• MapboxImage
• MapboxImages
• MapboxLayer
• MapboxMap
• MapboxMarker
• MapboxSource

Utilities

UI development is a lot about colors and typography. Here is a list of all available utilities:

• Theme Colors

License

MIT License © 2023-PRESENT Johann Schopplich