File tree 1 file changed +30
-0
lines changed
src/examples/how-to-toggle-product-details
1 file changed +30
-0
lines changed Original file line number Diff line number Diff line change
1
+ import { useToggle } from '../../hooks/ts/useToggle' ;
2
+
3
+ export const ToggleProductDetails = ( ) => {
4
+ const { current : showDetails , handleToggle : toggleDetails } =
5
+ useToggle ( false ) ;
6
+
7
+ return (
8
+ < >
9
+ < h1 > SmartWatch Pro X</ h1 >
10
+ < p >
11
+ The SmartWatch Pro X is the ultimate smartwatch for those looking to
12
+ combine style, technology, and performance in one device. With a
13
+ high-resolution AMOLED display, you'll enjoy vibrant colors and sharp
14
+ details, even under direct sunlight.
15
+ </ p >
16
+ { showDetails && (
17
+ < p >
18
+ Designed for everyday use, the Pro X offers advanced health tracking,
19
+ continuous heart rate monitoring, and the option to measure blood
20
+ oxygen levels, making it the perfect companion for any physical
21
+ activity. Plus, its GPS feature lets you track your routes without
22
+ needing to carry your phone.
23
+ </ p >
24
+ ) }
25
+ < button onClick = { toggleDetails } >
26
+ { showDetails ? 'Show less' : 'Show more' }
27
+ </ button >
28
+ </ >
29
+ ) ;
30
+ } ;
You can’t perform that action at this time.
0 commit comments