Component Library for Javascript
These components are built as JavaScript functions that generate clean HTML code, leveraging the simplicity and efficiency of Alpine.js. You can use it in Node.js, Deno or Browser.
- Clean and intuitive design system.
- Consistent and minimalistic designs across all components.
- All components extend from a powerful base component called "View".
- Support for utility props, two-way binding, and more.
To use @ulibs/ui in your project, you can install it via npm or yarn:
npm install @ulibs/ui@next
or
yarn add @ulibs/ui
Once you have installed the library, you can import the components in your JavaScript files and start using them
import {View, Container, Row, Col} from '@ulibs/ui'
const myPage = View([
Container({ size: "xl", mx: "auto" }, [
Row([
Col([Button("Column 1")]),
Col({ col: 12, colSm: 6 }, [Button("Column 2")]),
]),
]),
]);
const myPageHtml = myPage.toHtml()
console.log(myPageHtml)
For detailed information on each component and its props, please refer to the full documentation. It provides examples and usage guidelines for all available components. Documentation
We welcome contributions to make @ulibs/ui even better! If you find a bug, have a suggestion, or want to add new features, feel free to submit an issue or create a pull request.
@ulibs/ui is released under the MIT License.
Happy coding with uLibs UI! If you have any questions or need support, please don't hesitate to reach out.