A simple library for adding classes to vanjs
npm install momvanTo install dependencies:
``bash`
bun install
To run:
`bash`
bun run index.ts
Momvan is a set of utilities that make working with vanjs much easier for me. All of the utilities are designed to work together, and provide a compact system for expressing frontend GUIs.
You can use the whole system easily like so:
`html`
So you call van.tags normally (albeit from momvan instead):
`typescript`
import van from 'momvan';
const { div } = van.tags;
And then you can style the elements like this:
`typescript`
const myTailwindDiv = div.bgRed500.textWhite("Hello, world!");
And the div will have the classes "bg-red-500 text-white".
This is equivalent to the below:
`typescript`
const myTailwindDiv = div({ class: "bg-red-500 text-white" }, "Hello, world!");
This is a router that can be used to create a single page application.
It is designed to be used with the vanjs library, and to be very compact.
You can use it like so:
`typescript
import van from 'momvan'
const { div } = van.tags
const route = van.createRouter({
baseRoute: 'app',
});
const App = div(
route.home(
div('Home Page')
),
route.about(
div('About Page')
)
route.user" class="text-primary hover:underline" target="_blank" rel="noopener noreferrer">':id')
)
`
This is a system for writing forms in vanjs.
Simply call "createForm", like so:
`typescript
import van from 'momvan';
const {
state,
inputs: {
username,
password
},
submit,
reset
} = van.createForm();
const App = div(
form(
username({ placeholder: 'Username' }),
password({ placeholder: 'Password' }),
submit('Login'),
),
)
``