https://github.com/matheusandrade23/maps-ui

Personal Design System with many customizable components, developed with React, documented with Storybook and published on NPM.
https://github.com/matheusandrade23/maps-ui

javascript library maps-ui monorepo npm-package react storybook typescript

Last synced: about 1 month ago
JSON representation

Personal Design System with many customizable components, developed with React, documented with Storybook and published on NPM.

• Host: GitHub
• URL: https://github.com/matheusandrade23/maps-ui
• Owner: MatheusAndrade23
• License: mit
• Created: 2022-10-10T14:37:27.000Z (over 2 years ago)
• Default Branch: main
• Last Pushed: 2022-11-01T00:23:49.000Z (about 2 years ago)
• Last Synced: 2024-12-04T12:12:59.247Z (about 2 months ago)
• Topics: javascript, library, maps-ui, monorepo, npm-package, react, storybook, typescript
• Language: TypeScript
• Homepage: https://matheusandrade23.github.io/Maps-Ui/?path=/docs/home--page
• Size: 4.95 MB
• Stars: 6
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
Maps Ui 🗺️




  

  

  

  

  

  

  








 





 Introduction •

 Documentation •

 Publication •

 Technologies •

 Packages •

 Footer



Personal Design System with many customizable components, developed with React, documented with Storybook and published on npm.


---

Introduction


### To install the components package:

```sh

npm install @maps-ui/react

```

### To use the components:

```js

import { Button, Box, Tooltip, TooltipProvider } from '@maps-ui/react'

export const MyPage = () => {

  return (

    

      

        

          Send

        

      

    

  )

}

```

### Result:



Documentation


To access the complete documentation and see how to use and customize each component, click here.

Publication


The project was published on `npm`, Node package manager, so anyone who wants can download it and use it in their applications. Click here to visit.

Technologies


- **JS e TS** ➡️ Languages ​​used

- **React** ➡️ Library for creating components

- **Stitches** ➡️ Library for styling the components

- **Storybook** ➡️ Library for component documentation

- **Radix-Ui** ➡️ Library that helped in the creation of some more complex components

- **NPM** ➡️ Platform on which the project was published






  

  

  

  

  



Packages


Maps Ui consists of 2 packages: **Tokens** and **React**. The components are in the React package: `npm i @maps-ui/react` and the Tokens, which consist of colors, font sizes and weights, spacings and so on, are in the other package: `npm i @maps-ui/ tokens`.

- Click here to see how to use the components.

- Click here to see how to use the tokens.




---

🌟 If you liked it, consider giving it a star! 🌟