hds-web 1.18.6 → 1.18.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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "hds-web",
3
- "version": "1.18.6",
3
+ "version": "1.18.8",
4
4
  "private": false,
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.es.js",
@@ -40,9 +40,9 @@ export default function IconCard(props) {
40
40
  return (
41
41
  <>
42
42
  {
43
- ((props.readMoreBtn && props.button) || (!props.linkHover) || (!props.readMoreBtn && !props.button) || (props.button && props.button.length > 1)) ? (
43
+ ((props.readMoreBtn && props.button) || (!props.readMoreBtn && !props.button) || (props.button && props.button.length > 1) || !props.linkHover) ? (
44
44
  <div
45
- className={`bg-neutral-0 grid h-full transition-all ease-in-out rounded-3xl ${cardVariant[props.cardType]['cardStyle']} ` + ((props.cardBorder) ? props.cardBorder : 'tb:shadow') + ((props.readMoreBtn || props.button) ? ' hover:shadow-lg' : '')}
45
+ className={`bg-neutral-0 grid h-full transition-all ease-in-out rounded-3xl ${cardVariant[props.cardType]['cardStyle']} ` + ((props.cardBorder) ? props.cardBorder : 'tb:shadow')}
46
46
  >
47
47
  <div className=" self-start">
48
48
  <div
@@ -75,38 +75,62 @@ export default function IconCard(props) {
75
75
  {props.description}
76
76
  </ReactMarkdown>
77
77
  </Typography>
78
- {props.readMoreBtn && (
79
- <a href={props.readMoreBtn.cta_link} className='flex'>
80
- <div className="flex">
81
- <HDSButton
82
- label={props.readMoreBtn.cta_text}
83
- type='secondaryLink'
84
- leftIconVariant='none'
85
- rightIconVariant='none'
86
- state='default'
87
- size='sm'
88
- rightAnimatedArrow={props.linkHover ?? 'true'}
89
- rightAnimatedArrowColor='#3970FD'
90
- animatedHoverStroke='#3970FD'
91
- btnTextColorClass={props.linkHover ? 'text-blue-500' : 'text-neutral-1000'}
92
- btnTextHoverClass=''
93
- className=' mt-4'
94
- />
95
- </div>
96
- </a>
97
- )
98
-
99
- }
100
78
  </>
101
79
  )
102
80
  }
103
81
  </div>
104
82
  </div>
83
+ {props.readMoreBtn && (
84
+ <>
85
+ {
86
+ props.linkHover ? (
87
+ <a href={props.readMoreBtn.cta_link} className='flex self-end'>
88
+ <div className="flex">
89
+ <HDSButton
90
+ label={props.readMoreBtn.cta_text}
91
+ type='secondaryLink'
92
+ leftIconVariant='none'
93
+ rightIconVariant='none'
94
+ state='default'
95
+ size='sm'
96
+ rightAnimatedArrow={true}
97
+ rightAnimatedArrowColor='#3970FD'
98
+ animatedHoverStroke='#3970FD'
99
+ btnTextColorClass='text-blue-500'
100
+ btnTextHoverClass=''
101
+ className=' mt-4'
102
+ />
103
+ </div>
104
+ </a>
105
+ ) : (
106
+ <div className="flex self-end">
107
+ <HDSButton
108
+ label={props.readMoreBtn.cta_text}
109
+ type='secondaryLink'
110
+ leftIconVariant='none'
111
+ rightIconVariant='none'
112
+ state='default'
113
+ size='sm'
114
+ rightAnimatedArrow={false}
115
+ rightAnimatedArrowColor='#3970FD'
116
+ animatedHoverStroke='#3970FD'
117
+ btnTextColorClass='text-neutral-800'
118
+ btnTextHoverClass=''
119
+ className=' mt-4 hover:cursor-default'
120
+ />
121
+ </div>
122
+ )
123
+ }
124
+ </>
125
+ )
126
+ }
105
127
  {props.button &&
106
- <div className="flex self-end gap-2 ">
128
+ <div className="flex gap-2 ">
107
129
  {props.button.map((btn, index) => (
108
- <a href={btn.cta_link} key={index} className="flex mt-7">
130
+ <a href={btn.cta_link} key={index} className="flex self-end mt-7">
109
131
  <div className="flex">
132
+
133
+
110
134
  <HDSButton
111
135
  label={btn.cta_text}
112
136
  type={btn.cta_type || 'secondary'}
@@ -114,7 +138,7 @@ export default function IconCard(props) {
114
138
  rightIconVariant='none'
115
139
  state='default'
116
140
  size='sm'
117
- rightAnimatedArrow={(props.linkHover ?? 'true')}
141
+ rightAnimatedArrow={true}
118
142
  rightAnimatedArrowColor={btn.rightAnimatedArrowColor || '#3970FD'}
119
143
  btnBgColorClass={btn.btnBg}
120
144
  btnTextHoverClass={btn.btnTextColorClass}
@@ -126,15 +150,12 @@ export default function IconCard(props) {
126
150
  }
127
151
  </div>
128
152
  }
129
-
130
-
131
-
132
153
  </div>
133
154
  ) :
134
155
 
135
156
  (
136
157
  <a href={((props.readMoreBtn && !props.button) ? props.readMoreBtn['cta_link'] : props.button[0]['cta_link'])}
137
- className={`bg-neutral-0 group grid h-full duration-300 transition-all ease-in-out rounded-3xl ${cardVariant[props.cardType]['cardStyle']} ` + ((props.cardBorder) ? props.cardBorder : 'tb:shadow') + ((props.readMoreBtn || props.button) ? ' hover:shadow-lg hover:translate-y-0.5 ' : '')}
158
+ className={`bg-neutral-0 group grid h-full duration-300 transition-all ease-in-out rounded-3xl ${cardVariant[props.cardType]['cardStyle']} ` + ((props.cardBorder) ? props.cardBorder : 'tb:shadow') + ((props.readMoreBtn || props.button || props.linkHover) ? ' hover:shadow-lg hover:translate-y-0.5 ' : '')}
138
159
  >
139
160
  <div className=" self-start">
140
161
  <div
@@ -167,32 +188,33 @@ export default function IconCard(props) {
167
188
  {props.description}
168
189
  </ReactMarkdown>
169
190
  </Typography>
170
- {props.readMoreBtn && (
171
- <div className="flex">
172
- <HDSButton
173
- label={props.readMoreBtn.cta_text}
174
- type='secondaryLink'
175
- leftIconVariant='none'
176
- rightIconVariant='none'
177
- state='default'
178
- size='sm'
179
- rightAnimatedArrow={true}
180
- rightAnimatedArrowColor='#3970FD'
181
- animatedHoverStroke='#3970FD'
182
- btnTextColorClass='text-blue-500'
183
- btnTextHoverClass=''
184
- className=' mt-4'
185
- />
186
- </div>
187
- )
188
- }
191
+
189
192
  </>
190
193
  )
191
194
  }
192
195
  </div>
193
196
  </div>
197
+ {props.readMoreBtn && (
198
+ <div className="flex self-end">
199
+ <HDSButton
200
+ label={props.readMoreBtn.cta_text}
201
+ type='secondaryLink'
202
+ leftIconVariant='none'
203
+ rightIconVariant='none'
204
+ state='default'
205
+ size='sm'
206
+ rightAnimatedArrow={true}
207
+ rightAnimatedArrowColor='#3970FD'
208
+ animatedHoverStroke='#3970FD'
209
+ btnTextColorClass='text-blue-500'
210
+ btnTextHoverClass=''
211
+ className=' mt-4'
212
+ />
213
+ </div>
214
+ )
215
+ }
194
216
  {props.button &&
195
- <div className="flex pt-4 self-end gap-2">
217
+ <div className="flex pt-4 gap-2 self-end">
196
218
  {props.button.map((btn, index) => (
197
219
  <div className="flex">
198
220
  <HDSButton
@@ -230,4 +252,3 @@ IconCard.defaultProps = {
230
252
  Icon.propTypes = {
231
253
  cardType: PropTypes.oneOf(['withoutButton', 'withButton', 'sm']),
232
254
  }
233
-