mirror of
https://github.com/sonr-io/sonr.git
synced 2026-08-03 18:01:39 +00:00
Prad NukalaandGitHub
b6c49828ed
- **feat(did): add assertion type to DID spec** - **refactor: update build process to include assets generation** - **refactor: update import paths for to** - **feat: introduce new authentication state management** - **feat: add current account route** - **feat: implement global toasts with custom HTML** - **refactor: remove unused session code** - **feat: add config.json to embedded assets** - **refactor: remove unused dependency on gorilla/sessions** - **refactor: simplify session management and remove unnecessary fields** - **fix: remove unnecessary import for unused protobuf types** - **feat: introduce separate HTTP contexts for Highway and DWN** - **fix(keeper): Handle missing controller during initial sync** - **refactor: extract DWN configuration from DWNContext** - **feat: add view route** - **fix: update configuration file name in embed.go** - **feat: improve vaultindex page loading experience** - **feat(hway): add highway context to echo context** - **chore(deps): bump onsonr/crypto from 1.32.0 to 1.33.0** - **refactor: rename DWNSessionMiddleware to WebNodeSessionMiddleware** - **feat: rename client API to web node API** - **refactor: separate API and view routes** - **refactor: remove unused build targets in Makefile** - **feat: add Devbox integration to container** - **feat: add wasm support for dwn** - **refactor: update module proto import** - **feat: add default first and third party caveats** - **feat: Add target vault allocation mechanism** - **refactor: introduce standardized session cookie handling** - **fix: update service worker installation and ready states** - **feat: add worker handlers** - **feat: Enable SSH access to devcontainer** - **refactor: rename HighwayContext to HwayContext** - **feat: add block expiration calculation to sonr context** - **feat: remove config from cookie and header** - **feat(gen): Remove generated code for IPFS, Motr and Sonr** - **refactor: remove unused createMotrConfig function** - **feat: add project analytics with Repobeats** - **docs: Remove component details from README** - **refactor: rename SetConfig to injectConfig**
235 lines
8.7 KiB
Templ
235 lines
8.7 KiB
Templ
package ui
|
|
|
|
import "github.com/onsonr/sonr/pkg/nebula/global/styles"
|
|
|
|
templ PrimaryButton(href string, text string) {
|
|
<div>
|
|
<div class="btn cursor-pointer text-zinc-100 bg-zinc-900 hover:bg-zinc-800 w-full shadow" hx-swap="afterend" hx-get={ href }>{ text }</div>
|
|
</div>
|
|
}
|
|
|
|
templ SecondaryButton(href string, text string) {
|
|
<div>
|
|
<div x-on:click="toast('Default Toast Notification', 'default', '', 'top-center')" class="btn cursor-pointer text-zinc-600 bg-white hover:text-zinc-900 w-full shadow">{ text }</div>
|
|
</div>
|
|
}
|
|
|
|
type button struct {
|
|
variant styles.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",
|
|
}
|
|
}
|