ebombo-ui

React UI library packaged for NPM for ebombo, offering a collection of components designed for rapid development of user interfaces. It requires Node.js v16.

Installation

To install ebombo-ui in a Next.js project, run the following command:

npm i ebombo-ui

Then, in your project's entry file (e.g., _app.js for Next.js projects), import the stylesheet:

import "ebombo-ui/dist/ebombo.css";

Components

ebombo-ui includes a wide range of components to help you build your application:

• Button
• Input
• Switch
• Tab
• Select
• DatePicker
• Check
• Alert
• Anchor
• Collapsible
• Dropdown
• ModalConfirm
• Paths
• Table
• QuillRichTextEditor
• Toast
• Tooltip

Development Setup

Testing Locally

To test Ebombo UI locally, follow these steps:

1. npm run build:css [ui]
2. npm run build [ui]
3. npm run build:copy [ui]
4. npm pack [ui]
5. copy "full path + ebombo-ui-0.0.6.tgz" [ui]
6. npm i "full path + ebombo-ui-0.0.6.tgz" --force [events]
7. example. npm i /Users/peruhop/Projects/bombo/ebombo-ui/ebombo-ui-0.0.16.tgz --force

Generating Releases

This guide outlines the steps required to propose and merge changes within our project. Please follow these instructions carefully to ensure a smooth and efficient development process.

1. Creating a Changeset

Before proposing changes, you'll need to create a changeset that records the modifications you intend to introduce:

• Step: On your feature branch, execute the command npx changeset.

npx changeset

• Action: Follow the on-screen prompts to describe the changes you're making. This information is crucial for versioning and release notes.

2. Submitting a Pull Request (PR) to the red Branch

Once your changeset is prepared, the next step involves integrating your changes into the main codebase:

• Step: Commit the changeset generated in the previous step to the .changeset directory. Ensure this commit also includes your code modifications.
• Action: Create a PR targeting the red branch. This PR should contain both your changes and the changeset file(s).

3. Documentation Updates

Maintaining accurate documentation is essential for project usability and maintenance:

• Requirement: If your changes affect any components or hooks, update the README.md file accordingly. Document new features or modifications under the Components or Hooks sections.

4. Merging the PR into the red Branch

After your PR has been reviewed and approved, it's time to merge it:

• Step: Once your PR is reviewed and approved, merge it into the red branch. Ensure you follow any project-specific merge strategies or requirements.

5. Automatic Versioning and Publishing

Finalizing the change process involves automated versioning and publishing to NPM:

• Process: Once your PR with the changeset is merged, a new PR titled chore: version package will be automatically created. Merging this PR will trigger a GitHub Action that handles the publishing of the updated package to NPM.

Additional Notes

• Ensure that your feature branch is up to date with the red branch before creating a PR.
• Review the project's contribution guidelines for more information on code style, commit messages, and review processes.