Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@mintlify/components

Package Overview
Dependencies
Maintainers
4
Versions
99
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@mintlify/components

Open-source library of UI components made with React and TailwindCSS.

  • 0.3.15
  • latest
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
12
increased by71.43%
Maintainers
4
Weekly downloads
 
Created
Source
Mintlify Logo

Mintlify Components

Open-source library of UI components made with React and TailwindCSS.

contributions welcome Website

Built with 💚 by Mintlify


Mintlify

This repo contains the components Mintlify uses in our open-source documentation framework: mint. Checkout mintlify.com/docs to see the components in action. Feel free to use the components on your own websites!

Installation

Add Dependencies

Install this package and peerDependencies of this package, using install-peerdeps.

npx install-peerdeps @mintlify/components

React is already installed

You already have react installed or are using preact and just need @headlessui/react and @mintlify/components.

# yarn
yarn add @headlessui/react @mintlify/components

# npm
npm i @headlessui/react @mintlify/components

# pnpm
pnpm add @headlessui/react @mintlify/components

React and headlessui are already installed

You already have react and @headlessui/react installed and just need @mintlify/components.

# yarn
yarn add @mintlify/components

# npm
npm i @mintlify/components

# pnpm
pnpm add @mintlify/components

CSS import

Add the following at the start of your main.css file:

@import '@mintlify/components';

Usage

Import components like so:

import { Accordion, Card } from "@mintlify/components"

Designed for Next.js

The project is designed for use with static side rendering where we don't have access to document or window. Thus, our webpack config has to use mini-css-extract-plugin instead of style-loader.

Documentation

Go to mintlify.com/docs/components to see how to use the components in Mintlify's documentation platform.

Storybook has interactive demos.

Contributing

Read the Contributing guide to learn about our development process, the standards and tools used, and how to propose fixes, bugs or open issues.

The repo wiki explains how to contribute to this repo.

Code Quality

Check out the Contribution Tools section in our Contributing guide.

Formatting

This project uses prettier for code formatting. You can auto-format across the codebase by running yarn format.

Linting

This project uses eslint for code linting. You can check linter warnings and errors by running yarn lint.

Long Term Vision

The first version of this library only includes documentation components. In the long run, Mintlify will include layout components you could use to build an entire site.

Community

Join our Discord community if you have questions or just want to chat:

License

MIT

Keywords

FAQs

Package last updated on 05 Apr 2023

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc