@xaui/native 0.2.8 → 0.9.1-alpha.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 (224) hide show
  1. package/dist/chunk-JDS6KGCM.cjs +791 -0
  2. package/dist/chunk-T3ZI2PZ6.js +791 -0
  3. package/dist/index.cjs +32 -1
  4. package/dist/index.d.cts +2 -2
  5. package/dist/index.d.ts +2 -2
  6. package/dist/index.js +32 -0
  7. package/dist/theme/index.cjs +32 -0
  8. package/dist/theme/index.d.cts +669 -0
  9. package/dist/theme/index.d.ts +669 -0
  10. package/dist/theme/index.js +32 -0
  11. package/package.json +26 -249
  12. package/README.md +0 -178
  13. package/dist/alert/index.cjs +0 -340
  14. package/dist/alert/index.d.cts +0 -46
  15. package/dist/alert/index.d.ts +0 -46
  16. package/dist/alert/index.js +0 -340
  17. package/dist/app-bar/index.cjs +0 -148
  18. package/dist/app-bar/index.d.cts +0 -59
  19. package/dist/app-bar/index.d.ts +0 -59
  20. package/dist/app-bar/index.js +0 -148
  21. package/dist/autocomplete/index.cjs +0 -1122
  22. package/dist/autocomplete/index.d.cts +0 -88
  23. package/dist/autocomplete/index.d.ts +0 -88
  24. package/dist/autocomplete/index.js +0 -1122
  25. package/dist/avatar/index.cjs +0 -281
  26. package/dist/avatar/index.d.cts +0 -123
  27. package/dist/avatar/index.d.ts +0 -123
  28. package/dist/avatar/index.js +0 -281
  29. package/dist/badge/index.cjs +0 -197
  30. package/dist/badge/index.d.cts +0 -94
  31. package/dist/badge/index.d.ts +0 -94
  32. package/dist/badge/index.js +0 -197
  33. package/dist/bottom-sheet/index.cjs +0 -9
  34. package/dist/bottom-sheet/index.d.cts +0 -84
  35. package/dist/bottom-sheet/index.d.ts +0 -84
  36. package/dist/bottom-sheet/index.js +0 -9
  37. package/dist/bottom-tab-bar/index.cjs +0 -497
  38. package/dist/bottom-tab-bar/index.d.cts +0 -211
  39. package/dist/bottom-tab-bar/index.d.ts +0 -211
  40. package/dist/bottom-tab-bar/index.js +0 -497
  41. package/dist/button/index.cjs +0 -392
  42. package/dist/button/index.d.cts +0 -174
  43. package/dist/button/index.d.ts +0 -174
  44. package/dist/button/index.js +0 -392
  45. package/dist/button.type-j1ZdkkSl.d.cts +0 -4
  46. package/dist/button.type-j1ZdkkSl.d.ts +0 -4
  47. package/dist/card/index.cjs +0 -338
  48. package/dist/card/index.d.cts +0 -191
  49. package/dist/card/index.d.ts +0 -191
  50. package/dist/card/index.js +0 -338
  51. package/dist/carousel/index.cjs +0 -381
  52. package/dist/carousel/index.d.cts +0 -147
  53. package/dist/carousel/index.d.ts +0 -147
  54. package/dist/carousel/index.js +0 -381
  55. package/dist/chart/index.cjs +0 -1026
  56. package/dist/chart/index.d.cts +0 -218
  57. package/dist/chart/index.d.ts +0 -218
  58. package/dist/chart/index.js +0 -1026
  59. package/dist/checkbox/index.cjs +0 -443
  60. package/dist/checkbox/index.d.cts +0 -73
  61. package/dist/checkbox/index.d.ts +0 -73
  62. package/dist/checkbox/index.js +0 -443
  63. package/dist/chip/index.cjs +0 -503
  64. package/dist/chip/index.d.cts +0 -195
  65. package/dist/chip/index.d.ts +0 -195
  66. package/dist/chip/index.js +0 -503
  67. package/dist/chunk-4JFWQ5XT.js +0 -368
  68. package/dist/chunk-56RPWZD2.cjs +0 -9
  69. package/dist/chunk-7UFBLUMV.cjs +0 -136
  70. package/dist/chunk-A45TVXU5.js +0 -337
  71. package/dist/chunk-BYWUAPC4.cjs +0 -368
  72. package/dist/chunk-DECMUMCI.js +0 -0
  73. package/dist/chunk-DHSTKO3K.cjs +0 -19
  74. package/dist/chunk-DJ4Q37UT.cjs +0 -75
  75. package/dist/chunk-EUQDGTST.cjs +0 -1
  76. package/dist/chunk-GBHQCAKW.js +0 -19
  77. package/dist/chunk-RBSA4NH4.js +0 -136
  78. package/dist/chunk-SHBDANQN.js +0 -9
  79. package/dist/chunk-UGEINZM7.cjs +0 -290
  80. package/dist/chunk-UU4HHBDN.js +0 -290
  81. package/dist/chunk-VSZEXOUN.js +0 -384
  82. package/dist/chunk-YIEUN3G5.cjs +0 -384
  83. package/dist/chunk-ZH6ZSV2Q.cjs +0 -337
  84. package/dist/chunk-ZY7IUTAT.js +0 -75
  85. package/dist/color-picker/index.cjs +0 -457
  86. package/dist/color-picker/index.d.cts +0 -124
  87. package/dist/color-picker/index.d.ts +0 -124
  88. package/dist/color-picker/index.js +0 -457
  89. package/dist/core/index.cjs +0 -24
  90. package/dist/core/index.d.cts +0 -28
  91. package/dist/core/index.d.ts +0 -28
  92. package/dist/core/index.js +0 -24
  93. package/dist/datepicker/index.cjs +0 -1625
  94. package/dist/datepicker/index.d.cts +0 -45
  95. package/dist/datepicker/index.d.ts +0 -45
  96. package/dist/datepicker/index.js +0 -1625
  97. package/dist/dialog/index.cjs +0 -372
  98. package/dist/dialog/index.d.cts +0 -151
  99. package/dist/dialog/index.d.ts +0 -151
  100. package/dist/dialog/index.js +0 -372
  101. package/dist/divider/index.cjs +0 -8
  102. package/dist/divider/index.d.cts +0 -30
  103. package/dist/divider/index.d.ts +0 -30
  104. package/dist/divider/index.js +0 -8
  105. package/dist/drawer/index.cjs +0 -237
  106. package/dist/drawer/index.d.cts +0 -58
  107. package/dist/drawer/index.d.ts +0 -58
  108. package/dist/drawer/index.js +0 -237
  109. package/dist/expansion-panel/index.cjs +0 -441
  110. package/dist/expansion-panel/index.d.cts +0 -153
  111. package/dist/expansion-panel/index.d.ts +0 -153
  112. package/dist/expansion-panel/index.js +0 -441
  113. package/dist/fab/index.cjs +0 -9
  114. package/dist/fab/index.d.cts +0 -10
  115. package/dist/fab/index.d.ts +0 -10
  116. package/dist/fab/index.js +0 -9
  117. package/dist/fab-menu/index.cjs +0 -330
  118. package/dist/fab-menu/index.d.cts +0 -125
  119. package/dist/fab-menu/index.d.ts +0 -125
  120. package/dist/fab-menu/index.js +0 -330
  121. package/dist/fab.type-CkUHmXU_.d.ts +0 -86
  122. package/dist/fab.type-DN0vtAh6.d.cts +0 -86
  123. package/dist/feature-discovery/index.cjs +0 -464
  124. package/dist/feature-discovery/index.d.cts +0 -82
  125. package/dist/feature-discovery/index.d.ts +0 -82
  126. package/dist/feature-discovery/index.js +0 -464
  127. package/dist/indicator/index.cjs +0 -8
  128. package/dist/indicator/index.d.cts +0 -47
  129. package/dist/indicator/index.d.ts +0 -47
  130. package/dist/indicator/index.js +0 -8
  131. package/dist/input/index.cjs +0 -1462
  132. package/dist/input/index.d.cts +0 -522
  133. package/dist/input/index.d.ts +0 -522
  134. package/dist/input/index.js +0 -1462
  135. package/dist/input-trigger/index.cjs +0 -197
  136. package/dist/input-trigger/index.d.cts +0 -11
  137. package/dist/input-trigger/index.d.ts +0 -11
  138. package/dist/input-trigger/index.js +0 -197
  139. package/dist/input-trigger.type-Ba4bM3Qp.d.cts +0 -180
  140. package/dist/input-trigger.type-Ba4bM3Qp.d.ts +0 -180
  141. package/dist/list/index.cjs +0 -395
  142. package/dist/list/index.d.cts +0 -188
  143. package/dist/list/index.d.ts +0 -188
  144. package/dist/list/index.js +0 -395
  145. package/dist/menu/index.cjs +0 -316
  146. package/dist/menu/index.d.cts +0 -115
  147. package/dist/menu/index.d.ts +0 -115
  148. package/dist/menu/index.js +0 -316
  149. package/dist/menubox/index.cjs +0 -297
  150. package/dist/menubox/index.d.cts +0 -98
  151. package/dist/menubox/index.d.ts +0 -98
  152. package/dist/menubox/index.js +0 -297
  153. package/dist/pager/index.cjs +0 -205
  154. package/dist/pager/index.d.cts +0 -93
  155. package/dist/pager/index.d.ts +0 -93
  156. package/dist/pager/index.js +0 -205
  157. package/dist/picker/index.cjs +0 -244
  158. package/dist/picker/index.d.cts +0 -121
  159. package/dist/picker/index.d.ts +0 -121
  160. package/dist/picker/index.js +0 -244
  161. package/dist/progress/index.cjs +0 -219
  162. package/dist/progress/index.d.cts +0 -47
  163. package/dist/progress/index.d.ts +0 -47
  164. package/dist/progress/index.js +0 -219
  165. package/dist/radio/index.cjs +0 -465
  166. package/dist/radio/index.d.cts +0 -145
  167. package/dist/radio/index.d.ts +0 -145
  168. package/dist/radio/index.js +0 -465
  169. package/dist/refresh-control/index.cjs +0 -45
  170. package/dist/refresh-control/index.d.cts +0 -55
  171. package/dist/refresh-control/index.d.ts +0 -55
  172. package/dist/refresh-control/index.js +0 -45
  173. package/dist/segment-button/index.cjs +0 -405
  174. package/dist/segment-button/index.d.cts +0 -141
  175. package/dist/segment-button/index.d.ts +0 -141
  176. package/dist/segment-button/index.js +0 -405
  177. package/dist/select/index.cjs +0 -878
  178. package/dist/select/index.d.cts +0 -192
  179. package/dist/select/index.d.ts +0 -192
  180. package/dist/select/index.js +0 -878
  181. package/dist/skeleton/index.cjs +0 -89
  182. package/dist/skeleton/index.d.cts +0 -45
  183. package/dist/skeleton/index.d.ts +0 -45
  184. package/dist/skeleton/index.js +0 -89
  185. package/dist/slider/index.cjs +0 -576
  186. package/dist/slider/index.d.cts +0 -171
  187. package/dist/slider/index.d.ts +0 -171
  188. package/dist/slider/index.js +0 -576
  189. package/dist/snackbar/index.cjs +0 -436
  190. package/dist/snackbar/index.d.cts +0 -174
  191. package/dist/snackbar/index.d.ts +0 -174
  192. package/dist/snackbar/index.js +0 -436
  193. package/dist/snippet/index.cjs +0 -314
  194. package/dist/snippet/index.d.cts +0 -95
  195. package/dist/snippet/index.d.ts +0 -95
  196. package/dist/snippet/index.js +0 -314
  197. package/dist/stepper/index.cjs +0 -550
  198. package/dist/stepper/index.d.cts +0 -137
  199. package/dist/stepper/index.d.ts +0 -137
  200. package/dist/stepper/index.js +0 -550
  201. package/dist/switch/index.cjs +0 -358
  202. package/dist/switch/index.d.cts +0 -28
  203. package/dist/switch/index.d.ts +0 -28
  204. package/dist/switch/index.js +0 -358
  205. package/dist/tabs/index.cjs +0 -440
  206. package/dist/tabs/index.d.cts +0 -180
  207. package/dist/tabs/index.d.ts +0 -180
  208. package/dist/tabs/index.js +0 -440
  209. package/dist/timepicker/index.cjs +0 -823
  210. package/dist/timepicker/index.d.cts +0 -215
  211. package/dist/timepicker/index.d.ts +0 -215
  212. package/dist/timepicker/index.js +0 -823
  213. package/dist/toolbar/index.cjs +0 -333
  214. package/dist/toolbar/index.d.cts +0 -100
  215. package/dist/toolbar/index.d.ts +0 -100
  216. package/dist/toolbar/index.js +0 -333
  217. package/dist/typography/index.cjs +0 -238
  218. package/dist/typography/index.d.cts +0 -113
  219. package/dist/typography/index.d.ts +0 -113
  220. package/dist/typography/index.js +0 -238
  221. package/dist/view/index.cjs +0 -1361
  222. package/dist/view/index.d.cts +0 -833
  223. package/dist/view/index.d.ts +0 -833
  224. package/dist/view/index.js +0 -1361
