@retray-dev/ui-kit 7.0.1 → 9.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.
- package/COMPONENTS.md +567 -14
- package/EXAMPLES.md +21 -14
- package/README.md +14 -8
- package/dist/Accordion.js +57 -5
- package/dist/Accordion.mjs +4 -3
- package/dist/AlertBanner.js +4 -1
- package/dist/AlertBanner.mjs +3 -2
- package/dist/AppHeader.d.mts +40 -0
- package/dist/AppHeader.d.ts +40 -0
- package/dist/AppHeader.js +515 -0
- package/dist/AppHeader.mjs +10 -0
- package/dist/Avatar.js +39 -29
- package/dist/Avatar.mjs +2 -1
- package/dist/Badge.js +11 -1
- package/dist/Badge.mjs +2 -1
- package/dist/Button.d.mts +8 -3
- package/dist/Button.d.ts +8 -3
- package/dist/Button.js +126 -108
- package/dist/Button.mjs +6 -5
- package/dist/ButtonGroup.mjs +1 -0
- package/dist/Card.js +90 -70
- package/dist/Card.mjs +5 -4
- package/dist/CategoryStrip.js +79 -22
- package/dist/CategoryStrip.mjs +6 -6
- package/dist/Checkbox.js +118 -86
- package/dist/Checkbox.mjs +5 -5
- package/dist/Chip.js +113 -80
- package/dist/Chip.mjs +5 -5
- package/dist/ConfirmDialog.js +140 -110
- package/dist/ConfirmDialog.mjs +7 -6
- package/dist/CurrencyDisplay.mjs +1 -0
- package/dist/CurrencyInput.d.mts +1 -1
- package/dist/CurrencyInput.d.ts +1 -1
- package/dist/CurrencyInput.js +9 -5
- package/dist/CurrencyInput.mjs +5 -4
- package/dist/DetailRow.mjs +1 -0
- package/dist/EmptyState.js +131 -111
- package/dist/EmptyState.mjs +7 -6
- package/dist/ErrorBoundary.d.mts +42 -0
- package/dist/ErrorBoundary.d.ts +42 -0
- package/dist/ErrorBoundary.js +351 -0
- package/dist/ErrorBoundary.mjs +7 -0
- package/dist/Form.mjs +1 -0
- package/dist/HolographicCard.d.mts +55 -0
- package/dist/HolographicCard.d.ts +55 -0
- package/dist/HolographicCard.js +316 -0
- package/dist/HolographicCard.mjs +191 -0
- package/dist/IconButton.d.mts +8 -3
- package/dist/IconButton.d.ts +8 -3
- package/dist/IconButton.js +115 -98
- package/dist/IconButton.mjs +5 -4
- package/dist/ImageViewer.d.mts +23 -0
- package/dist/ImageViewer.d.ts +23 -0
- package/dist/ImageViewer.js +582 -0
- package/dist/ImageViewer.mjs +8 -0
- package/dist/Input.mjs +4 -3
- package/dist/LabelValue.mjs +1 -0
- package/dist/ListGroup.mjs +1 -0
- package/dist/ListItem.js +131 -117
- package/dist/ListItem.mjs +6 -5
- package/dist/MediaCard.js +54 -6
- package/dist/MediaCard.mjs +6 -5
- package/dist/MenuGroup.mjs +1 -0
- package/dist/MenuItem.js +91 -79
- package/dist/MenuItem.mjs +6 -5
- package/dist/MonthPicker.d.mts +10 -2
- package/dist/MonthPicker.d.ts +10 -2
- package/dist/MonthPicker.js +80 -17
- package/dist/MonthPicker.mjs +3 -2
- package/dist/PagerDots.d.mts +35 -0
- package/dist/PagerDots.d.ts +35 -0
- package/dist/PagerDots.js +392 -0
- package/dist/PagerDots.mjs +7 -0
- package/dist/Pressable.d.mts +5 -5
- package/dist/Pressable.d.ts +5 -5
- package/dist/Pressable.js +97 -86
- package/dist/Pressable.mjs +5 -4
- package/dist/PricingCard.d.mts +50 -0
- package/dist/PricingCard.d.ts +50 -0
- package/dist/PricingCard.js +636 -0
- package/dist/PricingCard.mjs +11 -0
- package/dist/Progress.mjs +3 -2
- package/dist/RadioGroup.js +81 -30
- package/dist/RadioGroup.mjs +5 -5
- package/dist/RetrayProvider.d.mts +2 -0
- package/dist/RetrayProvider.d.ts +2 -0
- package/dist/RetrayProvider.js +214 -0
- package/dist/RetrayProvider.mjs +5 -0
- package/dist/Select.js +51 -4
- package/dist/Select.mjs +5 -4
- package/dist/SelectableGrid.d.mts +44 -0
- package/dist/SelectableGrid.d.ts +44 -0
- package/dist/SelectableGrid.js +448 -0
- package/dist/SelectableGrid.mjs +9 -0
- package/dist/Separator.mjs +1 -0
- package/dist/Sheet.d.mts +13 -1
- package/dist/Sheet.d.ts +13 -1
- package/dist/Sheet.js +115 -5
- package/dist/Sheet.mjs +4 -2
- package/dist/Skeleton.d.mts +50 -0
- package/dist/Skeleton.d.ts +50 -0
- package/dist/Skeleton.js +61 -0
- package/dist/Skeleton.mjs +4 -2
- package/dist/Slider.js +51 -4
- package/dist/Slider.mjs +3 -2
- package/dist/Spinner.js +28 -7
- package/dist/Spinner.mjs +2 -1
- package/dist/Switch.js +98 -48
- package/dist/Switch.mjs +4 -3
- package/dist/TabBar.d.mts +42 -0
- package/dist/TabBar.d.ts +42 -0
- package/dist/TabBar.js +361 -0
- package/dist/TabBar.mjs +6 -0
- package/dist/Tabs.js +92 -62
- package/dist/Tabs.mjs +5 -4
- package/dist/Text.js +16 -0
- package/dist/Text.mjs +2 -1
- package/dist/Textarea.mjs +4 -3
- package/dist/Toast.d.mts +7 -7
- package/dist/Toast.d.ts +7 -7
- package/dist/Toast.mjs +1 -0
- package/dist/Toggle.d.mts +6 -3
- package/dist/Toggle.d.ts +6 -3
- package/dist/Toggle.js +135 -120
- package/dist/Toggle.mjs +5 -5
- package/dist/VirtualList.mjs +1 -0
- package/dist/{chunk-7H2OR44A.mjs → chunk-26BCI223.mjs} +1 -1
- package/dist/{chunk-CRYBX2CM.mjs → chunk-2TFTAWVJ.mjs} +44 -59
- package/dist/chunk-3DKJ2GIC.mjs +30 -0
- package/dist/{chunk-KWCPOM6W.mjs → chunk-3U4SSNWP.mjs} +32 -48
- package/dist/chunk-4I7D47FH.mjs +139 -0
- package/dist/chunk-4K625MVM.mjs +142 -0
- package/dist/{chunk-MN7OG7IY.mjs → chunk-6OAZJ577.mjs} +6 -4
- package/dist/{chunk-L7E7TVEZ.mjs → chunk-756RAKE4.mjs} +2 -2
- package/dist/{chunk-HSPSMN6U.mjs → chunk-7QHVVCB3.mjs} +2 -2
- package/dist/{chunk-URLL5JBR.mjs → chunk-A3A6KNQN.mjs} +3 -3
- package/dist/chunk-AJ7ZDNBT.mjs +120 -0
- package/dist/{chunk-FTLJOUOQ.mjs → chunk-AV4EMIRH.mjs} +25 -28
- package/dist/chunk-AZJF2BLK.mjs +115 -0
- package/dist/chunk-BNP626TY.mjs +159 -0
- package/dist/{chunk-5IKW3VNC.mjs → chunk-DVK4G2GT.mjs} +17 -1
- package/dist/{chunk-6LQYY7HC.mjs → chunk-EH745HE5.mjs} +2 -2
- package/dist/chunk-EJ7ZPXOH.mjs +163 -0
- package/dist/{chunk-RKLHUDZS.mjs → chunk-GD6KXMG5.mjs} +29 -15
- package/dist/{chunk-RR2VQLKE.mjs → chunk-GQYFLP3D.mjs} +14 -17
- package/dist/{chunk-Y6MXOREN.mjs → chunk-ID72TK46.mjs} +8 -17
- package/dist/{chunk-NQGVLMWG.mjs → chunk-JMOZEC77.mjs} +1 -1
- package/dist/{chunk-GCWOGZYL.mjs → chunk-JT7HKXRB.mjs} +39 -29
- package/dist/{chunk-LWG526VX.mjs → chunk-KIHCWCWL.mjs} +47 -62
- package/dist/chunk-LXJIIOYQ.mjs +104 -0
- package/dist/{chunk-SBZYEV4S.mjs → chunk-M6ZXVBTK.mjs} +5 -2
- package/dist/{chunk-XDMN67KV.mjs → chunk-MAC465BB.mjs} +10 -8
- package/dist/chunk-MBMXYJJV.mjs +36 -0
- package/dist/chunk-MLF3EZFW.mjs +119 -0
- package/dist/chunk-NA7PARID.mjs +147 -0
- package/dist/{chunk-QXGYKWI7.mjs → chunk-O3HA6TYM.mjs} +9 -4
- package/dist/{chunk-63357L2X.mjs → chunk-OB4JUQ3O.mjs} +1 -1
- package/dist/{chunk-AU2VDY4P.mjs → chunk-PFZTM6D5.mjs} +52 -4
- package/dist/chunk-QKH5ZOD5.mjs +97 -0
- package/dist/{chunk-KZJRQOIU.mjs → chunk-TERDKCLE.mjs} +11 -1
- package/dist/{chunk-U4N7WF4Z.mjs → chunk-UREA2GYY.mjs} +28 -23
- package/dist/{chunk-TAJ2PQ2O.mjs → chunk-VGTDN7SW.mjs} +7 -6
- package/dist/{chunk-URDE3EUU.mjs → chunk-VQ57HWPL.mjs} +27 -15
- package/dist/chunk-WBOOUHSS.mjs +62 -0
- package/dist/{chunk-GNGLDL6Z.mjs → chunk-WJLKJMKR.mjs} +18 -0
- package/dist/{chunk-YZJAFS4P.mjs → chunk-X4G6APW6.mjs} +22 -19
- package/dist/chunk-Y6FXYEAI.mjs +8 -0
- package/dist/chunk-YFZ3ELX5.mjs +16 -0
- package/dist/{chunk-QCNARS3X.mjs → chunk-YNROWHQJ.mjs} +1 -1
- package/dist/chunk-Z4BVUWW6.mjs +196 -0
- package/dist/{chunk-GPOUINK5.mjs → chunk-ZJKGQMYH.mjs} +10 -27
- package/dist/index-wt-orHUi.d.mts +85 -0
- package/dist/index-wt-orHUi.d.ts +85 -0
- package/dist/index.d.mts +59 -51
- package/dist/index.d.ts +59 -51
- package/dist/index.js +1940 -744
- package/dist/index.mjs +49 -39
- package/package.json +35 -5
- package/src/components/Accordion/Accordion.tsx +12 -1
- package/src/components/AlertBanner/AlertBanner.tsx +5 -0
- package/src/components/AppHeader/AppHeader.tsx +172 -0
- package/src/components/AppHeader/index.ts +1 -0
- package/src/components/Avatar/Avatar.tsx +10 -2
- package/src/components/Badge/Badge.tsx +8 -1
- package/src/components/Button/Button.tsx +20 -27
- package/src/components/Card/Card.tsx +12 -23
- package/src/components/CategoryStrip/CategoryStrip.tsx +17 -21
- package/src/components/Checkbox/Checkbox.tsx +26 -40
- package/src/components/Chip/Chip.tsx +24 -33
- package/src/components/CurrencyInput/CurrencyInput.tsx +10 -8
- package/src/components/EmptyState/EmptyState.tsx +2 -1
- package/src/components/ErrorBoundary/ErrorBoundary.tsx +153 -0
- package/src/components/ErrorBoundary/index.ts +1 -0
- package/src/components/HolographicCard/HolographicCard.tsx +315 -0
- package/src/components/HolographicCard/index.ts +1 -0
- package/src/components/IconButton/IconButton.tsx +19 -27
- package/src/components/ImageViewer/ImageViewer.tsx +290 -0
- package/src/components/ImageViewer/index.ts +1 -0
- package/src/components/ListItem/ListItem.tsx +70 -67
- package/src/components/MediaCard/MediaCard.tsx +8 -2
- package/src/components/MenuItem/MenuItem.tsx +10 -25
- package/src/components/MonthPicker/MonthPicker.tsx +39 -13
- package/src/components/MonthPicker/index.ts +1 -1
- package/src/components/PagerDots/PagerDots.tsx +200 -0
- package/src/components/PagerDots/index.ts +1 -0
- package/src/components/Pressable/Pressable.tsx +19 -35
- package/src/components/PricingCard/PricingCard.tsx +220 -0
- package/src/components/PricingCard/index.ts +1 -0
- package/src/components/RadioGroup/RadioGroup.tsx +14 -27
- package/src/components/RetrayProvider/RetrayProvider.tsx +59 -0
- package/src/components/RetrayProvider/index.ts +1 -0
- package/src/components/SelectableGrid/SelectableGrid.tsx +205 -0
- package/src/components/SelectableGrid/index.ts +1 -0
- package/src/components/Sheet/Sheet.tsx +65 -1
- package/src/components/Skeleton/Skeleton.tsx +142 -1
- package/src/components/Spinner/Spinner.tsx +17 -2
- package/src/components/Switch/Switch.tsx +30 -58
- package/src/components/TabBar/TabBar.tsx +169 -0
- package/src/components/TabBar/index.ts +1 -0
- package/src/components/Tabs/Tabs.tsx +23 -26
- package/src/components/Text/Text.tsx +2 -0
- package/src/components/Toggle/Toggle.tsx +35 -51
- package/src/fonts.ts +4 -1
- package/src/index.ts +23 -2
- package/src/utils/animations.ts +29 -1
- package/src/utils/fontGuard.ts +34 -0
- package/src/utils/haptics.ts +211 -9
- package/src/utils/pressable.ts +66 -0
- package/dist/chunk-76PFOSM2.mjs +0 -41
- package/dist/chunk-DITNP6PL.mjs +0 -106
- package/dist/chunk-JBLL7U3U.mjs +0 -64
- package/dist/chunk-LG4DO3DK.mjs +0 -174
- package/dist/chunk-RMMK64W5.mjs +0 -54
- package/dist/chunk-RTC3CFXF.mjs +0 -29
package/dist/Button.d.ts
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { ViewStyle } from 'react-native';
|
|
3
3
|
|
|
4
4
|
type ButtonVariant = 'primary' | 'secondary' | 'text' | 'destructive';
|
|
5
5
|
type ButtonSize = 'sm' | 'md' | 'lg';
|
|
6
|
-
interface ButtonProps
|
|
6
|
+
interface ButtonProps {
|
|
7
7
|
label: string;
|
|
8
8
|
variant?: ButtonVariant;
|
|
9
9
|
size?: ButtonSize;
|
|
@@ -18,8 +18,13 @@ interface ButtonProps extends TouchableOpacityProps {
|
|
|
18
18
|
iconName?: string;
|
|
19
19
|
iconColor?: string;
|
|
20
20
|
iconPosition?: 'left' | 'right';
|
|
21
|
+
disabled?: boolean;
|
|
22
|
+
style?: ViewStyle;
|
|
23
|
+
onPress?: () => void;
|
|
24
|
+
accessibilityLabel?: string;
|
|
25
|
+
accessibilityHint?: string;
|
|
21
26
|
}
|
|
22
|
-
declare function ButtonBase({ label, variant, size, loading, fullWidth, icon, iconName, iconColor, iconPosition, disabled, style, onPress, accessibilityLabel, accessibilityHint,
|
|
27
|
+
declare function ButtonBase({ label, variant, size, loading, fullWidth, icon, iconName, iconColor, iconPosition, disabled, style, onPress, accessibilityLabel, accessibilityHint, }: ButtonProps): React.JSX.Element;
|
|
23
28
|
declare const Button: React.MemoExoticComponent<typeof ButtonBase>;
|
|
24
29
|
|
|
25
30
|
export { Button, type ButtonProps, type ButtonSize, type ButtonVariant };
|
package/dist/Button.js
CHANGED
|
@@ -2,7 +2,6 @@
|
|
|
2
2
|
|
|
3
3
|
var React3 = require('react');
|
|
4
4
|
var reactNative = require('react-native');
|
|
5
|
-
var Animated = require('react-native-reanimated');
|
|
6
5
|
var reactNativeSizeMatters = require('react-native-size-matters');
|
|
7
6
|
var AntDesign = require('@expo/vector-icons/AntDesign');
|
|
8
7
|
var Entypo = require('@expo/vector-icons/Entypo');
|
|
@@ -10,11 +9,12 @@ var Feather = require('@expo/vector-icons/Feather');
|
|
|
10
9
|
var FontAwesome5 = require('@expo/vector-icons/FontAwesome5');
|
|
11
10
|
var MaterialIcons = require('@expo/vector-icons/MaterialIcons');
|
|
12
11
|
var Ionicons = require('@expo/vector-icons/Ionicons');
|
|
12
|
+
var pressto = require('pressto');
|
|
13
|
+
var reactNativeReanimated = require('react-native-reanimated');
|
|
13
14
|
|
|
14
15
|
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
15
16
|
|
|
16
17
|
var React3__default = /*#__PURE__*/_interopDefault(React3);
|
|
17
|
-
var Animated__default = /*#__PURE__*/_interopDefault(Animated);
|
|
18
18
|
var AntDesign__default = /*#__PURE__*/_interopDefault(AntDesign);
|
|
19
19
|
var Entypo__default = /*#__PURE__*/_interopDefault(Entypo);
|
|
20
20
|
var Feather__default = /*#__PURE__*/_interopDefault(Feather);
|
|
@@ -22,18 +22,65 @@ var FontAwesome5__default = /*#__PURE__*/_interopDefault(FontAwesome5);
|
|
|
22
22
|
var MaterialIcons__default = /*#__PURE__*/_interopDefault(MaterialIcons);
|
|
23
23
|
var Ionicons__default = /*#__PURE__*/_interopDefault(Ionicons);
|
|
24
24
|
|
|
25
|
-
|
|
25
|
+
var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
|
|
26
|
+
get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
|
|
27
|
+
}) : x)(function(x) {
|
|
28
|
+
if (typeof require !== "undefined") return require.apply(this, arguments);
|
|
29
|
+
throw Error('Dynamic require of "' + x + '" is not supported');
|
|
30
|
+
});
|
|
26
31
|
var _haptics = null;
|
|
32
|
+
var _hapticsLoaded = false;
|
|
27
33
|
async function getHaptics() {
|
|
28
34
|
if (reactNative.Platform.OS === "web") return null;
|
|
29
|
-
if (!
|
|
30
|
-
|
|
35
|
+
if (!_hapticsLoaded) {
|
|
36
|
+
_hapticsLoaded = true;
|
|
37
|
+
try {
|
|
38
|
+
_haptics = await import('expo-haptics');
|
|
39
|
+
} catch {
|
|
40
|
+
_haptics = null;
|
|
41
|
+
}
|
|
31
42
|
}
|
|
32
43
|
return _haptics;
|
|
33
44
|
}
|
|
45
|
+
var _pulsar = null;
|
|
46
|
+
var _pulsarChecked = false;
|
|
47
|
+
var _pulsarAvailable = false;
|
|
48
|
+
function isPulsarNativeRegistered() {
|
|
49
|
+
try {
|
|
50
|
+
const g = globalThis;
|
|
51
|
+
if (typeof g.__turboModuleProxy === "function") {
|
|
52
|
+
return g.__turboModuleProxy("RNPulsar") != null;
|
|
53
|
+
}
|
|
54
|
+
return reactNative.NativeModules?.RNPulsar != null;
|
|
55
|
+
} catch {
|
|
56
|
+
return false;
|
|
57
|
+
}
|
|
58
|
+
}
|
|
59
|
+
function getPulsar() {
|
|
60
|
+
if (reactNative.Platform.OS === "web") return null;
|
|
61
|
+
if (!_pulsarChecked) {
|
|
62
|
+
_pulsarChecked = true;
|
|
63
|
+
try {
|
|
64
|
+
if (isPulsarNativeRegistered()) {
|
|
65
|
+
_pulsar = __require("react-native-pulsar");
|
|
66
|
+
_pulsarAvailable = true;
|
|
67
|
+
}
|
|
68
|
+
} catch {
|
|
69
|
+
_pulsar = null;
|
|
70
|
+
_pulsarAvailable = false;
|
|
71
|
+
}
|
|
72
|
+
}
|
|
73
|
+
return _pulsarAvailable ? _pulsar : null;
|
|
74
|
+
}
|
|
34
75
|
function impactMedium() {
|
|
35
76
|
if (reactNative.Platform.OS === "web") return;
|
|
36
|
-
getHaptics().then((h) =>
|
|
77
|
+
getHaptics().then((h) => {
|
|
78
|
+
if (h) {
|
|
79
|
+
h.impactAsync(h.ImpactFeedbackStyle.Medium);
|
|
80
|
+
} else {
|
|
81
|
+
getPulsar()?.Presets.System.impactMedium();
|
|
82
|
+
}
|
|
83
|
+
});
|
|
37
84
|
}
|
|
38
85
|
|
|
39
86
|
// src/theme/colorUtils.ts
|
|
@@ -220,65 +267,50 @@ var TYPOGRAPHY = {
|
|
|
220
267
|
letterSpacing: 0
|
|
221
268
|
}
|
|
222
269
|
};
|
|
223
|
-
var SPRINGS = {
|
|
224
|
-
/** Tight, premium press feel — Buttons, Toggle, Tabs triggers. */
|
|
225
|
-
pressIn: { stiffness: 600, damping: 35, mass: 0.8 },
|
|
226
|
-
pressOut: { stiffness: 280, damping: 22, mass: 0.8 }};
|
|
227
270
|
({
|
|
228
271
|
/** Material-style ease-out — natural deceleration for state changes. */
|
|
229
|
-
standard:
|
|
272
|
+
standard: reactNativeReanimated.Easing.bezier(0.2, 0, 0, 1),
|
|
230
273
|
/** Strong ease-out for expanding surfaces (Accordion open). */
|
|
231
|
-
expand:
|
|
274
|
+
expand: reactNativeReanimated.Easing.bezier(0.23, 1, 0.32, 1),
|
|
232
275
|
/** Quick ease-in for collapsing. */
|
|
233
|
-
collapse:
|
|
276
|
+
collapse: reactNativeReanimated.Easing.in(reactNativeReanimated.Easing.ease)
|
|
234
277
|
});
|
|
235
278
|
var PRESS_SCALE = {
|
|
236
|
-
button: 0.95
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
return {
|
|
245
|
-
}
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
const animatedStyle = Animated.useAnimatedStyle(() => ({
|
|
267
|
-
transform: [
|
|
268
|
-
{ scale: scale2.value * (hoverActive ? hoverScale : 1) }
|
|
269
|
-
]
|
|
270
|
-
}));
|
|
271
|
-
return {
|
|
272
|
-
animatedStyle,
|
|
273
|
-
onPressIn,
|
|
274
|
-
onPressOut,
|
|
275
|
-
hoverHandlers
|
|
276
|
-
};
|
|
277
|
-
}
|
|
279
|
+
button: 0.95,
|
|
280
|
+
card: 0.98,
|
|
281
|
+
row: 0.97,
|
|
282
|
+
chip: 0.94
|
|
283
|
+
};
|
|
284
|
+
var PressableButton = pressto.createAnimatedPressable((progress) => {
|
|
285
|
+
"worklet";
|
|
286
|
+
const scale2 = 1 - (1 - PRESS_SCALE.button) * progress;
|
|
287
|
+
return { transform: [{ scale: scale2 }] };
|
|
288
|
+
});
|
|
289
|
+
pressto.createAnimatedPressable((progress) => {
|
|
290
|
+
"worklet";
|
|
291
|
+
const scale2 = 1 - (1 - PRESS_SCALE.card) * progress;
|
|
292
|
+
return { transform: [{ scale: scale2 }] };
|
|
293
|
+
});
|
|
294
|
+
pressto.createAnimatedPressable((progress) => {
|
|
295
|
+
"worklet";
|
|
296
|
+
const scale2 = 1 - (1 - PRESS_SCALE.row) * progress;
|
|
297
|
+
return { transform: [{ scale: scale2 }] };
|
|
298
|
+
});
|
|
299
|
+
pressto.createAnimatedPressable((progress) => {
|
|
300
|
+
"worklet";
|
|
301
|
+
const scale2 = 1 - (1 - PRESS_SCALE.chip) * progress;
|
|
302
|
+
return { transform: [{ scale: scale2 }] };
|
|
303
|
+
});
|
|
304
|
+
pressto.createAnimatedPressable((progress) => {
|
|
305
|
+
"worklet";
|
|
306
|
+
const scale2 = 1 - (1 - PRESS_SCALE.button) * progress;
|
|
307
|
+
return { transform: [{ scale: scale2 }] };
|
|
308
|
+
});
|
|
278
309
|
|
|
279
310
|
// src/components/Button/Button.tsx
|
|
280
311
|
var containerSizeStyles = {
|
|
281
|
-
|
|
312
|
+
// AUDIT FIX: sm was 40pt — below Apple HIG 44pt minimum touch target.
|
|
313
|
+
sm: { paddingHorizontal: s(16), paddingVertical: vs(12), minHeight: 44 },
|
|
282
314
|
md: { paddingHorizontal: s(24), paddingVertical: vs(14), minHeight: 48 },
|
|
283
315
|
lg: { paddingHorizontal: s(28), paddingVertical: vs(16), minHeight: 56 }
|
|
284
316
|
};
|
|
@@ -302,18 +334,13 @@ function ButtonBase({
|
|
|
302
334
|
style,
|
|
303
335
|
onPress,
|
|
304
336
|
accessibilityLabel,
|
|
305
|
-
accessibilityHint
|
|
306
|
-
...props
|
|
337
|
+
accessibilityHint
|
|
307
338
|
}) {
|
|
308
339
|
const { colors } = useTheme();
|
|
309
340
|
const isDisabled = disabled || loading;
|
|
310
|
-
const
|
|
311
|
-
pressScale: PRESS_SCALE.button,
|
|
312
|
-
disabled: isDisabled
|
|
313
|
-
});
|
|
314
|
-
const handlePress = (e) => {
|
|
341
|
+
const handlePress = () => {
|
|
315
342
|
impactMedium();
|
|
316
|
-
onPress?.(
|
|
343
|
+
onPress?.();
|
|
317
344
|
};
|
|
318
345
|
const containerVariantStyle = {
|
|
319
346
|
primary: { backgroundColor: colors.primary },
|
|
@@ -336,54 +363,45 @@ function ButtonBase({
|
|
|
336
363
|
const styleArray = Array.isArray(style) ? style : style ? [style] : [];
|
|
337
364
|
const flatStyle = reactNative.StyleSheet.flatten(styleArray);
|
|
338
365
|
const { flex, ...restStyle } = flatStyle || {};
|
|
339
|
-
return /* @__PURE__ */ React3__default.default.createElement(
|
|
340
|
-
|
|
366
|
+
return /* @__PURE__ */ React3__default.default.createElement(reactNative.View, { style: [fullWidth && styles.fullWidth, flex !== void 0 && { flex }] }, /* @__PURE__ */ React3__default.default.createElement(
|
|
367
|
+
PressableButton,
|
|
341
368
|
{
|
|
342
|
-
style: [
|
|
343
|
-
|
|
369
|
+
style: [
|
|
370
|
+
styles.base,
|
|
371
|
+
containerVariantStyle,
|
|
372
|
+
containerSizeStyles[size],
|
|
373
|
+
fullWidth && styles.fullWidth,
|
|
374
|
+
isDisabled && styles.disabled,
|
|
375
|
+
restStyle
|
|
376
|
+
],
|
|
377
|
+
enabled: !isDisabled,
|
|
378
|
+
onPress: handlePress,
|
|
379
|
+
rippleColor: "transparent",
|
|
380
|
+
touchSoundDisabled: true,
|
|
381
|
+
activateOnHover: true,
|
|
382
|
+
accessibilityRole: "button",
|
|
383
|
+
accessibilityLabel: accessibilityLabel ?? label,
|
|
384
|
+
accessibilityHint,
|
|
385
|
+
accessibilityState: { disabled: isDisabled, busy: loading }
|
|
344
386
|
},
|
|
345
|
-
/* @__PURE__ */ React3__default.default.createElement(
|
|
346
|
-
reactNative.
|
|
387
|
+
loading ? /* @__PURE__ */ React3__default.default.createElement(React3__default.default.Fragment, null, /* @__PURE__ */ React3__default.default.createElement(reactNative.ActivityIndicator, { size: "small", color: spinnerColor, style: { marginRight: s(6) } }), /* @__PURE__ */ React3__default.default.createElement(
|
|
388
|
+
reactNative.Text,
|
|
389
|
+
{
|
|
390
|
+
style: [styles.label, labelVariantStyle, labelSizeStyles[size], styles.labelLoading],
|
|
391
|
+
allowFontScaling: true,
|
|
392
|
+
numberOfLines: 1
|
|
393
|
+
},
|
|
394
|
+
label
|
|
395
|
+
)) : /* @__PURE__ */ React3__default.default.createElement(React3__default.default.Fragment, null, effectiveIcon && iconPosition === "left" && /* @__PURE__ */ React3__default.default.createElement(React3__default.default.Fragment, null, effectiveIcon), /* @__PURE__ */ React3__default.default.createElement(
|
|
396
|
+
reactNative.Text,
|
|
347
397
|
{
|
|
348
|
-
style: [
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
containerSizeStyles[size],
|
|
352
|
-
fullWidth && styles.fullWidth,
|
|
353
|
-
isDisabled && styles.disabled,
|
|
354
|
-
restStyle
|
|
355
|
-
],
|
|
356
|
-
disabled: isDisabled,
|
|
357
|
-
activeOpacity: 1,
|
|
358
|
-
touchSoundDisabled: true,
|
|
359
|
-
onPress: handlePress,
|
|
360
|
-
onPressIn,
|
|
361
|
-
onPressOut,
|
|
362
|
-
accessibilityRole: "button",
|
|
363
|
-
accessibilityLabel: accessibilityLabel ?? label,
|
|
364
|
-
accessibilityHint,
|
|
365
|
-
accessibilityState: { disabled: isDisabled, busy: loading },
|
|
366
|
-
...props
|
|
398
|
+
style: [styles.label, labelVariantStyle, labelSizeStyles[size], effectiveIcon ? styles.labelWithIcon : void 0],
|
|
399
|
+
allowFontScaling: true,
|
|
400
|
+
numberOfLines: 1
|
|
367
401
|
},
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
style: [styles.label, labelVariantStyle, labelSizeStyles[size], styles.labelLoading],
|
|
372
|
-
allowFontScaling: true,
|
|
373
|
-
numberOfLines: 1
|
|
374
|
-
},
|
|
375
|
-
label
|
|
376
|
-
)) : /* @__PURE__ */ React3__default.default.createElement(React3__default.default.Fragment, null, effectiveIcon && iconPosition === "left" && /* @__PURE__ */ React3__default.default.createElement(React3__default.default.Fragment, null, effectiveIcon), /* @__PURE__ */ React3__default.default.createElement(
|
|
377
|
-
reactNative.Text,
|
|
378
|
-
{
|
|
379
|
-
style: [styles.label, labelVariantStyle, labelSizeStyles[size], effectiveIcon ? styles.labelWithIcon : void 0],
|
|
380
|
-
allowFontScaling: true,
|
|
381
|
-
numberOfLines: 1
|
|
382
|
-
},
|
|
383
|
-
label
|
|
384
|
-
), effectiveIcon && iconPosition === "right" && /* @__PURE__ */ React3__default.default.createElement(React3__default.default.Fragment, null, effectiveIcon))
|
|
385
|
-
)
|
|
386
|
-
);
|
|
402
|
+
label
|
|
403
|
+
), effectiveIcon && iconPosition === "right" && /* @__PURE__ */ React3__default.default.createElement(React3__default.default.Fragment, null, effectiveIcon))
|
|
404
|
+
));
|
|
387
405
|
}
|
|
388
406
|
var Button = React3__default.default.memo(ButtonBase);
|
|
389
407
|
var styles = reactNative.StyleSheet.create({
|
package/dist/Button.mjs
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
|
-
export { Button } from './chunk-
|
|
2
|
-
import './chunk-
|
|
3
|
-
import './chunk-
|
|
4
|
-
import './chunk-
|
|
5
|
-
import './chunk-5IKW3VNC.mjs';
|
|
1
|
+
export { Button } from './chunk-2TFTAWVJ.mjs';
|
|
2
|
+
import './chunk-3DKJ2GIC.mjs';
|
|
3
|
+
import './chunk-EJ7ZPXOH.mjs';
|
|
4
|
+
import './chunk-DVK4G2GT.mjs';
|
|
6
5
|
import './chunk-QY3X2UYR.mjs';
|
|
6
|
+
import './chunk-T7XZ7H7Y.mjs';
|
|
7
7
|
import './chunk-SOYNZDVY.mjs';
|
|
8
8
|
import './chunk-2CE3TQVY.mjs';
|
|
9
|
+
import './chunk-Y6FXYEAI.mjs';
|
package/dist/ButtonGroup.mjs
CHANGED
package/dist/Card.js
CHANGED
|
@@ -2,26 +2,73 @@
|
|
|
2
2
|
|
|
3
3
|
var React2 = require('react');
|
|
4
4
|
var reactNative = require('react-native');
|
|
5
|
-
var Animated = require('react-native-reanimated');
|
|
6
5
|
var reactNativeSizeMatters = require('react-native-size-matters');
|
|
6
|
+
var pressto = require('pressto');
|
|
7
|
+
var reactNativeReanimated = require('react-native-reanimated');
|
|
7
8
|
|
|
8
9
|
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
9
10
|
|
|
10
11
|
var React2__default = /*#__PURE__*/_interopDefault(React2);
|
|
11
|
-
var Animated__default = /*#__PURE__*/_interopDefault(Animated);
|
|
12
12
|
|
|
13
|
-
|
|
13
|
+
var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
|
|
14
|
+
get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
|
|
15
|
+
}) : x)(function(x) {
|
|
16
|
+
if (typeof require !== "undefined") return require.apply(this, arguments);
|
|
17
|
+
throw Error('Dynamic require of "' + x + '" is not supported');
|
|
18
|
+
});
|
|
14
19
|
var _haptics = null;
|
|
20
|
+
var _hapticsLoaded = false;
|
|
15
21
|
async function getHaptics() {
|
|
16
22
|
if (reactNative.Platform.OS === "web") return null;
|
|
17
|
-
if (!
|
|
18
|
-
|
|
23
|
+
if (!_hapticsLoaded) {
|
|
24
|
+
_hapticsLoaded = true;
|
|
25
|
+
try {
|
|
26
|
+
_haptics = await import('expo-haptics');
|
|
27
|
+
} catch {
|
|
28
|
+
_haptics = null;
|
|
29
|
+
}
|
|
19
30
|
}
|
|
20
31
|
return _haptics;
|
|
21
32
|
}
|
|
33
|
+
var _pulsar = null;
|
|
34
|
+
var _pulsarChecked = false;
|
|
35
|
+
var _pulsarAvailable = false;
|
|
36
|
+
function isPulsarNativeRegistered() {
|
|
37
|
+
try {
|
|
38
|
+
const g = globalThis;
|
|
39
|
+
if (typeof g.__turboModuleProxy === "function") {
|
|
40
|
+
return g.__turboModuleProxy("RNPulsar") != null;
|
|
41
|
+
}
|
|
42
|
+
return reactNative.NativeModules?.RNPulsar != null;
|
|
43
|
+
} catch {
|
|
44
|
+
return false;
|
|
45
|
+
}
|
|
46
|
+
}
|
|
47
|
+
function getPulsar() {
|
|
48
|
+
if (reactNative.Platform.OS === "web") return null;
|
|
49
|
+
if (!_pulsarChecked) {
|
|
50
|
+
_pulsarChecked = true;
|
|
51
|
+
try {
|
|
52
|
+
if (isPulsarNativeRegistered()) {
|
|
53
|
+
_pulsar = __require("react-native-pulsar");
|
|
54
|
+
_pulsarAvailable = true;
|
|
55
|
+
}
|
|
56
|
+
} catch {
|
|
57
|
+
_pulsar = null;
|
|
58
|
+
_pulsarAvailable = false;
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
return _pulsarAvailable ? _pulsar : null;
|
|
62
|
+
}
|
|
22
63
|
function impactLight() {
|
|
23
64
|
if (reactNative.Platform.OS === "web") return;
|
|
24
|
-
getHaptics().then((h) =>
|
|
65
|
+
getHaptics().then((h) => {
|
|
66
|
+
if (h) {
|
|
67
|
+
h.impactAsync(h.ImpactFeedbackStyle.Light);
|
|
68
|
+
} else {
|
|
69
|
+
getPulsar()?.Presets.System.impactLight();
|
|
70
|
+
}
|
|
71
|
+
});
|
|
25
72
|
}
|
|
26
73
|
|
|
27
74
|
// src/theme/colorUtils.ts
|
|
@@ -151,75 +198,49 @@ var mvs = isWeb ? (n, _factor) => n : reactNativeSizeMatters.moderateVerticalSca
|
|
|
151
198
|
// src/tokens.ts
|
|
152
199
|
var RADIUS = {
|
|
153
200
|
md: 14};
|
|
154
|
-
var SPRINGS = {
|
|
155
|
-
/** Tight, premium press feel — Buttons, Toggle, Tabs triggers. */
|
|
156
|
-
pressIn: { stiffness: 600, damping: 35, mass: 0.8 },
|
|
157
|
-
pressOut: { stiffness: 280, damping: 22, mass: 0.8 },
|
|
158
|
-
/** Slightly softer for larger surfaces — Card, ListItem, MenuItem. */
|
|
159
|
-
surfacePressIn: { stiffness: 380, damping: 30, mass: 0.95 },
|
|
160
|
-
surfacePressOut: { stiffness: 220, damping: 20, mass: 0.95 }};
|
|
161
201
|
({
|
|
162
202
|
/** Material-style ease-out — natural deceleration for state changes. */
|
|
163
|
-
standard:
|
|
203
|
+
standard: reactNativeReanimated.Easing.bezier(0.2, 0, 0, 1),
|
|
164
204
|
/** Strong ease-out for expanding surfaces (Accordion open). */
|
|
165
|
-
expand:
|
|
205
|
+
expand: reactNativeReanimated.Easing.bezier(0.23, 1, 0.32, 1),
|
|
166
206
|
/** Quick ease-in for collapsing. */
|
|
167
|
-
collapse:
|
|
207
|
+
collapse: reactNativeReanimated.Easing.in(reactNativeReanimated.Easing.ease)
|
|
168
208
|
});
|
|
169
209
|
var PRESS_SCALE = {
|
|
170
210
|
button: 0.95,
|
|
171
|
-
card: 0.98
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
}
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
}
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
const
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
const hoverActive = reactNative.Platform.OS === "web" && hovered && hoverScale !== 1 && !disabled;
|
|
201
|
-
const animatedStyle = Animated.useAnimatedStyle(() => ({
|
|
202
|
-
transform: [
|
|
203
|
-
{ scale: scale2.value * (hoverActive ? hoverScale : 1) }
|
|
204
|
-
]
|
|
205
|
-
}));
|
|
206
|
-
return {
|
|
207
|
-
animatedStyle,
|
|
208
|
-
onPressIn,
|
|
209
|
-
onPressOut,
|
|
210
|
-
hoverHandlers
|
|
211
|
-
};
|
|
212
|
-
}
|
|
211
|
+
card: 0.98,
|
|
212
|
+
row: 0.97,
|
|
213
|
+
chip: 0.94
|
|
214
|
+
};
|
|
215
|
+
pressto.createAnimatedPressable((progress) => {
|
|
216
|
+
"worklet";
|
|
217
|
+
const scale2 = 1 - (1 - PRESS_SCALE.button) * progress;
|
|
218
|
+
return { transform: [{ scale: scale2 }] };
|
|
219
|
+
});
|
|
220
|
+
var PressableCard = pressto.createAnimatedPressable((progress) => {
|
|
221
|
+
"worklet";
|
|
222
|
+
const scale2 = 1 - (1 - PRESS_SCALE.card) * progress;
|
|
223
|
+
return { transform: [{ scale: scale2 }] };
|
|
224
|
+
});
|
|
225
|
+
pressto.createAnimatedPressable((progress) => {
|
|
226
|
+
"worklet";
|
|
227
|
+
const scale2 = 1 - (1 - PRESS_SCALE.row) * progress;
|
|
228
|
+
return { transform: [{ scale: scale2 }] };
|
|
229
|
+
});
|
|
230
|
+
pressto.createAnimatedPressable((progress) => {
|
|
231
|
+
"worklet";
|
|
232
|
+
const scale2 = 1 - (1 - PRESS_SCALE.chip) * progress;
|
|
233
|
+
return { transform: [{ scale: scale2 }] };
|
|
234
|
+
});
|
|
235
|
+
pressto.createAnimatedPressable((progress) => {
|
|
236
|
+
"worklet";
|
|
237
|
+
const scale2 = 1 - (1 - PRESS_SCALE.button) * progress;
|
|
238
|
+
return { transform: [{ scale: scale2 }] };
|
|
239
|
+
});
|
|
213
240
|
|
|
214
241
|
// src/components/Card/Card.tsx
|
|
215
242
|
function Card({ children, variant = "elevated", onPress, style, accessibilityLabel }) {
|
|
216
243
|
const { colors } = useTheme();
|
|
217
|
-
const { animatedStyle, onPressIn, onPressOut, hoverHandlers } = usePressScale({
|
|
218
|
-
pressScale: PRESS_SCALE.card,
|
|
219
|
-
pressInSpring: SPRINGS.surfacePressIn,
|
|
220
|
-
pressOutSpring: SPRINGS.surfacePressOut,
|
|
221
|
-
disabled: !onPress
|
|
222
|
-
});
|
|
223
244
|
const handlePress = () => {
|
|
224
245
|
if (!onPress) return;
|
|
225
246
|
impactLight();
|
|
@@ -253,19 +274,18 @@ function Card({ children, variant = "elevated", onPress, style, accessibilityLab
|
|
|
253
274
|
}[variant];
|
|
254
275
|
const cardContent = /* @__PURE__ */ React2__default.default.createElement(reactNative.View, { style: [styles.card, variantStyle, style] }, children);
|
|
255
276
|
if (onPress) {
|
|
256
|
-
return /* @__PURE__ */ React2__default.default.createElement(
|
|
257
|
-
|
|
277
|
+
return /* @__PURE__ */ React2__default.default.createElement(
|
|
278
|
+
PressableCard,
|
|
258
279
|
{
|
|
259
280
|
onPress: handlePress,
|
|
260
|
-
|
|
261
|
-
onPressOut,
|
|
262
|
-
activeOpacity: 1,
|
|
281
|
+
rippleColor: "transparent",
|
|
263
282
|
touchSoundDisabled: true,
|
|
283
|
+
activateOnHover: true,
|
|
264
284
|
accessibilityRole: "button",
|
|
265
285
|
accessibilityLabel
|
|
266
286
|
},
|
|
267
287
|
cardContent
|
|
268
|
-
)
|
|
288
|
+
);
|
|
269
289
|
}
|
|
270
290
|
return cardContent;
|
|
271
291
|
}
|
package/dist/Card.mjs
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
export { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from './chunk-
|
|
2
|
-
import './chunk-
|
|
3
|
-
import './chunk-
|
|
4
|
-
import './chunk-
|
|
1
|
+
export { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from './chunk-ID72TK46.mjs';
|
|
2
|
+
import './chunk-3DKJ2GIC.mjs';
|
|
3
|
+
import './chunk-EJ7ZPXOH.mjs';
|
|
4
|
+
import './chunk-DVK4G2GT.mjs';
|
|
5
5
|
import './chunk-QY3X2UYR.mjs';
|
|
6
6
|
import './chunk-SOYNZDVY.mjs';
|
|
7
7
|
import './chunk-2CE3TQVY.mjs';
|
|
8
|
+
import './chunk-Y6FXYEAI.mjs';
|