Serverkit ide library

Installation

You can install this package via npm:

``bash
npm install serverkit-ide-lib
`

---

$3

- Installation: Instructions for installing serverkit-ide-lib.
- Usage: How to use Theme in an app, wrapping the entire application.
- Component Examples in the example folder, each with a brief description, making it easier to locate and understand how to use each component.




Dialog Component

A Dialog component based on Radix UI's Dialog system, providing customizable content, layout, and controls.

Usage

Here's how to use the Dialog component, including examples of common props like isOpen, onClose, and title:

`typescript
interface DialogProps {
isOpen: boolean;
onClose: () => void;
title?: string | React.ReactNode;
children: React.ReactNode;
footer?: React.ReactNode;
header?: React.ReactNode;
body?: React.ReactNode;
size?: 1 | 2 | 3 | 4 | 5;
showCloseIcon?: boolean;
}

setDialogOpen(true)}>
Open Dialog


isOpen={isDialogOpen}
onClose={() => setDialogOpen(false)}
title="Sample Dialog"
footer={
setDialogOpen(false)}>
Close

}
size={2}
showCloseIcon={true}
>


This is the dialog content.



`

Button Component

A Button component based on Radix UI's Button system, supporting all Radix UI Button props.

Usage

Import and use the Button component in your app:

`typescript

setDialogOpen(true)}>
Button

setDialogOpen(true)}>
Button


`

Badge Component

A Badge component based on Radix UI's Badge system, supporting all Radix UI Badge props.

Usage

`typescript

`

Toast Component

A Toast component based on react-toastify

Usage

`typescript
Props {
content: string,
type: "info" | "success" | "warning" | "error" = "info"
}

showToast('Toast conent','success')}>Show toast
``