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

@mutable/meiosis

Package Overview
Dependencies
Maintainers
7
Versions
42
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@mutable/meiosis

Meiosis is the Design System for Mutable Products and Websites

  • 1.0.10
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
1
decreased by-50%
Maintainers
7
Weekly downloads
 
Created
Source

meiosis

Use this Design System within Mutable Products.

Getting Started

npm install

Note: When using NPM v7, you might encounter npm ERR! ERESOLVE unable to resolve dependency tree. To fix this, please use npm install --legacy-peer-deps, since the error is caused by some of the dependencies (including @visx) not supporting React v17 yet.

Run Storybook

npm run storybook

All the components having *.stories.tsx are automatically included in Storybook.

Build Storybook for production

npm run build-storybook

Build the component library for production

npm run build

Generate new components

When creating a new component, instead of creating the component directory and all its files manually, a util called create-component.js can be used.

npm run generate ComponentName

This will generate the following files, based on the templates stored at util/templates.

/src
  /components
    /ComponentName
      ComponentName.tsx
      ComponentName.stories.tsx
      ComponentName.types.ts

To export the newly added component in the npm package, add it to index.ts.

NPM Publish

The component library is published to @mutable/meiosis. To publish a new version, update the version in package.json, and run:

npm publish

Using the package

To use meiosis components in a client app, run:

npm install @mutable/meiosis

Then, simply use them by import { Table, SystemHealthCard } from "@mutable/meiosis".

Testing the package

All the components can be tested in different states using Storybook stories.

In addition, to test the package in client apps locally (before publishing it to NPM package registry), build the component library, and, in the client app run:

npm uninstall @mutable/meiosis
npm install full/path/to/package

Remember to change the dependency back to the published NPM package after testing.

References

The library was inspired by react-component-library template.

FAQs

Package last updated on 28 Apr 2021

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