Components

DW includes a set of UI components for building forms and common interface elements. These are Astro wrappers around shadcn/ui components, designed to integrate seamlessly with DW’s backend.

We’ve designed a “normalized” pattern/api for components, so if you ever want to use a different component lib or whatever, you can modify these to your heart’s content.

Form Components

• InputText - Text input with validation support
• Textarea - Multi-line text input
• Select - Dropdown selection
• CheckboxGroup - Multiple checkbox options
• Toggle - Boolean switch
• DatePicker - Date/time selection (Flatpickr)
• Label - Form labels with optional popovers

Button Components

• ButtonSubmit - Form submission with loading states
• ButtonDelete - Delete confirmation with dialog
• ButtonLink - Styled anchor links

Photo Components

• PhotoUploadSingle - Single image upload with cropping
• PhotoUploadGallery - Multiple image uploads
• PhotoCropper - Image cropping utility

UI Components

• Alert - Notifications and dialogs
• Modal - Dialog overlays
• GenericCard - Card container
• FullscreenSpinner - Loading indicator
• ResponsiveImage - Optimized images
• TableDatalist - Data tables

Scripts

• validate-input - Input validation
• validate-form - Form validation

Backend

• Helpers - TypeScript utility functions
• SendEmail - Email sending utilities

shadcn/ui Base

DW components wrap these shadcn/ui primitives:

• Checkbox
• Input
• Label
• Select
• Switch
• Textarea
• Alert Dialog
• Button
• Card