From 8a2fd03facb20e25df2735fa8f916f84fe0ea1ed Mon Sep 17 00:00:00 2001
From: anoshenko <anoshenko@gmail.com>
Date: Sun, 21 Nov 2021 18:16:22 +0300
Subject: [PATCH] Updated TabsLayout

---
 app_scripts.js   | 11 +++++++++--
 defaultTheme.rui | 39 +++++++++++++++++++++++++++++++++++++++
 tabsLayout.go    |  8 ++++++--
 3 files changed, 54 insertions(+), 4 deletions(-)

diff --git a/app_scripts.js b/app_scripts.js
index 7d8a0bc..86f1742 100644
--- a/app_scripts.js
+++ b/app_scripts.js
@@ -303,18 +303,25 @@ function tabClickEvent(layoutId, tabNumber, event) {
 	sendMessage("tabClick{session=" + sessionID + ",id=" + layoutId + ",number=" + tabNumber + "}");
 }
 
+function tabKeyClickEvent(layoutId, tabNumber, event) {
+	if (enterOrSpaceKeyClickEvent(event)) {
+		tabClickEvent(layoutId, tabNumber, event)
+	}
+}
+
 function tabCloseClickEvent(layoutId, tabNumber, event) {
 	event.stopPropagation();
 	event.preventDefault();
 	sendMessage("tabCloseClick{session=" + sessionID + ",id=" + layoutId + ",number=" + tabNumber + "}");
 }
 
-function tabKeyClickEvent(layoutId, tabNumber, event) {
+function tabCloseKeyClickEvent(layoutId, tabNumber, event) {
 	if (enterOrSpaceKeyClickEvent(event)) {
-		tabClickEvent(layoutId, tabNumber, event)
+		tabCloseClickEvent(layoutId, tabNumber, event)
 	}
 }
 
+
 function keyEvent(element, event, tag) {
 	event.stopPropagation();
 
diff --git a/defaultTheme.rui b/defaultTheme.rui
index 2f3acfb..23fd6f2 100644
--- a/defaultTheme.rui
+++ b/defaultTheme.rui
@@ -126,37 +126,73 @@ theme {
 			background-color = @ruiCurrentTabColor,
 			text-color = @ruiCurrentTabTextColor,
 			padding-left = 4px,
+			padding-top = 2px,
 			padding-right = 4px,
+			padding-bottom = 2px,
 			margin = @ruiTabMargin,
 			radius = @ruiTabRadius,
 		},
+		ruiCurrentTab:focus {
+			padding-left = 2px,
+			padding-top = 0px,
+			padding-right = 2px,
+			padding-bottom = 0px,
+			border = _{style = solid, color = @ruiHighlightColor, width = 2px },
+		},
 		ruiTab {
 			min-height = @ruiTabHeight,
 			background-color = @ruiTabColor,
 			text-color = @ruiTabTextColor,
 			padding-left = 4px,
+			padding-top = 2px,
 			padding-right = 4px,
+			padding-bottom = 2px,
 			margin = @ruiTabMargin,
 			radius = @ruiTabRadius,
 		},
+		ruiTab:focus {
+			padding-left = 2px,
+			padding-top = 0px,
+			padding-right = 2px,
+			padding-bottom = 0px,
+			border = _{style = solid, color = @ruiHighlightColor, width = 2px },
+		},
 		ruiCurrentVerticalTab {
 			min-width = @ruiTabHeight,
 			background-color = @ruiCurrentTabColor,
 			text-color = @ruiCurrentTabTextColor,
+			padding-left = 2px,
 			padding-top = 4px,
+			padding-right = 2px,
 			padding-bottom = 4px,
 			margin = @ruiTabMargin,
 			radius = @ruiTabRadius,
 		},
+		ruiCurrentVerticalTab:focus {
+			padding-left = 0px,
+			padding-top = 2px,
+			padding-right = 0px,
+			padding-bottom = 2px,
+			border = _{style = solid, color = @ruiHighlightColor, width = 2px },
+		},
 		ruiVerticalTab {
 			min-width = @ruiTabHeight,
 			background-color = @ruiTabColor,
 			text-color = @ruiTabTextColor,
+			padding-left = 2px,
 			padding-top = 4px,
+			padding-right = 2px,
 			padding-bottom = 4px,
 			margin = @ruiTabMargin,
 			radius = @ruiTabRadius,
 		},
+		ruiVerticalTab:focus {
+			padding-left = 0px,
+			padding-top = 2px,
+			padding-right = 0px,
+			padding-bottom = 2px,
+			border = _{style = solid, color = @ruiHighlightColor, width = 2px },
+		},
 		ruiTabCloseButton {
 			width = 16px,
 			height = 16px,
@@ -169,6 +205,9 @@ theme {
 			background-color = @ruiTabBarBackgroundColor,
 			radius = 3px,
 		},
+		ruiTabCloseButton:focus {
+			outline = _{style = solid, color = @ruiHighlightColor, width = 2px },
+		},
 		ruiPopup {
 			background-color = @ruiPopupBackgroundColor,
 			text-color = @ruiPopupTextColor,
diff --git a/tabsLayout.go b/tabsLayout.go
index 479aaf2..7b9b6a9 100644
--- a/tabsLayout.go
+++ b/tabsLayout.go
@@ -789,7 +789,7 @@ func (tabsLayout *tabsLayoutData) htmlSubviews(self View, buffer *strings.Builde
 			buffer.WriteString(tabsLayoutID)
 			buffer.WriteString(`\', `)
 			buffer.WriteString(strconv.Itoa(n))
-			buffer.WriteString(`, event)" onclick="tabKeyClickEvent(\'`)
+			buffer.WriteString(`, event)" onkeydown="tabKeyClickEvent(\'`)
 			buffer.WriteString(tabsLayoutID)
 			buffer.WriteString(`\', `)
 			buffer.WriteString(strconv.Itoa(n))
@@ -827,7 +827,11 @@ func (tabsLayout *tabsLayoutData) htmlSubviews(self View, buffer *strings.Builde
 				close = closeButton
 			}
 			if close {
-				buffer.WriteString(`<div class="ruiTabCloseButton" onclick="tabCloseClickEvent(\'`)
+				buffer.WriteString(`<div class="ruiTabCloseButton" tabindex="0" onclick="tabCloseClickEvent(\'`)
+				buffer.WriteString(tabsLayoutID)
+				buffer.WriteString(`\', `)
+				buffer.WriteString(strconv.Itoa(n))
+				buffer.WriteString(`, event)" onkeydown="tabCloseKeyClickEvent(\'`)
 				buffer.WriteString(tabsLayoutID)
 				buffer.WriteString(`\', `)
 				buffer.WriteString(strconv.Itoa(n))