@luxfi/ui 5.6.0 → 6.1.0

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.
Files changed (155) hide show
  1. package/dist/components/Badge.d.ts.map +1 -0
  2. package/dist/components/Badge.js +91 -0
  3. package/dist/components/Button.d.ts.map +1 -0
  4. package/dist/components/Button.js +137 -0
  5. package/dist/components/Card.d.ts.map +1 -0
  6. package/dist/components/Card.js +86 -0
  7. package/dist/components/IconButton.d.ts.map +1 -0
  8. package/dist/components/IconButton.js +64 -0
  9. package/dist/components/Input.d.ts.map +1 -0
  10. package/dist/components/Input.js +71 -0
  11. package/dist/components/Modal.d.ts.map +1 -0
  12. package/dist/components/Modal.js +98 -0
  13. package/dist/components/Skeleton.d.ts.map +1 -0
  14. package/dist/components/Skeleton.js +44 -0
  15. package/dist/components/Spinner.d.ts.map +1 -0
  16. package/dist/components/Spinner.js +42 -0
  17. package/dist/components/Switch.d.ts.map +1 -0
  18. package/dist/components/Switch.js +10 -0
  19. package/dist/components/TokenLogo.d.ts.map +1 -0
  20. package/dist/components/TokenLogo.js +57 -0
  21. package/dist/components/Tooltip.d.ts.map +1 -0
  22. package/dist/components/Tooltip.js +34 -0
  23. package/dist/components/index.d.ts.map +1 -0
  24. package/dist/components/index.js +19 -0
  25. package/dist/index.d.ts.map +1 -0
  26. package/dist/index.js +35 -5618
  27. package/dist/theme/index.d.ts.map +1 -0
  28. package/dist/theme/index.js +6 -0
  29. package/dist/theme/themes.d.ts.map +1 -0
  30. package/dist/theme/themes.js +73 -0
  31. package/dist/theme/tokens.d.ts.map +1 -0
  32. package/dist/theme/tokens.js +101 -0
  33. package/package.json +81 -278
  34. package/dist/accordion.cjs +0 -213
  35. package/dist/accordion.js +0 -186
  36. package/dist/alert.cjs +0 -553
  37. package/dist/alert.js +0 -531
  38. package/dist/avatar.cjs +0 -149
  39. package/dist/avatar.js +0 -125
  40. package/dist/badge.cjs +0 -611
  41. package/dist/badge.js +0 -589
  42. package/dist/button.cjs +0 -689
  43. package/dist/button.js +0 -664
  44. package/dist/checkbox.cjs +0 -265
  45. package/dist/checkbox.js +0 -241
  46. package/dist/close-button.cjs +0 -73
  47. package/dist/close-button.js +0 -51
  48. package/dist/collapsible.cjs +0 -702
  49. package/dist/collapsible.js +0 -679
  50. package/dist/color-mode.cjs +0 -96
  51. package/dist/color-mode.js +0 -72
  52. package/dist/dialog.cjs +0 -279
  53. package/dist/dialog.js +0 -246
  54. package/dist/drawer.cjs +0 -207
  55. package/dist/drawer.js +0 -175
  56. package/dist/empty-state.cjs +0 -93
  57. package/dist/empty-state.js +0 -71
  58. package/dist/field.cjs +0 -183
  59. package/dist/field.js +0 -160
  60. package/dist/heading.cjs +0 -46
  61. package/dist/heading.js +0 -40
  62. package/dist/icon-button.cjs +0 -491
  63. package/dist/icon-button.js +0 -470
  64. package/dist/image.cjs +0 -572
  65. package/dist/image.js +0 -551
  66. package/dist/index.cjs +0 -5779
  67. package/dist/input-group.cjs +0 -155
  68. package/dist/input-group.js +0 -133
  69. package/dist/input.cjs +0 -65
  70. package/dist/input.js +0 -59
  71. package/dist/link.cjs +0 -630
  72. package/dist/link.js +0 -606
  73. package/dist/menu.cjs +0 -305
  74. package/dist/menu.js +0 -269
  75. package/dist/pin-input.cjs +0 -182
  76. package/dist/pin-input.js +0 -160
  77. package/dist/popover.cjs +0 -327
  78. package/dist/popover.js +0 -294
  79. package/dist/progress-circle.cjs +0 -152
  80. package/dist/progress-circle.js +0 -128
  81. package/dist/progress.cjs +0 -117
  82. package/dist/progress.js +0 -94
  83. package/dist/provider.cjs +0 -62
  84. package/dist/provider.js +0 -40
  85. package/dist/radio.cjs +0 -177
  86. package/dist/radio.js +0 -153
  87. package/dist/rating.cjs +0 -80
  88. package/dist/rating.js +0 -58
  89. package/dist/select.cjs +0 -791
  90. package/dist/select.js +0 -757
  91. package/dist/separator.cjs +0 -57
  92. package/dist/separator.js +0 -51
  93. package/dist/skeleton.cjs +0 -370
  94. package/dist/skeleton.js +0 -346
  95. package/dist/slider.cjs +0 -138
  96. package/dist/slider.js +0 -115
  97. package/dist/switch.cjs +0 -163
  98. package/dist/switch.js +0 -140
  99. package/dist/table.cjs +0 -1044
  100. package/dist/table.js +0 -1013
  101. package/dist/tabs.cjs +0 -240
  102. package/dist/tabs.js +0 -213
  103. package/dist/tag.cjs +0 -651
  104. package/dist/tag.js +0 -628
  105. package/dist/textarea.cjs +0 -65
  106. package/dist/textarea.js +0 -59
  107. package/dist/toaster.cjs +0 -99
  108. package/dist/toaster.js +0 -96
  109. package/dist/tooltip.cjs +0 -171
  110. package/dist/tooltip.js +0 -148
  111. package/dist/utils.cjs +0 -11
  112. package/dist/utils.js +0 -9
  113. package/src/accordion.tsx +0 -285
  114. package/src/alert.tsx +0 -221
  115. package/src/avatar.tsx +0 -174
  116. package/src/badge.tsx +0 -158
  117. package/src/button.tsx +0 -411
  118. package/src/checkbox.tsx +0 -307
  119. package/src/close-button.tsx +0 -51
  120. package/src/collapsible.tsx +0 -126
  121. package/src/color-mode.tsx +0 -125
  122. package/src/dialog.tsx +0 -356
  123. package/src/drawer.tsx +0 -186
  124. package/src/empty-state.tsx +0 -97
  125. package/src/field.tsx +0 -202
  126. package/src/heading.tsx +0 -55
  127. package/src/icon-button.tsx +0 -192
  128. package/src/image.tsx +0 -280
  129. package/src/index.ts +0 -192
  130. package/src/input-group.tsx +0 -159
  131. package/src/input.tsx +0 -60
  132. package/src/link.tsx +0 -326
  133. package/src/menu.tsx +0 -471
  134. package/src/pin-input.tsx +0 -187
  135. package/src/popover.tsx +0 -400
  136. package/src/progress-circle.tsx +0 -180
  137. package/src/progress.tsx +0 -109
  138. package/src/provider.tsx +0 -12
  139. package/src/radio.tsx +0 -175
  140. package/src/rating.tsx +0 -79
  141. package/src/select.tsx +0 -696
  142. package/src/separator.tsx +0 -59
  143. package/src/skeleton.tsx +0 -302
  144. package/src/slider.tsx +0 -152
  145. package/src/switch.tsx +0 -158
  146. package/src/table.tsx +0 -621
  147. package/src/tabs.tsx +0 -354
  148. package/src/tag.tsx +0 -159
  149. package/src/textarea.tsx +0 -60
  150. package/src/toaster.tsx +0 -117
  151. package/src/tokens.css +0 -438
  152. package/src/tooltip.tsx +0 -184
  153. package/src/utils/cn.ts +0 -7
  154. package/src/utils.ts +0 -6
  155. package/tokens.css +0 -438
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../src/components/Badge.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAEvC,QAAA,MAAM,UAAU;;;8CAoDd,CAAA;AAmCF,MAAM,MAAM,UAAU,GAAG,QAAQ,CAAC,OAAO,UAAU,CAAC,GAAG;IACrD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,CAAA;AAED,wBAAgB,KAAK,CAAC,EAAE,QAAQ,EAAE,OAAmB,EAAE,GAAG,KAAK,EAAE,EAAE,UAAU,2CAM5E"}
@@ -0,0 +1,91 @@
1
+ import { jsx as _jsx } from 'react/jsx-runtime'
2
+ import { Stack, styled, Text } from 'tamagui'
3
+
4
+ const BadgeFrame = styled(Stack, {
5
+ name: 'Badge',
6
+ flexDirection: 'row',
7
+ alignItems: 'center',
8
+ justifyContent: 'center',
9
+ paddingHorizontal: '$2',
10
+ paddingVertical: '$1',
11
+ borderRadius: '$2',
12
+ variants: {
13
+ variant: {
14
+ default: {
15
+ backgroundColor: '$backgroundHover',
16
+ },
17
+ primary: {
18
+ backgroundColor: '$primary',
19
+ },
20
+ success: {
21
+ backgroundColor: '$success',
22
+ },
23
+ warning: {
24
+ backgroundColor: '$warning',
25
+ },
26
+ error: {
27
+ backgroundColor: '$error',
28
+ },
29
+ outline: {
30
+ backgroundColor: 'transparent',
31
+ borderWidth: 1,
32
+ borderColor: '$borderColor',
33
+ },
34
+ },
35
+ size: {
36
+ sm: {
37
+ paddingHorizontal: '$1.5',
38
+ paddingVertical: 2,
39
+ },
40
+ md: {
41
+ paddingHorizontal: '$2',
42
+ paddingVertical: '$1',
43
+ },
44
+ lg: {
45
+ paddingHorizontal: '$3',
46
+ paddingVertical: '$1.5',
47
+ },
48
+ },
49
+ },
50
+ defaultVariants: {
51
+ variant: 'default',
52
+ size: 'md',
53
+ },
54
+ })
55
+ const BadgeText = styled(Text, {
56
+ name: 'BadgeText',
57
+ fontSize: 12,
58
+ fontWeight: '500',
59
+ variants: {
60
+ variant: {
61
+ default: {
62
+ color: '$color',
63
+ },
64
+ primary: {
65
+ color: 'white',
66
+ },
67
+ success: {
68
+ color: 'white',
69
+ },
70
+ warning: {
71
+ color: 'white',
72
+ },
73
+ error: {
74
+ color: 'white',
75
+ },
76
+ outline: {
77
+ color: '$color',
78
+ },
79
+ },
80
+ },
81
+ defaultVariants: {
82
+ variant: 'default',
83
+ },
84
+ })
85
+ export function Badge({ children, variant = 'default', ...props }) {
86
+ return _jsx(BadgeFrame, {
87
+ variant: variant,
88
+ ...props,
89
+ children: _jsx(BadgeText, { variant: variant, children: children }),
90
+ })
91
+ }
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/components/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAU,QAAQ,EAAE,MAAM,eAAe,CAAA;AAGhD,QAAA,MAAM,WAAW;;;;;8CAgHf,CAAA;AAsBF,MAAM,MAAM,WAAW,GAAG,QAAQ,CAAC,OAAO,WAAW,CAAC,GAAG;IACvD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B,CAAA;AAED,wBAAgB,MAAM,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,WAAW,2CAU/D;yBAVe,MAAM"}
@@ -0,0 +1,137 @@
1
+ import { styled } from '@tamagui/core'
2
+ import { jsx as _jsx } from 'react/jsx-runtime'
3
+ import { Stack, Text } from 'tamagui'
4
+
5
+ const ButtonFrame = styled(Stack, {
6
+ name: 'Button',
7
+ tag: 'button',
8
+ alignItems: 'center',
9
+ justifyContent: 'center',
10
+ flexDirection: 'row',
11
+ gap: '$2',
12
+ borderRadius: '$3',
13
+ paddingHorizontal: '$4',
14
+ paddingVertical: '$3',
15
+ cursor: 'pointer',
16
+ pressStyle: {
17
+ opacity: 0.8,
18
+ scale: 0.98,
19
+ },
20
+ hoverStyle: {
21
+ opacity: 0.9,
22
+ },
23
+ focusStyle: {
24
+ outlineWidth: 2,
25
+ outlineColor: '$primary',
26
+ outlineStyle: 'solid',
27
+ outlineOffset: 2,
28
+ },
29
+ disabledStyle: {
30
+ opacity: 0.5,
31
+ cursor: 'not-allowed',
32
+ },
33
+ variants: {
34
+ variant: {
35
+ primary: {
36
+ backgroundColor: '$primary',
37
+ color: 'white',
38
+ hoverStyle: {
39
+ backgroundColor: '$primaryHover',
40
+ },
41
+ },
42
+ secondary: {
43
+ backgroundColor: '$secondary',
44
+ color: '$color',
45
+ hoverStyle: {
46
+ backgroundColor: '$secondaryHover',
47
+ },
48
+ },
49
+ outline: {
50
+ backgroundColor: 'transparent',
51
+ borderWidth: 1,
52
+ borderColor: '$borderColor',
53
+ color: '$color',
54
+ hoverStyle: {
55
+ backgroundColor: '$backgroundHover',
56
+ },
57
+ },
58
+ ghost: {
59
+ backgroundColor: 'transparent',
60
+ color: '$color',
61
+ hoverStyle: {
62
+ backgroundColor: '$backgroundHover',
63
+ },
64
+ },
65
+ destructive: {
66
+ backgroundColor: '$error',
67
+ color: 'white',
68
+ hoverStyle: {
69
+ backgroundColor: '$errorDark',
70
+ },
71
+ },
72
+ },
73
+ size: {
74
+ sm: {
75
+ paddingHorizontal: '$3',
76
+ paddingVertical: '$2',
77
+ height: 32,
78
+ },
79
+ md: {
80
+ paddingHorizontal: '$4',
81
+ paddingVertical: '$3',
82
+ height: 40,
83
+ },
84
+ lg: {
85
+ paddingHorizontal: '$5',
86
+ paddingVertical: '$4',
87
+ height: 48,
88
+ },
89
+ xl: {
90
+ paddingHorizontal: '$6',
91
+ paddingVertical: '$5',
92
+ height: 56,
93
+ },
94
+ },
95
+ fullWidth: {
96
+ true: {
97
+ width: '100%',
98
+ },
99
+ },
100
+ circular: {
101
+ true: {
102
+ borderRadius: '$round',
103
+ paddingHorizontal: 0,
104
+ aspectRatio: 1,
105
+ },
106
+ },
107
+ },
108
+ defaultVariants: {
109
+ variant: 'primary',
110
+ size: 'md',
111
+ },
112
+ })
113
+ const ButtonText = styled(Text, {
114
+ name: 'ButtonText',
115
+ fontFamily: '$body',
116
+ fontWeight: '600',
117
+ color: 'inherit',
118
+ variants: {
119
+ size: {
120
+ sm: { fontSize: 13 },
121
+ md: { fontSize: 14 },
122
+ lg: { fontSize: 16 },
123
+ xl: { fontSize: 18 },
124
+ },
125
+ },
126
+ defaultVariants: {
127
+ size: 'md',
128
+ },
129
+ })
130
+ export function Button({ children, size, ...props }) {
131
+ return _jsx(ButtonFrame, {
132
+ size: size,
133
+ ...props,
134
+ children: typeof children === 'string' ? _jsx(ButtonText, { size: size, children: children }) : children,
135
+ })
136
+ }
137
+ Button.displayName = 'Button'
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../src/components/Card.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAU,QAAQ,EAAE,MAAM,eAAe,CAAA;AAGhD,eAAO,MAAM,IAAI;;;;8CA8Df,CAAA;AAEF,eAAO,MAAM,UAAU,qPAGrB,CAAA;AAEF,eAAO,MAAM,SAAS;;;8CAGpB,CAAA;AAEF,eAAO,MAAM,eAAe;;8CAI1B,CAAA;AAEF,eAAO,MAAM,WAAW,qPAGtB,CAAA;AAEF,eAAO,MAAM,UAAU,qPAOrB,CAAA;AAEF,MAAM,MAAM,SAAS,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA"}
@@ -0,0 +1,86 @@
1
+ import { styled } from '@tamagui/core'
2
+ import { H3, Stack, Text } from 'tamagui'
3
+ export const Card = styled(Stack, {
4
+ name: 'Card',
5
+ backgroundColor: '$card',
6
+ borderRadius: '$4',
7
+ borderWidth: 1,
8
+ borderColor: '$borderColor',
9
+ padding: '$4',
10
+ gap: '$3',
11
+ variants: {
12
+ variant: {
13
+ default: {},
14
+ elevated: {
15
+ shadowColor: '$black',
16
+ shadowOffset: { width: 0, height: 4 },
17
+ shadowOpacity: 0.1,
18
+ shadowRadius: 8,
19
+ elevation: 4,
20
+ },
21
+ outline: {
22
+ backgroundColor: 'transparent',
23
+ borderWidth: 1,
24
+ borderColor: '$borderColor',
25
+ },
26
+ ghost: {
27
+ backgroundColor: 'transparent',
28
+ borderWidth: 0,
29
+ },
30
+ },
31
+ size: {
32
+ sm: {
33
+ padding: '$3',
34
+ gap: '$2',
35
+ },
36
+ md: {
37
+ padding: '$4',
38
+ gap: '$3',
39
+ },
40
+ lg: {
41
+ padding: '$5',
42
+ gap: '$4',
43
+ },
44
+ },
45
+ hoverable: {
46
+ true: {
47
+ cursor: 'pointer',
48
+ hoverStyle: {
49
+ backgroundColor: '$cardHover',
50
+ },
51
+ pressStyle: {
52
+ opacity: 0.9,
53
+ },
54
+ },
55
+ },
56
+ },
57
+ defaultVariants: {
58
+ variant: 'default',
59
+ size: 'md',
60
+ },
61
+ })
62
+ export const CardHeader = styled(Stack, {
63
+ name: 'CardHeader',
64
+ gap: '$2',
65
+ })
66
+ export const CardTitle = styled(H3, {
67
+ name: 'CardTitle',
68
+ fontWeight: '600',
69
+ })
70
+ export const CardDescription = styled(Text, {
71
+ name: 'CardDescription',
72
+ color: '$mutedForeground',
73
+ fontSize: 14,
74
+ })
75
+ export const CardContent = styled(Stack, {
76
+ name: 'CardContent',
77
+ gap: '$3',
78
+ })
79
+ export const CardFooter = styled(Stack, {
80
+ name: 'CardFooter',
81
+ flexDirection: 'row',
82
+ alignItems: 'center',
83
+ justifyContent: 'flex-end',
84
+ gap: '$2',
85
+ paddingTop: '$3',
86
+ })
@@ -0,0 +1 @@
1
+ {"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../src/components/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAU,QAAQ,EAAE,MAAM,eAAe,CAAA;AAGhD,eAAO,MAAM,UAAU;;;;8CAiErB,CAAA;AAEF,MAAM,MAAM,eAAe,GAAG,QAAQ,CAAC,OAAO,UAAU,CAAC,CAAA"}
@@ -0,0 +1,64 @@
1
+ import { styled } from '@tamagui/core'
2
+ import { Stack } from 'tamagui'
3
+ export const IconButton = styled(Stack, {
4
+ name: 'IconButton',
5
+ tag: 'button',
6
+ alignItems: 'center',
7
+ justifyContent: 'center',
8
+ borderRadius: '$2',
9
+ cursor: 'pointer',
10
+ pressStyle: {
11
+ opacity: 0.8,
12
+ scale: 0.95,
13
+ },
14
+ hoverStyle: {
15
+ backgroundColor: '$backgroundHover',
16
+ },
17
+ focusStyle: {
18
+ outlineWidth: 2,
19
+ outlineColor: '$primary',
20
+ outlineStyle: 'solid',
21
+ },
22
+ disabledStyle: {
23
+ opacity: 0.5,
24
+ cursor: 'not-allowed',
25
+ },
26
+ variants: {
27
+ variant: {
28
+ default: {
29
+ backgroundColor: 'transparent',
30
+ },
31
+ filled: {
32
+ backgroundColor: '$secondary',
33
+ },
34
+ outline: {
35
+ backgroundColor: 'transparent',
36
+ borderWidth: 1,
37
+ borderColor: '$borderColor',
38
+ },
39
+ },
40
+ size: {
41
+ sm: {
42
+ width: 28,
43
+ height: 28,
44
+ },
45
+ md: {
46
+ width: 36,
47
+ height: 36,
48
+ },
49
+ lg: {
50
+ width: 44,
51
+ height: 44,
52
+ },
53
+ },
54
+ circular: {
55
+ true: {
56
+ borderRadius: '$round',
57
+ },
58
+ },
59
+ },
60
+ defaultVariants: {
61
+ variant: 'default',
62
+ size: 'md',
63
+ },
64
+ })
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../src/components/Input.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAGvC,QAAA,MAAM,UAAU;;;;;;;;;;;8CAwCd,CAAA;AAEF,MAAM,MAAM,UAAU,GAAG,IAAI,CAAC,QAAQ,CAAC,OAAO,UAAU,CAAC,EAAE,UAAU,CAAC,GAAG;IACvE,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IACrC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,IAAI,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,UAAU,CAAA;IACrC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC/B,CAAA;AAED,eAAO,MAAM,KAAK;;;;;;;;;;;;YARR,MAAM;mBACC,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI;kBACvB,MAAM;WACb,MAAM,GAAG,QAAQ,GAAG,UAAU;kBACvB,KAAK,CAAC,SAAS;mBACd,KAAK,CAAC,SAAS;oDA2B/B,CAAA"}
@@ -0,0 +1,71 @@
1
+ import { forwardRef } from 'react'
2
+ import { jsx as _jsx, jsxs as _jsxs } from 'react/jsx-runtime'
3
+ import { styled, XStack } from 'tamagui'
4
+
5
+ const InputFrame = styled(XStack, {
6
+ name: 'InputFrame',
7
+ alignItems: 'center',
8
+ backgroundColor: '$backgroundHover',
9
+ borderRadius: '$3',
10
+ borderWidth: 1,
11
+ borderColor: '$borderColor',
12
+ paddingHorizontal: '$3',
13
+ height: 48,
14
+ gap: '$2',
15
+ focusWithinStyle: {
16
+ borderColor: '$primary',
17
+ },
18
+ variants: {
19
+ size: {
20
+ sm: {
21
+ height: 36,
22
+ paddingHorizontal: '$2',
23
+ },
24
+ md: {
25
+ height: 48,
26
+ paddingHorizontal: '$3',
27
+ },
28
+ lg: {
29
+ height: 56,
30
+ paddingHorizontal: '$4',
31
+ },
32
+ },
33
+ error: {
34
+ true: {
35
+ borderColor: '$red10',
36
+ },
37
+ },
38
+ },
39
+ defaultVariants: {
40
+ size: 'md',
41
+ },
42
+ })
43
+ export const Input = forwardRef(
44
+ ({ value, onChangeText, placeholder, type = 'text', leftElement, rightElement, size, error, ...props }, ref) => {
45
+ return _jsxs(InputFrame, {
46
+ size: size,
47
+ error: error,
48
+ ...props,
49
+ children: [
50
+ leftElement,
51
+ _jsx('input', {
52
+ ref: ref,
53
+ value: value,
54
+ onChange: (e) => onChangeText?.(e.target.value),
55
+ placeholder: placeholder,
56
+ type: type,
57
+ style: {
58
+ flex: 1,
59
+ backgroundColor: 'transparent',
60
+ border: 'none',
61
+ outline: 'none',
62
+ fontSize: 16,
63
+ color: 'inherit',
64
+ },
65
+ }),
66
+ rightElement,
67
+ ],
68
+ })
69
+ }
70
+ )
71
+ Input.displayName = 'Input'
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../src/components/Modal.tsx"],"names":[],"mappings":"AAmDA,MAAM,WAAW,UAAU;IACzB,IAAI,EAAE,OAAO,CAAA;IACb,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACrC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B;AAED,wBAAgB,KAAK,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,UAAU,2CA+CxE"}
@@ -0,0 +1,98 @@
1
+ import { X } from '@tamagui/lucide-icons'
2
+ import { jsx as _jsx, jsxs as _jsxs } from 'react/jsx-runtime'
3
+ import { Dialog, Stack, styled, Text } from 'tamagui'
4
+ import { IconButton } from './IconButton'
5
+
6
+ const _Overlay = styled(Stack, {
7
+ name: 'ModalOverlay',
8
+ position: 'absolute',
9
+ top: 0,
10
+ left: 0,
11
+ right: 0,
12
+ bottom: 0,
13
+ backgroundColor: 'rgba(0, 0, 0, 0.5)',
14
+ justifyContent: 'center',
15
+ alignItems: 'center',
16
+ animation: 'quick',
17
+ opacity: 0,
18
+ enterStyle: { opacity: 0 },
19
+ exitStyle: { opacity: 0 },
20
+ })
21
+ const _ModalContent = styled(Stack, {
22
+ name: 'ModalContent',
23
+ backgroundColor: '$background',
24
+ borderRadius: '$4',
25
+ padding: '$4',
26
+ width: '100%',
27
+ maxWidth: 420,
28
+ maxHeight: '85vh',
29
+ animation: 'medium',
30
+ y: 20,
31
+ opacity: 0,
32
+ enterStyle: { y: 20, opacity: 0 },
33
+ exitStyle: { y: 20, opacity: 0 },
34
+ })
35
+ const ModalHeader = styled(Stack, {
36
+ name: 'ModalHeader',
37
+ flexDirection: 'row',
38
+ alignItems: 'center',
39
+ justifyContent: 'space-between',
40
+ marginBottom: '$3',
41
+ })
42
+ const ModalTitle = styled(Text, {
43
+ name: 'ModalTitle',
44
+ fontSize: 18,
45
+ fontWeight: '600',
46
+ color: '$color',
47
+ })
48
+ export function Modal({ open, onOpenChange, title, children }) {
49
+ return _jsx(Dialog, {
50
+ modal: true,
51
+ open: open,
52
+ onOpenChange: onOpenChange,
53
+ children: _jsxs(Dialog.Portal, {
54
+ children: [
55
+ _jsx(
56
+ Dialog.Overlay,
57
+ { animation: 'quick', opacity: 0.5, enterStyle: { opacity: 0 }, exitStyle: { opacity: 0 } },
58
+ 'overlay'
59
+ ),
60
+ _jsxs(
61
+ Dialog.Content,
62
+ {
63
+ bordered: true,
64
+ elevate: true,
65
+ animation: [
66
+ 'medium',
67
+ {
68
+ opacity: {
69
+ overshootClamping: true,
70
+ },
71
+ },
72
+ ],
73
+ enterStyle: { x: 0, y: -20, opacity: 0, scale: 0.9 },
74
+ exitStyle: { x: 0, y: 10, opacity: 0, scale: 0.95 },
75
+ width: '100%',
76
+ maxWidth: 420,
77
+ padding: '$4',
78
+ borderRadius: '$4',
79
+ children: [
80
+ title &&
81
+ _jsxs(ModalHeader, {
82
+ children: [
83
+ _jsx(Dialog.Title, { children: _jsx(ModalTitle, { children: title }) }),
84
+ _jsx(Dialog.Close, {
85
+ asChild: true,
86
+ children: _jsx(IconButton, { size: 'sm', variant: 'default', children: _jsx(X, { size: 16 }) }),
87
+ }),
88
+ ],
89
+ }),
90
+ children,
91
+ ],
92
+ },
93
+ 'content'
94
+ ),
95
+ ],
96
+ }),
97
+ })
98
+ }
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Skeleton.d.ts","sourceRoot":"","sources":["../../src/components/Skeleton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAEvC,eAAO,MAAM,QAAQ;;;;8CA6CnB,CAAA;AAEF,MAAM,MAAM,aAAa,GAAG,QAAQ,CAAC,OAAO,QAAQ,CAAC,CAAA"}
@@ -0,0 +1,44 @@
1
+ import { Stack, styled } from 'tamagui'
2
+ export const Skeleton = styled(Stack, {
3
+ name: 'Skeleton',
4
+ backgroundColor: '$backgroundHover',
5
+ borderRadius: '$2',
6
+ animation: 'lazy',
7
+ // Pulse animation via opacity
8
+ animateOnly: ['opacity'],
9
+ opacity: 1,
10
+ enterStyle: {
11
+ opacity: 0.5,
12
+ },
13
+ variants: {
14
+ variant: {
15
+ text: {
16
+ height: 16,
17
+ width: '100%',
18
+ },
19
+ circular: {
20
+ borderRadius: 1000,
21
+ },
22
+ rectangular: {
23
+ borderRadius: '$2',
24
+ },
25
+ },
26
+ width: {
27
+ sm: { width: 60 },
28
+ md: { width: 100 },
29
+ lg: { width: 160 },
30
+ full: { width: '100%' },
31
+ },
32
+ height: {
33
+ sm: { height: 16 },
34
+ md: { height: 24 },
35
+ lg: { height: 40 },
36
+ xl: { height: 60 },
37
+ },
38
+ },
39
+ defaultVariants: {
40
+ variant: 'rectangular',
41
+ width: 'full',
42
+ height: 'md',
43
+ },
44
+ })
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Spinner.d.ts","sourceRoot":"","sources":["../../src/components/Spinner.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAEvC,QAAA,MAAM,YAAY;;8CAqChB,CAAA;AAEF,MAAM,MAAM,YAAY,GAAG,QAAQ,CAAC,OAAO,YAAY,CAAC,CAAA;AAExD,wBAAgB,OAAO,CAAC,KAAK,EAAE,YAAY,2CAE1C"}
@@ -0,0 +1,42 @@
1
+ import { jsx as _jsx } from 'react/jsx-runtime'
2
+ import { Stack, styled } from 'tamagui'
3
+
4
+ const SpinnerFrame = styled(Stack, {
5
+ name: 'Spinner',
6
+ borderWidth: 2,
7
+ borderColor: '$borderColor',
8
+ borderTopColor: '$primary',
9
+ borderRadius: 1000,
10
+ animation: 'lazy',
11
+ rotate: '0deg',
12
+ variants: {
13
+ size: {
14
+ sm: {
15
+ width: 16,
16
+ height: 16,
17
+ borderWidth: 2,
18
+ },
19
+ md: {
20
+ width: 24,
21
+ height: 24,
22
+ borderWidth: 2,
23
+ },
24
+ lg: {
25
+ width: 32,
26
+ height: 32,
27
+ borderWidth: 3,
28
+ },
29
+ xl: {
30
+ width: 48,
31
+ height: 48,
32
+ borderWidth: 4,
33
+ },
34
+ },
35
+ },
36
+ defaultVariants: {
37
+ size: 'md',
38
+ },
39
+ })
40
+ export function Spinner(props) {
41
+ return _jsx(SpinnerFrame, { ...props })
42
+ }
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../src/components/Switch.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,OAAO,EAAE,MAAM,SAAS,CAAA;AAC3C,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAEvC,MAAM,MAAM,WAAW,GAAG,QAAQ,CAAC,OAAO,OAAO,CAAC,GAAG;IACnD,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;CAC1B,CAAA;AAED,wBAAgB,MAAM,CAAC,EAAE,IAAW,EAAE,GAAG,KAAK,EAAE,EAAE,WAAW,2CAY5D"}
@@ -0,0 +1,10 @@
1
+ import { jsx as _jsx } from 'react/jsx-runtime'
2
+ import { Switch as TSwitch } from 'tamagui'
3
+ export function Switch({ size = 'md', ...props }) {
4
+ const sizeMap = {
5
+ sm: '$2',
6
+ md: '$3',
7
+ lg: '$4',
8
+ }
9
+ return _jsx(TSwitch, { size: sizeMap[size], ...props, children: _jsx(TSwitch.Thumb, { animation: 'quick' }) })
10
+ }
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TokenLogo.d.ts","sourceRoot":"","sources":["../../src/components/TokenLogo.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAU,QAAQ,EAAE,MAAM,eAAe,CAAA;AAGhD,QAAA,MAAM,cAAc;;8CAqBlB,CAAA;AA4BF,MAAM,MAAM,cAAc,GAAG,QAAQ,CAAC,OAAO,cAAc,CAAC,GAAG;IAC7D,MAAM,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB,CAAA;AAED,wBAAgB,SAAS,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,2CAY5E;yBAZe,SAAS"}