You're Invited:Meet the Socket Team at BlackHat and DEF CON in Las Vegas, Aug 4-6.RSVP
Socket
Book a DemoInstallSign in
Socket

@coco-ui/core

Package Overview
Dependencies
Maintainers
1
Versions
74
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@coco-ui/core

Click [here to access the storybook](https://dorianmaliszewski.github.io/coco-ui/)

1.27.2
latest
Source
npmnpm
Version published
Maintainers
1
Created
Source

COCO UI

Click here to access the storybook

This librairy is a set of React component to help you build beautiful and accesibile apps

Getting started

This library is based on tailwind css so to use it you need to install this library and Tailwind with the following steps.

Install Coco UI

npm install --save @coco-ui/core

Or alternatively with yarn :

yarn add @coco-ui/core

Install tailwind

Before using this library you need to add tailwind to your React project. Follow this link to install it

Using Create React App

npm install -D tailwindcss@npm:@tailwindcss/postcss7-compat postcss@^7 autoprefixer@^9 @craco/craco Or with yarn yarn -D tailwindcss@npm:@tailwindcss/postcss7-compat postcss@^7 autoprefixer@^9 @craco/craco

Then replace in your package.json :

  {
    "scripts": {
     "start": "react-scripts start",
     "build": "react-scripts build",
     "test": "react-scripts test",
     "start": "craco start",
     "build": "craco build",
     "test": "craco test",
      "eject": "react-scripts eject"
    },
  }

Theme configuration

You can import the default presets in your tailwind.config.js file :

// tailwind.config.js
module.exports = {
  presets: [
    require('@coco-ui/core/tailwind-theme')
  ],
}

Colors that are used :

  • primary : In presets : colors.purple
  • success : In presets : colors.green
  • error : In presets : colors.red
  • warning : In presets : colors.yellow
  • info : In presets : colors.blue
  • foreground : In presets : colors.gray[900]
  • background : In presets : white
  • gray : In presets : colors.gray
  • white : In presets : white
  • black : In presets : black

FAQs

Package last updated on 23 Feb 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