@@ -1,823 +0,0 @@
1
- "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }require('../chunk-EUQDGTST.cjs');
2
-
3
-
4
- var _chunkBYWUAPC4cjs = require('../chunk-BYWUAPC4.cjs');
5
- require('../chunk-56RPWZD2.cjs');
6
-
7
-
8
- var _chunk7UFBLUMVcjs = require('../chunk-7UFBLUMV.cjs');
9
-
10
- // src/components/timepicker/timepicker.tsx
11
- var _react = require('react'); var _react2 = _interopRequireDefault(_react);
12
- var _reactnative = require('react-native');
13
-
14
-
15
-
16
-
17
-
18
- var _reactnativereanimated = require('react-native-reanimated'); var _reactnativereanimated2 = _interopRequireDefault(_reactnativereanimated);
19
-
20
- // src/components/timepicker/timepicker.hook.ts
21
-
22
- var _core = require('@xaui/core');
23
-
24
- // src/components/timepicker/timepicker.utils.ts
25
- var to12HourFormat = (hours) => {
26
- if (hours === 0) {
27
- return { hours: 12, period: "AM" };
28
- }
29
- if (hours < 12) {
30
- return { hours, period: "AM" };
31
- }
32
- if (hours === 12) {
33
- return { hours: 12, period: "PM" };
34
- }
35
- return { hours: hours - 12, period: "PM" };
36
- };
37
- var to24HourFormat = (hours, period) => {
38
- if (period === "AM") {
39
- return hours === 12 ? 0 : hours;
40
- }
41
- return hours === 12 ? 12 : hours + 12;
42
- };
43
- var formatTimeValue = (time, is24Hour) => {
44
- const { hours, minutes } = time;
45
- if (is24Hour) {
46
- return `${hours.toString().padStart(2, "0")}:${minutes.toString().padStart(2, "0")}`;
47
- }
48
- const { hours: displayHours, period } = to12HourFormat(hours);
49
- return `${displayHours.toString().padStart(2, "0")}:${minutes.toString().padStart(2, "0")} ${period}`;
50
- };
51
- var getHourAngle = (hour, is24Hour) => {
52
- const displayHour = is24Hour ? hour % 12 : hour;
53
- return displayHour * 30 % 360;
54
- };
55
- var getMinuteAngle = (minute) => {
56
- return minute * 6 % 360;
57
- };
58
- var angleToHour = (angle, _is24Hour) => {
59
- const normalizedAngle = (angle % 360 + 360) % 360;
60
- const hour = Math.round(normalizedAngle / 30) % 12;
61
- return hour === 0 ? 12 : hour;
62
- };
63
- var angleToMinute = (angle) => {
64
- const normalizedAngle = (angle % 360 + 360) % 360;
65
- return Math.round(normalizedAngle / 6) % 60;
66
- };
67
- var calculateAngleFromPosition = (centerX, centerY, touchX, touchY) => {
68
- const deltaX = touchX - centerX;
69
- const deltaY = touchY - centerY;
70
- const radians = Math.atan2(deltaY, deltaX);
71
- const degrees = radians * 180 / Math.PI;
72
- return (degrees + 90 + 360) % 360;
73
- };
74
- var isTimeInRange = (time, minTime, maxTime) => {
75
- if (!minTime && !maxTime) return true;
76
- const timeInMinutes = time.hours * 60 + time.minutes;
77
- if (minTime) {
78
- const minInMinutes = minTime.hours * 60 + minTime.minutes;
79
- if (timeInMinutes < minInMinutes) return false;
80
- }
81
- if (maxTime) {
82
- const maxInMinutes = maxTime.hours * 60 + maxTime.minutes;
83
- if (timeInMinutes > maxInMinutes) return false;
84
- }
85
- return true;
86
- };
87
- var getCurrentTime = () => {
88
- const now = /* @__PURE__ */ new Date();
89
- return {
90
- hours: now.getHours(),
91
- minutes: now.getMinutes()
92
- };
93
- };
94
- var clampHour = (hour, is24Hour) => {
95
- if (is24Hour) {
96
- return Math.max(0, Math.min(23, hour));
97
- }
98
- return Math.max(1, Math.min(12, hour));
99
- };
100
- var clampMinute = (minute) => {
101
- return Math.max(0, Math.min(59, minute));
102
- };
103
-
104
- // src/components/timepicker/timepicker.hook.ts
105
- var useTimePickerState = (initialValue, is24Hour = false, onChange) => {
106
- const [time, setTime] = _react.useState.call(void 0, initialValue || getCurrentTime());
107
- const [mode, setMode] = _react.useState.call(void 0, "hour");
108
- const { hours: displayHours, period } = _react.useMemo.call(void 0,
109
- () => is24Hour ? { hours: time.hours, period: "AM" } : to12HourFormat(time.hours),
110
- [time.hours, is24Hour]
111
- );
112
- const handleHourChange = (hour) => {
113
- const newTime = {
114
- ...time,
115
- hours: hour
116
- };
117
- setTime(newTime);
118
- _optionalChain([onChange, 'optionalCall', _2 => _2(newTime)]);
119
- setMode("minute");
120
- };
121
- const handleMinuteChange = (minute) => {
122
- const newTime = {
123
- ...time,
124
- minutes: minute
125
- };
126
- setTime(newTime);
127
- _optionalChain([onChange, 'optionalCall', _3 => _3(newTime)]);
128
- };
129
- const handlePeriodToggle = (newPeriod) => {
130
- if (is24Hour) return;
131
- const newHours = to24HourFormat(displayHours, newPeriod);
132
- const newTime = {
133
- ...time,
134
- hours: newHours
135
- };
136
- setTime(newTime);
137
- _optionalChain([onChange, 'optionalCall', _4 => _4(newTime)]);
138
- };
139
- const handleManualInput = (hours, minutes) => {
140
- const newTime = { hours, minutes };
141
- setTime(newTime);
142
- _optionalChain([onChange, 'optionalCall', _5 => _5(newTime)]);
143
- };
144
- const toggleMode = () => {
145
- setMode((prev) => prev === "hour" ? "minute" : "hour");
146
- };
147
- return {
148
- time,
149
- displayHours,
150
- period,
151
- mode,
152
- handleHourChange,
153
- handleMinuteChange,
154
- handlePeriodToggle,
155
- handleManualInput,
156
- toggleMode,
157
- setMode
158
- };
159
- };
160
- var useTimePickerColors = (themeColor) => {
161
- const theme = _chunk7UFBLUMVcjs.useXUITheme.call(void 0, );
162
- const colorScheme = theme.colors[_core.getSafeThemeColor.call(void 0, themeColor)];
163
- return _react.useMemo.call(void 0, () => {
164
- return {
165
- background: theme.colors.background,
166
- surface: _core.withOpacity.call(void 0, colorScheme.main, 0.12),
167
- primary: colorScheme.main,
168
- onPrimary: colorScheme.onMain,
169
- text: theme.colors.foreground,
170
- textSecondary: _core.withOpacity.call(void 0, theme.colors.foreground, 0.6),
171
- border: _core.withOpacity.call(void 0, theme.colors.foreground, 0.12),
172
- clockFace: _core.withOpacity.call(void 0, colorScheme.main, 0.08),
173
- selectedDigit: _core.withOpacity.call(void 0, colorScheme.main, 0.12)
174
- };
175
- }, [
176
- colorScheme.main,
177
- colorScheme.onMain,
178
- theme.colors.background,
179
- theme.colors.foreground
180
- ]);
181
- };
182
-
183
- // src/components/timepicker/timepicker.style.ts
184
-
185
- var styles = _reactnative.StyleSheet.create({
186
- container: {
187
- padding: 24,
188
- alignItems: "center"
189
- },
190
- header: {
191
- alignSelf: "stretch",
192
- marginBottom: 24
193
- },
194
- headerTitle: {
195
- fontSize: 14,
196
- fontWeight: "400",
197
- marginBottom: 16
198
- },
199
- timeDisplay: {
200
- flexDirection: "row",
201
- alignItems: "center",
202
- justifyContent: "center",
203
- gap: 8
204
- },
205
- timeDisplayWithPeriod: {
206
- justifyContent: "space-between"
207
- },
208
- timeSection: {
209
- flexDirection: "row",
210
- alignItems: "center",
211
- gap: 4
212
- },
213
- timeDigit: {
214
- fontSize: 57,
215
- fontWeight: "400",
216
- lineHeight: 64,
217
- paddingHorizontal: 12,
218
- paddingVertical: 8,
219
- borderRadius: 8,
220
- minWidth: 96,
221
- textAlign: "center"
222
- },
223
- timeSeparator: {
224
- fontSize: 57,
225
- fontWeight: "400",
226
- lineHeight: 64
227
- },
228
- periodSelector: {
229
- gap: 4
230
- },
231
- periodButton: {
232
- paddingVertical: 8,
233
- paddingHorizontal: 12,
234
- borderRadius: 8,
235
- borderWidth: 1,
236
- minWidth: 52,
237
- alignItems: "center"
238
- },
239
- periodText: {
240
- fontSize: 16,
241
- fontWeight: "500"
242
- },
243
- clockContainer: {
244
- width: 256,
245
- height: 256,
246
- justifyContent: "center",
247
- alignItems: "center",
248
- marginBottom: 24
249
- },
250
- clockFace: {
251
- width: 256,
252
- height: 256,
253
- borderRadius: 128,
254
- justifyContent: "center",
255
- alignItems: "center",
256
- position: "relative"
257
- },
258
- clockCenter: {
259
- width: 6,
260
- height: 6,
261
- borderRadius: 3,
262
- position: "absolute"
263
- },
264
- clockHand: {
265
- position: "absolute",
266
- width: 2,
267
- backgroundColor: "transparent",
268
- transformOrigin: "top center"
269
- },
270
- clockHandLine: {
271
- width: 2,
272
- backgroundColor: "transparent"
273
- },
274
- clockHandDot: {
275
- width: 16,
276
- height: 16,
277
- borderRadius: 8,
278
- position: "absolute",
279
- top: -8,
280
- left: -7,
281
- justifyContent: "center",
282
- alignItems: "center"
283
- },
284
- clockNumber: {
285
- position: "absolute",
286
- width: 48,
287
- height: 48,
288
- borderRadius: 24,
289
- justifyContent: "center",
290
- alignItems: "center"
291
- },
292
- clockNumberText: {
293
- fontSize: 16,
294
- fontWeight: "400"
295
- },
296
- actions: {
297
- flexDirection: "row",
298
- justifyContent: "flex-end",
299
- gap: 8,
300
- alignSelf: "stretch"
301
- },
302
- actionButton: {
303
- paddingVertical: 10,
304
- paddingHorizontal: 24,
305
- borderRadius: 20
306
- },
307
- actionButtonText: {
308
- fontSize: 14,
309
- fontWeight: "500"
310
- },
311
- keyboardButton: {
312
- width: 48,
313
- height: 48,
314
- borderRadius: 24,
315
- justifyContent: "center",
316
- alignItems: "center"
317
- },
318
- inputContainer: {
319
- width: 256,
320
- height: 256,
321
- justifyContent: "center",
322
- alignItems: "center",
323
- gap: 16
324
- },
325
- inputRow: {
326
- flexDirection: "row",
327
- alignItems: "center",
328
- gap: 8
329
- },
330
- input: {
331
- width: 96,
332
- height: 80,
333
- borderRadius: 8,
334
- borderWidth: 1,
335
- fontSize: 57,
336
- fontWeight: "400",
337
- textAlign: "center",
338
- padding: 8
339
- },
340
- inputSeparator: {
341
- fontSize: 36,
342
- fontWeight: "400"
343
- },
344
- trigger: {
345
- minHeight: 52,
346
- borderWidth: 1,
347
- borderRadius: 12,
348
- paddingHorizontal: 16,
349
- paddingVertical: 12,
350
- flexDirection: "row",
351
- alignItems: "center",
352
- justifyContent: "space-between",
353
- gap: 12
354
- },
355
- triggerContent: {
356
- flex: 1,
357
- minWidth: 0
358
- },
359
- triggerText: {
360
- fontSize: 16,
361
- fontWeight: "500"
362
- },
363
- clearButton: {
364
- alignItems: "center",
365
- justifyContent: "center"
366
- },
367
- disabled: {
368
- opacity: 0.5
369
- }
370
- });
371
-
372
- // src/components/timepicker/timepicker.tsx
373
- var TimePicker = ({
374
- value,
375
- onChange,
376
- is24Hour = false,
377
- themeColor = "primary",
378
- style
379
- }) => {
380
- const {
381
- time,
382
- displayHours,
383
- period,
384
- mode,
385
- handleHourChange,
386
- handleMinuteChange,
387
- handlePeriodToggle,
388
- handleManualInput,
389
- setMode
390
- } = useTimePickerState(value, is24Hour, onChange);
391
- const colors = useTimePickerColors(themeColor);
392
- const hourAngle = _react.useMemo.call(void 0,
393
- () => getHourAngle(displayHours, is24Hour),
394
- [displayHours, is24Hour]
395
- );
396
- const minuteAngle = _react.useMemo.call(void 0, () => getMinuteAngle(time.minutes), [time.minutes]);
397
- const currentAngle = mode === "hour" ? hourAngle : minuteAngle;
398
- const handRotation = _reactnativereanimated.useSharedValue.call(void 0, currentAngle);
399
- const [hourInput, setHourInput] = _react.useState.call(void 0,
400
- displayHours.toString().padStart(2, "0")
401
- );
402
- const [minuteInput, setMinuteInput] = _react.useState.call(void 0,
403
- time.minutes.toString().padStart(2, "0")
404
- );
405
- _react.useEffect.call(void 0, () => {
406
- handRotation.value = _reactnativereanimated.withTiming.call(void 0, currentAngle - 180, {
407
- duration: 120,
408
- easing: _reactnativereanimated.Easing.out(_reactnativereanimated.Easing.cubic)
409
- });
410
- }, [currentAngle, handRotation]);
411
- _react.useEffect.call(void 0, () => {
412
- setHourInput(displayHours.toString().padStart(2, "0"));
413
- }, [displayHours]);
414
- _react.useEffect.call(void 0, () => {
415
- setMinuteInput(time.minutes.toString().padStart(2, "0"));
416
- }, [time.minutes]);
417
- const handStyle = _reactnativereanimated.useAnimatedStyle.call(void 0, () => ({
418
- transform: [{ rotate: `${handRotation.value}deg` }]
419
- }));
420
- const commitHourInput = () => {
421
- if (hourInput.trim() === "") {
422
- setHourInput(displayHours.toString().padStart(2, "0"));
423
- return;
424
- }
425
- const hours = parseInt(hourInput, 10);
426
- if (isNaN(hours)) {
427
- setHourInput(displayHours.toString().padStart(2, "0"));
428
- return;
429
- }
430
- const clampedHours = clampHour(hours, is24Hour);
431
- const finalHours = is24Hour ? clampedHours : period === "PM" && clampedHours !== 12 ? clampedHours + 12 : clampedHours === 12 && period === "AM" ? 0 : clampedHours;
432
- handleManualInput(finalHours, time.minutes);
433
- };
434
- const commitMinuteInput = () => {
435
- if (minuteInput.trim() === "") {
436
- setMinuteInput(time.minutes.toString().padStart(2, "0"));
437
- return;
438
- }
439
- const minutes = parseInt(minuteInput, 10);
440
- if (isNaN(minutes)) {
441
- setMinuteInput(time.minutes.toString().padStart(2, "0"));
442
- return;
443
- }
444
- handleManualInput(time.hours, clampMinute(minutes));
445
- };
446
- const renderClockNumbers = () => {
447
- if (mode === "hour" && is24Hour) {
448
- const outerRadius = 104;
449
- const innerRadius = 70;
450
- return Array.from({ length: 12 }, (_, slot) => {
451
- const angle = slot * 30;
452
- const radian = (angle - 90) * Math.PI / 180;
453
- const outerValue = slot === 0 ? 12 : slot;
454
- const innerValue = slot === 0 ? 0 : slot + 12;
455
- const outerX = outerRadius * Math.cos(radian);
456
- const outerY = outerRadius * Math.sin(radian);
457
- const innerX = innerRadius * Math.cos(radian);
458
- const innerY = innerRadius * Math.sin(radian);
459
- const outerSelected = outerValue === displayHours;
460
- const innerSelected = innerValue === displayHours;
461
- return /* @__PURE__ */ _react2.default.createElement(_react2.default.Fragment, { key: `hour-24-slot-${slot}` }, /* @__PURE__ */ _react2.default.createElement(
462
- _reactnative.Pressable,
463
- {
464
- onPress: () => handleHourChange(outerValue),
465
- style: [
466
- styles.clockNumber,
467
- {
468
- transform: [{ translateX: outerX }, { translateY: outerY }],
469
- backgroundColor: outerSelected ? colors.primary : "transparent"
470
- }
471
- ]
472
- },
473
- /* @__PURE__ */ _react2.default.createElement(
474
- _reactnative.Text,
475
- {
476
- style: [
477
- styles.clockNumberText,
478
- { color: outerSelected ? colors.onPrimary : colors.text }
479
- ]
480
- },
481
- outerValue
482
- )
483
- ), /* @__PURE__ */ _react2.default.createElement(
484
- _reactnative.Pressable,
485
- {
486
- onPress: () => handleHourChange(innerValue),
487
- style: [
488
- styles.clockNumber,
489
- {
490
- transform: [{ translateX: innerX }, { translateY: innerY }],
491
- backgroundColor: innerSelected ? colors.primary : "transparent"
492
- }
493
- ]
494
- },
495
- /* @__PURE__ */ _react2.default.createElement(
496
- _reactnative.Text,
497
- {
498
- style: [
499
- styles.clockNumberText,
500
- { color: innerSelected ? colors.onPrimary : colors.text }
501
- ]
502
- },
503
- innerValue === 0 ? 24 : innerValue
504
- )
505
- ));
506
- });
507
- }
508
- const numbers = mode === "hour" ? 12 : 60;
509
- const step = mode === "hour" ? 1 : 5;
510
- const radius = 100;
511
- return Array.from({ length: numbers / step }, (_, i) => {
512
- const value2 = mode === "hour" ? i === 0 ? 12 : i * step : i * step;
513
- const angle = value2 / (mode === "hour" ? 12 : 60) * 360;
514
- const radian = (angle - 90) * Math.PI / 180;
515
- const x = radius * Math.cos(radian);
516
- const y = radius * Math.sin(radian);
517
- const isSelected = mode === "hour" ? value2 === displayHours : value2 === time.minutes;
518
- return /* @__PURE__ */ _react2.default.createElement(
519
- _reactnative.Pressable,
520
- {
521
- key: `${mode}-${value2}`,
522
- onPress: () => {
523
- if (mode === "hour") {
524
- handleHourChange(value2 === 12 && period === "PM" ? 12 : value2);
525
- } else {
526
- handleMinuteChange(value2);
527
- }
528
- },
529
- style: [
530
- styles.clockNumber,
531
- {
532
- transform: [{ translateX: x }, { translateY: y }],
533
- backgroundColor: isSelected ? colors.primary : "transparent"
534
- }
535
- ]
536
- },
537
- /* @__PURE__ */ _react2.default.createElement(
538
- _reactnative.Text,
539
- {
540
- style: [
541
- styles.clockNumberText,
542
- { color: isSelected ? colors.onPrimary : colors.text }
543
- ]
544
- },
545
- mode === "minute" && value2 < 10 ? `0${value2}` : value2
546
- )
547
- );
548
- });
549
- };
550
- return /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: [styles.container, style] }, /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: styles.header }, /* @__PURE__ */ _react2.default.createElement(_reactnative.Text, { style: [styles.headerTitle, { color: colors.textSecondary }] }, "Select time"), /* @__PURE__ */ _react2.default.createElement(
551
- _reactnative.View,
552
- {
553
- style: [styles.timeDisplay, !is24Hour && styles.timeDisplayWithPeriod]
554
- },
555
- /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: styles.timeSection }, /* @__PURE__ */ _react2.default.createElement(
556
- _reactnative.TextInput,
557
- {
558
- style: [
559
- styles.timeDigit,
560
- {
561
- color: mode === "hour" ? colors.primary : colors.text,
562
- backgroundColor: mode === "hour" ? colors.selectedDigit : "transparent"
563
- }
564
- ],
565
- value: hourInput,
566
- onChangeText: (text) => {
567
- const numeric = text.replace(/[^0-9]/g, "");
568
- if (numeric.length > 2) return;
569
- setHourInput(numeric);
570
- if (numeric === "") return;
571
- const hours = parseInt(numeric, 10);
572
- if (isNaN(hours)) return;
573
- const clampedHours = clampHour(hours, is24Hour);
574
- const finalHours = is24Hour ? clampedHours : period === "PM" && clampedHours !== 12 ? clampedHours + 12 : clampedHours === 12 && period === "AM" ? 0 : clampedHours;
575
- handleManualInput(finalHours, time.minutes);
576
- },
577
- onFocus: () => setMode("hour"),
578
- onBlur: commitHourInput,
579
- onSubmitEditing: commitHourInput,
580
- keyboardType: "number-pad",
581
- maxLength: 2,
582
- selectTextOnFocus: true
583
- }
584
- ), /* @__PURE__ */ _react2.default.createElement(_reactnative.Text, { style: [styles.timeSeparator, { color: colors.text }] }, ":"), /* @__PURE__ */ _react2.default.createElement(
585
- _reactnative.TextInput,
586
- {
587
- style: [
588
- styles.timeDigit,
589
- {
590
- color: mode === "minute" ? colors.primary : colors.text,
591
- backgroundColor: mode === "minute" ? colors.selectedDigit : "transparent"
592
- }
593
- ],
594
- value: minuteInput,
595
- onChangeText: (text) => {
596
- const numeric = text.replace(/[^0-9]/g, "");
597
- if (numeric.length > 2) return;
598
- setMinuteInput(numeric);
599
- if (numeric === "") return;
600
- const minutes = parseInt(numeric, 10);
601
- if (isNaN(minutes)) return;
602
- handleManualInput(time.hours, clampMinute(minutes));
603
- },
604
- onFocus: () => setMode("minute"),
605
- onBlur: commitMinuteInput,
606
- onSubmitEditing: commitMinuteInput,
607
- keyboardType: "number-pad",
608
- maxLength: 2,
609
- selectTextOnFocus: true
610
- }
611
- )),
612
- !is24Hour && /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: styles.periodSelector }, /* @__PURE__ */ _react2.default.createElement(
613
- _reactnative.Pressable,
614
- {
615
- onPress: () => handlePeriodToggle("AM"),
616
- style: [
617
- styles.periodButton,
618
- {
619
- backgroundColor: period === "AM" ? colors.surface : "transparent",
620
- borderColor: period === "AM" ? colors.primary : colors.border
621
- }
622
- ]
623
- },
624
- /* @__PURE__ */ _react2.default.createElement(
625
- _reactnative.Text,
626
- {
627
- style: [
628
- styles.periodText,
629
- { color: period === "AM" ? colors.primary : colors.text }
630
- ]
631
- },
632
- "AM"
633
- )
634
- ), /* @__PURE__ */ _react2.default.createElement(
635
- _reactnative.Pressable,
636
- {
637
- onPress: () => handlePeriodToggle("PM"),
638
- style: [
639
- styles.periodButton,
640
- {
641
- backgroundColor: period === "PM" ? colors.surface : "transparent",
642
- borderColor: period === "PM" ? colors.primary : colors.border
643
- }
644
- ]
645
- },
646
- /* @__PURE__ */ _react2.default.createElement(
647
- _reactnative.Text,
648
- {
649
- style: [
650
- styles.periodText,
651
- { color: period === "PM" ? colors.primary : colors.text }
652
- ]
653
- },
654
- "PM"
655
- )
656
- ))
657
- )), /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: styles.clockContainer }, /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: [styles.clockFace, { backgroundColor: colors.clockFace }] }, renderClockNumbers(), /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: [styles.clockCenter, { backgroundColor: colors.primary }] }), /* @__PURE__ */ _react2.default.createElement(
658
- _reactnativereanimated2.default.View,
659
- {
660
- style: [
661
- styles.clockHand,
662
- {
663
- height: 84,
664
- top: "50%",
665
- left: "50%",
666
- marginLeft: -1
667
- },
668
- handStyle
669
- ]
670
- },
671
- /* @__PURE__ */ _react2.default.createElement(
672
- _reactnative.View,
673
- {
674
- style: [
675
- styles.clockHandLine,
676
- { height: "100%", backgroundColor: colors.primary }
677
- ]
678
- }
679
- ),
680
- /* @__PURE__ */ _react2.default.createElement(
681
- _reactnative.View,
682
- {
683
- style: [styles.clockHandDot, { backgroundColor: colors.primary }]
684
- }
685
- )
686
- ))));
687
- };
688
-
689
- // src/components/timepicker/timepicker-dialog.tsx
690
-
691
-
692
- var TimePickerDialog = ({
693
- isOpen,
694
- onClose,
695
- value,
696
- onChange,
697
- is24Hour = false,
698
- themeColor = "primary",
699
- confirmText = "OK",
700
- cancelText = "Cancel",
701
- onConfirm,
702
- onCancel
703
- }) => {
704
- const [tempValue, setTempValue] = _react.useState.call(void 0, value);
705
- const colors = useTimePickerColors(themeColor);
706
- const handleChange = (time) => {
707
- setTempValue(time);
708
- _optionalChain([onChange, 'optionalCall', _6 => _6(time)]);
709
- };
710
- const handleConfirm = () => {
711
- if (tempValue) {
712
- _optionalChain([onConfirm, 'optionalCall', _7 => _7(tempValue)]);
713
- }
714
- onClose();
715
- };
716
- const handleCancel = () => {
717
- _optionalChain([onCancel, 'optionalCall', _8 => _8()]);
718
- onClose();
719
- };
720
- return /* @__PURE__ */ _react2.default.createElement(_chunkBYWUAPC4cjs.BottomSheet, { isOpen, onClose, snapPoints: [0.7] }, /* @__PURE__ */ _react2.default.createElement(_reactnative.View, null, /* @__PURE__ */ _react2.default.createElement(
721
- TimePicker,
722
- {
723
- value: tempValue,
724
- onChange: handleChange,
725
- is24Hour,
726
- themeColor
727
- }
728
- ), /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: styles.actions }, /* @__PURE__ */ _react2.default.createElement(
729
- _reactnative.Pressable,
730
- {
731
- onPress: handleCancel,
732
- style: [styles.actionButton, { backgroundColor: "transparent" }]
733
- },
734
- /* @__PURE__ */ _react2.default.createElement(_reactnative.Text, { style: [styles.actionButtonText, { color: colors.primary }] }, cancelText)
735
- ), /* @__PURE__ */ _react2.default.createElement(
736
- _reactnative.Pressable,
737
- {
738
- onPress: handleConfirm,
739
- style: [styles.actionButton, { backgroundColor: "transparent" }]
740
- },
741
- /* @__PURE__ */ _react2.default.createElement(_reactnative.Text, { style: [styles.actionButtonText, { color: colors.primary }] }, confirmText)
742
- ))));
743
- };
744
-
745
- // src/components/timepicker/timepicker-trigger.tsx
746
-
747
-
748
- var _icons = require('@xaui/icons');
749
- var TimePickerTrigger = ({
750
- value,
751
- placeholder = "Select time",
752
- is24Hour = false,
753
- themeColor = "primary",
754
- isDisabled = false,
755
- isReadOnly = false,
756
- isClearable = true,
757
- icon,
758
- style,
759
- textStyle,
760
- onPress,
761
- onClear
762
- }) => {
763
- const theme = _chunk7UFBLUMVcjs.useXUITheme.call(void 0, );
764
- const colors = useTimePickerColors(themeColor);
765
- const hasValue = Boolean(value);
766
- const displayValue = _react.useMemo.call(void 0, () => {
767
- if (!value) return placeholder;
768
- return formatTimeValue(value, is24Hour);
769
- }, [value, placeholder, is24Hour]);
770
- const triggerStyle = {
771
- borderColor: colors.border,
772
- backgroundColor: colors.background
773
- };
774
- const triggerTextStyle = {
775
- color: hasValue ? theme.colors.foreground : colors.textSecondary
776
- };
777
- const isBlocked = isDisabled || isReadOnly;
778
- return /* @__PURE__ */ _react2.default.createElement(
779
- _reactnative.Pressable,
780
- {
781
- onPress: isBlocked ? void 0 : onPress,
782
- disabled: isBlocked,
783
- style: [styles.trigger, triggerStyle, isBlocked && styles.disabled, style],
784
- accessibilityRole: "button",
785
- accessibilityState: { disabled: isBlocked }
786
- },
787
- /* @__PURE__ */ _react2.default.createElement(_reactnative.View, { style: styles.triggerContent }, /* @__PURE__ */ _react2.default.createElement(
788
- _reactnative.Text,
789
- {
790
- style: [styles.triggerText, triggerTextStyle, textStyle],
791
- numberOfLines: 1,
792
- ellipsizeMode: "tail"
793
- },
794
- displayValue
795
- )),
796
- isClearable && hasValue && !isBlocked ? /* @__PURE__ */ _react2.default.createElement(
797
- _reactnative.TouchableOpacity,
798
- {
799
- onPress: onClear,
800
- style: styles.clearButton,
801
- hitSlop: { top: 8, right: 8, bottom: 8, left: 8 }
802
- },
803
- /* @__PURE__ */ _react2.default.createElement(_icons.CloseIcon, { color: theme.colors.foreground, size: 20 })
804
- ) : _nullishCoalesce(icon, () => ( /* @__PURE__ */ _react2.default.createElement(_icons.TimeIcon, { color: theme.colors.foreground, size: 20 })))
805
- );
806
- };
807
-
808
-
809
-
810
-
811
-
812
-
813
-
814
-
815
-
816
-
817
-
818
-
819
-
820
-
821
-
822
-
823
- exports.TimePicker = TimePicker; exports.TimePickerDialog = TimePickerDialog; exports.TimePickerTrigger = TimePickerTrigger; exports.angleToHour = angleToHour; exports.angleToMinute = angleToMinute; exports.calculateAngleFromPosition = calculateAngleFromPosition; exports.clampHour = clampHour; exports.clampMinute = clampMinute; exports.formatTimeValue = formatTimeValue; exports.getCurrentTime = getCurrentTime; exports.getHourAngle = getHourAngle; exports.getMinuteAngle = getMinuteAngle; exports.isTimeInRange = isTimeInRange; exports.to12HourFormat = to12HourFormat; exports.to24HourFormat = to24HourFormat;