next-helios-fe 1.8.43 → 1.8.44
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json
CHANGED
|
@@ -37,11 +37,11 @@ export const Tab: TabComponent = ({
|
|
|
37
37
|
|
|
38
38
|
return (
|
|
39
39
|
<div
|
|
40
|
-
className={`flex
|
|
40
|
+
className={`overlow-hidden flex h-full w-full ${
|
|
41
41
|
options?.variant !== "horizontal"
|
|
42
42
|
? "flex-col divide-y-1"
|
|
43
|
-
: "flex-col
|
|
44
|
-
} ${options?.border && "
|
|
43
|
+
: "flex-col divide-x-0 divide-y-1 lg:flex-row lg:divide-x-1 lg:divide-y-0"
|
|
44
|
+
} ${options?.border && "rounded-md border"}`}
|
|
45
45
|
>
|
|
46
46
|
{options?.variant !== "horizontal" ? (
|
|
47
47
|
<div className="flex overflow-auto [&::-webkit-scrollbar]:hidden">
|
|
@@ -50,17 +50,24 @@ export const Tab: TabComponent = ({
|
|
|
50
50
|
<div key={index} className="relative flex items-center">
|
|
51
51
|
<button
|
|
52
52
|
type="button"
|
|
53
|
-
className={`flex items-center gap-2
|
|
53
|
+
className={`flex select-none items-center gap-2 whitespace-nowrap border-b-2 pb-1.5 pt-2 duration-300 ${
|
|
54
54
|
activeTab === index
|
|
55
|
-
? "
|
|
56
|
-
: "border-transparent hover:
|
|
55
|
+
? "border-primary text-primary"
|
|
56
|
+
: "border-transparent hover:border-primary-transparent hover:text-primary"
|
|
57
57
|
} ${
|
|
58
58
|
onCloseTab && childrenList.length !== 1
|
|
59
|
-
? "ps-6
|
|
59
|
+
? "pe-10 ps-6"
|
|
60
60
|
: "px-6"
|
|
61
61
|
}`}
|
|
62
62
|
onClick={() => {
|
|
63
63
|
setActiveTab(index);
|
|
64
|
+
|
|
65
|
+
if (onChangeTab) {
|
|
66
|
+
onChangeTab({
|
|
67
|
+
index: index,
|
|
68
|
+
title: tabs[index].title,
|
|
69
|
+
});
|
|
70
|
+
}
|
|
64
71
|
}}
|
|
65
72
|
>
|
|
66
73
|
{tab?.icon && <Icon icon={tab?.icon} className="text-lg" />}
|
|
@@ -69,7 +76,7 @@ export const Tab: TabComponent = ({
|
|
|
69
76
|
{onCloseTab && childrenList.length !== 1 && (
|
|
70
77
|
<button
|
|
71
78
|
type="button"
|
|
72
|
-
className="absolute right-2 p-0.5
|
|
79
|
+
className="absolute right-2 rounded-full p-0.5 hover:text-warning"
|
|
73
80
|
onClick={() => {
|
|
74
81
|
setActiveTab(
|
|
75
82
|
activeTab === index
|
|
@@ -78,6 +85,7 @@ export const Tab: TabComponent = ({
|
|
|
78
85
|
: index - 1
|
|
79
86
|
: activeTab
|
|
80
87
|
);
|
|
88
|
+
|
|
81
89
|
onCloseTab(index);
|
|
82
90
|
}}
|
|
83
91
|
>
|
|
@@ -89,16 +97,16 @@ export const Tab: TabComponent = ({
|
|
|
89
97
|
})}
|
|
90
98
|
</div>
|
|
91
99
|
) : (
|
|
92
|
-
<div className="flex flex-row
|
|
100
|
+
<div className="flex flex-row overflow-auto lg:min-w-36 lg:max-w-48 lg:flex-col [&::-webkit-scrollbar]:hidden">
|
|
93
101
|
{tabs.slice(0, childrenList.length).map((tab, index) => {
|
|
94
102
|
return (
|
|
95
103
|
<button
|
|
96
104
|
key={index}
|
|
97
105
|
type="button"
|
|
98
|
-
className={`flex items-center gap-2
|
|
106
|
+
className={`flex select-none items-center gap-2 whitespace-nowrap border-b-2 border-r-0 px-6 pb-1.5 pt-2 text-left duration-300 lg:border-b-0 lg:border-r-2 ${
|
|
99
107
|
activeTab === index
|
|
100
|
-
? "
|
|
101
|
-
: "border-transparent hover:
|
|
108
|
+
? "border-primary text-primary"
|
|
109
|
+
: "border-transparent hover:border-primary-transparent hover:text-primary"
|
|
102
110
|
}`}
|
|
103
111
|
onClick={() => {
|
|
104
112
|
setActiveTab(index);
|
|
@@ -123,7 +131,7 @@ export const Tab: TabComponent = ({
|
|
|
123
131
|
!options?.disablePadding
|
|
124
132
|
? options?.variant !== "horizontal"
|
|
125
133
|
? "px-6 py-8"
|
|
126
|
-
: "px-6 lg:px-8
|
|
134
|
+
: "px-6 py-8 lg:px-8 lg:py-6"
|
|
127
135
|
: ""
|
|
128
136
|
}`}
|
|
129
137
|
>
|