Full feature server components for Astro.js

More features

Show me the code

---import {Bind,BindForm,BButton,BInput }from"@astro-utils/forms/forms.js";importLayoutfrom"../layouts/Layout.astro";const form=Bind();let showSubmitText:string;function formSubmit(){showSubmitText=`You name is ${form.name}, you are ${form.age} years old.`;}---<Layout>    <BindFormbind={form}>{showSubmitText}                <h4>What you name*</h4>        <BInputtype="text"name="name"maxlength={20}required/>            <h4>Enter age*</h4>        <BInputtype="int"name="age"required/>            <BButtononClick={formSubmit}whenFormOK>Submit</BButton>    </BindForm></Layout>

Usage

Add the middleware to your server

npm install @astro-utils/forms

importastroFormsfrom"@astro-utils/forms";import{sequence}from"astro/middleware";exportconstonRequest=sequence(astroForms());

Add to Layout

---import {WebForms}from'@astro-utils/forms/forms.js';---<WebForms>    <slot/></WebForms>

Code Integration

import{defineConfig}from'astro/config';importastroFormsfrom"@astro-utils/forms/dist/integration.js";exportdefaultdefineConfig({output:'server',integrations:[astroForms]});