react-ez-ui

react-ez-ui is a customizable component library for React that does not rely on predefined UI styles, allowing complete control over the design and content of the components.

🌐 Language Switch

• 中文
• English

⚡ Do You Need react-ez-ui?

• Does your code include third-party UI libraries like Antd?
• Are you using multi-platform tools such as TaroJS?

If the answer to all the above is "no", keep reading!

🚀 What Does react-ez-ui Solve?

In everyday development, many components are required, but UI framework components come with basic styles, making it difficult to achieve extensive customization. react-ez-ui simplifies this by providing the "actions" only, much like antd-pro's ModalForm, while allowing you to fully customize both the style and content.

📦 Installation

You can install it directly via npm without needing separate type declaration files. TypeScript support is included.

npm install react-ez-ui

🔨 Usage

import React from "react";
import { Picker, LoadingButton } from "react-ez-ui";

const App: React.FC = () => {
  return (
    <>
      <div>
        <Picker
          content={(cb) => {
            return (
              <div
                style={{
                  display: "flex",
                  justifyContent: "center",
                  alignItems: "center",
                  height: "30vh",
                  backgroundColor: "#fff",
                }}
              >
                <button onClick={cb}>close</button>
              </div>
            );
          }}
        >
          <button>open</button>
        </Picker>
      </div>
      <div>
        <LoadingButton
          loadingText="Loading..."
          onClick={async () => {
            await new Promise((resolve) => {
              setTimeout(() => {
                resolve(true);
              }, 1000);
            });

            console.log(1);
          }}
        >
          <button>Click Me</button>
        </LoadingButton>
      </div>
    </>
  );
};

export default App;

🤝 Contribution Guide

We welcome contributions to make react-ez-ui even better!

1. Clone the repository
2. Create a new branch (git checkout -b feature-new-component-name)
3. Commit your changes (git commit -m '✨ Add new component: xxx')
4. Push to the component branch (git push origin feature-new-component-name)
5. Create a Pull Request

📜 License

This project is licensed under the MIT license.

---