feat(confirm): direct styles customizations for width and border. mes…

…sage property added
sveltinio · Feb 27, 2023 · 788f781 · 788f781
1 parent f739d40
commit 788f781
Show file tree

Hide file tree

Showing 6 changed files with 135 additions and 25 deletions.
diff --git a/_examples/confirm/custom-styles-2/main.go b/_examples/confirm/custom-styles-2/main.go
@@ -0,0 +1,44 @@
+package main
+
+import (
+	"fmt"
+
+	"github.com/charmbracelet/lipgloss"
+	"github.com/sveltinio/prompti/confirm"
+)
+
+var (
+	cyan   = lipgloss.AdaptiveColor{Light: "#4f46e5", Dark: "#c7d2fe"}
+	green  = lipgloss.AdaptiveColor{Light: "#166534", Dark: "#22c55e"} // Light: green-800, Dark: green-500
+	red    = lipgloss.AdaptiveColor{Light: "#ef4444", Dark: "#ef4444"} // Light: red-500, Dark: red-500
+	purple = lipgloss.AdaptiveColor{Light: "#7e22ce", Dark: "#a855f7"} // Light: purple-700, Dark: purple-500
+
+	myCustomStyle = confirm.Styles{
+		ActiveButtonStyle: lipgloss.NewStyle().Padding(0, 3).
+			Margin(1, 1).Background(green).Foreground(purple),
+		DialogStyle: lipgloss.NewStyle().
+			Border(lipgloss.NormalBorder()).
+			BorderTopForeground(purple).
+			BorderBottomForeground(green).
+			BorderLeftForeground(cyan).
+			BorderRightForeground(cyan).
+			Margin(1, 0, 1, 0).
+			Padding(1, 0).
+			BorderTop(true).
+			BorderLeft(true).
+			BorderRight(true).
+			BorderBottom(true).
+			Width(50).
+			Align(lipgloss.Center),
+	}
+
+	confirmConfig = &confirm.Config{
+		Question: "Continue?",
+		Styles:   myCustomStyle,
+	}
+)
+
+func main() {
+	result, _ := confirm.Run(confirmConfig)
+	fmt.Println(result)
+}
diff --git a/_examples/confirm/custom-styles/main.go b/_examples/confirm/custom-styles/main.go
@@ -8,31 +8,22 @@ import (
 )
 
 var (
-	cyan   = lipgloss.AdaptiveColor{Light: "#4f46e5", Dark: "#c7d2fe"}
-	green  = lipgloss.AdaptiveColor{Light: "#166534", Dark: "#22c55e"} // Light: green-800, Dark: green-500
-	red    = lipgloss.AdaptiveColor{Light: "#ef4444", Dark: "#ef4444"} // Light: red-500, Dark: red-500
-	purple = lipgloss.AdaptiveColor{Light: "#7e22ce", Dark: "#a855f7"} // Light: purple-700, Dark: purple-500
+	cyan  = lipgloss.AdaptiveColor{Light: "#4f46e5", Dark: "#c7d2fe"}
+	green = lipgloss.AdaptiveColor{Light: "#166534", Dark: "#22c55e"} // Light: green-800, Dark:
+
+	infoText = `Lorem ipsum dolor sit amet,
+consectetur adipiscing elit %s...`
+
+	Green   = lipgloss.NewStyle().Foreground(green).Render
+	message = fmt.Sprintf(infoText, Green("elit"))
 
 	myCustomStyle = confirm.Styles{
-		ActiveButtonStyle: lipgloss.NewStyle().Padding(0, 3).
-			Margin(1, 1).Background(green).Foreground(purple),
-		DialogStyle: lipgloss.NewStyle().
-			Border(lipgloss.NormalBorder()).
-			BorderTopForeground(purple).
-			BorderBottomForeground(green).
-			BorderLeftForeground(cyan).
-			BorderRightForeground(cyan).
-			Margin(1, 0, 1, 0).
-			Padding(1, 0).
-			BorderTop(true).
-			BorderLeft(true).
-			BorderRight(true).
-			BorderBottom(true).
-			Width(50).
-			Align(lipgloss.Center),
+		Width:       60,
+		BorderColor: cyan,
 	}
 
 	confirmConfig = &confirm.Config{
+		Message:  message,
 		Question: "Continue?",
 		Styles:   myCustomStyle,
 	}

diff --git a/confirm/command.go b/confirm/command.go
@@ -14,6 +14,7 @@ const (
 
 // Config represents the struct to configure the tui command.
 type Config struct {
+	Message           string
 	Question          string
 	OkButtonLabel     string
 	CancelButtonLabel string
@@ -35,6 +36,7 @@ func (cfg *Config) setDefaults() {
 
 func (cfg *Config) initialModel() model {
 	return model{
+		message:           cfg.Message,
 		question:          cfg.Question,
 		okButtonLabel:     cfg.OkButtonLabel,
 		cancelButtonLabel: cfg.CancelButtonLabel,

diff --git a/confirm/confirm.go b/confirm/confirm.go
@@ -7,6 +7,7 @@ import (
 )
 
 type model struct {
+	message           string
 	question          string
 	okButtonLabel     string
 	cancelButtonLabel string
@@ -59,9 +60,18 @@ func (m model) View() string {
 		neg = m.styles.ActiveButtonStyle.Render(m.cancelButtonLabel)
 	}
 
+	message := lipgloss.NewStyle().Render(m.message)
 	question := m.styles.QuestionStyle.Render(m.question)
 	buttons := lipgloss.JoinHorizontal(lipgloss.Left, aff, neg)
-	ui := m.styles.DialogStyle.Render(lipgloss.JoinVertical(lipgloss.Center, question, buttons))
+
+	var ui string
+	if !isEmpty(message) {
+		ui = m.styles.DialogStyle.Render(
+			lipgloss.JoinVertical(lipgloss.Center, message, "\n", question, buttons))
+	} else {
+		ui = m.styles.DialogStyle.Render(
+			lipgloss.JoinVertical(lipgloss.Center, question, buttons))
+	}
 
 	return lipgloss.NewStyle().Render(ui)
 }
diff --git a/confirm/styles.go b/confirm/styles.go
@@ -4,6 +4,10 @@ import "github.com/charmbracelet/lipgloss"
 
 // Styles is the struct representing the style configuration options.
 type Styles struct {
+	Width             int
+	BorderColor       lipgloss.AdaptiveColor
+	BorderStyle       lipgloss.Border
+	MessageStyle      lipgloss.Style
 	QuestionStyle     lipgloss.Style
 	ButtonStyle       lipgloss.Style
 	ActiveButtonStyle lipgloss.Style
@@ -17,6 +21,10 @@ var (
 	amber   = lipgloss.AdaptiveColor{Light: "#fef3c7", Dark: "#fef3c7"} // Light: amber-100, Dark: amber-100
 
 	// Styles
+	width         = 50
+	borderColor   = purple
+	borderStyle   = lipgloss.RoundedBorder()
+	messageStyle  = lipgloss.NewStyle()
 	questionStyle = lipgloss.NewStyle().Bold(true)
 	buttonStyle   = lipgloss.NewStyle().
 			Foreground(amber).
@@ -28,40 +36,91 @@ var (
 				Background(purple).
 				Underline(true)
 	dialogStyle = lipgloss.NewStyle().
-			Border(lipgloss.RoundedBorder()).
-			BorderForeground(purple).
+			Border(borderStyle).
+			BorderForeground(borderColor).
 			Margin(1, 0, 0, 0).
 			Padding(1, 0).
 			BorderTop(true).
 			BorderLeft(true).
 			BorderRight(true).
 			BorderBottom(true).
-			Width(50).Align(lipgloss.Center)
+			Width(width).Align(lipgloss.Center)
 
 	defaultTheme = Styles{
+		Width:             width,
+		BorderColor:       borderColor,
+		BorderStyle:       borderStyle,
+		MessageStyle:      messageStyle,
 		QuestionStyle:     questionStyle,
 		ButtonStyle:       buttonStyle,
 		ActiveButtonStyle: activeButtonStyle,
 		DialogStyle:       dialogStyle,
 	}
 )
 
+func setCustomDialogStyles(t *Styles) lipgloss.Style {
+	_width := 50
+	if !isEmpty(t.Width) {
+		_width = t.Width
+	}
+
+	_borderStyle := borderStyle
+	if !isEmpty((t.BorderStyle)) {
+		_borderStyle = t.BorderStyle
+	}
+
+	_borderColor := purple
+	if !isEmpty((t.BorderColor)) {
+		_borderColor = t.BorderColor
+	}
+
+	return lipgloss.NewStyle().
+		Margin(1, 0, 0, 0).
+		Padding(1, 0).
+		Border(_borderStyle).
+		BorderForeground(_borderColor).
+		BorderTop(true).
+		BorderLeft(true).
+		BorderRight(true).
+		BorderBottom(true).
+		Width(_width).Align(lipgloss.Center)
+}
+
 // DefaultStyles sets the default styles theme.
 func DefaultStyles() (s Styles) {
 	return defaultTheme
 }
 
 func (t *Styles) setDefaults() {
+	if isEmpty(t.Width) {
+		t.Width = defaultTheme.Width
+	}
+
+	if isEmpty(t.BorderColor) {
+		t.BorderColor = defaultTheme.BorderColor
+	}
+
+	if isEmpty(t.BorderStyle) {
+		t.BorderStyle = defaultTheme.BorderStyle
+	}
+
+	if isEmpty(t.MessageStyle) {
+		t.MessageStyle = defaultTheme.MessageStyle
+	}
+
 	if isEmpty(t.QuestionStyle) {
 		t.QuestionStyle = defaultTheme.QuestionStyle
 	}
+
 	if isEmpty(t.ButtonStyle) {
 		t.ButtonStyle = defaultTheme.ButtonStyle
 	}
+
 	if isEmpty(t.ActiveButtonStyle) {
 		t.ActiveButtonStyle = defaultTheme.ActiveButtonStyle
 	}
+
 	if isEmpty(t.DialogStyle) {
-		t.DialogStyle = defaultTheme.DialogStyle
+		t.DialogStyle = setCustomDialogStyles(t)
 	}
 }
diff --git a/confirm/utils.go b/confirm/utils.go
@@ -11,12 +11,16 @@ func isEmpty(s interface{}) bool {
 	switch s.(type) {
 	case string:
 		return len(fmt.Sprint(s)) == 0
+	case int:
+		return s == 0
 	case Styles:
 		return reflect.DeepEqual(s, Styles{})
 	case lipgloss.Style:
 		return reflect.DeepEqual(s, lipgloss.Style{})
 	case lipgloss.AdaptiveColor:
 		return reflect.DeepEqual(s, lipgloss.AdaptiveColor{})
+	case lipgloss.Border:
+		return reflect.DeepEqual(s, lipgloss.Border{})
 	default:
 		return false
 	}