@infobae/infobae-components NPM

INFOBAE Components

Welcome to infobae-components!

This repository provides a collection of React UI components ready to use in your pnpm projects.

Getting Started

1. Installation:

pnpm add infobae-components

This command will install the infobae-components package and all of its peer dependencies in your local project's node_modules folder.

2. Build:

If you need to modify the source code of the components, you can rebuild them using the following command:

pnpm run build

This will generate a new dist folder with the compiled components.

Linking with a Local Project (DEVELOPMENT)

There are two ways to link infobae-components to a local project using pnpm:

1. Using pnpm workspaces:
This is the recommended approach for projects using pnpm workspaces. Add infobae-components as a dependency to your root package.json file:
```
{
  "dependencies": {
    "infobae-components": "path/to/infobae-components"
  }
}
```
Then, run the following command to link the dependency:
```
pnpm workspace infobae-components link
```
2. (RECOMMENDED) Directly Linking
In this folder package run:
Bash
```
pnpm link
```
Then on your project folder run the next script
Bash
```
pnpm link infobae-components
```

!WARNING
💡 DON’T FORGET to unlink the packages in the reverse order that you linked them.
!CAUTION
⚠️⚠️⚠️ Duplicate React
This problem can also come up when you use npm link or an equivalent. In that case, your bundler might “see” two Reacts — one in application folder and one in your library folder. Assuming myapp and mylib are sibling folders, one possible fix is to run npm link ../myapp/node_modules/react from mylib. This should make the library use the application’s React copy.

Usage

Once linked, you can import the components directly into your React files:

JavaScript

import { MyComponent } from 'infobae-components';

function MyPage() {
  return (
    <MyComponent>
      {/* ... content ... */}
    </MyComponent>
  );
}

For detailed information about each component, please refer to the individual component files or consider adding a dedicated documentation website.