hds-web 1.2.6 → 1.2.8
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/dist/index.css +2 -2
- package/dist/index.es.css +2 -2
- package/dist/index.es.js +2 -2
- package/dist/index.js +4 -4
- package/package.json +1 -1
- package/src/HDS/helpers/Media/mediabox.js +1 -1
- package/src/HDS/modules/navCard/navCard.js +52 -84
package/package.json
CHANGED
|
@@ -9,105 +9,73 @@ import PropTypes from 'prop-types';
|
|
|
9
9
|
const tabCard = (tabContent) => (
|
|
10
10
|
<>
|
|
11
11
|
<div className='px-3'>
|
|
12
|
-
<Typography textStyle='h4' className={HDSColor(tabContent.title_color)}>{tabContent.title}</Typography>
|
|
12
|
+
{tabContent.title && <Typography textStyle='h4' className={HDSColor(tabContent.title_color)}>{tabContent.title}</Typography>}
|
|
13
13
|
|
|
14
|
-
<Typography textStyle='body1c' className={HDSColor(tabContent.sub_title_color)}>{tabContent.sub_title}</Typography>
|
|
14
|
+
{tabContent.sub_title && <Typography textStyle='body1c' className={HDSColor(tabContent.sub_title_color)}>{tabContent.sub_title}</Typography>}
|
|
15
15
|
</div>
|
|
16
|
-
|
|
17
|
-
<
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
16
|
+
{tabContent.btnLabel &&
|
|
17
|
+
<div className='flex pl-3 pt-6 pb-8'>
|
|
18
|
+
<HDSButton
|
|
19
|
+
label={tabContent.btnLabel}
|
|
20
|
+
type='secondaryLink'
|
|
21
|
+
leftIconVariant='none'
|
|
22
|
+
rightIconVariant='none'
|
|
23
|
+
state='default'
|
|
24
|
+
size='sm'
|
|
25
|
+
rightAnimatedArrow={true}
|
|
26
|
+
rightAnimatedArrowColor='#1E56E3'
|
|
27
|
+
animatedHoverStroke='group-hover:stroke-blue-600'
|
|
28
|
+
className='flex'
|
|
29
|
+
btnTextColorClass='text-blue-600'
|
|
30
|
+
/>
|
|
31
|
+
</div>}
|
|
32
|
+
<div className='mt-8'>
|
|
32
33
|
<MediaBox
|
|
33
34
|
img_url={tabContent.img_url}
|
|
34
35
|
video_url={tabContent.video_url}
|
|
35
36
|
video_poster={tabContent.video_poster}
|
|
36
|
-
width={400}
|
|
37
37
|
/>
|
|
38
38
|
</div>
|
|
39
39
|
</>
|
|
40
40
|
)
|
|
41
41
|
|
|
42
42
|
export default function NavCard(props) {
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
43
|
+
const [activeTab, setActiveTab] = useState('');
|
|
44
|
+
|
|
45
|
+
useEffect(() => {
|
|
46
|
+
if (props.tabContent) {
|
|
47
|
+
const tabNames = Object.keys(props.tabContent);
|
|
48
|
+
setActiveTab(tabNames[0]);
|
|
49
|
+
}
|
|
50
|
+
}, [props.tabContent]);
|
|
51
|
+
|
|
52
|
+
const handleTabClick = (tab) => {
|
|
53
|
+
if (tab.name) {
|
|
54
|
+
setActiveTab(tab.name);
|
|
55
|
+
}
|
|
56
|
+
else return;
|
|
57
|
+
// Perform any other actions based on the clicked tab
|
|
58
|
+
}
|
|
59
|
+
|
|
57
60
|
return (
|
|
58
|
-
|
|
59
|
-
|
|
61
|
+
<div>
|
|
62
|
+
{props.navTabs &&
|
|
60
63
|
|
|
61
|
-
|
|
64
|
+
<div className='max-w-[44.44rem] p-16 bg-neutral-0 shadow rounded-2xl'>
|
|
62
65
|
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
66
|
+
<div className='flex justify-center pb-8'>
|
|
67
|
+
<Tab
|
|
68
|
+
onTabClick={handleTabClick}
|
|
69
|
+
tabs={props.navTabs}
|
|
70
|
+
/>
|
|
71
|
+
</div>
|
|
72
|
+
<div className=''>
|
|
73
|
+
{props.tabContent &&
|
|
74
|
+
props.tabContent[activeTab] &&
|
|
75
|
+
tabCard(props.tabContent[activeTab])}
|
|
76
|
+
</div>
|
|
74
77
|
|
|
75
|
-
|
|
76
|
-
|
|
78
|
+
</div>}
|
|
79
|
+
</div>
|
|
77
80
|
)
|
|
78
81
|
}
|
|
79
|
-
|
|
80
|
-
NavCard.defaultProps = {
|
|
81
|
-
tabContent: {
|
|
82
|
-
'Performance': {
|
|
83
|
-
title: '1Get blazing-fast APIs without the extra work',
|
|
84
|
-
sub_title: 'Hasura simplifies data access and reduces latency for optimizing performance via a Haskell core, JIT query compiler, predicate pushdown, and application-level caching out of the box.',
|
|
85
|
-
},
|
|
86
|
-
'Company': {
|
|
87
|
-
title: '2Get blazing-fast APIs without the extra work',
|
|
88
|
-
sub_title: 'Hasura simplifies data access and reduces latency for optimizing performance via a Haskell core, JIT query compiler, predicate pushdown, and application-level caching out of the box.',
|
|
89
|
-
},
|
|
90
|
-
'Authorization': {
|
|
91
|
-
title: '3Get blazing-fast APIs without the extra work',
|
|
92
|
-
sub_title: 'Hasura simplifies data access and reduces latency for optimizing performance via a Haskell core, JIT query compiler, predicate pushdown, and application-level caching out of the box.',
|
|
93
|
-
},
|
|
94
|
-
},
|
|
95
|
-
|
|
96
|
-
navTabs: [
|
|
97
|
-
{
|
|
98
|
-
current: true,
|
|
99
|
-
href: '',
|
|
100
|
-
name: 'Performance'
|
|
101
|
-
},
|
|
102
|
-
{
|
|
103
|
-
current: 'Insant Api',
|
|
104
|
-
href: '',
|
|
105
|
-
name: 'Company'
|
|
106
|
-
},
|
|
107
|
-
{
|
|
108
|
-
current: '[Circular]',
|
|
109
|
-
href: '',
|
|
110
|
-
name: 'Authorization'
|
|
111
|
-
},
|
|
112
|
-
]
|
|
113
|
-
}
|