mirror of
https://github.com/sonr-io/sonr.git
synced 2026-08-02 17:31:39 +00:00
feature/dwn database state (#18)
* refactor: move database, navigator scripts to state package * feat: add Schema config for dwn * test: add unit tests for InitializeDatabase * feat: use templated index.html for the DWN frontend * feat: introduce templ generation for templ * chore(deps): update devbox.json to use latest packages * chore: update devbox to use bun * feat: introduce dwn config generation * feat: add motr.mjs for vault management * refactor: move front end from to (alert) * feat: implement devbox integration and devbox-based process management * feat: embed motr.mjs script for offline demo * refactor: embed motr.mjs data in embed.go * chore: update workflows to use actions/checkout@v4 * refactor: move process-compose.yaml to deploy directory * refactor: remove unnecessary JSON conversion
This commit is contained in:
Prad Nukala
@@ -0,0 +1,218 @@
|
||||
package blocks
|
||||
|
||||
type button struct {
|
||||
variant Variant
|
||||
hxGet string
|
||||
hxPost string
|
||||
hxTarget string
|
||||
hxTrigger string
|
||||
hxSwap string
|
||||
}
|
||||
|
||||
type ButtonOpt func(button *button)
|
||||
|
||||
func PrimaryButtonStyle() ButtonOpt {
|
||||
return func(button *button) {
|
||||
button.variant = ButtonVariantPrimary
|
||||
}
|
||||
}
|
||||
|
||||
func InfoButtonStyle() ButtonOpt {
|
||||
return func(button *button) {
|
||||
button.variant = ButtonVariantInfo
|
||||
}
|
||||
}
|
||||
|
||||
func ErrorButtonStyle() ButtonOpt {
|
||||
return func(button *button) {
|
||||
button.variant = ButtonVariantError
|
||||
}
|
||||
}
|
||||
|
||||
func SuccessButtonStyle() ButtonOpt {
|
||||
return func(button *button) {
|
||||
button.variant = ButtonVariantSuccess
|
||||
}
|
||||
}
|
||||
|
||||
func WarningButtonStyle() ButtonOpt {
|
||||
return func(button *button) {
|
||||
button.variant = ButtonVariantWarning
|
||||
}
|
||||
}
|
||||
|
||||
func GET(action string, target string) ButtonOpt {
|
||||
return func(button *button) {
|
||||
button.hxGet = action
|
||||
button.hxTarget = target
|
||||
button.hxTrigger = "click"
|
||||
button.hxSwap = "outerHTML"
|
||||
}
|
||||
}
|
||||
|
||||
func POST(action string, target string) ButtonOpt {
|
||||
return func(button *button) {
|
||||
button.hxPost = action
|
||||
button.hxTarget = target
|
||||
button.hxTrigger = "click"
|
||||
button.hxSwap = "outerHTML"
|
||||
}
|
||||
}
|
||||
|
||||
func Button(opts ...ButtonOpt) templ.Component {
|
||||
button := button{
|
||||
variant: ButtonVariantDefault,
|
||||
}
|
||||
for _, opt := range opts {
|
||||
opt(&button)
|
||||
}
|
||||
if button.hxGet != "" {
|
||||
return renderHxGetButton(&button, button.variant.Attributes())
|
||||
}
|
||||
|
||||
if button.hxPost != "" {
|
||||
return renderHxPostButton(&button, button.variant.Attributes())
|
||||
}
|
||||
return renderButton(button.variant.Attributes())
|
||||
}
|
||||
|
||||
templ renderButton(attrs templ.Attributes) {
|
||||
<button { attrs... }>
|
||||
{ children... }
|
||||
</button>
|
||||
}
|
||||
|
||||
templ renderHxGetButton(c *button, attrs templ.Attributes) {
|
||||
<button hx-get={ c.hxGet } hx-push-url="true" hx-target={ c.hxTarget } hx-trigger={ c.hxTrigger } hx-swap={ c.hxSwap } { attrs... }>
|
||||
{ children... }
|
||||
</button>
|
||||
}
|
||||
|
||||
templ renderHxPostButton(c *button, attrs templ.Attributes) {
|
||||
<button hx-post={ c.hxPost } hx-target={ c.hxTarget } hx-trigger={ c.hxTrigger } hx-swap={ c.hxSwap } { attrs... }>
|
||||
{ children... }
|
||||
</button>
|
||||
}
|
||||
|
||||
type ButtonVariant int
|
||||
|
||||
const (
|
||||
ButtonVariantDefault ButtonVariant = iota
|
||||
ButtonVariantPrimary
|
||||
ButtonVariantInfo
|
||||
ButtonVariantError
|
||||
ButtonVariantSuccess
|
||||
ButtonVariantWarning
|
||||
)
|
||||
|
||||
func (v ButtonVariant) Attributes() templ.Attributes {
|
||||
switch v {
|
||||
case ButtonVariantPrimary:
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-white transition-colors duration-200 rounded-md bg-neutral-950 hover:bg-neutral-900 focus:ring-2 focus:ring-offset-2 focus:ring-neutral-900 focus:shadow-outline focus:outline-none",
|
||||
"type": "button",
|
||||
}
|
||||
case ButtonVariantInfo:
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-white transition-colors duration-200 bg-blue-600 rounded-md hover:bg-blue-700 focus:ring-2 focus:ring-offset-2 focus:ring-blue-700 focus:shadow-outline focus:outline-none",
|
||||
"type": "button",
|
||||
}
|
||||
case ButtonVariantError:
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-white transition-colors duration-200 rounded-md bg-red-600 hover:bg-red-700 focus:ring-2 focus:ring-offset-2 focus:ring-red-700 focus:shadow-outline focus:outline-none",
|
||||
"type": "button",
|
||||
}
|
||||
case ButtonVariantSuccess:
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-white transition-colors duration-200 rounded-md bg-green-600 hover:bg-green-700 focus:ring-2 focus:ring-offset-2 focus:ring-green-700 focus:shadow-outline focus:outline-none",
|
||||
"type": "button",
|
||||
}
|
||||
case ButtonVariantWarning:
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-white transition-colors duration-200 rounded-md bg-yellow-600 hover:bg-yellow-700 focus:ring-2 focus:ring-offset-2 focus:ring-yellow-700 focus:shadow-outline focus:outline-none",
|
||||
"type": "button",
|
||||
}
|
||||
}
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide transition-colors duration-200 bg-white border rounded-md text-neutral-500 hover:text-neutral-700 border-neutral-200/70 hover:bg-neutral-100 active:bg-white focus:bg-white focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-neutral-200/60 focus:shadow-outline",
|
||||
"type": "button",
|
||||
}
|
||||
}
|
||||
|
||||
type SubtleButtonVariant int
|
||||
|
||||
const (
|
||||
SubtleButtonVariantDefault SubtleButtonVariant = iota
|
||||
SubtleButtonVariantInfo
|
||||
SubtleButtonVariantError
|
||||
SubtleButtonVariantSuccess
|
||||
SubtleButtonVariantWarning
|
||||
)
|
||||
|
||||
func (v SubtleButtonVariant) Attributes() templ.Attributes {
|
||||
switch v {
|
||||
case SubtleButtonVariantInfo:
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-blue-500 transition-colors duration-100 rounded-md focus:ring-2 focus:ring-offset-2 focus:ring-blue-100 bg-blue-50 hover:text-blue-600 hover:bg-blue-100",
|
||||
"type": "button",
|
||||
}
|
||||
case SubtleButtonVariantError:
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-red-500 transition-colors duration-100 rounded-md focus:ring-2 focus:ring-offset-2 focus:ring-red-100 bg-red-50 hover:text-red-600 hover:bg-red-100",
|
||||
"type": "button",
|
||||
}
|
||||
case SubtleButtonVariantSuccess:
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-green-500 transition-colors duration-100 rounded-md focus:ring-2 focus:ring-offset-2 focus:ring-green-100 bg-green-50 hover:text-green-600 hover:bg-green-100",
|
||||
"type": "button",
|
||||
}
|
||||
case SubtleButtonVariantWarning:
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-yellow-600 transition-colors duration-100 rounded-md focus:ring-2 focus:ring-offset-2 focus:ring-yellow-100 bg-yellow-50 hover:text-yellow-700 hover:bg-yellow-100",
|
||||
"type": "button",
|
||||
}
|
||||
}
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide transition-colors duration-100 rounded-md text-neutral-500 bg-neutral-50 focus:ring-2 focus:ring-offset-2 focus:ring-neutral-100 hover:text-neutral-600 hover:bg-neutral-100",
|
||||
"type": "button",
|
||||
}
|
||||
}
|
||||
|
||||
type OutlineButtonVariant int
|
||||
|
||||
const (
|
||||
OutlineButtonVariantDefault OutlineButtonVariant = iota
|
||||
OutlineButtonVariantInfo
|
||||
OutlineButtonVariantError
|
||||
OutlineButtonVariantSuccess
|
||||
OutlineButtonVariantWarning
|
||||
)
|
||||
|
||||
func (v OutlineButtonVariant) Attributes() templ.Attributes {
|
||||
switch v {
|
||||
case OutlineButtonVariantInfo:
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-blue-600 transition-colors duration-100 bg-white border-2 border-blue-600 rounded-md hover:text-white hover:bg-blue-600",
|
||||
"type": "button",
|
||||
}
|
||||
case OutlineButtonVariantError:
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-red-600 transition-colors duration-100 bg-white border-2 border-red-600 rounded-md hover:text-white hover:bg-red-600",
|
||||
"type": "button",
|
||||
}
|
||||
case OutlineButtonVariantSuccess:
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-green-600 transition-colors duration-100 bg-white border-2 border-green-600 rounded-md hover:text-white hover:bg-green-600",
|
||||
"type": "button",
|
||||
}
|
||||
case OutlineButtonVariantWarning:
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide text-yellow-600 transition-colors duration-100 bg-white border-2 border-yellow-500 rounded-md hover:text-white hover:bg-yellow-500",
|
||||
"type": "button",
|
||||
}
|
||||
}
|
||||
return templ.Attributes{
|
||||
"class": "inline-flex items-center justify-center px-4 py-2 text-sm font-medium tracking-wide transition-colors duration-100 bg-white border-2 rounded-md text-neutral-900 hover:text-white border-neutral-900 hover:bg-neutral-900",
|
||||
"type": "button",
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user