open-index/open-npm huggingface dataset:
npm package: @joyfour/design-system
Description: Design System base on Material design
Author: huanglangjian@gmail.com
Latest version: 0.0.4
Deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

## Install
```
npm install @joyfour/design-system
```

## Vite Plugin

```javascript
// vite.config.ts
import { MDCPlugin } from "material-design-system";

export default defineConfig({
  plugins: [
    // inject css to your app
    MDCPlugin({
      source: "#6750A4",
      customs: {
        info: "#D0BCFF",
      },
    })
  ],
});

```

## Use Reference

```javascript
// create palette or scheme refers
// it will refers to css-variables 
// it can accept string array of custom color names
const palette = createPaletteReference(['info'])
const scheme = createSchemeReference(['info'])

const primary40 = palette.primary[40]
const primary = scheme.dark.accent.primary.color
```

## Use Theme
```javascript
// create theme that compatible with Theme-UI
const theme = createTheme({
    // custom color names
    customs: ['info']
})
```