natxocc/sigpro-ui
1
1
Fork 0
Code Issues Actions Packages Projects Releases Wiki Activity

changed to new functions
All checks were successful
Deploy Docs to Synology / deploy (push) Successful in 3s
Details

Browse Source
This commit is contained in:
Natxo
2026-04-22 12:06:34 +02:00
parent 5a5f593025
commit 59e6d972a8
125 changed files with 1934 additions and 2015 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
docs/install.md
View File

@@ -23,15 +23,15 @@ npm install sigpro-ui
```javascript
// Import everything from sigpro-ui (includes sigpro core)
import { $, Mount, Button, Alert, Input, tt } from "sigpro-ui";
import { $, mount, Button, Alert, Input, tt } from "sigpro-ui";
import "sigpro-ui/css";
// Create your app
const App = () => {
const count = $(0);
return Tag('div', { class: 'p-8 max-w-md mx-auto' }, [
Tag('h1', { class: 'text-2xl font-bold mb-4' }, 'SigProUI Demo'),
return h('div', { class: 'p-8 max-w-md mx-auto' }, [
h('h1', { class: 'text-2xl font-bold mb-4' }, 'SigProUI Demo'),
Input({
placeholder: 'Enter your name...'
@@ -49,8 +49,8 @@ const App = () => {
]);
};
// Mount your app
Mount(App, "#app");
// mount your app
mount(App, "#app");
```
### CDN Usage (no build step)
@@ -77,14 +77,14 @@ Simply add the script tag and start using SigProUI:
// All functions are available directly in window
// No need to import anything!
const { $, Mount, Button, Input, Alert } = window;
const { $, mount, Button, Input, Alert } = window;
const App = () => {
const name = $('');
const count = $(0);
return Tag('div', { class: 'max-w-md mx-auto p-4' }, [
Tag('h1', { class: 'text-2xl font-bold mb-4' }, 'SigProUI Demo'),
return h('div', { class: 'max-w-md mx-auto p-4' }, [
h('h1', { class: 'text-2xl font-bold mb-4' }, 'SigProUI Demo'),
Input({
value: name,
@@ -103,7 +103,7 @@ Simply add the script tag and start using SigProUI:
]);
};
Mount(App, '#app');
mount(App, '#app');
</script>
</body>
</html>
@@ -115,12 +115,12 @@ When you install SigProUI, you get:
### SigPro Core Functions
- `$()` - Reactive signals
- `Watch()` - Watch reactive dependencies
- `Tag()` - Create HTML elements with reactivity
- `If()` - Conditional rendering
- `For()` - List rendering
- `Router()` - Hash-based routing
- `Mount()` - Mount components to DOM
- `watch()` - watch reactive dependencies
- `h()` - Create HTML elements with reactivity
- `when()` - Conditional rendering
- `each()` - List rendering
- `router()` - Hash-based routing
- `mount()` - mount components to DOM
>For more information about SigPro Core visit official Docs [SigPro Docs](https://natxocc.github.io/sigpro/#/)