@xaui/native 0.9.1-alpha.2 → 0.9.1-alpha.21
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/dist/chunk-2WMVDMFV.cjs +62 -0
- package/dist/chunk-33QILJJH.cjs +143 -0
- package/dist/chunk-4NE3SLTM.cjs +695 -0
- package/dist/{chunk-M7P46XKI.cjs → chunk-57SJ4LJF.cjs} +33 -3
- package/dist/chunk-5LC6KVL3.cjs +68 -0
- package/dist/{chunk-RBNCR5KB.js → chunk-A3EGFI6T.js} +31 -1
- package/dist/chunk-APCBIHLR.cjs +507 -0
- package/dist/chunk-BPBY7ON7.cjs +451 -0
- package/dist/chunk-EVXZGNPA.cjs +303 -0
- package/dist/chunk-EXX6ATAS.js +303 -0
- package/dist/chunk-GGW42MY4.js +20 -0
- package/dist/chunk-IBRVMLUF.js +668 -0
- package/dist/chunk-ISVUXVFL.js +471 -0
- package/dist/chunk-JL27KVRT.js +68 -0
- package/dist/chunk-JXLRHKCQ.js +143 -0
- package/dist/chunk-MC7SY2QH.cjs +20 -0
- package/dist/{chunk-RCP3SD26.js → chunk-N7C4UNUL.js} +2 -126
- package/dist/chunk-RMLFMRWL.js +102 -0
- package/dist/chunk-RRRGLRRP.cjs +28 -0
- package/dist/chunk-SGHP76GU.js +28 -0
- package/dist/{chunk-PBVPOX7D.js → chunk-TUJBDS5M.js} +30 -63
- package/dist/chunk-UBA6AEY6.cjs +102 -0
- package/dist/{chunk-NHPQQQ7P.cjs → chunk-UL263KGM.cjs} +56 -89
- package/dist/{chunk-B755PRVJ.cjs → chunk-UVO4GFSW.cjs} +3 -127
- package/dist/chunk-XHZBXYVU.js +62 -0
- package/dist/chunk-YRCUALUQ.js +451 -0
- package/dist/components/button/index.cjs +17 -0
- package/dist/components/button/index.d.cts +659 -0
- package/dist/components/button/index.d.ts +659 -0
- package/dist/components/button/index.js +17 -0
- package/dist/components/card/index.cjs +20 -0
- package/dist/components/card/index.d.cts +620 -0
- package/dist/components/card/index.d.ts +620 -0
- package/dist/components/card/index.js +20 -0
- package/dist/components/typography/index.cjs +14 -0
- package/dist/components/typography/index.d.cts +116 -0
- package/dist/components/typography/index.d.ts +116 -0
- package/dist/components/typography/index.js +14 -0
- package/dist/components/view/index.cjs +16 -0
- package/dist/components/view/index.d.cts +152 -0
- package/dist/components/view/index.d.ts +152 -0
- package/dist/components/view/index.js +16 -0
- package/dist/create-recipe-CC3NNCqF.d.ts +94 -0
- package/dist/create-recipe-CPBFg7ym.d.cts +94 -0
- package/dist/icon.type-BkcEPJbK.d.ts +73 -0
- package/dist/icon.type-Cs1tMX0W.d.cts +73 -0
- package/dist/index.cjs +167 -5
- package/dist/index.d.cts +79 -4
- package/dist/index.d.ts +79 -4
- package/dist/index.js +171 -9
- package/dist/pressable-feedback.type-DsvWZXWC.d.ts +127 -0
- package/dist/pressable-feedback.type-wfeiJz5m.d.cts +127 -0
- package/dist/style-props.type-B1BG5TCm.d.cts +31 -0
- package/dist/style-props.type-B1BG5TCm.d.ts +31 -0
- package/dist/system/index.cjs +66 -3
- package/dist/system/index.d.cts +301 -75
- package/dist/system/index.d.ts +301 -75
- package/dist/system/index.js +68 -5
- package/dist/theme/index.cjs +4 -3
- package/dist/theme/index.d.cts +27 -15
- package/dist/theme/index.d.ts +27 -15
- package/dist/theme/index.js +7 -6
- package/dist/{theme.type-B3ODSLbB.d.cts → theme.type-C2gNHpEx.d.cts} +8 -2
- package/dist/{theme.type-B3ODSLbB.d.ts → theme.type-C2gNHpEx.d.ts} +8 -2
- package/package.json +74 -18
|
@@ -0,0 +1,668 @@
|
|
|
1
|
+
import { Slot, createSlotContext, useStyleProps } from "./chunk-EXX6ATAS.js";
|
|
2
|
+
import { contrastOn, isHex, useXAUITheme } from "./chunk-A3EGFI6T.js";
|
|
3
|
+
|
|
4
|
+
// src/system/pressable-feedback/pressable-feedback-context.ts
|
|
5
|
+
import { createContext } from "react";
|
|
6
|
+
var [FeedbackProvider, useFeedback] = createSlotContext("PressableFeedback");
|
|
7
|
+
var DisableAllContext = createContext(false);
|
|
8
|
+
|
|
9
|
+
// src/system/pressable-feedback/pressable-feedback.animation.ts
|
|
10
|
+
var PRESS_SCALE = 0.985;
|
|
11
|
+
var PRESS_DURATION = 300;
|
|
12
|
+
var SCALE_REFERENCE_WIDTH = 300;
|
|
13
|
+
const _worklet_8662087220269_init_data = {
|
|
14
|
+
code: "function pressScaleFor_chunkIBRVMLUFJs1(width){const{SCALE_REFERENCE_WIDTH,PRESS_SCALE}=this.__closure;const coefficient=width>0?SCALE_REFERENCE_WIDTH/width:1;return 1-(1-PRESS_SCALE)*coefficient;}",
|
|
15
|
+
location: "/home/runner/work/xaui/xaui/packages/native/dist/chunk-IBRVMLUF.js",
|
|
16
|
+
sourceMap: "{\"version\":3,\"names\":[\"pressScaleFor_chunkIBRVMLUFJs1\",\"width\",\"SCALE_REFERENCE_WIDTH\",\"PRESS_SCALE\",\"__closure\",\"coefficient\"],\"sources\":[\"/home/runner/work/xaui/xaui/packages/native/dist/chunk-IBRVMLUF.js\"],\"mappings\":\"AAoBA,SAAAA,8BAA8BA,CAAAC,KAAA,QAAAC,qBAAA,CAAAC,WAAA,OAAAC,SAAA,CAE5B,KAAM,CAAAC,WAAW,CAAGJ,KAAK,CAAG,CAAC,CAAGC,qBAAqB,CAAGD,KAAK,CAAG,CAAC,CACjE,MAAO,EAAC,CAAG,CAAC,CAAC,CAAGE,WAAW,EAAIE,WAAW,CAC5C\",\"ignoreList\":[]}"
|
|
17
|
+
};
|
|
18
|
+
const pressScaleFor = function pressScaleFor_chunkIBRVMLUFJs1Factory({
|
|
19
|
+
_worklet_8662087220269_init_data,
|
|
20
|
+
SCALE_REFERENCE_WIDTH,
|
|
21
|
+
PRESS_SCALE
|
|
22
|
+
}) {
|
|
23
|
+
const _e = [new global.Error(), -3, -27];
|
|
24
|
+
const pressScaleFor = function (width) {
|
|
25
|
+
const coefficient = width > 0 ? SCALE_REFERENCE_WIDTH / width : 1;
|
|
26
|
+
return 1 - (1 - PRESS_SCALE) * coefficient;
|
|
27
|
+
};
|
|
28
|
+
pressScaleFor.__closure = {
|
|
29
|
+
SCALE_REFERENCE_WIDTH,
|
|
30
|
+
PRESS_SCALE
|
|
31
|
+
};
|
|
32
|
+
pressScaleFor.__workletHash = 8662087220269;
|
|
33
|
+
pressScaleFor.__pluginVersion = "0.7.4";
|
|
34
|
+
pressScaleFor.__initData = _worklet_8662087220269_init_data;
|
|
35
|
+
pressScaleFor.__stackDetails = _e;
|
|
36
|
+
return pressScaleFor;
|
|
37
|
+
}({
|
|
38
|
+
_worklet_8662087220269_init_data,
|
|
39
|
+
SCALE_REFERENCE_WIDTH,
|
|
40
|
+
PRESS_SCALE
|
|
41
|
+
});
|
|
42
|
+
var HIGHLIGHT_OPACITY = 0.1;
|
|
43
|
+
var HIGHLIGHT_DURATION = 200;
|
|
44
|
+
var RIPPLE_OPACITY = 0.1;
|
|
45
|
+
var RIPPLE_START_SCALE = 0.3;
|
|
46
|
+
var RIPPLE_EXPAND_DURATION = 1e3;
|
|
47
|
+
var RIPPLE_CONFIRM_DURATION = 225;
|
|
48
|
+
var RIPPLE_FADE_IN = 75;
|
|
49
|
+
var RIPPLE_FADE_OUT_DELAY = 225;
|
|
50
|
+
var RIPPLE_FADE_OUT = 150;
|
|
51
|
+
const _worklet_10132409620502_init_data = {
|
|
52
|
+
code: "function rippleRadiusFor_chunkIBRVMLUFJs2(width,height){return Math.sqrt(width*width+height*height)/2+5;}",
|
|
53
|
+
location: "/home/runner/work/xaui/xaui/packages/native/dist/chunk-IBRVMLUF.js",
|
|
54
|
+
sourceMap: "{\"version\":3,\"names\":[\"rippleRadiusFor_chunkIBRVMLUFJs2\",\"width\",\"height\",\"Math\",\"sqrt\"],\"sources\":[\"/home/runner/work/xaui/xaui/packages/native/dist/chunk-IBRVMLUF.js\"],\"mappings\":\"AAkCA,SAAAA,gCAAwCA,CAAAC,KAAA,CAAAC,MAAA,EAEtC,MAAO,CAAAC,IAAI,CAACC,IAAI,CAACH,KAAK,CAAGA,KAAK,CAAGC,MAAM,CAAGA,MAAM,CAAC,CAAG,CAAC,CAAG,CAAC,CAC3D\",\"ignoreList\":[]}"
|
|
55
|
+
};
|
|
56
|
+
const rippleRadiusFor = function rippleRadiusFor_chunkIBRVMLUFJs2Factory({
|
|
57
|
+
_worklet_10132409620502_init_data
|
|
58
|
+
}) {
|
|
59
|
+
const _e = [new global.Error(), 1, -27];
|
|
60
|
+
const rippleRadiusFor = function (width, height) {
|
|
61
|
+
return Math.sqrt(width * width + height * height) / 2 + 5;
|
|
62
|
+
};
|
|
63
|
+
rippleRadiusFor.__closure = {};
|
|
64
|
+
rippleRadiusFor.__workletHash = 10132409620502;
|
|
65
|
+
rippleRadiusFor.__pluginVersion = "0.7.4";
|
|
66
|
+
rippleRadiusFor.__initData = _worklet_10132409620502_init_data;
|
|
67
|
+
rippleRadiusFor.__stackDetails = _e;
|
|
68
|
+
return rippleRadiusFor;
|
|
69
|
+
}({
|
|
70
|
+
_worklet_10132409620502_init_data
|
|
71
|
+
});
|
|
72
|
+
var ALL_OFF = {
|
|
73
|
+
scale: false,
|
|
74
|
+
highlight: false,
|
|
75
|
+
ripple: false,
|
|
76
|
+
none: true
|
|
77
|
+
};
|
|
78
|
+
var ALL_ON = {
|
|
79
|
+
scale: true,
|
|
80
|
+
highlight: true,
|
|
81
|
+
ripple: true,
|
|
82
|
+
none: false
|
|
83
|
+
};
|
|
84
|
+
function resolveAnimation(animation, inheritedDisableAll = false) {
|
|
85
|
+
if (inheritedDisableAll) return {
|
|
86
|
+
...ALL_OFF,
|
|
87
|
+
disableAll: true
|
|
88
|
+
};
|
|
89
|
+
if (animation === false || animation === "disabled") {
|
|
90
|
+
return {
|
|
91
|
+
...ALL_OFF,
|
|
92
|
+
disableAll: false
|
|
93
|
+
};
|
|
94
|
+
}
|
|
95
|
+
if (animation === "disable-all") return {
|
|
96
|
+
...ALL_OFF,
|
|
97
|
+
disableAll: true
|
|
98
|
+
};
|
|
99
|
+
if (animation === void 0 || animation === true) {
|
|
100
|
+
return {
|
|
101
|
+
...ALL_ON,
|
|
102
|
+
disableAll: false
|
|
103
|
+
};
|
|
104
|
+
}
|
|
105
|
+
const scale = animation.scale ?? true;
|
|
106
|
+
const highlight = animation.highlight ?? true;
|
|
107
|
+
const ripple = animation.ripple ?? true;
|
|
108
|
+
return {
|
|
109
|
+
scale,
|
|
110
|
+
highlight,
|
|
111
|
+
ripple,
|
|
112
|
+
none: !scale && !highlight && !ripple,
|
|
113
|
+
disableAll: false
|
|
114
|
+
};
|
|
115
|
+
}
|
|
116
|
+
function resolveSlotAnimation(override, enabledByRoot, defaultOpacity, defaultDuration = PRESS_DURATION) {
|
|
117
|
+
const fallback = {
|
|
118
|
+
enabled: enabledByRoot,
|
|
119
|
+
duration: defaultDuration,
|
|
120
|
+
opacity: defaultOpacity
|
|
121
|
+
};
|
|
122
|
+
if (override === void 0 || override === true) return fallback;
|
|
123
|
+
if (override === false) return {
|
|
124
|
+
...fallback,
|
|
125
|
+
enabled: false
|
|
126
|
+
};
|
|
127
|
+
return {
|
|
128
|
+
enabled: enabledByRoot,
|
|
129
|
+
duration: override.duration ?? defaultDuration,
|
|
130
|
+
opacity: override.opacity ?? defaultOpacity
|
|
131
|
+
};
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
// src/system/pressable-feedback/pressable-feedback.overlay.ts
|
|
135
|
+
import { Children, Fragment, createElement, isValidElement } from "react";
|
|
136
|
+
var FEEDBACK_OVERLAY = /* @__PURE__ */Symbol.for("xaui.PressableFeedback.overlay");
|
|
137
|
+
function markOverlay(component) {
|
|
138
|
+
return Object.assign(component, {
|
|
139
|
+
[FEEDBACK_OVERLAY]: true
|
|
140
|
+
});
|
|
141
|
+
}
|
|
142
|
+
function isBareOverlay(node) {
|
|
143
|
+
if (!isValidElement(node)) return false;
|
|
144
|
+
const type = node.type;
|
|
145
|
+
if (typeof type !== "function" && typeof type !== "object") return false;
|
|
146
|
+
if (type === null) return false;
|
|
147
|
+
if (type[FEEDBACK_OVERLAY] !== true) return false;
|
|
148
|
+
return node.props.children === void 0;
|
|
149
|
+
}
|
|
150
|
+
function partitionOverlays(children) {
|
|
151
|
+
const all = Children.toArray(children);
|
|
152
|
+
const overlays = all.filter(isBareOverlay);
|
|
153
|
+
if (overlays.length === 0) return {
|
|
154
|
+
overlays: null,
|
|
155
|
+
content: children
|
|
156
|
+
};
|
|
157
|
+
return {
|
|
158
|
+
overlays,
|
|
159
|
+
content: all.filter(node => !isBareOverlay(node))
|
|
160
|
+
};
|
|
161
|
+
}
|
|
162
|
+
function feedbackChildren(children, asChild) {
|
|
163
|
+
if (asChild) return children;
|
|
164
|
+
const {
|
|
165
|
+
overlays,
|
|
166
|
+
content
|
|
167
|
+
} = partitionOverlays(children);
|
|
168
|
+
if (overlays === null) return content;
|
|
169
|
+
return createElement(Fragment, null, overlays, content);
|
|
170
|
+
}
|
|
171
|
+
|
|
172
|
+
// src/system/pressable-feedback/pressable-feedback.tsx
|
|
173
|
+
import { forwardRef, useContext, useEffect, useMemo, useRef } from "react";
|
|
174
|
+
import { Pressable, StyleSheet } from "react-native";
|
|
175
|
+
import Animated, { Easing, useAnimatedStyle, useDerivedValue, useSharedValue, withDelay, withTiming } from "react-native-reanimated";
|
|
176
|
+
|
|
177
|
+
// src/system/pressable-feedback/pressable-feedback.surface.ts
|
|
178
|
+
function inkFor(background, colors) {
|
|
179
|
+
if (typeof background !== "string" || !isHex(background)) return colors.foreground;
|
|
180
|
+
return contrastOn(background, colors.snow, colors.eclipse);
|
|
181
|
+
}
|
|
182
|
+
var RADIUS_KEYS = ["borderRadius", "borderStartStartRadius", "borderStartEndRadius", "borderEndStartRadius", "borderEndEndRadius"];
|
|
183
|
+
function radiusFrom(style) {
|
|
184
|
+
if (!style) return {};
|
|
185
|
+
const radius = {};
|
|
186
|
+
for (const key of RADIUS_KEYS) {
|
|
187
|
+
const value = style[key];
|
|
188
|
+
if (value !== void 0) radius[key] = value;
|
|
189
|
+
}
|
|
190
|
+
return radius;
|
|
191
|
+
}
|
|
192
|
+
|
|
193
|
+
// src/system/pressable-feedback/pressable-feedback.tsx
|
|
194
|
+
import { jsx } from "react/jsx-runtime";
|
|
195
|
+
var AnimatedPressable = Animated.createAnimatedComponent(Pressable);
|
|
196
|
+
var AnimatedSlot = Animated.createAnimatedComponent(Slot);
|
|
197
|
+
var PressableFeedback = forwardRef(function PressableFeedback2({
|
|
198
|
+
animation,
|
|
199
|
+
style,
|
|
200
|
+
...props
|
|
201
|
+
}, ref) {
|
|
202
|
+
const inheritedDisableAll = useContext(DisableAllContext);
|
|
203
|
+
const resolved = resolveAnimation(animation, inheritedDisableAll);
|
|
204
|
+
const [styleProps, rest] = useStyleProps(props);
|
|
205
|
+
const Feedback = resolved.none ? StaticFeedback : AnimatedFeedback;
|
|
206
|
+
const body = /* @__PURE__ */jsx(Feedback, {
|
|
207
|
+
ref,
|
|
208
|
+
animation: resolved,
|
|
209
|
+
style: [styleProps, style],
|
|
210
|
+
...rest
|
|
211
|
+
});
|
|
212
|
+
return resolved.disableAll ? /* @__PURE__ */jsx(DisableAllContext.Provider, {
|
|
213
|
+
value: true,
|
|
214
|
+
children: body
|
|
215
|
+
}) : body;
|
|
216
|
+
});
|
|
217
|
+
var StaticFeedback = forwardRef(function StaticFeedback2({
|
|
218
|
+
isPressed = false,
|
|
219
|
+
isDisabled,
|
|
220
|
+
asChild = false,
|
|
221
|
+
animation,
|
|
222
|
+
children,
|
|
223
|
+
style,
|
|
224
|
+
...rest
|
|
225
|
+
}, ref) {
|
|
226
|
+
const surface = useSurface(style);
|
|
227
|
+
const context = useMemo(() => ({
|
|
228
|
+
isPressed,
|
|
229
|
+
animation,
|
|
230
|
+
...surface
|
|
231
|
+
}), [isPressed, animation, surface]);
|
|
232
|
+
const Root = asChild ? Slot : Pressable;
|
|
233
|
+
return /* @__PURE__ */jsx(FeedbackProvider, {
|
|
234
|
+
value: context,
|
|
235
|
+
children: /* @__PURE__ */jsx(Root, {
|
|
236
|
+
ref,
|
|
237
|
+
style,
|
|
238
|
+
disabled: isDisabled,
|
|
239
|
+
...rest,
|
|
240
|
+
children: feedbackChildren(children, asChild)
|
|
241
|
+
})
|
|
242
|
+
});
|
|
243
|
+
});
|
|
244
|
+
const _worklet_255922780899_init_data = {
|
|
245
|
+
code: "function chunkIBRVMLUFJs3(){const{pressScaleFor,size}=this.__closure;return pressScaleFor(size.value.width);}",
|
|
246
|
+
location: "/home/runner/work/xaui/xaui/packages/native/dist/chunk-IBRVMLUF.js",
|
|
247
|
+
sourceMap: "{\"version\":3,\"names\":[\"chunkIBRVMLUFJs3\",\"pressScaleFor\",\"size\",\"__closure\",\"value\",\"width\"],\"sources\":[\"/home/runner/work/xaui/xaui/packages/native/dist/chunk-IBRVMLUF.js\"],\"mappings\":\"AAgNuC,SAAAA,iBAAA,QAAAC,aAAA,CAAAC,IAAA,OAAAC,SAAA,OAAM,CAAAF,aAAc,CAAAC,IAAK,CAAAE,KAAM,CAAAC,KAAK\",\"ignoreList\":[]}"
|
|
248
|
+
};
|
|
249
|
+
const _worklet_1871177836211_init_data = {
|
|
250
|
+
code: "function chunkIBRVMLUFJs4(){const{animation,pressedScale,progress}=this.__closure;if(!animation.scale)return{};return{transform:[{scale:1-(1-pressedScale.value)*progress.value}]};}",
|
|
251
|
+
location: "/home/runner/work/xaui/xaui/packages/native/dist/chunk-IBRVMLUF.js",
|
|
252
|
+
sourceMap: "{\"version\":3,\"names\":[\"chunkIBRVMLUFJs4\",\"animation\",\"pressedScale\",\"progress\",\"__closure\",\"scale\",\"transform\",\"value\"],\"sources\":[\"/home/runner/work/xaui/xaui/packages/native/dist/chunk-IBRVMLUF.js\"],\"mappings\":\"AAiNyC,SAAAA,gBAAMA,CAAA,QAAAC,SAAA,CAAAC,YAAA,CAAAC,QAAA,OAAAC,SAAA,CAE3C,GAAI,CAACH,SAAS,CAACI,KAAK,CAAE,MAAO,CAAC,CAAC,CAC/B,MAAO,CAAEC,SAAS,CAAE,CAAC,CAAED,KAAK,CAAE,CAAC,CAAG,CAAC,CAAC,CAAGH,YAAY,CAACK,KAAK,EAAIJ,QAAQ,CAACI,KAAM,CAAC,CAAE,CAAC,CAClF\",\"ignoreList\":[]}"
|
|
253
|
+
};
|
|
254
|
+
var AnimatedFeedback = forwardRef(function AnimatedFeedback2({
|
|
255
|
+
isPressed = false,
|
|
256
|
+
isDisabled,
|
|
257
|
+
asChild = false,
|
|
258
|
+
animation,
|
|
259
|
+
children,
|
|
260
|
+
style,
|
|
261
|
+
onLayout,
|
|
262
|
+
onTouchStart,
|
|
263
|
+
onTouchEnd,
|
|
264
|
+
onTouchCancel,
|
|
265
|
+
...rest
|
|
266
|
+
}, ref) {
|
|
267
|
+
const progress = useSharedValue(0);
|
|
268
|
+
const size = useSharedValue({
|
|
269
|
+
width: 0,
|
|
270
|
+
height: 0
|
|
271
|
+
});
|
|
272
|
+
const waves = [useWave(), useWave()];
|
|
273
|
+
const nextWave = useRef(0);
|
|
274
|
+
useEffect(() => {
|
|
275
|
+
progress.value = withTiming(isPressed ? 1 : 0, {
|
|
276
|
+
duration: PRESS_DURATION,
|
|
277
|
+
easing: Easing.out(Easing.ease)
|
|
278
|
+
});
|
|
279
|
+
}, [isPressed, progress]);
|
|
280
|
+
const pressedScale = useDerivedValue(function chunkIBRVMLUFJs3Factory({
|
|
281
|
+
_worklet_255922780899_init_data,
|
|
282
|
+
pressScaleFor,
|
|
283
|
+
size
|
|
284
|
+
}) {
|
|
285
|
+
const _e = [new global.Error(), -3, -27];
|
|
286
|
+
const chunkIBRVMLUFJs3 = () => pressScaleFor(size.value.width);
|
|
287
|
+
chunkIBRVMLUFJs3.__closure = {
|
|
288
|
+
pressScaleFor,
|
|
289
|
+
size
|
|
290
|
+
};
|
|
291
|
+
chunkIBRVMLUFJs3.__workletHash = 255922780899;
|
|
292
|
+
chunkIBRVMLUFJs3.__pluginVersion = "0.7.4";
|
|
293
|
+
chunkIBRVMLUFJs3.__initData = _worklet_255922780899_init_data;
|
|
294
|
+
chunkIBRVMLUFJs3.__stackDetails = _e;
|
|
295
|
+
return chunkIBRVMLUFJs3;
|
|
296
|
+
}({
|
|
297
|
+
_worklet_255922780899_init_data,
|
|
298
|
+
pressScaleFor,
|
|
299
|
+
size
|
|
300
|
+
}));
|
|
301
|
+
const animatedStyle = useAnimatedStyle(function chunkIBRVMLUFJs4Factory({
|
|
302
|
+
_worklet_1871177836211_init_data,
|
|
303
|
+
animation,
|
|
304
|
+
pressedScale,
|
|
305
|
+
progress
|
|
306
|
+
}) {
|
|
307
|
+
const _e = [new global.Error(), -4, -27];
|
|
308
|
+
const chunkIBRVMLUFJs4 = function () {
|
|
309
|
+
if (!animation.scale) return {};
|
|
310
|
+
return {
|
|
311
|
+
transform: [{
|
|
312
|
+
scale: 1 - (1 - pressedScale.value) * progress.value
|
|
313
|
+
}]
|
|
314
|
+
};
|
|
315
|
+
};
|
|
316
|
+
chunkIBRVMLUFJs4.__closure = {
|
|
317
|
+
animation,
|
|
318
|
+
pressedScale,
|
|
319
|
+
progress
|
|
320
|
+
};
|
|
321
|
+
chunkIBRVMLUFJs4.__workletHash = 1871177836211;
|
|
322
|
+
chunkIBRVMLUFJs4.__pluginVersion = "0.7.4";
|
|
323
|
+
chunkIBRVMLUFJs4.__initData = _worklet_1871177836211_init_data;
|
|
324
|
+
chunkIBRVMLUFJs4.__stackDetails = _e;
|
|
325
|
+
return chunkIBRVMLUFJs4;
|
|
326
|
+
}({
|
|
327
|
+
_worklet_1871177836211_init_data,
|
|
328
|
+
animation,
|
|
329
|
+
pressedScale,
|
|
330
|
+
progress
|
|
331
|
+
}), [animation.scale, progress, pressedScale]);
|
|
332
|
+
const surface = useSurface(style);
|
|
333
|
+
const context = useMemo(() => ({
|
|
334
|
+
isPressed,
|
|
335
|
+
animation,
|
|
336
|
+
progress,
|
|
337
|
+
size,
|
|
338
|
+
waves,
|
|
339
|
+
...surface
|
|
340
|
+
}), [isPressed, animation, progress, size, waves, surface]);
|
|
341
|
+
const handleTouchStart = event => {
|
|
342
|
+
const wave = waves[nextWave.current];
|
|
343
|
+
nextWave.current = nextWave.current === 0 ? 1 : 0;
|
|
344
|
+
const {
|
|
345
|
+
locationX,
|
|
346
|
+
locationY
|
|
347
|
+
} = event.nativeEvent;
|
|
348
|
+
wave.origin.value = {
|
|
349
|
+
x: locationX,
|
|
350
|
+
y: locationY
|
|
351
|
+
};
|
|
352
|
+
wave.expand.value = 0;
|
|
353
|
+
wave.expand.value = withTiming(1, {
|
|
354
|
+
duration: RIPPLE_EXPAND_DURATION,
|
|
355
|
+
easing: Easing.ease
|
|
356
|
+
});
|
|
357
|
+
wave.alpha.value = withTiming(1, {
|
|
358
|
+
duration: RIPPLE_FADE_IN
|
|
359
|
+
});
|
|
360
|
+
onTouchStart?.(event);
|
|
361
|
+
};
|
|
362
|
+
const releaseWave = () => {
|
|
363
|
+
const wave = waves[nextWave.current === 0 ? 1 : 0];
|
|
364
|
+
wave.expand.value = withTiming(1, {
|
|
365
|
+
duration: RIPPLE_CONFIRM_DURATION,
|
|
366
|
+
easing: Easing.ease
|
|
367
|
+
});
|
|
368
|
+
wave.alpha.value = withDelay(RIPPLE_FADE_OUT_DELAY, withTiming(0, {
|
|
369
|
+
duration: RIPPLE_FADE_OUT
|
|
370
|
+
}));
|
|
371
|
+
};
|
|
372
|
+
const handleTouchEnd = event => {
|
|
373
|
+
releaseWave();
|
|
374
|
+
onTouchEnd?.(event);
|
|
375
|
+
};
|
|
376
|
+
const handleTouchCancel = event => {
|
|
377
|
+
releaseWave();
|
|
378
|
+
onTouchCancel?.(event);
|
|
379
|
+
};
|
|
380
|
+
const handleLayout = event => {
|
|
381
|
+
const {
|
|
382
|
+
width,
|
|
383
|
+
height
|
|
384
|
+
} = event.nativeEvent.layout;
|
|
385
|
+
size.value = {
|
|
386
|
+
width,
|
|
387
|
+
height
|
|
388
|
+
};
|
|
389
|
+
onLayout?.(event);
|
|
390
|
+
};
|
|
391
|
+
const Root = asChild ? AnimatedSlot : AnimatedPressable;
|
|
392
|
+
return /* @__PURE__ */jsx(FeedbackProvider, {
|
|
393
|
+
value: context,
|
|
394
|
+
children: /* @__PURE__ */jsx(Root, {
|
|
395
|
+
ref,
|
|
396
|
+
style: [style, animatedStyle],
|
|
397
|
+
disabled: isDisabled,
|
|
398
|
+
onLayout: handleLayout,
|
|
399
|
+
onTouchStart: handleTouchStart,
|
|
400
|
+
onTouchEnd: handleTouchEnd,
|
|
401
|
+
onTouchCancel: handleTouchCancel,
|
|
402
|
+
...rest,
|
|
403
|
+
children: feedbackChildren(children, asChild)
|
|
404
|
+
})
|
|
405
|
+
});
|
|
406
|
+
});
|
|
407
|
+
PressableFeedback.displayName = "XAUI.PressableFeedback";
|
|
408
|
+
function useWave() {
|
|
409
|
+
return {
|
|
410
|
+
expand: useSharedValue(0),
|
|
411
|
+
alpha: useSharedValue(0),
|
|
412
|
+
origin: useSharedValue({
|
|
413
|
+
x: 0,
|
|
414
|
+
y: 0
|
|
415
|
+
})
|
|
416
|
+
};
|
|
417
|
+
}
|
|
418
|
+
function useSurface(style) {
|
|
419
|
+
const theme = useXAUITheme();
|
|
420
|
+
return useMemo(() => {
|
|
421
|
+
const flat = StyleSheet.flatten(style);
|
|
422
|
+
return {
|
|
423
|
+
ink: inkFor(flat?.backgroundColor, theme.colors),
|
|
424
|
+
corners: radiusFrom(flat)
|
|
425
|
+
};
|
|
426
|
+
}, [style, theme]);
|
|
427
|
+
}
|
|
428
|
+
|
|
429
|
+
// src/system/pressable-feedback/pressable-feedback-highlight.tsx
|
|
430
|
+
import { useEffect as useEffect2 } from "react";
|
|
431
|
+
import { StyleSheet as StyleSheet2, View as View2 } from "react-native";
|
|
432
|
+
import Animated2, { useAnimatedStyle as useAnimatedStyle2, useSharedValue as useSharedValue2, withTiming as withTiming2 } from "react-native-reanimated";
|
|
433
|
+
import { Fragment as Fragment2, jsx as jsx2, jsxs } from "react/jsx-runtime";
|
|
434
|
+
function PressableFeedbackHighlight({
|
|
435
|
+
style,
|
|
436
|
+
animation: override,
|
|
437
|
+
children,
|
|
438
|
+
...props
|
|
439
|
+
}) {
|
|
440
|
+
const {
|
|
441
|
+
isPressed,
|
|
442
|
+
animation,
|
|
443
|
+
progress,
|
|
444
|
+
ink,
|
|
445
|
+
corners
|
|
446
|
+
} = useFeedback();
|
|
447
|
+
const [styleProps] = useStyleProps(props);
|
|
448
|
+
const settings = resolveSlotAnimation(override, animation.highlight, HIGHLIGHT_OPACITY, HIGHLIGHT_DURATION);
|
|
449
|
+
const base = [StyleSheet2.absoluteFillObject, {
|
|
450
|
+
backgroundColor: ink,
|
|
451
|
+
pointerEvents: "none"
|
|
452
|
+
}, corners, styleProps, style];
|
|
453
|
+
if (!progress || !settings.enabled) {
|
|
454
|
+
return /* @__PURE__ */jsxs(Fragment2, {
|
|
455
|
+
children: [/* @__PURE__ */jsx2(View2, {
|
|
456
|
+
style: [base, {
|
|
457
|
+
opacity: isPressed ? settings.opacity : 0
|
|
458
|
+
}]
|
|
459
|
+
}), children]
|
|
460
|
+
});
|
|
461
|
+
}
|
|
462
|
+
return /* @__PURE__ */jsxs(Fragment2, {
|
|
463
|
+
children: [/* @__PURE__ */jsx2(AnimatedHighlight, {
|
|
464
|
+
base,
|
|
465
|
+
duration: settings.duration,
|
|
466
|
+
opacity: settings.opacity
|
|
467
|
+
}), children]
|
|
468
|
+
});
|
|
469
|
+
}
|
|
470
|
+
PressableFeedbackHighlight.displayName = "XAUI.PressableFeedback.Highlight";
|
|
471
|
+
markOverlay(PressableFeedbackHighlight);
|
|
472
|
+
const _worklet_9313686008259_init_data = {
|
|
473
|
+
code: "function chunkIBRVMLUFJs5(){const{shown,opacity}=this.__closure;return{opacity:shown.value*opacity};}",
|
|
474
|
+
location: "/home/runner/work/xaui/xaui/packages/native/dist/chunk-IBRVMLUF.js",
|
|
475
|
+
sourceMap: "{\"version\":3,\"names\":[\"chunkIBRVMLUFJs5\",\"shown\",\"opacity\",\"__closure\",\"value\"],\"sources\":[\"/home/runner/work/xaui/xaui/packages/native/dist/chunk-IBRVMLUF.js\"],\"mappings\":\"AA+V0C,SAAAA,gBAAMA,CAAA,QAAAC,KAAA,CAAAC,OAAA,OAAAC,SAAA,CAE5C,MAAO,CAAED,OAAO,CAAED,KAAK,CAACG,KAAK,CAAGF,OAAQ,CAAC,CAC3C\",\"ignoreList\":[]}"
|
|
476
|
+
};
|
|
477
|
+
function AnimatedHighlight({
|
|
478
|
+
base,
|
|
479
|
+
duration,
|
|
480
|
+
opacity
|
|
481
|
+
}) {
|
|
482
|
+
const {
|
|
483
|
+
isPressed
|
|
484
|
+
} = useFeedback();
|
|
485
|
+
const shown = useSharedValue2(0);
|
|
486
|
+
useEffect2(() => {
|
|
487
|
+
shown.value = withTiming2(isPressed ? 1 : 0, {
|
|
488
|
+
duration
|
|
489
|
+
});
|
|
490
|
+
}, [isPressed, shown, duration]);
|
|
491
|
+
const animatedStyle = useAnimatedStyle2(function chunkIBRVMLUFJs5Factory({
|
|
492
|
+
_worklet_9313686008259_init_data,
|
|
493
|
+
shown,
|
|
494
|
+
opacity
|
|
495
|
+
}) {
|
|
496
|
+
const _e = [new global.Error(), -3, -27];
|
|
497
|
+
const chunkIBRVMLUFJs5 = function () {
|
|
498
|
+
return {
|
|
499
|
+
opacity: shown.value * opacity
|
|
500
|
+
};
|
|
501
|
+
};
|
|
502
|
+
chunkIBRVMLUFJs5.__closure = {
|
|
503
|
+
shown,
|
|
504
|
+
opacity
|
|
505
|
+
};
|
|
506
|
+
chunkIBRVMLUFJs5.__workletHash = 9313686008259;
|
|
507
|
+
chunkIBRVMLUFJs5.__pluginVersion = "0.7.4";
|
|
508
|
+
chunkIBRVMLUFJs5.__initData = _worklet_9313686008259_init_data;
|
|
509
|
+
chunkIBRVMLUFJs5.__stackDetails = _e;
|
|
510
|
+
return chunkIBRVMLUFJs5;
|
|
511
|
+
}({
|
|
512
|
+
_worklet_9313686008259_init_data,
|
|
513
|
+
shown,
|
|
514
|
+
opacity
|
|
515
|
+
}), [shown, opacity]);
|
|
516
|
+
return /* @__PURE__ */jsx2(Animated2.View, {
|
|
517
|
+
style: [base, animatedStyle]
|
|
518
|
+
});
|
|
519
|
+
}
|
|
520
|
+
|
|
521
|
+
// src/system/pressable-feedback/pressable-feedback-ripple.tsx
|
|
522
|
+
import { useState } from "react";
|
|
523
|
+
import { StyleSheet as StyleSheet3, View as View3 } from "react-native";
|
|
524
|
+
import Animated3, { useAnimatedStyle as useAnimatedStyle3 } from "react-native-reanimated";
|
|
525
|
+
import { Fragment as Fragment3, jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
526
|
+
function PressableFeedbackRipple({
|
|
527
|
+
style,
|
|
528
|
+
animation: override,
|
|
529
|
+
children,
|
|
530
|
+
...props
|
|
531
|
+
}) {
|
|
532
|
+
const {
|
|
533
|
+
animation,
|
|
534
|
+
waves,
|
|
535
|
+
ink,
|
|
536
|
+
corners
|
|
537
|
+
} = useFeedback();
|
|
538
|
+
const [styleProps] = useStyleProps(props);
|
|
539
|
+
const waveStyle = [styleProps, style];
|
|
540
|
+
const settings = resolveSlotAnimation(override, animation.ripple, RIPPLE_OPACITY);
|
|
541
|
+
const [size, setSize] = useState({
|
|
542
|
+
width: 0,
|
|
543
|
+
height: 0
|
|
544
|
+
});
|
|
545
|
+
const handleLayout = event => {
|
|
546
|
+
const {
|
|
547
|
+
width,
|
|
548
|
+
height
|
|
549
|
+
} = event.nativeEvent.layout;
|
|
550
|
+
setSize(current => current.width === width && current.height === height ? current : {
|
|
551
|
+
width,
|
|
552
|
+
height
|
|
553
|
+
});
|
|
554
|
+
};
|
|
555
|
+
if (!waves || !settings.enabled) return /* @__PURE__ */jsx3(Fragment3, {
|
|
556
|
+
children
|
|
557
|
+
});
|
|
558
|
+
const radius = rippleRadiusFor(size.width, size.height);
|
|
559
|
+
return /* @__PURE__ */jsxs2(Fragment3, {
|
|
560
|
+
children: [/* @__PURE__ */jsx3(View3, {
|
|
561
|
+
style: [StyleSheet3.absoluteFill, styles.clip, corners],
|
|
562
|
+
onLayout: handleLayout,
|
|
563
|
+
children: waves.map((wave, index) => /* @__PURE__ */jsx3(RippleWave, {
|
|
564
|
+
wave,
|
|
565
|
+
radius,
|
|
566
|
+
center: {
|
|
567
|
+
x: size.width / 2,
|
|
568
|
+
y: size.height / 2
|
|
569
|
+
},
|
|
570
|
+
color: ink,
|
|
571
|
+
opacity: settings.opacity,
|
|
572
|
+
style: waveStyle
|
|
573
|
+
}, index))
|
|
574
|
+
}), children]
|
|
575
|
+
});
|
|
576
|
+
}
|
|
577
|
+
PressableFeedbackRipple.displayName = "XAUI.PressableFeedback.Ripple";
|
|
578
|
+
markOverlay(PressableFeedbackRipple);
|
|
579
|
+
const _worklet_4133379733260_init_data = {
|
|
580
|
+
code: "function chunkIBRVMLUFJs6(){const{wave,RIPPLE_START_SCALE,center,opacity,radius}=this.__closure;const t=wave.expand.value;const from=wave.origin.value;const scale=RIPPLE_START_SCALE+(1-RIPPLE_START_SCALE)*t;const x=from.x+(center.x-from.x)*t;const y=from.y+(center.y-from.y)*t;return{opacity:wave.alpha.value*opacity,transform:[{translateX:x-radius},{translateY:y-radius},{scale:scale}]};}",
|
|
581
|
+
location: "/home/runner/work/xaui/xaui/packages/native/dist/chunk-IBRVMLUF.js",
|
|
582
|
+
sourceMap: "{\"version\":3,\"names\":[\"chunkIBRVMLUFJs6\",\"wave\",\"RIPPLE_START_SCALE\",\"center\",\"opacity\",\"radius\",\"__closure\",\"t\",\"expand\",\"value\",\"from\",\"origin\",\"scale\",\"x\",\"y\",\"alpha\",\"transform\",\"translateX\",\"translateY\"],\"sources\":[\"/home/runner/work/xaui/xaui/packages/native/dist/chunk-IBRVMLUF.js\"],\"mappings\":\"AA+Z0C,SAAAA,gBAAMA,CAAA,QAAAC,IAAA,CAAAC,kBAAA,CAAAC,MAAA,CAAAC,OAAA,CAAAC,MAAA,OAAAC,SAAA,CAE5C,KAAM,CAAAC,CAAC,CAAGN,IAAI,CAACO,MAAM,CAACC,KAAK,CAC3B,KAAM,CAAAC,IAAI,CAAGT,IAAI,CAACU,MAAM,CAACF,KAAK,CAC9B,KAAM,CAAAG,KAAK,CAAGV,kBAAkB,CAAG,CAAC,CAAC,CAAGA,kBAAkB,EAAIK,CAAC,CAC/D,KAAM,CAAAM,CAAC,CAAGH,IAAI,CAACG,CAAC,CAAG,CAACV,MAAM,CAACU,CAAC,CAAGH,IAAI,CAACG,CAAC,EAAIN,CAAC,CAC1C,KAAM,CAAAO,CAAC,CAAGJ,IAAI,CAACI,CAAC,CAAG,CAACX,MAAM,CAACW,CAAC,CAAGJ,IAAI,CAACI,CAAC,EAAIP,CAAC,CAC1C,MAAO,CAELH,OAAO,CAAEH,IAAI,CAACc,KAAK,CAACN,KAAK,CAAGL,OAAO,CACnCY,SAAS,CAAE,CAAC,CAAEC,UAAU,CAAEJ,CAAC,CAAGR,MAAO,CAAC,CAAE,CAAEa,UAAU,CAAEJ,CAAC,CAAGT,MAAO,CAAC,CAAE,CAAEO,KAAA,CAAAA,KAAM,CAAC,CAC/E,CAAC,CACH\",\"ignoreList\":[]}"
|
|
583
|
+
};
|
|
584
|
+
function RippleWave({
|
|
585
|
+
wave,
|
|
586
|
+
radius,
|
|
587
|
+
center,
|
|
588
|
+
color,
|
|
589
|
+
opacity,
|
|
590
|
+
style
|
|
591
|
+
}) {
|
|
592
|
+
const animatedStyle = useAnimatedStyle3(function chunkIBRVMLUFJs6Factory({
|
|
593
|
+
_worklet_4133379733260_init_data,
|
|
594
|
+
wave,
|
|
595
|
+
RIPPLE_START_SCALE,
|
|
596
|
+
center,
|
|
597
|
+
opacity,
|
|
598
|
+
radius
|
|
599
|
+
}) {
|
|
600
|
+
const _e = [new global.Error(), -6, -27];
|
|
601
|
+
const chunkIBRVMLUFJs6 = function () {
|
|
602
|
+
const t = wave.expand.value;
|
|
603
|
+
const from = wave.origin.value;
|
|
604
|
+
const scale = RIPPLE_START_SCALE + (1 - RIPPLE_START_SCALE) * t;
|
|
605
|
+
const x = from.x + (center.x - from.x) * t;
|
|
606
|
+
const y = from.y + (center.y - from.y) * t;
|
|
607
|
+
return {
|
|
608
|
+
// Its own curve, not the expansion's: full ink in 75ms, held while the circle grows.
|
|
609
|
+
opacity: wave.alpha.value * opacity,
|
|
610
|
+
transform: [{
|
|
611
|
+
translateX: x - radius
|
|
612
|
+
}, {
|
|
613
|
+
translateY: y - radius
|
|
614
|
+
}, {
|
|
615
|
+
scale
|
|
616
|
+
}]
|
|
617
|
+
};
|
|
618
|
+
};
|
|
619
|
+
chunkIBRVMLUFJs6.__closure = {
|
|
620
|
+
wave,
|
|
621
|
+
RIPPLE_START_SCALE,
|
|
622
|
+
center,
|
|
623
|
+
opacity,
|
|
624
|
+
radius
|
|
625
|
+
};
|
|
626
|
+
chunkIBRVMLUFJs6.__workletHash = 4133379733260;
|
|
627
|
+
chunkIBRVMLUFJs6.__pluginVersion = "0.7.4";
|
|
628
|
+
chunkIBRVMLUFJs6.__initData = _worklet_4133379733260_init_data;
|
|
629
|
+
chunkIBRVMLUFJs6.__stackDetails = _e;
|
|
630
|
+
return chunkIBRVMLUFJs6;
|
|
631
|
+
}({
|
|
632
|
+
_worklet_4133379733260_init_data,
|
|
633
|
+
wave,
|
|
634
|
+
RIPPLE_START_SCALE,
|
|
635
|
+
center,
|
|
636
|
+
opacity,
|
|
637
|
+
radius
|
|
638
|
+
}), [wave, radius, center, opacity]);
|
|
639
|
+
return /* @__PURE__ */jsx3(Animated3.View, {
|
|
640
|
+
style: [styles.wave, {
|
|
641
|
+
backgroundColor: color,
|
|
642
|
+
width: radius * 2,
|
|
643
|
+
height: radius * 2,
|
|
644
|
+
borderRadius: radius
|
|
645
|
+
}, style, animatedStyle]
|
|
646
|
+
});
|
|
647
|
+
}
|
|
648
|
+
var styles = StyleSheet3.create({
|
|
649
|
+
// `pointerEvents` in the style rather than as a prop: the prop form is deprecated, and it
|
|
650
|
+
// is not decoration — a container that ate touches would claim every press meant for the
|
|
651
|
+
// control it covers.
|
|
652
|
+
clip: {
|
|
653
|
+
overflow: "hidden",
|
|
654
|
+
pointerEvents: "none"
|
|
655
|
+
},
|
|
656
|
+
wave: {
|
|
657
|
+
position: "absolute",
|
|
658
|
+
top: 0,
|
|
659
|
+
start: 0
|
|
660
|
+
}
|
|
661
|
+
});
|
|
662
|
+
|
|
663
|
+
// src/system/pressable-feedback/index.ts
|
|
664
|
+
var PressableFeedback3 = Object.assign(PressableFeedback, {
|
|
665
|
+
Highlight: PressableFeedbackHighlight,
|
|
666
|
+
Ripple: PressableFeedbackRipple
|
|
667
|
+
});
|
|
668
|
+
export { useFeedback, PRESS_SCALE, PRESS_DURATION, SCALE_REFERENCE_WIDTH, pressScaleFor, HIGHLIGHT_OPACITY, HIGHLIGHT_DURATION, RIPPLE_OPACITY, RIPPLE_START_SCALE, RIPPLE_EXPAND_DURATION, RIPPLE_CONFIRM_DURATION, RIPPLE_FADE_IN, RIPPLE_FADE_OUT_DELAY, RIPPLE_FADE_OUT, rippleRadiusFor, resolveAnimation, resolveSlotAnimation, FEEDBACK_OVERLAY, markOverlay, PressableFeedback3 as PressableFeedback };
|