@krizaka/ui 3.11.0 → 3.13.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/README.md +4 -3
- package/dist/avatar.d.ts +51 -2
- package/dist/avatar.js +91 -4
- package/dist/avatar.js.map +1 -1
- package/dist/chat.js +1 -1
- package/dist/chunk-2JFARUKC.js +83 -0
- package/dist/chunk-2JFARUKC.js.map +1 -0
- package/dist/{chunk-OT6HX3PN.js → chunk-COJ3IDE2.js} +5 -2
- package/dist/chunk-COJ3IDE2.js.map +1 -0
- package/dist/{chunk-HG65YAV4.js → chunk-GR5JNFGQ.js} +110 -32
- package/dist/chunk-GR5JNFGQ.js.map +1 -0
- package/dist/index.d.ts +12 -2
- package/dist/index.js +3 -1
- package/dist/map.js +30 -0
- package/dist/map.js.map +1 -1
- package/dist/match-dialog.js +1 -1
- package/dist/native/map.js +30 -0
- package/dist/native/map.js.map +1 -1
- package/dist/native.d.ts +42 -3
- package/dist/native.js +559 -448
- package/dist/native.js.map +1 -1
- package/dist/nav-bar.d.ts +1 -1
- package/dist/nav-bar.js +2 -2
- package/dist/showcase.js +1 -1
- package/dist/showcase.js.map +1 -1
- package/dist/site-footer.d.ts +1 -1
- package/dist/site-footer.js +7 -7
- package/dist/site-footer.js.map +1 -1
- package/dist/{sites-CgJrxejx.d.ts → sites-ClGou6ou.d.ts} +1 -1
- package/dist/sites.d.ts +2 -2
- package/dist/sites.js +3 -0
- package/dist/sites.js.map +1 -1
- package/dist/vertical-video.js +1 -1
- package/package.json +8 -7
- package/registry/avatar.json +122 -3
- package/registry/examples/avatar/default.d.ts +4 -0
- package/registry/examples/avatar/default.js +12 -0
- package/registry/examples/avatar/default.tsx +13 -0
- package/registry/index.json +5 -5
- package/registry/map.json +1 -1
- package/registry/nav-bar.json +10 -2
- package/registry/showcase.json +1 -1
- package/registry/site-footer.json +11 -3
- package/registry/sites.json +1 -1
- package/dist/chunk-CURW36FI.js +0 -47
- package/dist/chunk-CURW36FI.js.map +0 -1
- package/dist/chunk-HG65YAV4.js.map +0 -1
- package/dist/chunk-OT6HX3PN.js.map +0 -1
package/dist/native.js
CHANGED
|
@@ -1,3 +1,24 @@
|
|
|
1
|
+
// src/avatar/default-avatar.ts
|
|
2
|
+
var DEFAULT_AVATAR_TONES = 6;
|
|
3
|
+
var DEFAULT_AVATAR_BASE = "https://krizaka-assets.b-cdn.net/people/defaults/v1";
|
|
4
|
+
var clampTone = (tone3) => Math.min(DEFAULT_AVATAR_TONES, Math.max(1, Math.round(tone3)));
|
|
5
|
+
function defaultAvatarToneOf(seed) {
|
|
6
|
+
if (seed === void 0) return 1;
|
|
7
|
+
let h = 2166136261;
|
|
8
|
+
for (const ch of String(seed)) {
|
|
9
|
+
h ^= ch.codePointAt(0) ?? 0;
|
|
10
|
+
h = Math.imul(h, 16777619) >>> 0;
|
|
11
|
+
}
|
|
12
|
+
return h % DEFAULT_AVATAR_TONES + 1;
|
|
13
|
+
}
|
|
14
|
+
var resolveTone = (a) => a.tone === void 0 ? defaultAvatarToneOf(a.seed) : clampTone(a.tone);
|
|
15
|
+
function defaultAvatarFile(kind, tone3, size) {
|
|
16
|
+
return size === "svg" ? `${kind}-${tone3}.svg` : `${kind}-${tone3}-${size}.webp`;
|
|
17
|
+
}
|
|
18
|
+
function defaultAvatarUrl(avatar, { size = 256, base = DEFAULT_AVATAR_BASE } = {}) {
|
|
19
|
+
return `${base.replace(/\/+$/, "")}/${avatar.brand}/${defaultAvatarFile(avatar.kind ?? "person", resolveTone(avatar), size)}`;
|
|
20
|
+
}
|
|
21
|
+
|
|
1
22
|
// src/countdown/core.ts
|
|
2
23
|
import { useSyncExternalStore } from "react";
|
|
3
24
|
var listeners = /* @__PURE__ */ new Set();
|
|
@@ -324,6 +345,16 @@ var marks = /* @__PURE__ */ Object.freeze({
|
|
|
324
345
|
"100%",
|
|
325
346
|
"#5d894d"
|
|
326
347
|
]
|
|
348
|
+
],
|
|
349
|
+
"yomizaka": [
|
|
350
|
+
[
|
|
351
|
+
"0%",
|
|
352
|
+
"#5362c6"
|
|
353
|
+
],
|
|
354
|
+
[
|
|
355
|
+
"100%",
|
|
356
|
+
"#6d5ec9"
|
|
357
|
+
]
|
|
327
358
|
]
|
|
328
359
|
});
|
|
329
360
|
|
|
@@ -590,12 +621,14 @@ var SIDE = { xs: 20, sm: 32, md: 40, lg: 56, xl: 80 };
|
|
|
590
621
|
function isSvgUri(uri) {
|
|
591
622
|
return /^data:image\/svg\+xml[;,]/i.test(uri) || /\.svg(?:[?#]|$)/i.test(uri);
|
|
592
623
|
}
|
|
593
|
-
function AvatarRoot({ src, svg, alt = "", fallback, size = "md", presence, presenceLabel, ring, style, ...props }) {
|
|
624
|
+
function AvatarRoot({ src, svg, alt = "", fallback, fallbackSrc, defaultAvatar, size = "md", presence, presenceLabel, ring, style, ...props }) {
|
|
594
625
|
const { theme } = useTheme();
|
|
595
626
|
const gradient = useSvgId("kz-ring-");
|
|
596
|
-
const [
|
|
597
|
-
const
|
|
627
|
+
const [failedSrcs, setFailedSrcs] = React4.useState([]);
|
|
628
|
+
const failedSrc = { has: (uri) => Boolean(uri) && failedSrcs.includes(uri) };
|
|
598
629
|
const side = typeof size === "number" ? size : SIDE[size];
|
|
630
|
+
const backup = fallbackSrc ?? (defaultAvatar ? defaultAvatarUrl(defaultAvatar, { size: side > 40 ? 512 : 256 }) : void 0);
|
|
631
|
+
const shown = src && !failedSrc.has(src) ? src : backup && !failedSrc.has(backup) ? backup : null;
|
|
599
632
|
const initial = alt.trim().charAt(0).toUpperCase();
|
|
600
633
|
const content = fallback ?? initial;
|
|
601
634
|
const picture = /* @__PURE__ */ jsx5(
|
|
@@ -606,7 +639,7 @@ function AvatarRoot({ src, svg, alt = "", fallback, size = "md", presence, prese
|
|
|
606
639
|
"aria-label": alt && !presence && !ring ? alt : void 0,
|
|
607
640
|
...presence || ring ? {} : props,
|
|
608
641
|
style: [styles4.root, { width: side, height: side, borderRadius: side / 2, backgroundColor: theme.surface3 }, presence || ring ? null : style],
|
|
609
|
-
children:
|
|
642
|
+
children: shown && (svg && shown === src || isSvgUri(shown)) ? /* @__PURE__ */ jsx5(View3, { style: StyleSheet4.absoluteFill, pointerEvents: "none", children: /* @__PURE__ */ jsx5(SvgUri, { testID: props.testID ? `${props.testID}.svg` : void 0, uri: shown, width: "100%", height: "100%", preserveAspectRatio: "xMidYMid slice", onError: () => setFailedSrcs((all) => [...all, shown]) }) }) : shown ? /* @__PURE__ */ jsx5(Image, { testID: props.testID ? `${props.testID}.image` : void 0, source: { uri: shown }, onError: () => setFailedSrcs((all) => [...all, shown]), resizeMode: "cover", style: StyleSheet4.absoluteFill }) : typeof content === "string" ? /* @__PURE__ */ jsx5(Text2, { style: [styles4.initial, { color: theme.textSecondary, fontSize: Math.max(9, Math.round(side * 0.4)) }], children: content }) : content
|
|
610
643
|
}
|
|
611
644
|
);
|
|
612
645
|
if (!presence && !ring) return picture;
|
|
@@ -2791,8 +2824,8 @@ function KrizakaMark({ size = 48, animated = true, title, neutral }) {
|
|
|
2791
2824
|
|
|
2792
2825
|
// src/native/loader.tsx
|
|
2793
2826
|
import * as React22 from "react";
|
|
2794
|
-
import { AccessibilityInfo as AccessibilityInfo7, Animated as Animated11, Easing as Easing5, StyleSheet as StyleSheet24, View as
|
|
2795
|
-
import
|
|
2827
|
+
import { AccessibilityInfo as AccessibilityInfo7, Animated as Animated11, Easing as Easing5, StyleSheet as StyleSheet24, View as View27 } from "react-native";
|
|
2828
|
+
import Svg14, { Circle as Circle8, Path as Path12 } from "react-native-svg";
|
|
2796
2829
|
|
|
2797
2830
|
// src/native/OrazakaMark.tsx
|
|
2798
2831
|
import { View as View22 } from "react-native";
|
|
@@ -3029,10 +3062,85 @@ function YasakiaMark({ size = 48, animated = true, title, neutral }) {
|
|
|
3029
3062
|
}
|
|
3030
3063
|
var YazakiaMark = YasakiaMark;
|
|
3031
3064
|
|
|
3032
|
-
// src/native/
|
|
3065
|
+
// src/native/YomizakaMark.tsx
|
|
3033
3066
|
import { View as View25 } from "react-native";
|
|
3034
3067
|
import Svg12, { Circle as Circle6, Defs as Defs7, LinearGradient as LinearGradient7, Path as Path10, RadialGradient as RadialGradient5, Stop as Stop7 } from "react-native-svg";
|
|
3035
3068
|
|
|
3069
|
+
// src/marks/yomizaka-geometry.ts
|
|
3070
|
+
var indigo = marks.yomizaka[marks.yomizaka.length - 1][1];
|
|
3071
|
+
var YOMIZAKA = {
|
|
3072
|
+
viewBox: "0 0 400 400",
|
|
3073
|
+
croppedViewBox: "80 80 240 240",
|
|
3074
|
+
center: 200,
|
|
3075
|
+
/** The page, cut at its corner (the Krizaka chamfer) and around the lens. */
|
|
3076
|
+
page: "M128 92 H228 L264 128 V185.87 A52 52 0 1 0 264 278.13 V300 H128 Z",
|
|
3077
|
+
/** Three lines of text and the start of a fourth, in light: they wrap around the lens. */
|
|
3078
|
+
lines: "M156 140 H226 M156 170 H236 M156 200 H184 M156 230 H176",
|
|
3079
|
+
line: { color: "#f4f5ff", opacity: 0.6, width: 10 },
|
|
3080
|
+
/** The lens: a ring in the brand gradient, its pale core lit from above, a glint; the handle leaves the page. */
|
|
3081
|
+
lens: { cx: 240, cy: 232, r: 40, width: 12, core: 28, glint: { cx: 230, cy: 222, r: 8 } },
|
|
3082
|
+
handle: "M276 268 L304 296",
|
|
3083
|
+
handleWidth: 20,
|
|
3084
|
+
gradient: { x1: 128, y1: 300, x2: 304, y2: 92, stops: marks.yomizaka },
|
|
3085
|
+
/** The lens' core: a pale indigo light, brighter at the top. */
|
|
3086
|
+
coreGradient: { stops: [["0%", "#c9ceff"], ["100%", "#f4f5ff"]] },
|
|
3087
|
+
highlight: "#ffffff",
|
|
3088
|
+
/** The reading (web): a line of light that scans the page from top to bottom, clipped to the page. */
|
|
3089
|
+
scan: { d: "M136 100 H236", travel: 192, color: "#f4f5ff", opacity: 0.7, width: 3 },
|
|
3090
|
+
/** A page: one node on the orbit, that turns with it. */
|
|
3091
|
+
node: { r: 9, at: [200, 40] },
|
|
3092
|
+
glow: { color: indigo, opacity: 0.18 },
|
|
3093
|
+
/** The lens' breathing shadow (web), in the indigo. */
|
|
3094
|
+
pulse: { color: indigo, low: 0.3, high: 0.6 },
|
|
3095
|
+
orbit: { r: 160, dash: "8 8", width: 1.5 },
|
|
3096
|
+
ring: { r: 134, width: 1 }
|
|
3097
|
+
};
|
|
3098
|
+
|
|
3099
|
+
// src/native/YomizakaMark.tsx
|
|
3100
|
+
import { jsx as jsx29, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
3101
|
+
function YomizakaMark({ size = 48, animated = true, title, neutral }) {
|
|
3102
|
+
const { theme } = useTheme();
|
|
3103
|
+
const { Animated: Animated28, layer, spinStyle, pulseStyle } = useMarkMotion(size, animated, 32e3);
|
|
3104
|
+
const id = useSvgId("ymm");
|
|
3105
|
+
const viewBox = size < 48 ? YOMIZAKA.croppedViewBox : YOMIZAKA.viewBox;
|
|
3106
|
+
const stroke = neutral ?? theme.textMuted;
|
|
3107
|
+
const gradient = /* @__PURE__ */ jsx29(LinearGradient7, { id: `${id}a`, gradientUnits: "userSpaceOnUse", x1: YOMIZAKA.gradient.x1, y1: YOMIZAKA.gradient.y1, x2: YOMIZAKA.gradient.x2, y2: YOMIZAKA.gradient.y2, children: YOMIZAKA.gradient.stops.map(([offset, color]) => /* @__PURE__ */ jsx29(Stop7, { offset, stopColor: color }, offset)) });
|
|
3108
|
+
const fill = `url(#${id}a)`;
|
|
3109
|
+
return /* @__PURE__ */ jsxs26(View25, { style: { width: size, height: size }, ...markA11y(title), children: [
|
|
3110
|
+
/* @__PURE__ */ jsxs26(Svg12, { viewBox, style: layer, children: [
|
|
3111
|
+
/* @__PURE__ */ jsxs26(Defs7, { children: [
|
|
3112
|
+
/* @__PURE__ */ jsxs26(RadialGradient5, { id: `${id}g`, cx: "50%", cy: "50%", r: "50%", children: [
|
|
3113
|
+
/* @__PURE__ */ jsx29(Stop7, { offset: "0%", stopColor: YOMIZAKA.glow.color, stopOpacity: YOMIZAKA.glow.opacity }),
|
|
3114
|
+
/* @__PURE__ */ jsx29(Stop7, { offset: "100%", stopColor: YOMIZAKA.glow.color, stopOpacity: 0 })
|
|
3115
|
+
] }),
|
|
3116
|
+
gradient
|
|
3117
|
+
] }),
|
|
3118
|
+
size >= 48 ? /* @__PURE__ */ jsx29(Circle6, { cx: YOMIZAKA.center, cy: YOMIZAKA.center, r: 190, fill: `url(#${id}g)` }) : null,
|
|
3119
|
+
/* @__PURE__ */ jsx29(Circle6, { cx: YOMIZAKA.center, cy: YOMIZAKA.center, r: YOMIZAKA.ring.r, stroke, strokeWidth: YOMIZAKA.ring.width, opacity: 0.35, fill: "none" }),
|
|
3120
|
+
/* @__PURE__ */ jsx29(Path10, { d: YOMIZAKA.page, fill }),
|
|
3121
|
+
/* @__PURE__ */ jsx29(Path10, { d: YOMIZAKA.lines, stroke: YOMIZAKA.line.color, strokeOpacity: YOMIZAKA.line.opacity, strokeWidth: YOMIZAKA.line.width, strokeLinecap: "round", fill: "none" }),
|
|
3122
|
+
/* @__PURE__ */ jsx29(Path10, { d: YOMIZAKA.handle, stroke: fill, strokeWidth: YOMIZAKA.handleWidth, strokeLinecap: "round", fill: "none" })
|
|
3123
|
+
] }),
|
|
3124
|
+
/* @__PURE__ */ jsx29(Animated28.View, { style: [layer, spinStyle], children: /* @__PURE__ */ jsxs26(Svg12, { viewBox, style: layer, children: [
|
|
3125
|
+
/* @__PURE__ */ jsx29(Defs7, { children: gradient }),
|
|
3126
|
+
/* @__PURE__ */ jsx29(Circle6, { cx: YOMIZAKA.center, cy: YOMIZAKA.center, r: YOMIZAKA.orbit.r, stroke, strokeWidth: YOMIZAKA.orbit.width, strokeDasharray: YOMIZAKA.orbit.dash, opacity: 0.6, fill: "none" }),
|
|
3127
|
+
/* @__PURE__ */ jsx29(Circle6, { cx: YOMIZAKA.node.at[0], cy: YOMIZAKA.node.at[1], r: YOMIZAKA.node.r, fill })
|
|
3128
|
+
] }) }),
|
|
3129
|
+
/* @__PURE__ */ jsx29(Animated28.View, { style: [layer, pulseStyle], children: /* @__PURE__ */ jsxs26(Svg12, { viewBox, style: layer, children: [
|
|
3130
|
+
/* @__PURE__ */ jsxs26(Defs7, { children: [
|
|
3131
|
+
gradient,
|
|
3132
|
+
/* @__PURE__ */ jsx29(LinearGradient7, { id: `${id}c`, x1: "50%", y1: "100%", x2: "50%", y2: "0%", children: YOMIZAKA.coreGradient.stops.map(([offset, color]) => /* @__PURE__ */ jsx29(Stop7, { offset, stopColor: color }, offset)) })
|
|
3133
|
+
] }),
|
|
3134
|
+
/* @__PURE__ */ jsx29(Circle6, { cx: YOMIZAKA.lens.cx, cy: YOMIZAKA.lens.cy, r: YOMIZAKA.lens.r, stroke: fill, strokeWidth: YOMIZAKA.lens.width, fill: `url(#${id}c)` }),
|
|
3135
|
+
/* @__PURE__ */ jsx29(Circle6, { cx: YOMIZAKA.lens.glint.cx, cy: YOMIZAKA.lens.glint.cy, r: YOMIZAKA.lens.glint.r, fill: YOMIZAKA.highlight })
|
|
3136
|
+
] }) })
|
|
3137
|
+
] });
|
|
3138
|
+
}
|
|
3139
|
+
|
|
3140
|
+
// src/native/YororisMark.tsx
|
|
3141
|
+
import { View as View26 } from "react-native";
|
|
3142
|
+
import Svg13, { Circle as Circle7, Defs as Defs8, LinearGradient as LinearGradient8, Path as Path11, RadialGradient as RadialGradient6, Stop as Stop8 } from "react-native-svg";
|
|
3143
|
+
|
|
3036
3144
|
// src/marks/yororis-geometry.ts
|
|
3037
3145
|
var sand = marks.yororis[0][1];
|
|
3038
3146
|
var sage = marks.yororis[marks.yororis.length - 1][1];
|
|
@@ -3067,55 +3175,56 @@ var YORORIS = {
|
|
|
3067
3175
|
};
|
|
3068
3176
|
|
|
3069
3177
|
// src/native/YororisMark.tsx
|
|
3070
|
-
import { jsx as
|
|
3178
|
+
import { jsx as jsx30, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
3071
3179
|
function YororisMark({ size = 48, animated = true, title, neutral }) {
|
|
3072
3180
|
const { theme } = useTheme();
|
|
3073
3181
|
const { Animated: Animated28, layer, spinStyle, pulseStyle } = useMarkMotion(size, animated, 36e3);
|
|
3074
3182
|
const id = useSvgId("yrm");
|
|
3075
3183
|
const viewBox = size < 48 ? YORORIS.croppedViewBox : YORORIS.viewBox;
|
|
3076
3184
|
const stroke = neutral ?? theme.textMuted;
|
|
3077
|
-
const gradient = /* @__PURE__ */
|
|
3185
|
+
const gradient = /* @__PURE__ */ jsx30(LinearGradient8, { id: `${id}a`, gradientUnits: "userSpaceOnUse", x1: YORORIS.gradient.x1, y1: YORORIS.gradient.y1, x2: YORORIS.gradient.x2, y2: YORORIS.gradient.y2, children: YORORIS.gradient.stops.map(([offset, color]) => /* @__PURE__ */ jsx30(Stop8, { offset, stopColor: color }, offset)) });
|
|
3078
3186
|
const fill = `url(#${id}a)`;
|
|
3079
|
-
return /* @__PURE__ */
|
|
3080
|
-
/* @__PURE__ */
|
|
3081
|
-
/* @__PURE__ */
|
|
3082
|
-
/* @__PURE__ */
|
|
3083
|
-
/* @__PURE__ */
|
|
3084
|
-
/* @__PURE__ */
|
|
3187
|
+
return /* @__PURE__ */ jsxs27(View26, { style: { width: size, height: size }, ...markA11y(title), children: [
|
|
3188
|
+
/* @__PURE__ */ jsxs27(Svg13, { viewBox, style: layer, children: [
|
|
3189
|
+
/* @__PURE__ */ jsxs27(Defs8, { children: [
|
|
3190
|
+
/* @__PURE__ */ jsxs27(RadialGradient6, { id: `${id}g`, cx: "50%", cy: "50%", r: "50%", children: [
|
|
3191
|
+
/* @__PURE__ */ jsx30(Stop8, { offset: "0%", stopColor: YORORIS.glow.color, stopOpacity: YORORIS.glow.opacity }),
|
|
3192
|
+
/* @__PURE__ */ jsx30(Stop8, { offset: "100%", stopColor: YORORIS.glow.color, stopOpacity: 0 })
|
|
3085
3193
|
] }),
|
|
3086
3194
|
gradient
|
|
3087
3195
|
] }),
|
|
3088
|
-
size >= 48 ? /* @__PURE__ */
|
|
3089
|
-
/* @__PURE__ */
|
|
3090
|
-
/* @__PURE__ */
|
|
3091
|
-
YORORIS.leaves.map((d) => /* @__PURE__ */
|
|
3092
|
-
/* @__PURE__ */
|
|
3196
|
+
size >= 48 ? /* @__PURE__ */ jsx30(Circle7, { cx: YORORIS.center, cy: YORORIS.center, r: 190, fill: `url(#${id}g)` }) : null,
|
|
3197
|
+
/* @__PURE__ */ jsx30(Circle7, { cx: YORORIS.center, cy: YORORIS.center, r: YORORIS.ring.r, stroke, strokeWidth: YORORIS.ring.width, opacity: 0.35, fill: "none" }),
|
|
3198
|
+
/* @__PURE__ */ jsx30(Path11, { d: YORORIS.stem, stroke: fill, strokeWidth: YORORIS.stroke, strokeLinecap: "round", fill: "none" }),
|
|
3199
|
+
YORORIS.leaves.map((d) => /* @__PURE__ */ jsx30(Path11, { d, fill }, d)),
|
|
3200
|
+
/* @__PURE__ */ jsx30(Path11, { d: YORORIS.veins, stroke: YORORIS.vein.color, strokeOpacity: YORORIS.vein.opacity, strokeWidth: YORORIS.vein.width, strokeLinecap: "round", strokeDasharray: YORORIS.vein.dash, fill: "none" })
|
|
3093
3201
|
] }),
|
|
3094
|
-
/* @__PURE__ */
|
|
3095
|
-
/* @__PURE__ */
|
|
3096
|
-
/* @__PURE__ */
|
|
3097
|
-
/* @__PURE__ */
|
|
3202
|
+
/* @__PURE__ */ jsx30(Animated28.View, { style: [layer, spinStyle], children: /* @__PURE__ */ jsxs27(Svg13, { viewBox, style: layer, children: [
|
|
3203
|
+
/* @__PURE__ */ jsx30(Defs8, { children: gradient }),
|
|
3204
|
+
/* @__PURE__ */ jsx30(Circle7, { cx: YORORIS.center, cy: YORORIS.center, r: YORORIS.orbit.r, stroke, strokeWidth: YORORIS.orbit.width, strokeDasharray: YORORIS.orbit.dash, opacity: 0.6, fill: "none" }),
|
|
3205
|
+
/* @__PURE__ */ jsx30(Circle7, { cx: YORORIS.moment.at[0], cy: YORORIS.moment.at[1], r: YORORIS.moment.r, fill })
|
|
3098
3206
|
] }) }),
|
|
3099
|
-
/* @__PURE__ */
|
|
3100
|
-
/* @__PURE__ */
|
|
3101
|
-
/* @__PURE__ */
|
|
3102
|
-
/* @__PURE__ */
|
|
3207
|
+
/* @__PURE__ */ jsx30(Animated28.View, { style: [layer, pulseStyle], children: /* @__PURE__ */ jsxs27(Svg13, { viewBox, style: layer, children: [
|
|
3208
|
+
/* @__PURE__ */ jsx30(Defs8, { children: /* @__PURE__ */ jsx30(LinearGradient8, { id: `${id}c`, x1: "50%", y1: "100%", x2: "50%", y2: "0%", children: YORORIS.coreGradient.stops.map(([offset, color]) => /* @__PURE__ */ jsx30(Stop8, { offset, stopColor: color }, offset)) }) }),
|
|
3209
|
+
/* @__PURE__ */ jsx30(Circle7, { cx: YORORIS.core.cx, cy: YORORIS.core.cy, r: YORORIS.core.r, fill: `url(#${id}c)` }),
|
|
3210
|
+
/* @__PURE__ */ jsx30(Circle7, { cx: YORORIS.core.cx, cy: YORORIS.core.cy, r: YORORIS.core.inner, fill: YORORIS.highlight })
|
|
3103
3211
|
] }) })
|
|
3104
3212
|
] });
|
|
3105
3213
|
}
|
|
3106
3214
|
|
|
3107
3215
|
// src/native/ProductMark.tsx
|
|
3108
|
-
import { jsx as
|
|
3216
|
+
import { jsx as jsx31 } from "react/jsx-runtime";
|
|
3109
3217
|
function ProductMark({ id, ...props }) {
|
|
3110
|
-
if (id === "krizaka") return /* @__PURE__ */
|
|
3111
|
-
if (id === "orazaka") return /* @__PURE__ */
|
|
3112
|
-
if (id === "yasakia" || id === "yazakia") return /* @__PURE__ */
|
|
3113
|
-
if (id === "yororis") return /* @__PURE__ */
|
|
3114
|
-
return /* @__PURE__ */
|
|
3218
|
+
if (id === "krizaka") return /* @__PURE__ */ jsx31(KrizakaMark, { ...props });
|
|
3219
|
+
if (id === "orazaka") return /* @__PURE__ */ jsx31(OrazakaMark, { ...props });
|
|
3220
|
+
if (id === "yasakia" || id === "yazakia") return /* @__PURE__ */ jsx31(YasakiaMark, { ...props });
|
|
3221
|
+
if (id === "yororis") return /* @__PURE__ */ jsx31(YororisMark, { ...props });
|
|
3222
|
+
if (id === "yomizaka") return /* @__PURE__ */ jsx31(YomizakaMark, { ...props });
|
|
3223
|
+
return /* @__PURE__ */ jsx31(OrochiaMark, { ...props });
|
|
3115
3224
|
}
|
|
3116
3225
|
|
|
3117
3226
|
// src/native/loader.tsx
|
|
3118
|
-
import { jsx as
|
|
3227
|
+
import { jsx as jsx32, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
3119
3228
|
var HEX = "M12 3 19.79 7.5 19.79 16.5 12 21 4.21 16.5 4.21 7.5Z";
|
|
3120
3229
|
var PERIMETER = 54;
|
|
3121
3230
|
function LoaderGlyph({ state = "loading", value, size = 20, color }) {
|
|
@@ -3132,12 +3241,12 @@ function LoaderGlyph({ state = "loading", value, size = 20, color }) {
|
|
|
3132
3241
|
const stroke = color ?? (state === "success" ? theme.success : state === "error" ? theme.danger : theme.accent);
|
|
3133
3242
|
const fill = state !== "loading" ? 1 : known ? Math.min(1, Math.max(0, value)) : 0.3;
|
|
3134
3243
|
const rotate = spin.interpolate({ inputRange: [0, 1], outputRange: ["0deg", "360deg"] });
|
|
3135
|
-
return /* @__PURE__ */
|
|
3136
|
-
/* @__PURE__ */
|
|
3137
|
-
/* @__PURE__ */
|
|
3138
|
-
state === "loading" ? /* @__PURE__ */
|
|
3139
|
-
state === "success" ? /* @__PURE__ */
|
|
3140
|
-
state === "error" ? /* @__PURE__ */
|
|
3244
|
+
return /* @__PURE__ */ jsx32(Animated11.View, { "aria-hidden": true, style: { width: size, height: size, transform: state === "loading" && !known ? [{ rotate }] : [] }, children: /* @__PURE__ */ jsxs28(Svg14, { width: size, height: size, viewBox: "0 0 24 24", fill: "none", children: [
|
|
3245
|
+
/* @__PURE__ */ jsx32(Path12, { d: HEX, stroke, strokeOpacity: 0.22, strokeWidth: 2.2, strokeLinejoin: "round" }),
|
|
3246
|
+
/* @__PURE__ */ jsx32(Path12, { d: HEX, stroke, strokeWidth: 2.2, strokeLinejoin: "round", strokeLinecap: "round", strokeDasharray: `${fill * PERIMETER} ${PERIMETER}` }),
|
|
3247
|
+
state === "loading" ? /* @__PURE__ */ jsx32(Circle8, { cx: 12, cy: 12, r: 2.6, fill: stroke }) : null,
|
|
3248
|
+
state === "success" ? /* @__PURE__ */ jsx32(Path12, { d: "M8.3 12.3l2.6 2.6 4.9-5.3", stroke, strokeWidth: 2.2, strokeLinecap: "round", strokeLinejoin: "round" }) : null,
|
|
3249
|
+
state === "error" ? /* @__PURE__ */ jsx32(Path12, { d: "M9.4 9.4l5.2 5.2M14.6 9.4l-5.2 5.2", stroke, strokeWidth: 2.2, strokeLinecap: "round" }) : null
|
|
3141
3250
|
] }) });
|
|
3142
3251
|
}
|
|
3143
3252
|
function useDelayedWait(active, delay = 250, minDuration = 600) {
|
|
@@ -3189,17 +3298,17 @@ function Loader({ label, status = "loading", successLabel, errorLabel, value, et
|
|
|
3189
3298
|
const known = phase === "loading" && typeof value === "number" && Number.isFinite(value);
|
|
3190
3299
|
const detail = phase === "loading" ? [known ? `${Math.round(Math.min(1, Math.max(0, value)) * 100)} %` : null, eta].filter(Boolean).join(" \xB7 ") : "";
|
|
3191
3300
|
const stacked = variant !== "inline";
|
|
3192
|
-
const box = /* @__PURE__ */
|
|
3193
|
-
product && phase === "loading" ? /* @__PURE__ */
|
|
3194
|
-
/* @__PURE__ */
|
|
3195
|
-
/* @__PURE__ */
|
|
3196
|
-
detail ? /* @__PURE__ */
|
|
3301
|
+
const box = /* @__PURE__ */ jsxs28(View27, { style: [stacked ? styles24.stacked : styles24.inline, variant === "overlay" ? { backgroundColor: alpha(theme.surface1, 0.92), borderColor: theme.borderDefault, borderRadius: radius3.lg, ...styles24.card } : null], children: [
|
|
3302
|
+
product && phase === "loading" ? /* @__PURE__ */ jsx32(ProductMark, { id: product, size: GLYPH[variant], animated: true }) : /* @__PURE__ */ jsx32(LoaderGlyph, { state: phase, value: known ? value : null, size: GLYPH[variant] }),
|
|
3303
|
+
/* @__PURE__ */ jsxs28(View27, { style: stacked ? styles24.center : styles24.text, children: [
|
|
3304
|
+
/* @__PURE__ */ jsx32(Txt, { variant: variant === "page" ? "title" : "label", style: stacked ? styles24.centered : null, children: words2 }),
|
|
3305
|
+
detail ? /* @__PURE__ */ jsx32(Txt, { variant: "caption", tone: "secondary", style: stacked ? styles24.centered : null, children: detail }) : null
|
|
3197
3306
|
] })
|
|
3198
3307
|
] });
|
|
3199
3308
|
const a11y = { accessible: true, role: "progressbar", "aria-label": words2, "aria-busy": phase === "loading", accessibilityLiveRegion: "polite" };
|
|
3200
3309
|
if (variant === "overlay" || variant === "page")
|
|
3201
|
-
return /* @__PURE__ */
|
|
3202
|
-
return /* @__PURE__ */
|
|
3310
|
+
return /* @__PURE__ */ jsx32(View27, { ...a11y, style: [StyleSheet24.absoluteFill, styles24.cover, variant === "page" ? { backgroundColor: alpha(theme.surface0, 0.86) } : null, style], children: box });
|
|
3311
|
+
return /* @__PURE__ */ jsx32(View27, { ...a11y, style: [variant === "block" ? styles24.block : null, style], children: box });
|
|
3203
3312
|
}
|
|
3204
3313
|
var styles24 = StyleSheet24.create({
|
|
3205
3314
|
inline: { flexDirection: "row", alignItems: "center", gap: 10 },
|
|
@@ -3214,12 +3323,12 @@ var styles24 = StyleSheet24.create({
|
|
|
3214
3323
|
|
|
3215
3324
|
// src/native/mascot-state.tsx
|
|
3216
3325
|
import * as React24 from "react";
|
|
3217
|
-
import { AccessibilityInfo as AccessibilityInfo9, Animated as Animated13, Easing as Easing7, StyleSheet as StyleSheet25, View as
|
|
3326
|
+
import { AccessibilityInfo as AccessibilityInfo9, Animated as Animated13, Easing as Easing7, StyleSheet as StyleSheet25, View as View29 } from "react-native";
|
|
3218
3327
|
|
|
3219
3328
|
// src/native/mascots.tsx
|
|
3220
3329
|
import { useEffect as useEffect14, useState as useState22 } from "react";
|
|
3221
|
-
import { AccessibilityInfo as AccessibilityInfo8, Animated as Animated12, Easing as Easing6, View as
|
|
3222
|
-
import
|
|
3330
|
+
import { AccessibilityInfo as AccessibilityInfo8, Animated as Animated12, Easing as Easing6, View as View28 } from "react-native";
|
|
3331
|
+
import Svg15, { Circle as Circle9, Defs as Defs9, Ellipse as Ellipse2, G, LinearGradient as LinearGradient9, Path as Path13, Rect as Rect2, Stop as Stop9 } from "react-native-svg";
|
|
3223
3332
|
|
|
3224
3333
|
// src/mascots/geometry.ts
|
|
3225
3334
|
var mirror = (d) => d.replace(/(-?\d+(?:\.\d+)?) (-?\d+(?:\.\d+)?)/g, (_, x, y) => `${120 - Number(x)} ${y}`);
|
|
@@ -3377,7 +3486,7 @@ var SHADE = "#000000";
|
|
|
3377
3486
|
var PARCEL = ["#f59e0b", "#d97706", "#b45309"];
|
|
3378
3487
|
|
|
3379
3488
|
// src/native/mascots.tsx
|
|
3380
|
-
import { jsx as
|
|
3489
|
+
import { jsx as jsx33, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
3381
3490
|
function useBob(animated) {
|
|
3382
3491
|
const [y] = useState22(() => new Animated12.Value(0));
|
|
3383
3492
|
useEffect14(() => {
|
|
@@ -3411,52 +3520,52 @@ function Mascot({ bird = "owl", mood = "welcome", tone: tone3 = "brand", size =
|
|
|
3411
3520
|
const look3 = mood === "thinking" ? 1.4 : 0;
|
|
3412
3521
|
const rot = (deg, [x, y]) => `rotate(${deg} ${x} ${y})`;
|
|
3413
3522
|
const [wl, wr] = g.wings;
|
|
3414
|
-
return /* @__PURE__ */
|
|
3415
|
-
/* @__PURE__ */
|
|
3416
|
-
/* @__PURE__ */
|
|
3417
|
-
/* @__PURE__ */
|
|
3523
|
+
return /* @__PURE__ */ jsx33(View28, { style: [{ width: size, height: size }, style], ...markA11y(title), children: /* @__PURE__ */ jsx33(Animated12.View, { style: { transform: [{ translateY: bob }] }, children: /* @__PURE__ */ jsxs29(Svg15, { width: size, height: size, viewBox: "0 0 120 120", children: [
|
|
3524
|
+
/* @__PURE__ */ jsx33(Defs9, { children: /* @__PURE__ */ jsxs29(LinearGradient9, { id, x1: "0", y1: "0", x2: "0", y2: "1", children: [
|
|
3525
|
+
/* @__PURE__ */ jsx33(Stop9, { offset: "0%", stopColor: p.from }),
|
|
3526
|
+
/* @__PURE__ */ jsx33(Stop9, { offset: "100%", stopColor: p.to })
|
|
3418
3527
|
] }) }),
|
|
3419
|
-
/* @__PURE__ */
|
|
3420
|
-
mood === "empty" && /* @__PURE__ */
|
|
3421
|
-
g.legs.map((d) => /* @__PURE__ */
|
|
3422
|
-
g.back?.map((d) => d.endsWith("Z") ? /* @__PURE__ */
|
|
3423
|
-
g.parcel?.map((d, i) => /* @__PURE__ */
|
|
3424
|
-
/* @__PURE__ */
|
|
3425
|
-
/* @__PURE__ */
|
|
3528
|
+
/* @__PURE__ */ jsx33(Ellipse2, { cx: g.shadow[0], cy: g.shadow[1], rx: g.shadow[2], ry: g.shadow[3], fill: SHADE, opacity: 0.14 }),
|
|
3529
|
+
mood === "empty" && /* @__PURE__ */ jsx33(Path13, { d: MOOD_PARTS.tray, stroke: outline, strokeWidth: 1.6, strokeDasharray: "3 3", fill: "none" }),
|
|
3530
|
+
g.legs.map((d) => /* @__PURE__ */ jsx33(Path13, { d, stroke: p.beak, strokeWidth: 2.6, strokeLinecap: "round", fill: "none" }, d)),
|
|
3531
|
+
g.back?.map((d) => d.endsWith("Z") ? /* @__PURE__ */ jsx33(Path13, { d, fill: p.detail, ...line }, d) : /* @__PURE__ */ jsx33(Path13, { d, stroke: outline, strokeWidth: 1.4, fill: "none" }, d)),
|
|
3532
|
+
g.parcel?.map((d, i) => /* @__PURE__ */ jsx33(Path13, { d, fill: PARCEL[i], ...line }, d)),
|
|
3533
|
+
/* @__PURE__ */ jsx33(Path13, { d: g.body, fill: body, ...line }),
|
|
3534
|
+
/* @__PURE__ */ jsx33(Path13, { d: g.belly, fill: LIGHT, opacity: 0.28 }),
|
|
3426
3535
|
[wl, wr].map((w, i) => {
|
|
3427
3536
|
const turn = mood === "success" ? i === 0 ? 28 : -28 : mood === "welcome" && i === 1 ? -20 : 0;
|
|
3428
|
-
return /* @__PURE__ */
|
|
3429
|
-
/* @__PURE__ */
|
|
3430
|
-
/* @__PURE__ */
|
|
3537
|
+
return /* @__PURE__ */ jsxs29(G, { transform: turn ? rot(turn, w.pivot) : void 0, children: [
|
|
3538
|
+
/* @__PURE__ */ jsx33(Path13, { d: w.d, fill: p.wing, ...line }),
|
|
3539
|
+
/* @__PURE__ */ jsx33(Path13, { d: w.d, fill: SHADE, opacity: 0.16 })
|
|
3431
3540
|
] }, i);
|
|
3432
3541
|
}),
|
|
3433
|
-
g.neck && /* @__PURE__ */
|
|
3434
|
-
g.head.r > 0 && /* @__PURE__ */
|
|
3435
|
-
g.details.map((d) => /* @__PURE__ */
|
|
3436
|
-
g.visor && /* @__PURE__ */
|
|
3542
|
+
g.neck && /* @__PURE__ */ jsx33(Path13, { d: g.neck.d, stroke: body, strokeWidth: g.neck.width, strokeLinecap: "round", fill: "none" }),
|
|
3543
|
+
g.head.r > 0 && /* @__PURE__ */ jsx33(Circle9, { cx: g.head.cx, cy: g.head.cy, r: g.head.r, fill: body, ...line }),
|
|
3544
|
+
g.details.map((d) => /* @__PURE__ */ jsx33(Path13, { d, fill: p.detail, ...line }, d)),
|
|
3545
|
+
g.visor && /* @__PURE__ */ jsx33(Rect2, { x: g.visor.x, y: g.visor.y, width: g.visor.w, height: g.visor.h, rx: 4, fill: theme.surface0, ...line }),
|
|
3437
3546
|
g.eyes.at.map(
|
|
3438
|
-
(at, i) => mood === "empty" && g.eyes.white > 0 ? /* @__PURE__ */
|
|
3439
|
-
/* @__PURE__ */
|
|
3440
|
-
/* @__PURE__ */
|
|
3441
|
-
/* @__PURE__ */
|
|
3442
|
-
] }, i) : mood === "success" || mood === "empty" ? /* @__PURE__ */
|
|
3443
|
-
g.eyes.white > 0 && /* @__PURE__ */
|
|
3444
|
-
/* @__PURE__ */
|
|
3547
|
+
(at, i) => mood === "empty" && g.eyes.white > 0 ? /* @__PURE__ */ jsxs29(G, { children: [
|
|
3548
|
+
/* @__PURE__ */ jsx33(Circle9, { cx: at[0], cy: at[1], r: g.eyes.white, fill: LIGHT, ...line }),
|
|
3549
|
+
/* @__PURE__ */ jsx33(Circle9, { cx: at[0], cy: at[1] + g.eyes.pupil * 0.7, r: g.eyes.pupil, fill: SHADE }),
|
|
3550
|
+
/* @__PURE__ */ jsx33(Path13, { d: upperLid(at, g.eyes.white), fill: p.detail, ...line })
|
|
3551
|
+
] }, i) : mood === "success" || mood === "empty" ? /* @__PURE__ */ jsx33(Path13, { d: mood === "success" ? archEye(at, eyeR * 0.85) : lidEye(at, eyeR * 0.8), stroke: g.visor ? p.eye : outline, strokeWidth: 2.2, strokeLinecap: "round", fill: "none" }, i) : /* @__PURE__ */ jsxs29(G, { children: [
|
|
3552
|
+
g.eyes.white > 0 && /* @__PURE__ */ jsx33(Circle9, { cx: at[0], cy: at[1], r: g.eyes.white, fill: LIGHT, ...line }),
|
|
3553
|
+
/* @__PURE__ */ jsx33(Circle9, { cx: at[0] + look3, cy: at[1] - look3, r: g.eyes.pupil, fill: g.visor ? p.eye : SHADE })
|
|
3445
3554
|
] }, i)
|
|
3446
3555
|
),
|
|
3447
|
-
g.glasses && g.eyes.at.map(([x, y]) => /* @__PURE__ */
|
|
3448
|
-
mood === "error" && g.eyes.at.map((at, i) => /* @__PURE__ */
|
|
3449
|
-
/* @__PURE__ */
|
|
3450
|
-
mood === "thinking" && MOOD_PARTS.dots.map(([cx, cy, r], i) => /* @__PURE__ */
|
|
3451
|
-
(mood === "success" || mood === "error") && /* @__PURE__ */
|
|
3452
|
-
mood === "success" && /* @__PURE__ */
|
|
3453
|
-
mood === "error" && /* @__PURE__ */
|
|
3454
|
-
mood === "error" && /* @__PURE__ */
|
|
3556
|
+
g.glasses && g.eyes.at.map(([x, y]) => /* @__PURE__ */ jsx33(Circle9, { cx: x, cy: y, r: 6.5, fill: "none", stroke: outline, strokeWidth: 1.3 }, x)),
|
|
3557
|
+
mood === "error" && g.eyes.at.map((at, i) => /* @__PURE__ */ jsx33(Path13, { d: brow(at, eyeR, g.eyes.at.length === 1 ? 1 : i === 0 ? -1 : 1), stroke: outline, strokeWidth: 2, strokeLinecap: "round" }, i)),
|
|
3558
|
+
/* @__PURE__ */ jsx33(Path13, { d: g.beak, fill: p.beak, ...line }),
|
|
3559
|
+
mood === "thinking" && MOOD_PARTS.dots.map(([cx, cy, r], i) => /* @__PURE__ */ jsx33(Circle9, { cx, cy, r, fill: theme.textSecondary, opacity: 0.5 + i * 0.25 }, cx)),
|
|
3560
|
+
(mood === "success" || mood === "error") && /* @__PURE__ */ jsx33(Circle9, { cx: MOOD_PARTS.badge.cx, cy: MOOD_PARTS.badge.cy, r: MOOD_PARTS.badge.r, fill: mood === "success" ? theme.success : theme.danger }),
|
|
3561
|
+
mood === "success" && /* @__PURE__ */ jsx33(Path13, { d: MOOD_PARTS.check, stroke: theme.surface0, strokeWidth: 2.6, strokeLinecap: "round", strokeLinejoin: "round", fill: "none" }),
|
|
3562
|
+
mood === "error" && /* @__PURE__ */ jsx33(Path13, { d: MOOD_PARTS.bang.line, stroke: theme.surface0, strokeWidth: 2.8, strokeLinecap: "round" }),
|
|
3563
|
+
mood === "error" && /* @__PURE__ */ jsx33(Circle9, { cx: MOOD_PARTS.bang.dot[0], cy: MOOD_PARTS.bang.dot[1], r: 1.6, fill: theme.surface0 })
|
|
3455
3564
|
] }) }) });
|
|
3456
3565
|
}
|
|
3457
3566
|
|
|
3458
3567
|
// src/native/mascot-state.tsx
|
|
3459
|
-
import { jsx as
|
|
3568
|
+
import { jsx as jsx34, jsxs as jsxs30 } from "react/jsx-runtime";
|
|
3460
3569
|
var SIZE = { sm: 64, md: 96, lg: 128 };
|
|
3461
3570
|
function useArrival(animated) {
|
|
3462
3571
|
const [value] = React24.useState(() => new Animated13.Value(animated ? 0 : 1));
|
|
@@ -3477,7 +3586,7 @@ function useArrival(animated) {
|
|
|
3477
3586
|
function MascotState({ bird = "owl", mood = "empty", title, description, action, size = "md", layout = "stacked", tone: tone3, animated = true, style, ...props }) {
|
|
3478
3587
|
const opacity = useArrival(animated);
|
|
3479
3588
|
const inline = layout === "inline";
|
|
3480
|
-
return /* @__PURE__ */
|
|
3589
|
+
return /* @__PURE__ */ jsxs30(
|
|
3481
3590
|
Animated13.View,
|
|
3482
3591
|
{
|
|
3483
3592
|
role: mood === "error" ? "alert" : "status",
|
|
@@ -3486,20 +3595,20 @@ function MascotState({ bird = "owl", mood = "empty", title, description, action,
|
|
|
3486
3595
|
...props,
|
|
3487
3596
|
style: [inline ? styles25.inline : styles25.stacked, { opacity, transform: [{ translateY: opacity.interpolate({ inputRange: [0, 1], outputRange: [6, 0] }) }] }, style],
|
|
3488
3597
|
children: [
|
|
3489
|
-
/* @__PURE__ */
|
|
3490
|
-
/* @__PURE__ */
|
|
3491
|
-
/* @__PURE__ */
|
|
3492
|
-
description ? /* @__PURE__ */
|
|
3493
|
-
action ? /* @__PURE__ */
|
|
3598
|
+
/* @__PURE__ */ jsx34(Mascot, { bird, mood, tone: tone3, size: SIZE[size], animated }),
|
|
3599
|
+
/* @__PURE__ */ jsxs30(View29, { style: inline ? styles25.wordsInline : styles25.words, children: [
|
|
3600
|
+
/* @__PURE__ */ jsx34(Txt, { variant: "label", role: "heading", style: inline ? null : styles25.center, children: title }),
|
|
3601
|
+
description ? /* @__PURE__ */ jsx34(Txt, { tone: "secondary", style: inline ? null : styles25.center, children: description }) : null,
|
|
3602
|
+
action ? /* @__PURE__ */ jsx34(View29, { style: [styles25.action, inline ? null : styles25.actionCentred], children: action }) : null
|
|
3494
3603
|
] })
|
|
3495
3604
|
]
|
|
3496
3605
|
}
|
|
3497
3606
|
);
|
|
3498
3607
|
}
|
|
3499
|
-
var ErrorState = (props) => /* @__PURE__ */
|
|
3500
|
-
var SuccessState = (props) => /* @__PURE__ */
|
|
3501
|
-
var LoadingState = (props) => /* @__PURE__ */
|
|
3502
|
-
var WelcomeState = (props) => /* @__PURE__ */
|
|
3608
|
+
var ErrorState = (props) => /* @__PURE__ */ jsx34(MascotState, { mood: "error", ...props });
|
|
3609
|
+
var SuccessState = (props) => /* @__PURE__ */ jsx34(MascotState, { mood: "success", ...props });
|
|
3610
|
+
var LoadingState = (props) => /* @__PURE__ */ jsx34(MascotState, { mood: "thinking", ...props });
|
|
3611
|
+
var WelcomeState = (props) => /* @__PURE__ */ jsx34(MascotState, { mood: "welcome", ...props });
|
|
3503
3612
|
var styles25 = StyleSheet25.create({
|
|
3504
3613
|
stacked: { alignItems: "center", justifyContent: "center", gap: 12, paddingVertical: 40, paddingHorizontal: 24 },
|
|
3505
3614
|
inline: { flexDirection: "row", alignItems: "center", gap: 16 },
|
|
@@ -3512,9 +3621,9 @@ var styles25 = StyleSheet25.create({
|
|
|
3512
3621
|
|
|
3513
3622
|
// src/native/match-dialog.tsx
|
|
3514
3623
|
import * as React25 from "react";
|
|
3515
|
-
import { AccessibilityInfo as AccessibilityInfo10, Animated as Animated14, Easing as Easing8, Modal as Modal4, Pressable as Pressable14, StyleSheet as StyleSheet26, View as
|
|
3516
|
-
import
|
|
3517
|
-
import { jsx as
|
|
3624
|
+
import { AccessibilityInfo as AccessibilityInfo10, Animated as Animated14, Easing as Easing8, Modal as Modal4, Pressable as Pressable14, StyleSheet as StyleSheet26, View as View30 } from "react-native";
|
|
3625
|
+
import Svg16, { Path as Path14 } from "react-native-svg";
|
|
3626
|
+
import { jsx as jsx35, jsxs as jsxs31 } from "react/jsx-runtime";
|
|
3518
3627
|
function MatchDialog({ open, onOpenChange, title, description, people, primaryLabel, onPrimary, secondaryLabel }) {
|
|
3519
3628
|
const { theme, haptic } = useTheme();
|
|
3520
3629
|
const reduce = useReducedMotion();
|
|
@@ -3534,17 +3643,17 @@ function MatchDialog({ open, onOpenChange, title, description, people, primaryLa
|
|
|
3534
3643
|
}
|
|
3535
3644
|
}, [open, reduce, t]);
|
|
3536
3645
|
const side = (dir) => ({ transform: [{ translateX: t.interpolate({ inputRange: [0, 1], outputRange: [dir * 110, dir * 50] }) }, { rotate: dir === -1 ? "-8deg" : "8deg" }] });
|
|
3537
|
-
return /* @__PURE__ */
|
|
3538
|
-
/* @__PURE__ */
|
|
3539
|
-
/* @__PURE__ */
|
|
3540
|
-
description ? /* @__PURE__ */
|
|
3541
|
-
/* @__PURE__ */
|
|
3542
|
-
/* @__PURE__ */
|
|
3543
|
-
/* @__PURE__ */
|
|
3544
|
-
/* @__PURE__ */
|
|
3646
|
+
return /* @__PURE__ */ jsx35(Modal4, { ...modalName(title), visible: open, transparent: true, animationType: reduce ? "none" : "fade", onRequestClose: () => onOpenChange(false), statusBarTranslucent: true, children: /* @__PURE__ */ jsxs31(View30, { accessibilityViewIsModal: true, style: [styles26.screen, { backgroundColor: theme.accent }], children: [
|
|
3647
|
+
/* @__PURE__ */ jsx35(View30, { style: [StyleSheet26.absoluteFill, { backgroundColor: theme.accent2, opacity: 0.55 }] }),
|
|
3648
|
+
/* @__PURE__ */ jsx35(Txt, { variant: "display", tone: "onAccent", style: styles26.title, children: title }),
|
|
3649
|
+
description ? /* @__PURE__ */ jsx35(Txt, { tone: "onAccent", style: styles26.center, children: description }) : null,
|
|
3650
|
+
/* @__PURE__ */ jsxs31(View30, { style: styles26.pair, "aria-hidden": true, children: [
|
|
3651
|
+
/* @__PURE__ */ jsx35(Animated14.View, { style: [styles26.photo, side(-1), { borderColor: theme.onAccent }], children: /* @__PURE__ */ jsx35(Avatar, { src: people[0].src, alt: "", fallback: people[0].name.charAt(0), size: 112 }) }),
|
|
3652
|
+
/* @__PURE__ */ jsx35(Animated14.View, { style: [styles26.photo, side(1), { borderColor: theme.onAccent }], children: /* @__PURE__ */ jsx35(Avatar, { src: people[1].src, alt: "", fallback: people[1].name.charAt(0), size: 112 }) }),
|
|
3653
|
+
/* @__PURE__ */ jsx35(Animated14.View, { style: [styles26.heart, { backgroundColor: theme.onAccent, transform: [{ scale: t }] }], children: /* @__PURE__ */ jsx35(Svg16, { width: 26, height: 26, viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx35(Path14, { d: "M12 20s-7-4.4-7-10a4 4 0 0 1 7-2.6A4 4 0 0 1 19 10c0 5.6-7 10-7 10z", fill: theme.accent }) }) })
|
|
3545
3654
|
] }),
|
|
3546
|
-
/* @__PURE__ */
|
|
3547
|
-
/* @__PURE__ */
|
|
3655
|
+
/* @__PURE__ */ jsxs31(View30, { style: styles26.actions, children: [
|
|
3656
|
+
/* @__PURE__ */ jsx35(
|
|
3548
3657
|
Button,
|
|
3549
3658
|
{
|
|
3550
3659
|
label: primaryLabel,
|
|
@@ -3555,7 +3664,7 @@ function MatchDialog({ open, onOpenChange, title, description, people, primaryLa
|
|
|
3555
3664
|
}
|
|
3556
3665
|
}
|
|
3557
3666
|
),
|
|
3558
|
-
/* @__PURE__ */
|
|
3667
|
+
/* @__PURE__ */ jsx35(Pressable14, { role: "button", onPress: () => onOpenChange(false), style: ({ pressed }) => [styles26.secondary, { borderColor: theme.onAccent, opacity: pressed ? 0.8 : 1 }], children: /* @__PURE__ */ jsx35(Txt, { variant: "label", tone: "onAccent", children: secondaryLabel }) })
|
|
3559
3668
|
] })
|
|
3560
3669
|
] }) });
|
|
3561
3670
|
}
|
|
@@ -3571,9 +3680,9 @@ var styles26 = StyleSheet26.create({
|
|
|
3571
3680
|
});
|
|
3572
3681
|
|
|
3573
3682
|
// src/native/meter.tsx
|
|
3574
|
-
import { StyleSheet as StyleSheet27, View as
|
|
3575
|
-
import
|
|
3576
|
-
import { jsx as
|
|
3683
|
+
import { StyleSheet as StyleSheet27, View as View31 } from "react-native";
|
|
3684
|
+
import Svg17, { Circle as Circle10 } from "react-native-svg";
|
|
3685
|
+
import { jsx as jsx36, jsxs as jsxs32 } from "react/jsx-runtime";
|
|
3577
3686
|
var THICK = { sm: 6, md: 8, lg: 12 };
|
|
3578
3687
|
var RING = { sm: 56, md: 96, lg: 144 };
|
|
3579
3688
|
var partColor = (t, i) => [t.accent, t.warning, t.success, t.textSecondary, t.danger][i % 5];
|
|
@@ -3586,10 +3695,10 @@ function Meter({ label, value = 0, min = 0, max = 100, valueText, thresholds, op
|
|
|
3586
3695
|
const words2 = valueText ?? `${Math.round(ratio * 100)} %`;
|
|
3587
3696
|
const shares = (parts ?? []).map((p, i) => ({ ...p, color: partColor(theme, i), ratio: Math.min(1, Math.max(0, p.value / span)), words: p.valueText ?? `${Math.round(p.value / span * 100)} %` }));
|
|
3588
3697
|
const a11y = parts ? { role: "group", "aria-label": `${label}: ${shares.map((p) => `${p.label} ${p.words}`).join(", ")}` } : { role: "meter", "aria-label": label, "aria-valuemin": min, "aria-valuemax": max, "aria-valuenow": Math.min(max, Math.max(min, value)), "aria-valuetext": words2 };
|
|
3589
|
-
const legend = parts ? /* @__PURE__ */
|
|
3590
|
-
/* @__PURE__ */
|
|
3591
|
-
/* @__PURE__ */
|
|
3592
|
-
/* @__PURE__ */
|
|
3698
|
+
const legend = parts ? /* @__PURE__ */ jsx36(View31, { style: styles27.legend, "aria-hidden": true, children: shares.map((p, i) => /* @__PURE__ */ jsxs32(View31, { style: styles27.legendItem, children: [
|
|
3699
|
+
/* @__PURE__ */ jsx36(View31, { style: [styles27.swatch, { backgroundColor: p.color }] }),
|
|
3700
|
+
/* @__PURE__ */ jsx36(Txt, { variant: "caption", children: p.label }),
|
|
3701
|
+
/* @__PURE__ */ jsx36(Txt, { variant: "caption", tone: "secondary", children: p.words })
|
|
3593
3702
|
] }, i)) }) : null;
|
|
3594
3703
|
if (variant === "ring") {
|
|
3595
3704
|
const side = RING[size];
|
|
@@ -3601,23 +3710,23 @@ function Meter({ label, value = 0, min = 0, max = 100, valueText, thresholds, op
|
|
|
3601
3710
|
offset += p.ratio;
|
|
3602
3711
|
return arc;
|
|
3603
3712
|
}) : [{ color: tone3, len: ratio, start: 0 }];
|
|
3604
|
-
return /* @__PURE__ */
|
|
3605
|
-
/* @__PURE__ */
|
|
3606
|
-
/* @__PURE__ */
|
|
3607
|
-
/* @__PURE__ */
|
|
3608
|
-
arcs.map((a, i) => /* @__PURE__ */
|
|
3713
|
+
return /* @__PURE__ */ jsxs32(View31, { accessible: true, ...a11y, style: [styles27.ringRoot, style], children: [
|
|
3714
|
+
/* @__PURE__ */ jsxs32(View31, { style: { width: side, height: side }, children: [
|
|
3715
|
+
/* @__PURE__ */ jsxs32(Svg17, { width: side, height: side, viewBox: "0 0 100 100", style: { transform: [{ rotate: "-90deg" }] }, children: [
|
|
3716
|
+
/* @__PURE__ */ jsx36(Circle10, { cx: 50, cy: 50, r, fill: "none", stroke: theme.borderDefault, strokeWidth: 9 }),
|
|
3717
|
+
arcs.map((a, i) => /* @__PURE__ */ jsx36(Circle10, { cx: 50, cy: 50, r, fill: "none", stroke: a.color, strokeWidth: 9, strokeDasharray: `${Math.max(0, a.len * c - (parts ? 2 : 0))} ${c}`, strokeDashoffset: -a.start * c, strokeLinecap: parts ? "butt" : "round" }, i))
|
|
3609
3718
|
] }),
|
|
3610
|
-
children !== void 0 ? /* @__PURE__ */
|
|
3719
|
+
children !== void 0 ? /* @__PURE__ */ jsx36(View31, { style: [StyleSheet27.absoluteFill, styles27.center], children }) : null
|
|
3611
3720
|
] }),
|
|
3612
3721
|
legend
|
|
3613
3722
|
] });
|
|
3614
3723
|
}
|
|
3615
|
-
return /* @__PURE__ */
|
|
3616
|
-
showLabel ? /* @__PURE__ */
|
|
3617
|
-
/* @__PURE__ */
|
|
3618
|
-
!parts ? /* @__PURE__ */
|
|
3724
|
+
return /* @__PURE__ */ jsxs32(View31, { accessible: true, ...a11y, style: [styles27.root, style], children: [
|
|
3725
|
+
showLabel ? /* @__PURE__ */ jsxs32(View31, { style: styles27.header, "aria-hidden": true, children: [
|
|
3726
|
+
/* @__PURE__ */ jsx36(Txt, { variant: "caption", numberOfLines: 1, style: styles27.caption, children: label }),
|
|
3727
|
+
!parts ? /* @__PURE__ */ jsx36(Txt, { variant: "caption", tone: "secondary", children: words2 }) : null
|
|
3619
3728
|
] }) : null,
|
|
3620
|
-
/* @__PURE__ */
|
|
3729
|
+
/* @__PURE__ */ jsx36(View31, { style: [styles27.track, { height: THICK[size], backgroundColor: theme.surface3 }], children: parts ? shares.map((p, i) => /* @__PURE__ */ jsx36(View31, { style: { width: `${p.ratio * 100}%`, backgroundColor: p.color } }, i)) : /* @__PURE__ */ jsx36(View31, { style: [styles27.fill, { width: `${ratio * 100}%`, backgroundColor: tone3 }] }) }),
|
|
3621
3730
|
legend
|
|
3622
3731
|
] });
|
|
3623
3732
|
}
|
|
@@ -3637,7 +3746,7 @@ var styles27 = StyleSheet27.create({
|
|
|
3637
3746
|
// src/native/number-ticker.tsx
|
|
3638
3747
|
import * as React26 from "react";
|
|
3639
3748
|
import { AccessibilityInfo as AccessibilityInfo11, Animated as Animated15, Easing as Easing9, Text as Text13 } from "react-native";
|
|
3640
|
-
import { jsx as
|
|
3749
|
+
import { jsx as jsx37 } from "react/jsx-runtime";
|
|
3641
3750
|
function NumberTicker({ value, locale, format, trigger = "mount", duration = 1100, announce, variant = "display", tone: tone3 = "text", style }) {
|
|
3642
3751
|
const reduce = useReducedMotion();
|
|
3643
3752
|
const writer = React26.useMemo(() => new Intl.NumberFormat(locale, format), [locale, format]);
|
|
@@ -3665,13 +3774,13 @@ function NumberTicker({ value, locale, format, trigger = "mount", duration = 110
|
|
|
3665
3774
|
};
|
|
3666
3775
|
}, [value, reduce, trigger, duration, announce, anim, writer]);
|
|
3667
3776
|
const digits = Number.isInteger(value) ? Math.round(shown) : shown;
|
|
3668
|
-
return /* @__PURE__ */
|
|
3777
|
+
return /* @__PURE__ */ jsx37(Txt, { variant, tone: tone3, "aria-label": writer.format(value), style: [{ fontVariant: ["tabular-nums"] }, style], children: /* @__PURE__ */ jsx37(Text13, { "aria-hidden": true, children: writer.format(digits) }) });
|
|
3669
3778
|
}
|
|
3670
3779
|
|
|
3671
3780
|
// src/native/onboarding.tsx
|
|
3672
3781
|
import * as React27 from "react";
|
|
3673
|
-
import { ScrollView as ScrollView5, StyleSheet as StyleSheet28, View as
|
|
3674
|
-
import { jsx as
|
|
3782
|
+
import { ScrollView as ScrollView5, StyleSheet as StyleSheet28, View as View32 } from "react-native";
|
|
3783
|
+
import { jsx as jsx38, jsxs as jsxs33 } from "react/jsx-runtime";
|
|
3675
3784
|
function Onboarding({ slides, labels, onDone, style }) {
|
|
3676
3785
|
const { theme, insets, haptic } = useTheme();
|
|
3677
3786
|
const [width, setWidth] = React27.useState(0);
|
|
@@ -3686,15 +3795,15 @@ function Onboarding({ slides, labels, onDone, style }) {
|
|
|
3686
3795
|
const onScroll = (e) => {
|
|
3687
3796
|
if (width > 0) setPage(Math.round(e.nativeEvent.contentOffset.x / width));
|
|
3688
3797
|
};
|
|
3689
|
-
return /* @__PURE__ */
|
|
3690
|
-
/* @__PURE__ */
|
|
3691
|
-
/* @__PURE__ */
|
|
3692
|
-
slide.visual ? /* @__PURE__ */
|
|
3693
|
-
/* @__PURE__ */
|
|
3694
|
-
/* @__PURE__ */
|
|
3798
|
+
return /* @__PURE__ */ jsxs33(View32, { style: [styles28.root, { backgroundColor: theme.surface0, paddingTop: insets.top + 8, paddingBottom: insets.bottom + 16 }, style], onLayout: (e) => setWidth(e.nativeEvent.layout.width), children: [
|
|
3799
|
+
/* @__PURE__ */ jsx38(View32, { style: styles28.top, children: !last ? /* @__PURE__ */ jsx38(Button, { label: labels.skip, variant: "ghost", size: "sm", onPress: onDone }) : /* @__PURE__ */ jsx38(View32, { style: styles28.spacer }) }),
|
|
3800
|
+
/* @__PURE__ */ jsx38(ScrollView5, { ref: scroller, tabIndex: 0, horizontal: true, pagingEnabled: true, showsHorizontalScrollIndicator: false, onMomentumScrollEnd: onScroll, style: styles28.flex, children: slides.map((slide, i) => /* @__PURE__ */ jsxs33(View32, { style: [styles28.slide, { width: width || void 0 }], accessible: true, "aria-label": `${labels.position(i + 1, slides.length)}. ${slide.title}. ${slide.description}`, "aria-hidden": i !== page, children: [
|
|
3801
|
+
slide.visual ? /* @__PURE__ */ jsx38(View32, { style: styles28.visual, children: slide.visual }) : null,
|
|
3802
|
+
/* @__PURE__ */ jsx38(Txt, { variant: "display", style: styles28.centred, children: slide.title }),
|
|
3803
|
+
/* @__PURE__ */ jsx38(Txt, { tone: "secondary", style: [styles28.centred, styles28.description], children: slide.description })
|
|
3695
3804
|
] }, i)) }),
|
|
3696
|
-
/* @__PURE__ */
|
|
3697
|
-
/* @__PURE__ */
|
|
3805
|
+
/* @__PURE__ */ jsx38(View32, { style: styles28.dots, "aria-hidden": true, children: slides.map((_, i) => /* @__PURE__ */ jsx38(View32, { style: [styles28.dot, { width: i === page ? 22 : 8, backgroundColor: i === page ? theme.accent : theme.borderStrong }] }, i)) }),
|
|
3806
|
+
/* @__PURE__ */ jsx38(View32, { style: styles28.bottom, children: /* @__PURE__ */ jsx38(Button, { label: last ? labels.done : labels.next, variant: last ? "gradient" : "primary", size: "lg", onPress: () => last ? onDone() : go(page + 1) }) })
|
|
3698
3807
|
] });
|
|
3699
3808
|
}
|
|
3700
3809
|
var styles28 = StyleSheet28.create({
|
|
@@ -3713,8 +3822,8 @@ var styles28 = StyleSheet28.create({
|
|
|
3713
3822
|
|
|
3714
3823
|
// src/native/otp-input.tsx
|
|
3715
3824
|
import * as React28 from "react";
|
|
3716
|
-
import { Platform as Platform2, Pressable as Pressable15, StyleSheet as StyleSheet29, TextInput as TextInput5, View as
|
|
3717
|
-
import { jsx as
|
|
3825
|
+
import { Platform as Platform2, Pressable as Pressable15, StyleSheet as StyleSheet29, TextInput as TextInput5, View as View33 } from "react-native";
|
|
3826
|
+
import { jsx as jsx39, jsxs as jsxs34 } from "react/jsx-runtime";
|
|
3718
3827
|
function OtpInput({ label, length = 6, value, onValueChange, onComplete, mode = "numeric", invalid, disabled, autoFocus, style }) {
|
|
3719
3828
|
const { theme, radius: radius3, haptic } = useTheme();
|
|
3720
3829
|
const [own, setOwn] = React28.useState("");
|
|
@@ -3733,11 +3842,11 @@ function OtpInput({ label, length = 6, value, onValueChange, onComplete, mode =
|
|
|
3733
3842
|
onComplete?.(next);
|
|
3734
3843
|
}
|
|
3735
3844
|
};
|
|
3736
|
-
return /* @__PURE__ */
|
|
3737
|
-
/* @__PURE__ */
|
|
3845
|
+
return /* @__PURE__ */ jsxs34(Pressable15, { onPress: () => input.current?.focus(), disabled, accessible: false, style: [styles29.root, style], children: [
|
|
3846
|
+
/* @__PURE__ */ jsx39(View33, { style: styles29.boxes, "aria-hidden": true, children: Array.from({ length }, (_, i) => {
|
|
3738
3847
|
const active = focused && i === Math.min(code.length, length - 1);
|
|
3739
|
-
return /* @__PURE__ */
|
|
3740
|
-
|
|
3848
|
+
return /* @__PURE__ */ jsx39(
|
|
3849
|
+
View33,
|
|
3741
3850
|
{
|
|
3742
3851
|
style: [
|
|
3743
3852
|
styles29.box,
|
|
@@ -3748,12 +3857,12 @@ function OtpInput({ label, length = 6, value, onValueChange, onComplete, mode =
|
|
|
3748
3857
|
borderWidth: invalid || active ? 2 : 1
|
|
3749
3858
|
}
|
|
3750
3859
|
],
|
|
3751
|
-
children: /* @__PURE__ */
|
|
3860
|
+
children: /* @__PURE__ */ jsx39(Txt, { variant: "title", children: code[i] ?? "" })
|
|
3752
3861
|
},
|
|
3753
3862
|
i
|
|
3754
3863
|
);
|
|
3755
3864
|
}) }),
|
|
3756
|
-
/* @__PURE__ */
|
|
3865
|
+
/* @__PURE__ */ jsx39(
|
|
3757
3866
|
TextInput5,
|
|
3758
3867
|
{
|
|
3759
3868
|
ref: input,
|
|
@@ -3785,11 +3894,11 @@ var styles29 = StyleSheet29.create({
|
|
|
3785
3894
|
});
|
|
3786
3895
|
|
|
3787
3896
|
// src/native/pagination.tsx
|
|
3788
|
-
import { Pressable as Pressable16, StyleSheet as StyleSheet30, Text as Text14, View as
|
|
3789
|
-
import
|
|
3790
|
-
import { jsx as
|
|
3897
|
+
import { Pressable as Pressable16, StyleSheet as StyleSheet30, Text as Text14, View as View34 } from "react-native";
|
|
3898
|
+
import Svg18, { Path as Path15 } from "react-native-svg";
|
|
3899
|
+
import { jsx as jsx40, jsxs as jsxs35 } from "react/jsx-runtime";
|
|
3791
3900
|
function Chevron3({ direction, color }) {
|
|
3792
|
-
return /* @__PURE__ */
|
|
3901
|
+
return /* @__PURE__ */ jsx40(Svg18, { width: 18, height: 18, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: 2.2, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx40(Path15, { d: direction === "left" ? "m15 6-6 6 6 6" : "m9 6 6 6-6 6" }) });
|
|
3793
3902
|
}
|
|
3794
3903
|
function Pagination({ page = 1, pageCount, onPageChange, hasPrevious, hasNext, onPrevious, onNext, status, disabled, labels, style }) {
|
|
3795
3904
|
const { theme, radius: radius3 } = useTheme();
|
|
@@ -3798,7 +3907,7 @@ function Pagination({ page = 1, pageCount, onPageChange, hasPrevious, hasNext, o
|
|
|
3798
3907
|
const current = Math.min(Math.max(1, page), count);
|
|
3799
3908
|
const canPrevious = !disabled && (paged ? current > 1 : Boolean(hasPrevious));
|
|
3800
3909
|
const canNext = !disabled && (paged ? current < count : Boolean(hasNext));
|
|
3801
|
-
const button = (direction, enabled, onPress, label) => /* @__PURE__ */
|
|
3910
|
+
const button = (direction, enabled, onPress, label) => /* @__PURE__ */ jsx40(
|
|
3802
3911
|
Pressable16,
|
|
3803
3912
|
{
|
|
3804
3913
|
role: "button",
|
|
@@ -3811,13 +3920,13 @@ function Pagination({ page = 1, pageCount, onPageChange, hasPrevious, hasNext, o
|
|
|
3811
3920
|
styles30.button,
|
|
3812
3921
|
{ borderRadius: radius3.sm, borderColor: theme.borderDefault, backgroundColor: theme.surface1, opacity: enabled ? pressed ? 0.8 : 1 : 0.4 }
|
|
3813
3922
|
],
|
|
3814
|
-
children: /* @__PURE__ */
|
|
3923
|
+
children: /* @__PURE__ */ jsx40(Chevron3, { direction, color: theme.textPrimary })
|
|
3815
3924
|
}
|
|
3816
3925
|
);
|
|
3817
3926
|
const text = status ?? (paged ? labels.compact(current, count) : null);
|
|
3818
|
-
return /* @__PURE__ */
|
|
3927
|
+
return /* @__PURE__ */ jsxs35(View34, { role: "navigation", style: [styles30.row, style], children: [
|
|
3819
3928
|
button("left", canPrevious, paged ? () => onPageChange?.(current - 1) : onPrevious, labels.previous),
|
|
3820
|
-
text ? /* @__PURE__ */
|
|
3929
|
+
text ? /* @__PURE__ */ jsx40(Text14, { "aria-live": "polite", style: [styles30.status, { color: theme.textSecondary }], children: text }) : null,
|
|
3821
3930
|
button("right", canNext, paged ? () => onPageChange?.(current + 1) : onNext, labels.next)
|
|
3822
3931
|
] });
|
|
3823
3932
|
}
|
|
@@ -3828,8 +3937,8 @@ var styles30 = StyleSheet30.create({
|
|
|
3828
3937
|
});
|
|
3829
3938
|
|
|
3830
3939
|
// src/native/permission-prompt.tsx
|
|
3831
|
-
import { StyleSheet as StyleSheet31, View as
|
|
3832
|
-
import { Fragment as Fragment6, jsx as
|
|
3940
|
+
import { StyleSheet as StyleSheet31, View as View35 } from "react-native";
|
|
3941
|
+
import { Fragment as Fragment6, jsx as jsx41, jsxs as jsxs36 } from "react/jsx-runtime";
|
|
3833
3942
|
function PermissionPrompt({
|
|
3834
3943
|
status,
|
|
3835
3944
|
title,
|
|
@@ -3846,15 +3955,15 @@ function PermissionPrompt({
|
|
|
3846
3955
|
style
|
|
3847
3956
|
}) {
|
|
3848
3957
|
const { theme, radius: radius3 } = useTheme();
|
|
3849
|
-
if (status === "granted") return /* @__PURE__ */
|
|
3958
|
+
if (status === "granted") return /* @__PURE__ */ jsx41(Fragment6, { children: children ?? null });
|
|
3850
3959
|
const blocked = status === "blocked" || status === "denied" && Boolean(onOpenSettings);
|
|
3851
|
-
return /* @__PURE__ */
|
|
3852
|
-
/* @__PURE__ */
|
|
3853
|
-
/* @__PURE__ */
|
|
3854
|
-
/* @__PURE__ */
|
|
3855
|
-
/* @__PURE__ */
|
|
3856
|
-
blocked && settingsLabel && onOpenSettings ? /* @__PURE__ */
|
|
3857
|
-
dismissLabel && onDismiss ? /* @__PURE__ */
|
|
3960
|
+
return /* @__PURE__ */ jsxs36(View35, { style: [styles31.root, { backgroundColor: theme.surface1, borderColor: theme.borderSubtle, borderRadius: radius3.xl }, style], children: [
|
|
3961
|
+
/* @__PURE__ */ jsx41(Mascot, { bird: mascot, mood: blocked ? "error" : "welcome", size: 104 }),
|
|
3962
|
+
/* @__PURE__ */ jsx41(Txt, { variant: "title", style: styles31.centred, children: title }),
|
|
3963
|
+
/* @__PURE__ */ jsx41(Txt, { tone: "secondary", style: styles31.centred, children: blocked && blockedDescription ? blockedDescription : description }),
|
|
3964
|
+
/* @__PURE__ */ jsxs36(View35, { style: styles31.actions, children: [
|
|
3965
|
+
blocked && settingsLabel && onOpenSettings ? /* @__PURE__ */ jsx41(Button, { label: settingsLabel, variant: "primary", onPress: onOpenSettings }) : /* @__PURE__ */ jsx41(Button, { label: allowLabel, variant: "primary", onPress: onAllow }),
|
|
3966
|
+
dismissLabel && onDismiss ? /* @__PURE__ */ jsx41(Button, { label: dismissLabel, variant: "ghost", onPress: onDismiss }) : null
|
|
3858
3967
|
] })
|
|
3859
3968
|
] });
|
|
3860
3969
|
}
|
|
@@ -3866,8 +3975,8 @@ var styles31 = StyleSheet31.create({
|
|
|
3866
3975
|
|
|
3867
3976
|
// src/native/phoenix.tsx
|
|
3868
3977
|
import { useEffect as useEffect19, useState as useState28 } from "react";
|
|
3869
|
-
import { AccessibilityInfo as AccessibilityInfo12, Animated as Animated16, Easing as Easing10, View as
|
|
3870
|
-
import
|
|
3978
|
+
import { AccessibilityInfo as AccessibilityInfo12, Animated as Animated16, Easing as Easing10, View as View36 } from "react-native";
|
|
3979
|
+
import Svg19, { Circle as Circle11, Defs as Defs10, LinearGradient as LinearGradient10, Path as Path16, RadialGradient as RadialGradient7, Stop as Stop10 } from "react-native-svg";
|
|
3871
3980
|
|
|
3872
3981
|
// src/mascots/phoenix-geometry.ts
|
|
3873
3982
|
var PHOENIX = {
|
|
@@ -3890,7 +3999,7 @@ var PHOENIX_PALETTES = {
|
|
|
3890
3999
|
};
|
|
3891
4000
|
|
|
3892
4001
|
// src/native/phoenix.tsx
|
|
3893
|
-
import { jsx as
|
|
4002
|
+
import { jsx as jsx42, jsxs as jsxs37 } from "react/jsx-runtime";
|
|
3894
4003
|
function useFloat(animated) {
|
|
3895
4004
|
const [y] = useState28(() => new Animated16.Value(0));
|
|
3896
4005
|
useEffect19(() => {
|
|
@@ -3915,37 +4024,37 @@ function Phoenix({ tone: tone3 = "own", size = 120, animated = true, title, styl
|
|
|
3915
4024
|
const id = useSvgId("kzp");
|
|
3916
4025
|
const y = useFloat(animated);
|
|
3917
4026
|
const p = tone3 === "brand" ? { left: [theme.accent2, theme.accent], right: [theme.accent, theme.accent2], core: ["#ffffff", theme.accent], body: theme.surface3, edge: theme.borderStrong, crest: theme.accent } : PHOENIX_PALETTES.own;
|
|
3918
|
-
return /* @__PURE__ */
|
|
3919
|
-
/* @__PURE__ */
|
|
3920
|
-
/* @__PURE__ */
|
|
3921
|
-
/* @__PURE__ */
|
|
3922
|
-
/* @__PURE__ */
|
|
4027
|
+
return /* @__PURE__ */ jsx42(View36, { style: [{ width: size, height: size }, style], ...markA11y(title), children: /* @__PURE__ */ jsx42(Animated16.View, { style: { transform: [{ translateY: y }] }, children: /* @__PURE__ */ jsxs37(Svg19, { width: size, height: size, viewBox: "0 0 120 120", children: [
|
|
4028
|
+
/* @__PURE__ */ jsxs37(Defs10, { children: [
|
|
4029
|
+
/* @__PURE__ */ jsxs37(LinearGradient10, { id: `${id}l`, x1: "1", y1: "0", x2: "0", y2: "1", children: [
|
|
4030
|
+
/* @__PURE__ */ jsx42(Stop10, { offset: "0%", stopColor: p.left[0] }),
|
|
4031
|
+
/* @__PURE__ */ jsx42(Stop10, { offset: "100%", stopColor: p.left[1] })
|
|
3923
4032
|
] }),
|
|
3924
|
-
/* @__PURE__ */
|
|
3925
|
-
/* @__PURE__ */
|
|
3926
|
-
/* @__PURE__ */
|
|
4033
|
+
/* @__PURE__ */ jsxs37(LinearGradient10, { id: `${id}r`, x1: "0", y1: "0", x2: "1", y2: "1", children: [
|
|
4034
|
+
/* @__PURE__ */ jsx42(Stop10, { offset: "0%", stopColor: p.right[0] }),
|
|
4035
|
+
/* @__PURE__ */ jsx42(Stop10, { offset: "100%", stopColor: p.right[1] })
|
|
3927
4036
|
] }),
|
|
3928
|
-
/* @__PURE__ */
|
|
3929
|
-
/* @__PURE__ */
|
|
3930
|
-
/* @__PURE__ */
|
|
4037
|
+
/* @__PURE__ */ jsxs37(RadialGradient7, { id: `${id}c`, children: [
|
|
4038
|
+
/* @__PURE__ */ jsx42(Stop10, { offset: "0%", stopColor: p.core[0] }),
|
|
4039
|
+
/* @__PURE__ */ jsx42(Stop10, { offset: "100%", stopColor: p.core[1], stopOpacity: 0 })
|
|
3931
4040
|
] })
|
|
3932
4041
|
] }),
|
|
3933
|
-
/* @__PURE__ */
|
|
3934
|
-
/* @__PURE__ */
|
|
3935
|
-
/* @__PURE__ */
|
|
3936
|
-
/* @__PURE__ */
|
|
3937
|
-
/* @__PURE__ */
|
|
3938
|
-
/* @__PURE__ */
|
|
3939
|
-
/* @__PURE__ */
|
|
3940
|
-
/* @__PURE__ */
|
|
4042
|
+
/* @__PURE__ */ jsx42(Path16, { d: PHOENIX.wingL, fill: `url(#${id}l)` }),
|
|
4043
|
+
/* @__PURE__ */ jsx42(Path16, { d: PHOENIX.wingR, fill: `url(#${id}r)` }),
|
|
4044
|
+
/* @__PURE__ */ jsx42(Path16, { d: PHOENIX.tailL, fill: `url(#${id}l)`, opacity: 0.7 }),
|
|
4045
|
+
/* @__PURE__ */ jsx42(Path16, { d: PHOENIX.tailR, fill: `url(#${id}r)`, opacity: 0.7 }),
|
|
4046
|
+
/* @__PURE__ */ jsx42(Path16, { d: PHOENIX.body, fill: p.body, stroke: p.edge, strokeOpacity: 0.5 }),
|
|
4047
|
+
/* @__PURE__ */ jsx42(Circle11, { cx: 60, cy: 58, r: 12, fill: `url(#${id}c)` }),
|
|
4048
|
+
/* @__PURE__ */ jsx42(Circle11, { cx: 60, cy: 58, r: 3.5, fill: "#ffffff" }),
|
|
4049
|
+
/* @__PURE__ */ jsx42(Path16, { d: PHOENIX.crest, stroke: p.crest, strokeWidth: 2, strokeLinecap: "round" })
|
|
3941
4050
|
] }) }) });
|
|
3942
4051
|
}
|
|
3943
4052
|
|
|
3944
4053
|
// src/native/photo-grid.tsx
|
|
3945
4054
|
import * as React30 from "react";
|
|
3946
|
-
import { Image as Image4, Pressable as Pressable17, StyleSheet as StyleSheet32, View as
|
|
3947
|
-
import
|
|
3948
|
-
import { jsx as
|
|
4055
|
+
import { Image as Image4, Pressable as Pressable17, StyleSheet as StyleSheet32, View as View37 } from "react-native";
|
|
4056
|
+
import Svg20, { Path as Path17 } from "react-native-svg";
|
|
4057
|
+
import { jsx as jsx43, jsxs as jsxs38 } from "react/jsx-runtime";
|
|
3949
4058
|
function PhotoGrid({ value, onValueChange, onAdd, slots = 6, required = 1, columns = 3, labels, style }) {
|
|
3950
4059
|
const { theme, radius: radius3, haptic } = useTheme();
|
|
3951
4060
|
const [menu, setMenu] = React30.useState(null);
|
|
@@ -3962,11 +4071,11 @@ function PhotoGrid({ value, onValueChange, onAdd, slots = 6, required = 1, colum
|
|
|
3962
4071
|
onValueChange(value.filter((_, j) => j !== i));
|
|
3963
4072
|
};
|
|
3964
4073
|
const width = `${100 / columns}%`;
|
|
3965
|
-
return /* @__PURE__ */
|
|
4074
|
+
return /* @__PURE__ */ jsxs38(View37, { style: [styles32.grid, style], children: [
|
|
3966
4075
|
Array.from({ length: slots }, (_, i) => {
|
|
3967
4076
|
const photo = value[i];
|
|
3968
4077
|
const cell = [styles32.slot, { borderRadius: radius3.lg, aspectRatio: 3 / 4 }];
|
|
3969
|
-
return /* @__PURE__ */
|
|
4078
|
+
return /* @__PURE__ */ jsx43(View37, { style: [styles32.cell, { width }], children: photo ? /* @__PURE__ */ jsxs38(
|
|
3970
4079
|
Pressable17,
|
|
3971
4080
|
{
|
|
3972
4081
|
role: "button",
|
|
@@ -3990,11 +4099,11 @@ function PhotoGrid({ value, onValueChange, onAdd, slots = 6, required = 1, colum
|
|
|
3990
4099
|
},
|
|
3991
4100
|
style: [...cell, { backgroundColor: theme.surface3, overflow: "hidden" }],
|
|
3992
4101
|
children: [
|
|
3993
|
-
/* @__PURE__ */
|
|
3994
|
-
i === 0 ? /* @__PURE__ */
|
|
4102
|
+
/* @__PURE__ */ jsx43(Image4, { source: { uri: photo.uri }, style: StyleSheet32.absoluteFill, resizeMode: "cover" }),
|
|
4103
|
+
i === 0 ? /* @__PURE__ */ jsx43(View37, { style: [styles32.main, { backgroundColor: theme.accent, borderRadius: radius3.full }], children: /* @__PURE__ */ jsx43(Txt, { variant: "caption", tone: "onAccent", style: styles32.mainText, children: labels.main }) }) : null
|
|
3995
4104
|
]
|
|
3996
4105
|
}
|
|
3997
|
-
) : /* @__PURE__ */
|
|
4106
|
+
) : /* @__PURE__ */ jsx43(
|
|
3998
4107
|
Pressable17,
|
|
3999
4108
|
{
|
|
4000
4109
|
role: "button",
|
|
@@ -4006,11 +4115,11 @@ function PhotoGrid({ value, onValueChange, onAdd, slots = 6, required = 1, colum
|
|
|
4006
4115
|
styles32.empty,
|
|
4007
4116
|
{ borderColor: i < required ? theme.accent : theme.borderStrong, backgroundColor: pressed ? theme.surface2 : theme.surface1, opacity: i > value.length ? 0.5 : 1 }
|
|
4008
4117
|
],
|
|
4009
|
-
children: /* @__PURE__ */
|
|
4118
|
+
children: /* @__PURE__ */ jsx43(View37, { style: [styles32.plus, { backgroundColor: i === value.length ? theme.accent : theme.surface3, borderRadius: radius3.full }], children: /* @__PURE__ */ jsx43(Svg20, { width: 16, height: 16, viewBox: "0 0 24 24", "aria-hidden": true, children: /* @__PURE__ */ jsx43(Path17, { d: "M12 5v14M5 12h14", stroke: i === value.length ? theme.onAccent : theme.textSecondary, strokeWidth: 2.6, strokeLinecap: "round" }) }) })
|
|
4010
4119
|
}
|
|
4011
4120
|
) }, photo?.id ?? `empty-${i}`);
|
|
4012
4121
|
}),
|
|
4013
|
-
/* @__PURE__ */
|
|
4122
|
+
/* @__PURE__ */ jsx43(
|
|
4014
4123
|
ActionSheet,
|
|
4015
4124
|
{
|
|
4016
4125
|
open: menu !== null,
|
|
@@ -4038,16 +4147,16 @@ var styles32 = StyleSheet32.create({
|
|
|
4038
4147
|
|
|
4039
4148
|
// src/native/profile-card.tsx
|
|
4040
4149
|
import * as React31 from "react";
|
|
4041
|
-
import { Animated as Animated17, StyleSheet as StyleSheet33, View as
|
|
4042
|
-
import { jsx as
|
|
4150
|
+
import { Animated as Animated17, StyleSheet as StyleSheet33, View as View38 } from "react-native";
|
|
4151
|
+
import { jsx as jsx44, jsxs as jsxs39 } from "react/jsx-runtime";
|
|
4043
4152
|
var ratioOf = (value, max = 100) => Math.min(1, Math.max(0, value / (max || 1)));
|
|
4044
4153
|
function Bar({ label, ratio, words: words2, animated, delay }) {
|
|
4045
4154
|
const { theme } = useTheme();
|
|
4046
4155
|
const t = useEntrance(animated, delay, 900);
|
|
4047
4156
|
const [width, setWidth] = React31.useState(0);
|
|
4048
4157
|
const translateX = t.interpolate({ inputRange: [0, 1], outputRange: [-width * ratio, 0] });
|
|
4049
|
-
return /* @__PURE__ */
|
|
4050
|
-
|
|
4158
|
+
return /* @__PURE__ */ jsx44(
|
|
4159
|
+
View38,
|
|
4051
4160
|
{
|
|
4052
4161
|
accessible: true,
|
|
4053
4162
|
role: "meter",
|
|
@@ -4058,37 +4167,37 @@ function Bar({ label, ratio, words: words2, animated, delay }) {
|
|
|
4058
4167
|
"aria-valuetext": words2,
|
|
4059
4168
|
onLayout: (e) => setWidth(e.nativeEvent.layout.width),
|
|
4060
4169
|
style: [styles33.track, { backgroundColor: theme.surface3 }],
|
|
4061
|
-
children: /* @__PURE__ */
|
|
4170
|
+
children: /* @__PURE__ */ jsx44(Animated17.View, { style: [styles33.fill, { width: `${ratio * 100}%`, backgroundColor: theme.accent, transform: [{ translateX }] }] })
|
|
4062
4171
|
}
|
|
4063
4172
|
);
|
|
4064
4173
|
}
|
|
4065
4174
|
function ProfileCard({ visual, name, statLabel, value = 100, valueText, stats, caption, children, animated = true, style, ...props }) {
|
|
4066
4175
|
const { theme, radius: radius3 } = useTheme();
|
|
4067
4176
|
const ratio = ratioOf(value);
|
|
4068
|
-
return /* @__PURE__ */
|
|
4069
|
-
/* @__PURE__ */
|
|
4070
|
-
/* @__PURE__ */
|
|
4071
|
-
/* @__PURE__ */
|
|
4072
|
-
statLabel ? /* @__PURE__ */
|
|
4177
|
+
return /* @__PURE__ */ jsxs39(View38, { ...props, style: [styles33.root, { backgroundColor: theme.surface1, borderColor: theme.borderSubtle, borderRadius: radius3.xl }, style], children: [
|
|
4178
|
+
/* @__PURE__ */ jsx44(View38, { "aria-hidden": true, style: [styles33.disc, { backgroundColor: theme.surface2, borderColor: theme.accentSoft }], children: visual }),
|
|
4179
|
+
/* @__PURE__ */ jsxs39(View38, { style: styles33.head, children: [
|
|
4180
|
+
/* @__PURE__ */ jsx44(Txt, { variant: "title", style: styles33.name, children: name }),
|
|
4181
|
+
statLabel ? /* @__PURE__ */ jsxs39(Txt, { variant: "caption", tone: "secondary", children: [
|
|
4073
4182
|
statLabel,
|
|
4074
4183
|
" ",
|
|
4075
|
-
/* @__PURE__ */
|
|
4184
|
+
/* @__PURE__ */ jsx44(Txt, { variant: "caption", children: valueText ?? `${Math.round(ratio * 100)} %` })
|
|
4076
4185
|
] }) : null
|
|
4077
4186
|
] }),
|
|
4078
|
-
statLabel ? /* @__PURE__ */
|
|
4187
|
+
statLabel ? /* @__PURE__ */ jsx44(Bar, { label: statLabel, ratio, words: valueText ?? `${Math.round(ratio * 100)} %`, animated, delay: 200 }) : null,
|
|
4079
4188
|
stats?.map((s, i) => {
|
|
4080
4189
|
const r = ratioOf(s.value, s.max);
|
|
4081
4190
|
const words2 = s.valueText ?? `${Math.round(r * 100)} %`;
|
|
4082
|
-
return /* @__PURE__ */
|
|
4083
|
-
/* @__PURE__ */
|
|
4084
|
-
/* @__PURE__ */
|
|
4085
|
-
/* @__PURE__ */
|
|
4191
|
+
return /* @__PURE__ */ jsxs39(View38, { style: styles33.stat, children: [
|
|
4192
|
+
/* @__PURE__ */ jsxs39(View38, { "aria-hidden": true, style: styles33.statHead, children: [
|
|
4193
|
+
/* @__PURE__ */ jsx44(Txt, { variant: "caption", tone: "secondary", children: s.label }),
|
|
4194
|
+
/* @__PURE__ */ jsx44(Txt, { variant: "caption", children: words2 })
|
|
4086
4195
|
] }),
|
|
4087
|
-
/* @__PURE__ */
|
|
4196
|
+
/* @__PURE__ */ jsx44(Bar, { label: s.label, ratio: r, words: words2, animated, delay: 320 + i * 120 })
|
|
4088
4197
|
] }, s.label);
|
|
4089
4198
|
}),
|
|
4090
|
-
caption ? /* @__PURE__ */
|
|
4091
|
-
children ? /* @__PURE__ */
|
|
4199
|
+
caption ? /* @__PURE__ */ jsx44(Txt, { variant: "caption", tone: "secondary", style: styles33.caption, children: caption }) : null,
|
|
4200
|
+
children ? /* @__PURE__ */ jsx44(View38, { style: styles33.extra, children }) : null
|
|
4092
4201
|
] });
|
|
4093
4202
|
}
|
|
4094
4203
|
var styles33 = StyleSheet33.create({
|
|
@@ -4106,10 +4215,10 @@ var styles33 = StyleSheet33.create({
|
|
|
4106
4215
|
|
|
4107
4216
|
// src/native/progress.tsx
|
|
4108
4217
|
import * as React32 from "react";
|
|
4109
|
-
import { Animated as Animated18, Easing as Easing11, StyleSheet as StyleSheet34, View as
|
|
4110
|
-
import
|
|
4111
|
-
import { jsx as
|
|
4112
|
-
var AnimatedCircle = Animated18.createAnimatedComponent(
|
|
4218
|
+
import { Animated as Animated18, Easing as Easing11, StyleSheet as StyleSheet34, View as View39 } from "react-native";
|
|
4219
|
+
import Svg21, { Circle as Circle12, Defs as Defs11, LinearGradient as LinearGradient11, Rect as Rect3, Stop as Stop11 } from "react-native-svg";
|
|
4220
|
+
import { jsx as jsx45, jsxs as jsxs40 } from "react/jsx-runtime";
|
|
4221
|
+
var AnimatedCircle = Animated18.createAnimatedComponent(Circle12);
|
|
4113
4222
|
var BAR2 = { sm: 4, md: 8, lg: 12 };
|
|
4114
4223
|
var RING2 = { sm: 40, md: 80, lg: 144 };
|
|
4115
4224
|
var STROKE = { sm: 12, md: 9, lg: 7 };
|
|
@@ -4150,9 +4259,9 @@ function Progress({ variant = "bar", size = "md", value, max = 100, label, value
|
|
|
4150
4259
|
"aria-valuenow": known ? Math.min(max, Math.max(0, value)) : void 0,
|
|
4151
4260
|
"aria-valuetext": known ? valueText ?? `${percent}%` : valueText
|
|
4152
4261
|
};
|
|
4153
|
-
const gradient = /* @__PURE__ */
|
|
4154
|
-
/* @__PURE__ */
|
|
4155
|
-
/* @__PURE__ */
|
|
4262
|
+
const gradient = /* @__PURE__ */ jsx45(Defs11, { children: /* @__PURE__ */ jsxs40(LinearGradient11, { id, x1: "0", y1: "0", x2: "1", y2: variant === "ring" ? "1" : "0", children: [
|
|
4263
|
+
/* @__PURE__ */ jsx45(Stop11, { offset: "0", stopColor: theme.accent }),
|
|
4264
|
+
/* @__PURE__ */ jsx45(Stop11, { offset: "1", stopColor: theme.accent2 })
|
|
4156
4265
|
] }) });
|
|
4157
4266
|
if (variant === "ring") {
|
|
4158
4267
|
const side = RING2[size];
|
|
@@ -4161,11 +4270,11 @@ function Progress({ variant = "bar", size = "md", value, max = 100, label, value
|
|
|
4161
4270
|
const circumference = 2 * Math.PI * r;
|
|
4162
4271
|
const offset = known ? progress.interpolate({ inputRange: [0, 1], outputRange: [circumference, 0] }) : circumference * 0.75;
|
|
4163
4272
|
const rotate = spin.interpolate({ inputRange: [0, 1], outputRange: ["0deg", "360deg"] });
|
|
4164
|
-
return /* @__PURE__ */
|
|
4165
|
-
/* @__PURE__ */
|
|
4273
|
+
return /* @__PURE__ */ jsxs40(View39, { ...a11y, style: [styles34.ring, { width: side, height: side }, style], children: [
|
|
4274
|
+
/* @__PURE__ */ jsx45(Animated18.View, { style: [StyleSheet34.absoluteFill, { transform: [{ rotate: known ? "-90deg" : rotate }] }], children: /* @__PURE__ */ jsxs40(Svg21, { width: side, height: side, viewBox: "0 0 100 100", children: [
|
|
4166
4275
|
gradient,
|
|
4167
|
-
/* @__PURE__ */
|
|
4168
|
-
/* @__PURE__ */
|
|
4276
|
+
/* @__PURE__ */ jsx45(Circle12, { cx: 50, cy: 50, r, fill: "none", stroke: theme.borderDefault, strokeWidth: stroke }),
|
|
4277
|
+
/* @__PURE__ */ jsx45(
|
|
4169
4278
|
AnimatedCircle,
|
|
4170
4279
|
{
|
|
4171
4280
|
cx: 50,
|
|
@@ -4185,15 +4294,15 @@ function Progress({ variant = "bar", size = "md", value, max = 100, label, value
|
|
|
4185
4294
|
}
|
|
4186
4295
|
const width = known ? progress.interpolate({ inputRange: [0, 1], outputRange: ["0%", "100%"] }) : "40%";
|
|
4187
4296
|
const translate = spin.interpolate({ inputRange: [0, 1], outputRange: [-0.4 * track, track] });
|
|
4188
|
-
return /* @__PURE__ */
|
|
4189
|
-
|
|
4297
|
+
return /* @__PURE__ */ jsx45(
|
|
4298
|
+
View39,
|
|
4190
4299
|
{
|
|
4191
4300
|
...a11y,
|
|
4192
4301
|
onLayout: known ? void 0 : (event) => setTrack(event.nativeEvent.layout.width),
|
|
4193
4302
|
style: [styles34.bar, { height: BAR2[size], backgroundColor: theme.surface3 }, style],
|
|
4194
|
-
children: /* @__PURE__ */
|
|
4303
|
+
children: /* @__PURE__ */ jsx45(Animated18.View, { style: [styles34.fill, { width }, known || reduce ? null : { transform: [{ translateX: translate }] }], children: /* @__PURE__ */ jsxs40(Svg21, { width: "100%", height: "100%", preserveAspectRatio: "none", children: [
|
|
4195
4304
|
gradient,
|
|
4196
|
-
/* @__PURE__ */
|
|
4305
|
+
/* @__PURE__ */ jsx45(Rect3, { x: 0, y: 0, width: "100%", height: "100%", fill: `url(#${id})` })
|
|
4197
4306
|
] }) })
|
|
4198
4307
|
}
|
|
4199
4308
|
);
|
|
@@ -4206,11 +4315,11 @@ var styles34 = StyleSheet34.create({
|
|
|
4206
4315
|
|
|
4207
4316
|
// src/native/pull-to-refresh.tsx
|
|
4208
4317
|
import * as React33 from "react";
|
|
4209
|
-
import { AccessibilityInfo as AccessibilityInfo13, Animated as Animated19, RefreshControl, StyleSheet as StyleSheet35, View as
|
|
4210
|
-
import { jsx as
|
|
4318
|
+
import { AccessibilityInfo as AccessibilityInfo13, Animated as Animated19, RefreshControl, StyleSheet as StyleSheet35, View as View40 } from "react-native";
|
|
4319
|
+
import { jsx as jsx46, jsxs as jsxs41 } from "react/jsx-runtime";
|
|
4211
4320
|
function PullToRefresh({ label, ...props }) {
|
|
4212
4321
|
const { theme } = useTheme();
|
|
4213
|
-
return /* @__PURE__ */
|
|
4322
|
+
return /* @__PURE__ */ jsx46(RefreshControl, { ...props, tintColor: theme.accent, colors: [theme.accent], progressBackgroundColor: theme.surface2, title: label, titleColor: theme.textSecondary });
|
|
4214
4323
|
}
|
|
4215
4324
|
var pullProgress = (offset, threshold) => Math.min(1, Math.max(0, -offset / threshold));
|
|
4216
4325
|
function BrandedRefresh({ product, refreshing, onRefresh, label, children, threshold = 72 }) {
|
|
@@ -4227,14 +4336,14 @@ function BrandedRefresh({ product, refreshing, onRefresh, label, children, thres
|
|
|
4227
4336
|
const shown = refreshing ? 1 : pull;
|
|
4228
4337
|
const scale = refreshing || reduce ? 1 : pull.interpolate({ inputRange: [0, 1], outputRange: [0.4, 1] });
|
|
4229
4338
|
const rotate = refreshing || reduce ? "0deg" : pull.interpolate({ inputRange: [0, 1], outputRange: ["-90deg", "0deg"] });
|
|
4230
|
-
return /* @__PURE__ */
|
|
4339
|
+
return /* @__PURE__ */ jsxs41(View40, { style: styles35.root, children: [
|
|
4231
4340
|
children({
|
|
4232
4341
|
// The platform's control does the gesture and the haptics, drawn transparent: the mark is ours.
|
|
4233
|
-
refreshControl: /* @__PURE__ */
|
|
4342
|
+
refreshControl: /* @__PURE__ */ jsx46(RefreshControl, { refreshing, onRefresh, tintColor: "transparent", colors: ["transparent"], progressBackgroundColor: "transparent" }),
|
|
4234
4343
|
onScroll,
|
|
4235
4344
|
scrollEventThrottle: 16
|
|
4236
4345
|
}),
|
|
4237
|
-
/* @__PURE__ */
|
|
4346
|
+
/* @__PURE__ */ jsx46(Animated19.View, { pointerEvents: "none", "aria-hidden": true, style: [styles35.mark, { opacity: shown, transform: [{ scale }, { rotate }] }], children: /* @__PURE__ */ jsx46(ProductMark, { id: product, size: 32, animated: refreshing, neutral: theme.textMuted }) })
|
|
4238
4347
|
] });
|
|
4239
4348
|
}
|
|
4240
4349
|
var styles35 = StyleSheet35.create({
|
|
@@ -4244,11 +4353,11 @@ var styles35 = StyleSheet35.create({
|
|
|
4244
4353
|
|
|
4245
4354
|
// src/native/radio-group.tsx
|
|
4246
4355
|
import * as React34 from "react";
|
|
4247
|
-
import { Animated as Animated20, Pressable as Pressable18, StyleSheet as StyleSheet36, Text as Text15, View as
|
|
4248
|
-
import
|
|
4249
|
-
import { jsx as
|
|
4356
|
+
import { Animated as Animated20, Pressable as Pressable18, StyleSheet as StyleSheet36, Text as Text15, View as View41 } from "react-native";
|
|
4357
|
+
import Svg22, { Path as Path18 } from "react-native-svg";
|
|
4358
|
+
import { jsx as jsx47, jsxs as jsxs42 } from "react/jsx-runtime";
|
|
4250
4359
|
function Check({ color }) {
|
|
4251
|
-
return /* @__PURE__ */
|
|
4360
|
+
return /* @__PURE__ */ jsx47(Svg22, { width: 12, height: 12, viewBox: "0 0 24 24", fill: "none", stroke: color, strokeWidth: 3.2, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx47(Path18, { d: "M20 6 9 17l-5-5" }) });
|
|
4252
4361
|
}
|
|
4253
4362
|
function Key({ option, checked, disabled, onPress }) {
|
|
4254
4363
|
const { theme, radius: radius3, motion: motion3 } = useTheme();
|
|
@@ -4258,7 +4367,7 @@ function Key({ option, checked, disabled, onPress }) {
|
|
|
4258
4367
|
React34.useEffect(() => {
|
|
4259
4368
|
Animated20.timing(sink, { toValue: down ? 1 : 0, duration: motion3.duration.fast, useNativeDriver: true }).start();
|
|
4260
4369
|
}, [down, sink, motion3.duration.fast]);
|
|
4261
|
-
return /* @__PURE__ */
|
|
4370
|
+
return /* @__PURE__ */ jsxs42(
|
|
4262
4371
|
Pressable18,
|
|
4263
4372
|
{
|
|
4264
4373
|
role: "radio",
|
|
@@ -4271,8 +4380,8 @@ function Key({ option, checked, disabled, onPress }) {
|
|
|
4271
4380
|
onPressOut: () => setHeld(false),
|
|
4272
4381
|
style: [styles36.keySlot, disabled ? styles36.disabled : null],
|
|
4273
4382
|
children: [
|
|
4274
|
-
/* @__PURE__ */
|
|
4275
|
-
/* @__PURE__ */
|
|
4383
|
+
/* @__PURE__ */ jsx47(View41, { style: [styles36.ledge, { borderRadius: radius3.lg, backgroundColor: checked ? theme.accentHover : theme.borderStrong }] }),
|
|
4384
|
+
/* @__PURE__ */ jsxs42(
|
|
4276
4385
|
Animated20.View,
|
|
4277
4386
|
{
|
|
4278
4387
|
style: [
|
|
@@ -4285,8 +4394,8 @@ function Key({ option, checked, disabled, onPress }) {
|
|
|
4285
4394
|
}
|
|
4286
4395
|
],
|
|
4287
4396
|
children: [
|
|
4288
|
-
/* @__PURE__ */
|
|
4289
|
-
option.hint ? /* @__PURE__ */
|
|
4397
|
+
/* @__PURE__ */ jsx47(Text15, { style: [styles36.keyLabel, { color: checked ? theme.onAccent : theme.textPrimary }], children: option.label }),
|
|
4398
|
+
option.hint ? /* @__PURE__ */ jsx47(Text15, { style: [styles36.keyHint, { color: checked ? theme.onAccent : theme.textSecondary }], children: option.hint }) : null
|
|
4290
4399
|
]
|
|
4291
4400
|
}
|
|
4292
4401
|
)
|
|
@@ -4307,9 +4416,9 @@ function RadioGroup({ label, options, value: valueProp, defaultValue = null, onV
|
|
|
4307
4416
|
const checked = o.value === value;
|
|
4308
4417
|
const off = Boolean(disabled || o.disabled);
|
|
4309
4418
|
const name = o.description ? `${o.label}, ${o.description}` : o.label;
|
|
4310
|
-
if (variant === "buttons") return /* @__PURE__ */
|
|
4419
|
+
if (variant === "buttons") return /* @__PURE__ */ jsx47(Key, { option: o, checked, disabled: off, onPress: () => pick(o.value) }, o.value);
|
|
4311
4420
|
if (variant === "segmented")
|
|
4312
|
-
return /* @__PURE__ */
|
|
4421
|
+
return /* @__PURE__ */ jsx47(
|
|
4313
4422
|
Pressable18,
|
|
4314
4423
|
{
|
|
4315
4424
|
role: "radio",
|
|
@@ -4319,12 +4428,12 @@ function RadioGroup({ label, options, value: valueProp, defaultValue = null, onV
|
|
|
4319
4428
|
disabled: off,
|
|
4320
4429
|
onPress: () => pick(o.value),
|
|
4321
4430
|
style: [styles36.segment, { borderRadius: radius3.md }, checked ? { backgroundColor: theme.surface0, borderColor: theme.borderDefault } : null, off ? styles36.disabled : null],
|
|
4322
|
-
children: /* @__PURE__ */
|
|
4431
|
+
children: /* @__PURE__ */ jsx47(Text15, { numberOfLines: 1, style: [styles36.segmentLabel, { color: checked ? theme.textPrimary : theme.textSecondary }], children: o.label })
|
|
4323
4432
|
},
|
|
4324
4433
|
o.value
|
|
4325
4434
|
);
|
|
4326
4435
|
if (variant === "cards")
|
|
4327
|
-
return /* @__PURE__ */
|
|
4436
|
+
return /* @__PURE__ */ jsxs42(
|
|
4328
4437
|
Pressable18,
|
|
4329
4438
|
{
|
|
4330
4439
|
role: "radio",
|
|
@@ -4339,24 +4448,24 @@ function RadioGroup({ label, options, value: valueProp, defaultValue = null, onV
|
|
|
4339
4448
|
off ? styles36.disabled : null
|
|
4340
4449
|
],
|
|
4341
4450
|
children: [
|
|
4342
|
-
/* @__PURE__ */
|
|
4343
|
-
/* @__PURE__ */
|
|
4344
|
-
o.description ? /* @__PURE__ */
|
|
4451
|
+
/* @__PURE__ */ jsx47(View41, { style: [styles36.cardCheck, { borderColor: checked ? theme.accent : theme.borderStrong, backgroundColor: checked ? theme.accent : theme.surface1 }], children: checked ? /* @__PURE__ */ jsx47(Check, { color: theme.onAccent }) : null }),
|
|
4452
|
+
/* @__PURE__ */ jsx47(Text15, { style: [styles36.cardLabel, { color: theme.textPrimary }], children: o.label }),
|
|
4453
|
+
o.description ? /* @__PURE__ */ jsx47(Text15, { style: [styles36.cardDescription, { color: theme.textSecondary }], children: o.description }) : null
|
|
4345
4454
|
]
|
|
4346
4455
|
},
|
|
4347
4456
|
o.value
|
|
4348
4457
|
);
|
|
4349
|
-
return /* @__PURE__ */
|
|
4350
|
-
/* @__PURE__ */
|
|
4351
|
-
/* @__PURE__ */
|
|
4352
|
-
/* @__PURE__ */
|
|
4353
|
-
o.description ? /* @__PURE__ */
|
|
4458
|
+
return /* @__PURE__ */ jsxs42(Pressable18, { role: "radio", "aria-checked": checked, "aria-label": name, "aria-disabled": off || void 0, disabled: off, onPress: () => pick(o.value), style: [styles36.row, off ? styles36.disabled : null], children: [
|
|
4459
|
+
/* @__PURE__ */ jsx47(View41, { style: [styles36.dot, { borderColor: checked ? theme.accent : theme.borderStrong, backgroundColor: checked ? theme.accent : theme.surface1 }], children: checked ? /* @__PURE__ */ jsx47(View41, { style: [styles36.dotIn, { backgroundColor: theme.onAccent }] }) : null }),
|
|
4460
|
+
/* @__PURE__ */ jsxs42(View41, { style: styles36.rowText, children: [
|
|
4461
|
+
/* @__PURE__ */ jsx47(Text15, { style: [styles36.rowLabel, { color: theme.textPrimary }], children: o.label }),
|
|
4462
|
+
o.description ? /* @__PURE__ */ jsx47(Text15, { style: [styles36.cardDescription, { color: theme.textSecondary }], children: o.description }) : null
|
|
4354
4463
|
] })
|
|
4355
4464
|
] }, o.value);
|
|
4356
4465
|
});
|
|
4357
|
-
return /* @__PURE__ */
|
|
4358
|
-
/* @__PURE__ */
|
|
4359
|
-
|
|
4466
|
+
return /* @__PURE__ */ jsxs42(View41, { style: [styles36.root, style], children: [
|
|
4467
|
+
/* @__PURE__ */ jsx47(
|
|
4468
|
+
View41,
|
|
4360
4469
|
{
|
|
4361
4470
|
role: "radiogroup",
|
|
4362
4471
|
"aria-label": label,
|
|
@@ -4364,7 +4473,7 @@ function RadioGroup({ label, options, value: valueProp, defaultValue = null, onV
|
|
|
4364
4473
|
children: body
|
|
4365
4474
|
}
|
|
4366
4475
|
),
|
|
4367
|
-
error ? /* @__PURE__ */
|
|
4476
|
+
error ? /* @__PURE__ */ jsx47(Text15, { role: "alert", "aria-live": "polite", style: [styles36.error, { color: theme.dangerText }], children: error }) : null
|
|
4368
4477
|
] });
|
|
4369
4478
|
}
|
|
4370
4479
|
var styles36 = StyleSheet36.create({
|
|
@@ -4394,26 +4503,26 @@ var styles36 = StyleSheet36.create({
|
|
|
4394
4503
|
});
|
|
4395
4504
|
|
|
4396
4505
|
// src/native/screen.tsx
|
|
4397
|
-
import { KeyboardAvoidingView, Platform as Platform3, ScrollView as ScrollView6, StyleSheet as StyleSheet37, View as
|
|
4398
|
-
import { Fragment as Fragment7, jsx as
|
|
4506
|
+
import { KeyboardAvoidingView, Platform as Platform3, ScrollView as ScrollView6, StyleSheet as StyleSheet37, View as View42 } from "react-native";
|
|
4507
|
+
import { Fragment as Fragment7, jsx as jsx48, jsxs as jsxs43 } from "react/jsx-runtime";
|
|
4399
4508
|
function Screen({ header, footer, children, scroll = true, keyboard = true, padding = 16, surface = "surface0", contentStyle }) {
|
|
4400
4509
|
const { theme, insets } = useTheme();
|
|
4401
|
-
const body = scroll ? /* @__PURE__ */
|
|
4402
|
-
const inner = /* @__PURE__ */
|
|
4510
|
+
const body = scroll ? /* @__PURE__ */ jsx48(ScrollView6, { style: styles37.flex, contentContainerStyle: [{ padding, paddingTop: header ? padding : padding + insets.top, gap: 16 }, contentStyle], keyboardShouldPersistTaps: "handled", tabIndex: 0, children }) : /* @__PURE__ */ jsx48(View42, { style: [styles37.flex, { paddingTop: header ? 0 : insets.top }, contentStyle], children });
|
|
4511
|
+
const inner = /* @__PURE__ */ jsxs43(Fragment7, { children: [
|
|
4403
4512
|
header,
|
|
4404
4513
|
body,
|
|
4405
4514
|
footer
|
|
4406
4515
|
] });
|
|
4407
|
-
return /* @__PURE__ */
|
|
4516
|
+
return /* @__PURE__ */ jsx48(View42, { style: [styles37.flex, { backgroundColor: theme[surface] }], children: keyboard ? /* @__PURE__ */ jsx48(KeyboardAvoidingView, { style: styles37.flex, behavior: Platform3.OS === "ios" ? "padding" : void 0, children: inner }) : inner });
|
|
4408
4517
|
}
|
|
4409
4518
|
var styles37 = StyleSheet37.create({ flex: { flex: 1 } });
|
|
4410
4519
|
|
|
4411
4520
|
// src/native/search-field.tsx
|
|
4412
4521
|
import { useDebouncedCallback } from "@krizaka/pacer/react";
|
|
4413
4522
|
import * as React35 from "react";
|
|
4414
|
-
import { Pressable as Pressable19, StyleSheet as StyleSheet38, TextInput as TextInput6, View as
|
|
4415
|
-
import
|
|
4416
|
-
import { jsx as
|
|
4523
|
+
import { Pressable as Pressable19, StyleSheet as StyleSheet38, TextInput as TextInput6, View as View43 } from "react-native";
|
|
4524
|
+
import Svg23, { Circle as Circle13, Path as Path19 } from "react-native-svg";
|
|
4525
|
+
import { jsx as jsx49, jsxs as jsxs44 } from "react/jsx-runtime";
|
|
4417
4526
|
function SearchField({ label, value, defaultValue = "", onValueChange, onSearch, debounce = 300, onSubmit, clearLabel, cancelLabel, onCancel, style, placeholder, onFocus, onBlur, ...props }) {
|
|
4418
4527
|
const [focused, setFocused] = React35.useState(false);
|
|
4419
4528
|
const input = React35.useRef(null);
|
|
@@ -4427,12 +4536,12 @@ function SearchField({ label, value, defaultValue = "", onValueChange, onSearch,
|
|
|
4427
4536
|
search.cancel();
|
|
4428
4537
|
if (onSearch) search(next);
|
|
4429
4538
|
};
|
|
4430
|
-
const field = /* @__PURE__ */
|
|
4431
|
-
/* @__PURE__ */
|
|
4432
|
-
/* @__PURE__ */
|
|
4433
|
-
/* @__PURE__ */
|
|
4539
|
+
const field = /* @__PURE__ */ jsxs44(View43, { style: [styles38.frame, { borderRadius: radius3.md, borderColor: theme.borderDefault, backgroundColor: theme.surface2 }, style], children: [
|
|
4540
|
+
/* @__PURE__ */ jsxs44(Svg23, { width: 18, height: 18, viewBox: "0 0 24 24", fill: "none", stroke: theme.textSecondary, strokeWidth: 2, strokeLinecap: "round", "aria-hidden": true, children: [
|
|
4541
|
+
/* @__PURE__ */ jsx49(Circle13, { cx: 11, cy: 11, r: 7 }),
|
|
4542
|
+
/* @__PURE__ */ jsx49(Path19, { d: "m20 20-3.5-3.5" })
|
|
4434
4543
|
] }),
|
|
4435
|
-
/* @__PURE__ */
|
|
4544
|
+
/* @__PURE__ */ jsx49(
|
|
4436
4545
|
TextInput6,
|
|
4437
4546
|
{
|
|
4438
4547
|
ref: input,
|
|
@@ -4463,12 +4572,12 @@ function SearchField({ label, value, defaultValue = "", onValueChange, onSearch,
|
|
|
4463
4572
|
...props
|
|
4464
4573
|
}
|
|
4465
4574
|
),
|
|
4466
|
-
query ? /* @__PURE__ */
|
|
4575
|
+
query ? /* @__PURE__ */ jsx49(Pressable19, { role: "button", "aria-label": clearLabel, hitSlop: 10, onPress: () => change(""), style: styles38.clear, children: /* @__PURE__ */ jsx49(Svg23, { width: 16, height: 16, viewBox: "0 0 24 24", fill: "none", stroke: theme.textSecondary, strokeWidth: 2.4, strokeLinecap: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx49(Path19, { d: "M18 6 6 18M6 6l12 12" }) }) }) : null
|
|
4467
4576
|
] });
|
|
4468
4577
|
if (!cancelLabel || !onCancel) return field;
|
|
4469
|
-
return /* @__PURE__ */
|
|
4470
|
-
/* @__PURE__ */
|
|
4471
|
-
focused || query ? /* @__PURE__ */
|
|
4578
|
+
return /* @__PURE__ */ jsxs44(View43, { style: styles38.bar, children: [
|
|
4579
|
+
/* @__PURE__ */ jsx49(View43, { style: styles38.grow, children: field }),
|
|
4580
|
+
focused || query ? /* @__PURE__ */ jsx49(
|
|
4472
4581
|
Pressable19,
|
|
4473
4582
|
{
|
|
4474
4583
|
role: "button",
|
|
@@ -4479,7 +4588,7 @@ function SearchField({ label, value, defaultValue = "", onValueChange, onSearch,
|
|
|
4479
4588
|
},
|
|
4480
4589
|
hitSlop: 8,
|
|
4481
4590
|
style: styles38.cancel,
|
|
4482
|
-
children: /* @__PURE__ */
|
|
4591
|
+
children: /* @__PURE__ */ jsx49(Txt, { variant: "label", tone: "accent", children: cancelLabel })
|
|
4483
4592
|
}
|
|
4484
4593
|
) : null
|
|
4485
4594
|
] });
|
|
@@ -4494,19 +4603,19 @@ var styles38 = StyleSheet38.create({
|
|
|
4494
4603
|
});
|
|
4495
4604
|
|
|
4496
4605
|
// src/native/segmented.tsx
|
|
4497
|
-
import { Pressable as Pressable20, StyleSheet as StyleSheet39, Text as Text16, View as
|
|
4498
|
-
import { jsx as
|
|
4606
|
+
import { Pressable as Pressable20, StyleSheet as StyleSheet39, Text as Text16, View as View44 } from "react-native";
|
|
4607
|
+
import { jsx as jsx50 } from "react/jsx-runtime";
|
|
4499
4608
|
function Segmented({ options, value, onValueChange, size = "md", "aria-label": label, style }) {
|
|
4500
4609
|
const { theme, radius: radius3 } = useTheme();
|
|
4501
|
-
return /* @__PURE__ */
|
|
4502
|
-
|
|
4610
|
+
return /* @__PURE__ */ jsx50(
|
|
4611
|
+
View44,
|
|
4503
4612
|
{
|
|
4504
4613
|
role: "tablist",
|
|
4505
4614
|
"aria-label": label,
|
|
4506
4615
|
style: [styles39.track, { backgroundColor: theme.surface2, borderColor: theme.borderSubtle, borderRadius: radius3.md, height: size === "sm" ? 32 : 40 }, style],
|
|
4507
4616
|
children: options.map((option) => {
|
|
4508
4617
|
const selected = option.value === value;
|
|
4509
|
-
return /* @__PURE__ */
|
|
4618
|
+
return /* @__PURE__ */ jsx50(
|
|
4510
4619
|
Pressable20,
|
|
4511
4620
|
{
|
|
4512
4621
|
role: "tab",
|
|
@@ -4522,7 +4631,7 @@ function Segmented({ options, value, onValueChange, size = "md", "aria-label": l
|
|
|
4522
4631
|
selected ? { backgroundColor: theme.surface0, borderColor: theme.borderDefault } : null,
|
|
4523
4632
|
option.disabled ? styles39.disabled : null
|
|
4524
4633
|
],
|
|
4525
|
-
children: /* @__PURE__ */
|
|
4634
|
+
children: /* @__PURE__ */ jsx50(Text16, { numberOfLines: 1, style: [styles39.label, { color: selected ? theme.textPrimary : theme.textSecondary, fontSize: size === "sm" ? 12 : 13 }], children: option.label })
|
|
4526
4635
|
},
|
|
4527
4636
|
option.value
|
|
4528
4637
|
);
|
|
@@ -4539,9 +4648,9 @@ var styles39 = StyleSheet39.create({
|
|
|
4539
4648
|
|
|
4540
4649
|
// src/native/showcase.tsx
|
|
4541
4650
|
import * as React36 from "react";
|
|
4542
|
-
import { Animated as Animated21, AppState, Easing as Easing12, FlatList, Pressable as Pressable21, StyleSheet as StyleSheet40, View as
|
|
4543
|
-
import
|
|
4544
|
-
import { jsx as
|
|
4651
|
+
import { Animated as Animated21, AppState, Easing as Easing12, FlatList, Pressable as Pressable21, StyleSheet as StyleSheet40, View as View45 } from "react-native";
|
|
4652
|
+
import Svg24, { Path as Path20 } from "react-native-svg";
|
|
4653
|
+
import { jsx as jsx51, jsxs as jsxs45 } from "react/jsx-runtime";
|
|
4545
4654
|
var showcaseLabels = {
|
|
4546
4655
|
previous: "Previous slide",
|
|
4547
4656
|
next: "Next slide",
|
|
@@ -4600,9 +4709,9 @@ function Showcase({ label, items: items2, getId, renderItem, getTitle, interval
|
|
|
4600
4709
|
const item = items2[current];
|
|
4601
4710
|
const title = item !== void 0 ? getTitle?.(item) : void 0;
|
|
4602
4711
|
const control = [styles40.control, { borderColor: theme.borderDefault, backgroundColor: theme.surface1 }];
|
|
4603
|
-
const icon = (d) => /* @__PURE__ */
|
|
4604
|
-
return /* @__PURE__ */
|
|
4605
|
-
/* @__PURE__ */
|
|
4712
|
+
const icon = (d) => /* @__PURE__ */ jsx51(Svg24, { width: 16, height: 16, viewBox: "0 0 24 24", "aria-hidden": true, children: /* @__PURE__ */ jsx51(Path20, { d, stroke: theme.textSecondary, strokeWidth: 2.2, fill: "none", strokeLinecap: "round", strokeLinejoin: "round" }) });
|
|
4713
|
+
return /* @__PURE__ */ jsxs45(View45, { role: "group", "aria-label": label, style: [styles40.root, style], children: [
|
|
4714
|
+
/* @__PURE__ */ jsx51(View45, { "aria-live": announce ? "polite" : "off", onLayout: (e) => setWidth(e.nativeEvent.layout.width), children: /* @__PURE__ */ jsx51(
|
|
4606
4715
|
FlatList,
|
|
4607
4716
|
{
|
|
4608
4717
|
ref: list,
|
|
@@ -4623,21 +4732,21 @@ function Showcase({ label, items: items2, getId, renderItem, getTitle, interval
|
|
|
4623
4732
|
onIndexChange?.(next, true);
|
|
4624
4733
|
}
|
|
4625
4734
|
},
|
|
4626
|
-
renderItem: ({ item: slide, index }) => /* @__PURE__ */
|
|
4735
|
+
renderItem: ({ item: slide, index }) => /* @__PURE__ */ jsx51(View45, { role: "group", "aria-label": labels.slide(index + 1, total), style: { width }, children: Math.abs(index - current) <= 1 ? renderItem(slide, { index, active: index === current }) : null })
|
|
4627
4736
|
}
|
|
4628
4737
|
) }),
|
|
4629
|
-
/* @__PURE__ */
|
|
4630
|
-
i < current || i === current && !playing ? /* @__PURE__ */
|
|
4631
|
-
i === current && playing ? /* @__PURE__ */
|
|
4738
|
+
/* @__PURE__ */ jsx51(View45, { style: styles40.segments, children: items2.map((slide, i) => /* @__PURE__ */ jsx51(Pressable21, { role: "button", "aria-label": labels.goTo(i + 1, total), "aria-current": i === current ? true : void 0, onPress: () => go(i, true), style: styles40.segment, children: /* @__PURE__ */ jsxs45(View45, { style: [styles40.track, { backgroundColor: theme.surface3 }], children: [
|
|
4739
|
+
i < current || i === current && !playing ? /* @__PURE__ */ jsx51(View45, { style: [StyleSheet40.absoluteFill, { backgroundColor: theme.accent }] }) : null,
|
|
4740
|
+
i === current && playing ? /* @__PURE__ */ jsx51(Animated21.View, { style: [styles40.fill, { backgroundColor: theme.accent, width: fill.interpolate({ inputRange: [0, 1], outputRange: ["0%", "100%"] }) }] }) : null
|
|
4632
4741
|
] }) }, getId(slide))) }),
|
|
4633
|
-
/* @__PURE__ */
|
|
4634
|
-
/* @__PURE__ */
|
|
4742
|
+
/* @__PURE__ */ jsxs45(View45, { style: styles40.bar, children: [
|
|
4743
|
+
/* @__PURE__ */ jsxs45(Txt, { variant: "caption", tone: "secondary", numberOfLines: 1, style: styles40.counter, children: [
|
|
4635
4744
|
title ? `${title} \xB7 ` : "",
|
|
4636
4745
|
labels.counter(current + 1, total)
|
|
4637
4746
|
] }),
|
|
4638
|
-
/* @__PURE__ */
|
|
4639
|
-
playing ? /* @__PURE__ */
|
|
4640
|
-
/* @__PURE__ */
|
|
4747
|
+
/* @__PURE__ */ jsx51(Pressable21, { role: "button", "aria-label": labels.previous, disabled: !loop && current === 0, hitSlop: 6, onPress: () => go(current - 1, true), style: control, children: icon("M15 5l-7 7 7 7") }),
|
|
4748
|
+
playing ? /* @__PURE__ */ jsx51(Pressable21, { role: "button", "aria-label": paused ? labels.play : labels.pause, hitSlop: 6, onPress: () => setPaused(!paused), style: control, children: icon(paused ? "M8 5.5v13l10-6.5Z" : "M8 5v14M16 5v14") }) : null,
|
|
4749
|
+
/* @__PURE__ */ jsx51(Pressable21, { role: "button", "aria-label": labels.next, disabled: !loop && current === total - 1, hitSlop: 6, onPress: () => go(current + 1, true), style: control, children: icon("M9 5l7 7-7 7") })
|
|
4641
4750
|
] })
|
|
4642
4751
|
] });
|
|
4643
4752
|
}
|
|
@@ -4655,7 +4764,7 @@ var styles40 = StyleSheet40.create({
|
|
|
4655
4764
|
// src/native/skeleton.tsx
|
|
4656
4765
|
import * as React37 from "react";
|
|
4657
4766
|
import { Animated as Animated22 } from "react-native";
|
|
4658
|
-
import { jsx as
|
|
4767
|
+
import { jsx as jsx52 } from "react/jsx-runtime";
|
|
4659
4768
|
var SHAPE = {
|
|
4660
4769
|
text: { width: "100%", height: 12, radius: 4 },
|
|
4661
4770
|
circle: { width: 40, height: 40, radius: 9999 },
|
|
@@ -4681,7 +4790,7 @@ function Skeleton({ shape = "text", width, height, style, testID }) {
|
|
|
4681
4790
|
}, [reduce, opacity]);
|
|
4682
4791
|
const s = SHAPE[shape];
|
|
4683
4792
|
const side = shape === "circle" ? width ?? height ?? s.width : void 0;
|
|
4684
|
-
return /* @__PURE__ */
|
|
4793
|
+
return /* @__PURE__ */ jsx52(
|
|
4685
4794
|
Animated22.View,
|
|
4686
4795
|
{
|
|
4687
4796
|
testID,
|
|
@@ -4696,9 +4805,9 @@ function Skeleton({ shape = "text", width, height, style, testID }) {
|
|
|
4696
4805
|
|
|
4697
4806
|
// src/native/slider.tsx
|
|
4698
4807
|
import * as React38 from "react";
|
|
4699
|
-
import { PanResponder as PanResponder2, StyleSheet as StyleSheet41, Text as Text17, View as
|
|
4700
|
-
import
|
|
4701
|
-
import { jsx as
|
|
4808
|
+
import { PanResponder as PanResponder2, StyleSheet as StyleSheet41, Text as Text17, View as View46 } from "react-native";
|
|
4809
|
+
import Svg25, { Defs as Defs12, LinearGradient as LinearGradient12, Rect as Rect4, Stop as Stop12 } from "react-native-svg";
|
|
4810
|
+
import { jsx as jsx53, jsxs as jsxs46 } from "react/jsx-runtime";
|
|
4702
4811
|
var THUMB = 26;
|
|
4703
4812
|
var toArray = (v) => v === void 0 ? void 0 : typeof v === "number" ? [v] : [...v];
|
|
4704
4813
|
function Slider({
|
|
@@ -4790,24 +4899,24 @@ function Slider({
|
|
|
4790
4899
|
const along = (p) => vertical ? { bottom: p * length } : { left: p * length };
|
|
4791
4900
|
const onLayout = (e) => setLength(vertical ? e.nativeEvent.layout.height : e.nativeEvent.layout.width);
|
|
4792
4901
|
const fill = vertical ? { bottom: pct(lo) * length, height: (pct(hi) - pct(lo)) * length, left: 0, right: 0 } : { left: pct(lo) * length, width: (pct(hi) - pct(lo)) * length, top: 0, bottom: 0 };
|
|
4793
|
-
return /* @__PURE__ */
|
|
4794
|
-
showLabel ? /* @__PURE__ */
|
|
4795
|
-
/* @__PURE__ */
|
|
4796
|
-
/* @__PURE__ */
|
|
4902
|
+
return /* @__PURE__ */ jsxs46(View46, { style: [styles41.root, vertical ? styles41.rootVertical : null, disabled ? styles41.disabled : null, style], children: [
|
|
4903
|
+
showLabel ? /* @__PURE__ */ jsxs46(View46, { style: styles41.header, children: [
|
|
4904
|
+
/* @__PURE__ */ jsx53(Text17, { style: [styles41.label, { color: theme.textSecondary }], children: label }),
|
|
4905
|
+
/* @__PURE__ */ jsx53(Text17, { "aria-hidden": true, style: [styles41.value, { color: theme.textSecondary }], children: current.map(formatValue).join(" \u2013 ") })
|
|
4797
4906
|
] }) : null,
|
|
4798
|
-
/* @__PURE__ */
|
|
4799
|
-
/* @__PURE__ */
|
|
4800
|
-
/* @__PURE__ */
|
|
4801
|
-
/* @__PURE__ */
|
|
4802
|
-
/* @__PURE__ */
|
|
4803
|
-
/* @__PURE__ */
|
|
4907
|
+
/* @__PURE__ */ jsxs46(View46, { ...responder.panHandlers, style: vertical ? styles41.controlVertical : styles41.control, children: [
|
|
4908
|
+
/* @__PURE__ */ jsxs46(View46, { onLayout, pointerEvents: "none", style: [vertical ? styles41.trackVertical : styles41.track, { borderRadius: radius3.full, backgroundColor: theme.surface3 }], children: [
|
|
4909
|
+
/* @__PURE__ */ jsx53(View46, { style: [styles41.fill, fill, { borderRadius: radius3.full, overflow: "hidden", backgroundColor: theme.accent }], children: tone3 === "gradient" ? /* @__PURE__ */ jsxs46(Svg25, { width: "100%", height: "100%", "aria-hidden": true, children: [
|
|
4910
|
+
/* @__PURE__ */ jsx53(Defs12, { children: /* @__PURE__ */ jsxs46(LinearGradient12, { id: gradientId, x1: "0", y1: vertical ? "1" : "0", x2: vertical ? "0" : "1", y2: "0", children: [
|
|
4911
|
+
/* @__PURE__ */ jsx53(Stop12, { offset: "0", stopColor: theme.accent }),
|
|
4912
|
+
/* @__PURE__ */ jsx53(Stop12, { offset: "1", stopColor: theme.accent2 })
|
|
4804
4913
|
] }) }),
|
|
4805
|
-
/* @__PURE__ */
|
|
4914
|
+
/* @__PURE__ */ jsx53(Rect4, { width: "100%", height: "100%", fill: `url(#${gradientId})` })
|
|
4806
4915
|
] }) : null }),
|
|
4807
|
-
tickValues.map((t) => /* @__PURE__ */
|
|
4916
|
+
tickValues.map((t) => /* @__PURE__ */ jsx53(View46, { style: [vertical ? styles41.tickVertical : styles41.tick, along(pct(t)), { backgroundColor: t > lo && t < hi ? theme.onAccent : theme.borderStrong }] }, t))
|
|
4808
4917
|
] }),
|
|
4809
|
-
current.map((v, i) => /* @__PURE__ */
|
|
4810
|
-
|
|
4918
|
+
current.map((v, i) => /* @__PURE__ */ jsx53(
|
|
4919
|
+
View46,
|
|
4811
4920
|
{
|
|
4812
4921
|
accessible: true,
|
|
4813
4922
|
role: "slider",
|
|
@@ -4827,12 +4936,12 @@ function Slider({
|
|
|
4827
4936
|
},
|
|
4828
4937
|
pointerEvents: "none",
|
|
4829
4938
|
style: [styles41.thumb, vertical ? { bottom: pct(v) * length, left: (44 - THUMB) / 2, marginLeft: 0, marginTop: 0 } : { left: pct(v) * length - THUMB / 2, top: 0 }, { borderColor: theme.accent, backgroundColor: theme.textOnMedia, shadowColor: theme.scrimStrong }],
|
|
4830
|
-
children: floatingValue === "always" || floatingValue && dragging === i ? /* @__PURE__ */
|
|
4939
|
+
children: floatingValue === "always" || floatingValue && dragging === i ? /* @__PURE__ */ jsx53(View46, { "aria-hidden": true, style: [vertical ? styles41.bubbleVertical : styles41.bubble, { backgroundColor: theme.textPrimary, borderRadius: radius3.md }], children: /* @__PURE__ */ jsx53(Text17, { style: [styles41.bubbleText, { color: theme.surface0 }], children: formatValue(v) }) }) : null
|
|
4831
4940
|
},
|
|
4832
4941
|
i
|
|
4833
4942
|
))
|
|
4834
4943
|
] }),
|
|
4835
|
-
marks2?.length && !vertical ? /* @__PURE__ */
|
|
4944
|
+
marks2?.length && !vertical ? /* @__PURE__ */ jsx53(View46, { "aria-hidden": true, style: styles41.marks, children: marks2.map((m) => /* @__PURE__ */ jsx53(Text17, { style: [styles41.mark, { left: pct(m.value) * length, color: theme.textSecondary, transform: [{ translateX: m.value === min ? 0 : m.value === max ? -40 : -20 }], textAlign: m.value === min ? "left" : m.value === max ? "right" : "center" }], children: m.label }, m.value)) }) : null
|
|
4836
4945
|
] });
|
|
4837
4946
|
}
|
|
4838
4947
|
var styles41 = StyleSheet41.create({
|
|
@@ -4871,10 +4980,10 @@ var styles41 = StyleSheet41.create({
|
|
|
4871
4980
|
|
|
4872
4981
|
// src/native/spinner.tsx
|
|
4873
4982
|
import { ActivityIndicator as ActivityIndicator2 } from "react-native";
|
|
4874
|
-
import { jsx as
|
|
4983
|
+
import { jsx as jsx54 } from "react/jsx-runtime";
|
|
4875
4984
|
function Spinner({ label, size = "md", ...props }) {
|
|
4876
4985
|
const { theme } = useTheme();
|
|
4877
|
-
return /* @__PURE__ */
|
|
4986
|
+
return /* @__PURE__ */ jsx54(
|
|
4878
4987
|
ActivityIndicator2,
|
|
4879
4988
|
{
|
|
4880
4989
|
accessible: true,
|
|
@@ -4890,8 +4999,8 @@ function Spinner({ label, size = "md", ...props }) {
|
|
|
4890
4999
|
|
|
4891
5000
|
// src/native/splash-handoff.tsx
|
|
4892
5001
|
import * as React39 from "react";
|
|
4893
|
-
import { Animated as Animated23, Easing as Easing13, StyleSheet as StyleSheet42, View as
|
|
4894
|
-
import { jsx as
|
|
5002
|
+
import { Animated as Animated23, Easing as Easing13, StyleSheet as StyleSheet42, View as View47 } from "react-native";
|
|
5003
|
+
import { jsx as jsx55 } from "react/jsx-runtime";
|
|
4895
5004
|
function SplashHandoff({ product, ready, onShown, onDone, size = 96, background, label, duration = 320, style }) {
|
|
4896
5005
|
const { theme } = useTheme();
|
|
4897
5006
|
const reduce = useReducedMotion();
|
|
@@ -4909,7 +5018,7 @@ function SplashHandoff({ product, ready, onShown, onDone, size = 96, background,
|
|
|
4909
5018
|
return () => animation.stop();
|
|
4910
5019
|
}, [ready, reduce, duration, opacity, onDone]);
|
|
4911
5020
|
if (gone) return null;
|
|
4912
|
-
return /* @__PURE__ */
|
|
5021
|
+
return /* @__PURE__ */ jsx55(
|
|
4913
5022
|
Animated23.View,
|
|
4914
5023
|
{
|
|
4915
5024
|
accessible: true,
|
|
@@ -4919,26 +5028,26 @@ function SplashHandoff({ product, ready, onShown, onDone, size = 96, background,
|
|
|
4919
5028
|
pointerEvents: ready ? "none" : "auto",
|
|
4920
5029
|
onLayout: onShown,
|
|
4921
5030
|
style: [StyleSheet42.absoluteFill, styles42.root, { backgroundColor: background ?? theme.surface0, opacity }, style],
|
|
4922
|
-
children: /* @__PURE__ */
|
|
5031
|
+
children: /* @__PURE__ */ jsx55(View47, { children: /* @__PURE__ */ jsx55(ProductMark, { id: product, size, animated: true }) })
|
|
4923
5032
|
}
|
|
4924
5033
|
);
|
|
4925
5034
|
}
|
|
4926
5035
|
var styles42 = StyleSheet42.create({ root: { alignItems: "center", justifyContent: "center", zIndex: 100 } });
|
|
4927
5036
|
|
|
4928
5037
|
// src/native/step-progress.tsx
|
|
4929
|
-
import { Pressable as Pressable22, StyleSheet as StyleSheet43, View as
|
|
4930
|
-
import
|
|
4931
|
-
import { jsx as
|
|
5038
|
+
import { Pressable as Pressable22, StyleSheet as StyleSheet43, View as View48 } from "react-native";
|
|
5039
|
+
import Svg26, { Path as Path21 } from "react-native-svg";
|
|
5040
|
+
import { jsx as jsx56, jsxs as jsxs47 } from "react/jsx-runtime";
|
|
4932
5041
|
function StepProgress({ step, total, label, backLabel, onBack, trailing, style }) {
|
|
4933
5042
|
const { theme, insets } = useTheme();
|
|
4934
5043
|
const words2 = label(step, total);
|
|
4935
|
-
return /* @__PURE__ */
|
|
4936
|
-
/* @__PURE__ */
|
|
4937
|
-
onBack && backLabel ? /* @__PURE__ */
|
|
4938
|
-
/* @__PURE__ */
|
|
4939
|
-
/* @__PURE__ */
|
|
5044
|
+
return /* @__PURE__ */ jsxs47(View48, { style: [styles43.root, { paddingTop: insets.top + 8 }, style], children: [
|
|
5045
|
+
/* @__PURE__ */ jsxs47(View48, { style: styles43.row, children: [
|
|
5046
|
+
onBack && backLabel ? /* @__PURE__ */ jsx56(Pressable22, { role: "button", "aria-label": backLabel, hitSlop: 10, onPress: onBack, style: styles43.back, children: /* @__PURE__ */ jsx56(Svg26, { width: 22, height: 22, viewBox: "0 0 24 24", "aria-hidden": true, children: /* @__PURE__ */ jsx56(Path21, { d: "M15 5l-7 7 7 7", stroke: theme.textPrimary, strokeWidth: 2.4, fill: "none", strokeLinecap: "round", strokeLinejoin: "round" }) }) }) : /* @__PURE__ */ jsx56(View48, { style: styles43.back }),
|
|
5047
|
+
/* @__PURE__ */ jsx56(View48, { accessible: true, role: "progressbar", "aria-label": words2, "aria-valuemin": 1, "aria-valuemax": total, "aria-valuenow": step, "aria-valuetext": words2, style: styles43.bars, children: Array.from({ length: total }, (_, i) => /* @__PURE__ */ jsx56(View48, { style: [styles43.bar, { backgroundColor: i < step ? theme.accent : theme.surface3 }] }, i)) }),
|
|
5048
|
+
/* @__PURE__ */ jsx56(View48, { style: styles43.trailing, children: trailing })
|
|
4940
5049
|
] }),
|
|
4941
|
-
/* @__PURE__ */
|
|
5050
|
+
/* @__PURE__ */ jsx56(Txt, { variant: "caption", tone: "secondary", style: styles43.words, "aria-hidden": true, children: words2 })
|
|
4942
5051
|
] });
|
|
4943
5052
|
}
|
|
4944
5053
|
var styles43 = StyleSheet43.create({
|
|
@@ -4952,31 +5061,31 @@ var styles43 = StyleSheet43.create({
|
|
|
4952
5061
|
});
|
|
4953
5062
|
|
|
4954
5063
|
// src/native/stepper.tsx
|
|
4955
|
-
import { StyleSheet as StyleSheet44, View as
|
|
4956
|
-
import
|
|
4957
|
-
import { jsx as
|
|
5064
|
+
import { StyleSheet as StyleSheet44, View as View49 } from "react-native";
|
|
5065
|
+
import Svg27, { Circle as Circle14, Path as Path22 } from "react-native-svg";
|
|
5066
|
+
import { jsx as jsx57, jsxs as jsxs48 } from "react/jsx-runtime";
|
|
4958
5067
|
var WORDS = { done: "done", current: "in progress", upcoming: "to come", error: "failed" };
|
|
4959
5068
|
function Stepper({ steps, current = 0, orientation = "vertical", statusLabels, "aria-label": label, style }) {
|
|
4960
5069
|
const { theme } = useTheme();
|
|
4961
5070
|
const words2 = { ...WORDS, ...statusLabels };
|
|
4962
5071
|
const vertical = orientation === "vertical";
|
|
4963
|
-
return /* @__PURE__ */
|
|
5072
|
+
return /* @__PURE__ */ jsx57(View49, { role: "list", "aria-label": label, style: [vertical ? styles44.column : styles44.row, style], children: steps.map((step, i) => {
|
|
4964
5073
|
const status = step.status ?? (i < current ? "done" : i === current ? "current" : "upcoming");
|
|
4965
5074
|
const last = i === steps.length - 1;
|
|
4966
|
-
const node = status === "current" ? /* @__PURE__ */
|
|
4967
|
-
/* @__PURE__ */
|
|
4968
|
-
status === "done" ? /* @__PURE__ */
|
|
5075
|
+
const node = status === "current" ? /* @__PURE__ */ jsx57(LoaderGlyph, { value: step.value ?? null, size: 24 }) : status === "error" ? /* @__PURE__ */ jsx57(LoaderGlyph, { state: "error", size: 24 }) : /* @__PURE__ */ jsxs48(Svg27, { width: 24, height: 24, viewBox: "0 0 24 24", "aria-hidden": true, children: [
|
|
5076
|
+
/* @__PURE__ */ jsx57(Circle14, { cx: 12, cy: 12, r: 10, fill: status === "done" ? theme.accent : "none", stroke: status === "done" ? theme.accent : theme.borderStrong, strokeWidth: 2 }),
|
|
5077
|
+
status === "done" ? /* @__PURE__ */ jsx57(Path22, { d: "M7.5 12.3l3 3 6-6.3", stroke: theme.onAccent, strokeWidth: 2.2, fill: "none", strokeLinecap: "round", strokeLinejoin: "round" }) : null
|
|
4969
5078
|
] });
|
|
4970
|
-
const connector = !last ? /* @__PURE__ */
|
|
4971
|
-
return /* @__PURE__ */
|
|
4972
|
-
/* @__PURE__ */
|
|
5079
|
+
const connector = !last ? /* @__PURE__ */ jsx57(View49, { "aria-hidden": true, style: [vertical ? styles44.vLine : styles44.hLine, { backgroundColor: status === "done" ? theme.accent : theme.borderDefault }] }) : null;
|
|
5080
|
+
return /* @__PURE__ */ jsxs48(View49, { role: "listitem", accessible: true, "aria-label": `${step.title}, ${words2[status]}`, style: vertical ? styles44.vStep : styles44.hStep, children: [
|
|
5081
|
+
/* @__PURE__ */ jsxs48(View49, { style: vertical ? styles44.vRail : styles44.hRail, children: [
|
|
4973
5082
|
node,
|
|
4974
5083
|
connector
|
|
4975
5084
|
] }),
|
|
4976
|
-
/* @__PURE__ */
|
|
4977
|
-
/* @__PURE__ */
|
|
4978
|
-
step.description ? /* @__PURE__ */
|
|
4979
|
-
step.content && (status === "current" || status === "error") ? /* @__PURE__ */
|
|
5085
|
+
/* @__PURE__ */ jsxs48(View49, { style: [styles44.body, vertical && !last ? { paddingBottom: 20 } : null], children: [
|
|
5086
|
+
/* @__PURE__ */ jsx57(Txt, { variant: "label", tone: status === "upcoming" ? "secondary" : "text", numberOfLines: vertical ? void 0 : 2, children: step.title }),
|
|
5087
|
+
step.description ? /* @__PURE__ */ jsx57(Txt, { variant: "caption", tone: "secondary", children: step.description }) : null,
|
|
5088
|
+
step.content && (status === "current" || status === "error") ? /* @__PURE__ */ jsx57(View49, { style: styles44.content, children: step.content }) : null
|
|
4980
5089
|
] })
|
|
4981
5090
|
] }, i);
|
|
4982
5091
|
}) });
|
|
@@ -4996,17 +5105,17 @@ var styles44 = StyleSheet44.create({
|
|
|
4996
5105
|
|
|
4997
5106
|
// src/native/swipe-deck.tsx
|
|
4998
5107
|
import * as React40 from "react";
|
|
4999
|
-
import { AccessibilityInfo as AccessibilityInfo14, Animated as Animated24, Image as Image5, PanResponder as PanResponder3, Platform as Platform4, Pressable as Pressable23, StyleSheet as StyleSheet45, useWindowDimensions as useWindowDimensions2, View as
|
|
5000
|
-
import
|
|
5001
|
-
import { Fragment as Fragment8, jsx as
|
|
5108
|
+
import { AccessibilityInfo as AccessibilityInfo14, Animated as Animated24, Image as Image5, PanResponder as PanResponder3, Platform as Platform4, Pressable as Pressable23, StyleSheet as StyleSheet45, useWindowDimensions as useWindowDimensions2, View as View50 } from "react-native";
|
|
5109
|
+
import Svg28, { Defs as Defs13, LinearGradient as LinearGradient13, Path as Path23, Rect as Rect5, Stop as Stop13 } from "react-native-svg";
|
|
5110
|
+
import { Fragment as Fragment8, jsx as jsx58, jsxs as jsxs49 } from "react/jsx-runtime";
|
|
5002
5111
|
function PersonCard({ photos, name, age, badge, meta, bio, footer, photoLabel = (n, t) => `Photo ${n} of ${t}`, style }) {
|
|
5003
5112
|
const { theme, radius: radius3 } = useTheme();
|
|
5004
5113
|
const [index, setIndex] = React40.useState(0);
|
|
5005
5114
|
const gradient = useSvgId("kz-profile-");
|
|
5006
5115
|
const [box, setBox] = React40.useState(null);
|
|
5007
5116
|
const photo = photos[index];
|
|
5008
|
-
return /* @__PURE__ */
|
|
5009
|
-
|
|
5117
|
+
return /* @__PURE__ */ jsxs49(
|
|
5118
|
+
View50,
|
|
5010
5119
|
{
|
|
5011
5120
|
accessible: Platform4.OS !== "web",
|
|
5012
5121
|
accessibilityActions: photos.length > 1 ? [{ name: "increment" }, { name: "decrement" }] : [],
|
|
@@ -5015,39 +5124,39 @@ function PersonCard({ photos, name, age, badge, meta, bio, footer, photoLabel =
|
|
|
5015
5124
|
"aria-label": [`${name}${age !== void 0 ? `, ${age}` : ""}`, bio, photos.length > 1 ? photoLabel(index + 1, photos.length) : null].filter(Boolean).join(". "),
|
|
5016
5125
|
style: [styles45.card, { borderRadius: radius3.xl, backgroundColor: theme.media }, style],
|
|
5017
5126
|
children: [
|
|
5018
|
-
photo ? /* @__PURE__ */
|
|
5019
|
-
photos.length > 1 ? /* @__PURE__ */
|
|
5020
|
-
/* @__PURE__ */
|
|
5021
|
-
/* @__PURE__ */
|
|
5022
|
-
/* @__PURE__ */
|
|
5127
|
+
photo ? /* @__PURE__ */ jsx58(Image5, { testID: "person-card-photo", source: { uri: photo.uri }, style: StyleSheet45.absoluteFill, resizeMode: "cover" }) : null,
|
|
5128
|
+
photos.length > 1 ? /* @__PURE__ */ jsxs49(Fragment8, { children: [
|
|
5129
|
+
/* @__PURE__ */ jsx58(View50, { style: styles45.bars, "aria-hidden": true, children: photos.map((_, i) => /* @__PURE__ */ jsx58(View50, { style: [styles45.bar, { backgroundColor: theme.textOnMedia, opacity: i === index ? 1 : 0.4 }] }, i)) }),
|
|
5130
|
+
/* @__PURE__ */ jsx58(Pressable23, { "aria-hidden": true, accessible: false, focusable: false, tabIndex: -1, style: [styles45.half, { left: 0 }], onPress: () => setIndex((i) => Math.max(0, i - 1)) }),
|
|
5131
|
+
/* @__PURE__ */ jsx58(Pressable23, { "aria-hidden": true, accessible: false, focusable: false, tabIndex: -1, style: [styles45.half, { right: 0 }], onPress: () => setIndex((i) => Math.min(photos.length - 1, i + 1)) })
|
|
5023
5132
|
] }) : null,
|
|
5024
|
-
/* @__PURE__ */
|
|
5025
|
-
|
|
5133
|
+
/* @__PURE__ */ jsxs49(
|
|
5134
|
+
View50,
|
|
5026
5135
|
{
|
|
5027
5136
|
testID: "person-card-overlay",
|
|
5028
5137
|
pointerEvents: "box-none",
|
|
5029
5138
|
style: styles45.bottom,
|
|
5030
5139
|
onLayout: (e) => setBox({ width: e.nativeEvent.layout.width, height: e.nativeEvent.layout.height }),
|
|
5031
5140
|
children: [
|
|
5032
|
-
box ? /* @__PURE__ */
|
|
5033
|
-
/* @__PURE__ */
|
|
5034
|
-
/* @__PURE__ */
|
|
5035
|
-
/* @__PURE__ */
|
|
5036
|
-
/* @__PURE__ */
|
|
5141
|
+
box ? /* @__PURE__ */ jsxs49(Svg28, { testID: "person-card-scrim", style: styles45.scrim, width: box.width, height: box.height, "aria-hidden": true, children: [
|
|
5142
|
+
/* @__PURE__ */ jsx58(Defs13, { children: /* @__PURE__ */ jsxs49(LinearGradient13, { id: gradient, x1: "0", y1: "0", x2: "0", y2: "1", children: [
|
|
5143
|
+
/* @__PURE__ */ jsx58(Stop13, { offset: "0", stopColor: theme.scrimStrong, stopOpacity: 0 }),
|
|
5144
|
+
/* @__PURE__ */ jsx58(Stop13, { offset: "0.5", stopColor: theme.scrimStrong, stopOpacity: 0.8 }),
|
|
5145
|
+
/* @__PURE__ */ jsx58(Stop13, { offset: "1", stopColor: theme.scrimStrong, stopOpacity: 1 })
|
|
5037
5146
|
] }) }),
|
|
5038
|
-
/* @__PURE__ */
|
|
5147
|
+
/* @__PURE__ */ jsx58(Rect5, { x: 0, y: 0, width: box.width, height: box.height, fill: `url(#${gradient})` })
|
|
5039
5148
|
] }) : null,
|
|
5040
|
-
/* @__PURE__ */
|
|
5041
|
-
/* @__PURE__ */
|
|
5042
|
-
/* @__PURE__ */
|
|
5149
|
+
/* @__PURE__ */ jsxs49(View50, { style: styles45.text, children: [
|
|
5150
|
+
/* @__PURE__ */ jsxs49(View50, { style: styles45.nameRow, children: [
|
|
5151
|
+
/* @__PURE__ */ jsxs49(Txt, { variant: "display", tone: "onMedia", style: styles45.name, numberOfLines: 1, children: [
|
|
5043
5152
|
name,
|
|
5044
|
-
age !== void 0 ? /* @__PURE__ */
|
|
5153
|
+
age !== void 0 ? /* @__PURE__ */ jsx58(Txt, { variant: "display", tone: "onMedia", style: styles45.age, children: ` ${age}` }) : null
|
|
5045
5154
|
] }),
|
|
5046
5155
|
badge
|
|
5047
5156
|
] }),
|
|
5048
5157
|
meta,
|
|
5049
|
-
bio ? /* @__PURE__ */
|
|
5050
|
-
footer ? /* @__PURE__ */
|
|
5158
|
+
bio ? /* @__PURE__ */ jsx58(Txt, { tone: "onMedia", numberOfLines: 2, children: bio }) : null,
|
|
5159
|
+
footer ? /* @__PURE__ */ jsx58(View50, { style: styles45.footer, children: footer }) : null
|
|
5051
5160
|
] })
|
|
5052
5161
|
]
|
|
5053
5162
|
}
|
|
@@ -5091,7 +5200,7 @@ function SwipeDeck({ items: items2, getId, renderCard, onSwipe, empty: empty2, l
|
|
|
5091
5200
|
const rotate = x.interpolate({ inputRange: [-width, 0, width], outputRange: ["-14deg", "0deg", "14deg"] });
|
|
5092
5201
|
const likeOpacity = x.interpolate({ inputRange: [0, width / 4], outputRange: [0, 1], extrapolate: "clamp" });
|
|
5093
5202
|
const passOpacity = x.interpolate({ inputRange: [-width / 4, 0], outputRange: [1, 0], extrapolate: "clamp" });
|
|
5094
|
-
const button = (direction) => /* @__PURE__ */
|
|
5203
|
+
const button = (direction) => /* @__PURE__ */ jsx58(
|
|
5095
5204
|
Pressable23,
|
|
5096
5205
|
{
|
|
5097
5206
|
role: "button",
|
|
@@ -5102,15 +5211,15 @@ function SwipeDeck({ items: items2, getId, renderCard, onSwipe, empty: empty2, l
|
|
|
5102
5211
|
styles45.button,
|
|
5103
5212
|
{ borderColor: direction === "like" ? theme.success : theme.danger, backgroundColor: theme.surface1, transform: [{ scale: pressed ? 0.92 : 1 }], opacity: top ? 1 : 0.4 }
|
|
5104
5213
|
],
|
|
5105
|
-
children: /* @__PURE__ */
|
|
5214
|
+
children: /* @__PURE__ */ jsx58(Svg28, { width: 28, height: 28, viewBox: "0 0 24 24", "aria-hidden": true, children: direction === "like" ? /* @__PURE__ */ jsx58(Path23, { d: "M12 20s-7-4.4-7-10a4 4 0 0 1 7-2.6A4 4 0 0 1 19 10c0 5.6-7 10-7 10z", fill: theme.success }) : /* @__PURE__ */ jsx58(Path23, { d: "M6 6l12 12M18 6 6 18", stroke: theme.danger, strokeWidth: 3, strokeLinecap: "round" }) })
|
|
5106
5215
|
}
|
|
5107
5216
|
);
|
|
5108
|
-
return /* @__PURE__ */
|
|
5109
|
-
/* @__PURE__ */
|
|
5217
|
+
return /* @__PURE__ */ jsxs49(View50, { style: [styles45.deck, style], children: [
|
|
5218
|
+
/* @__PURE__ */ jsxs49(View50, { style: styles45.stack, children: [
|
|
5110
5219
|
!top ? empty2 ?? null : null,
|
|
5111
5220
|
items2.slice(0, 2).reverse().map((item) => {
|
|
5112
5221
|
const isTop = item === top;
|
|
5113
|
-
return /* @__PURE__ */
|
|
5222
|
+
return /* @__PURE__ */ jsxs49(
|
|
5114
5223
|
Animated24.View,
|
|
5115
5224
|
{
|
|
5116
5225
|
...isTop ? pan.panHandlers : {},
|
|
@@ -5122,9 +5231,9 @@ function SwipeDeck({ items: items2, getId, renderCard, onSwipe, empty: empty2, l
|
|
|
5122
5231
|
style: [StyleSheet45.absoluteFill, isTop ? { transform: [{ translateX: x }, { rotate }] } : { transform: [{ scale: 0.96 }], opacity: 0.9 }],
|
|
5123
5232
|
children: [
|
|
5124
5233
|
renderCard(item),
|
|
5125
|
-
isTop ? /* @__PURE__ */
|
|
5126
|
-
/* @__PURE__ */
|
|
5127
|
-
/* @__PURE__ */
|
|
5234
|
+
isTop ? /* @__PURE__ */ jsxs49(Fragment8, { children: [
|
|
5235
|
+
/* @__PURE__ */ jsx58(Animated24.View, { pointerEvents: "none", style: [styles45.stamp, styles45.stampLike, { borderColor: theme.success, opacity: likeOpacity }], "aria-hidden": true, children: /* @__PURE__ */ jsx58(Txt, { variant: "title", style: { color: theme.success }, children: labels.likeStamp ?? labels.like.toUpperCase() }) }),
|
|
5236
|
+
/* @__PURE__ */ jsx58(Animated24.View, { pointerEvents: "none", style: [styles45.stamp, styles45.stampPass, { borderColor: theme.danger, opacity: passOpacity }], "aria-hidden": true, children: /* @__PURE__ */ jsx58(Txt, { variant: "title", style: { color: theme.danger }, children: labels.passStamp ?? labels.pass.toUpperCase() }) })
|
|
5128
5237
|
] }) : null
|
|
5129
5238
|
]
|
|
5130
5239
|
},
|
|
@@ -5132,7 +5241,7 @@ function SwipeDeck({ items: items2, getId, renderCard, onSwipe, empty: empty2, l
|
|
|
5132
5241
|
);
|
|
5133
5242
|
})
|
|
5134
5243
|
] }),
|
|
5135
|
-
hideButtons ? null : /* @__PURE__ */
|
|
5244
|
+
hideButtons ? null : /* @__PURE__ */ jsxs49(View50, { style: styles45.buttons, children: [
|
|
5136
5245
|
button("pass"),
|
|
5137
5246
|
button("like")
|
|
5138
5247
|
] })
|
|
@@ -5161,8 +5270,8 @@ var styles45 = StyleSheet45.create({
|
|
|
5161
5270
|
|
|
5162
5271
|
// src/native/swipeable-row.tsx
|
|
5163
5272
|
import * as React41 from "react";
|
|
5164
|
-
import { Animated as Animated25, PanResponder as PanResponder4, Pressable as Pressable24, StyleSheet as StyleSheet46, View as
|
|
5165
|
-
import { jsx as
|
|
5273
|
+
import { Animated as Animated25, PanResponder as PanResponder4, Pressable as Pressable24, StyleSheet as StyleSheet46, View as View51 } from "react-native";
|
|
5274
|
+
import { jsx as jsx59, jsxs as jsxs50 } from "react/jsx-runtime";
|
|
5166
5275
|
var toneColor = (t, tone3) => ({ neutral: t.surface3, accent: t.accent, success: t.success, warning: t.warning, danger: t.danger })[tone3 ?? "neutral"];
|
|
5167
5276
|
var toneText = (tone3) => tone3 === "neutral" || tone3 === void 0 ? "text" : "onAccent";
|
|
5168
5277
|
function SwipeableRow({ children, trailing = [], leading = [], fullSwipe = 0.6, actionWidth = 80, onActivate, testID, style }) {
|
|
@@ -5210,18 +5319,18 @@ function SwipeableRow({ children, trailing = [], leading = [], fullSwipe = 0.6,
|
|
|
5210
5319
|
[trailing, leading, fullSwipe, width, actionWidth]
|
|
5211
5320
|
// eslint-disable-line react-hooks/exhaustive-deps -- run/settle are stable in effect
|
|
5212
5321
|
);
|
|
5213
|
-
const side = (actions, edge) => /* @__PURE__ */
|
|
5322
|
+
const side = (actions, edge) => /* @__PURE__ */ jsx59(View51, { "aria-hidden": true, style: [styles46.side, edge === "left" ? { left: 0 } : { right: 0, flexDirection: "row-reverse" }], children: actions.map((action, i) => (
|
|
5214
5323
|
// eslint-disable-next-line react-hooks/refs -- runs on a press, never during render
|
|
5215
|
-
/* @__PURE__ */
|
|
5324
|
+
/* @__PURE__ */ jsxs50(Pressable24, { focusable: false, tabIndex: -1, onPress: () => run(action), style: [styles46.action, { width: actionWidth, backgroundColor: toneColor(theme, action.tone) }], children: [
|
|
5216
5325
|
action.icon,
|
|
5217
|
-
/* @__PURE__ */
|
|
5326
|
+
/* @__PURE__ */ jsx59(Txt, { variant: "caption", tone: toneText(action.tone), style: styles46.actionText, numberOfLines: 1, children: action.label })
|
|
5218
5327
|
] }, i)
|
|
5219
5328
|
)) });
|
|
5220
5329
|
const all = [...leading, ...trailing];
|
|
5221
|
-
return /* @__PURE__ */
|
|
5330
|
+
return /* @__PURE__ */ jsxs50(View51, { style: [styles46.root, style], onLayout: (e) => setWidth(e.nativeEvent.layout.width), children: [
|
|
5222
5331
|
leading.length > 0 ? side(leading, "left") : null,
|
|
5223
5332
|
trailing.length > 0 ? side(trailing, "right") : null,
|
|
5224
|
-
/* @__PURE__ */
|
|
5333
|
+
/* @__PURE__ */ jsx59(
|
|
5225
5334
|
Animated25.View,
|
|
5226
5335
|
{
|
|
5227
5336
|
...pan.panHandlers,
|
|
@@ -5249,8 +5358,8 @@ var styles46 = StyleSheet46.create({
|
|
|
5249
5358
|
|
|
5250
5359
|
// src/native/switch.tsx
|
|
5251
5360
|
import * as React42 from "react";
|
|
5252
|
-
import { Animated as Animated26, Pressable as Pressable25, StyleSheet as StyleSheet47, Text as Text18, View as
|
|
5253
|
-
import { jsx as
|
|
5361
|
+
import { Animated as Animated26, Pressable as Pressable25, StyleSheet as StyleSheet47, Text as Text18, View as View52 } from "react-native";
|
|
5362
|
+
import { jsx as jsx60, jsxs as jsxs51 } from "react/jsx-runtime";
|
|
5254
5363
|
var SIZES = { sm: { w: 40, h: 24, knob: 18 }, md: { w: 52, h: 32, knob: 26 } };
|
|
5255
5364
|
function Switch({ label, checked, defaultChecked = false, onCheckedChange, description, showLabel, size = "md", error, disabled, style }) {
|
|
5256
5365
|
const { theme, motion: motion3, haptic } = useTheme();
|
|
@@ -5267,7 +5376,7 @@ function Switch({ label, checked, defaultChecked = false, onCheckedChange, descr
|
|
|
5267
5376
|
if (checked === void 0) setOwn(!on);
|
|
5268
5377
|
onCheckedChange?.(!on);
|
|
5269
5378
|
};
|
|
5270
|
-
const track = /* @__PURE__ */
|
|
5379
|
+
const track = /* @__PURE__ */ jsx60(View52, { style: [styles47.track, { width: d.w, height: d.h, borderRadius: d.h / 2, backgroundColor: on ? theme.accent : theme.surface3, borderColor: error ? theme.danger : on ? theme.accent : theme.borderDefault }], children: /* @__PURE__ */ jsx60(
|
|
5271
5380
|
Animated26.View,
|
|
5272
5381
|
{
|
|
5273
5382
|
style: [
|
|
@@ -5293,16 +5402,16 @@ function Switch({ label, checked, defaultChecked = false, onCheckedChange, descr
|
|
|
5293
5402
|
onPress: toggle
|
|
5294
5403
|
};
|
|
5295
5404
|
if (!showLabel)
|
|
5296
|
-
return /* @__PURE__ */
|
|
5297
|
-
return /* @__PURE__ */
|
|
5298
|
-
/* @__PURE__ */
|
|
5299
|
-
/* @__PURE__ */
|
|
5300
|
-
/* @__PURE__ */
|
|
5301
|
-
description ? /* @__PURE__ */
|
|
5405
|
+
return /* @__PURE__ */ jsx60(Pressable25, { ...a11y, hitSlop: { top: (44 - d.h) / 2, bottom: (44 - d.h) / 2, left: Math.max(0, (44 - d.w) / 2), right: Math.max(0, (44 - d.w) / 2) }, style: [disabled ? styles47.disabled : null, style], children: track });
|
|
5406
|
+
return /* @__PURE__ */ jsxs51(View52, { style: [styles47.root, style], children: [
|
|
5407
|
+
/* @__PURE__ */ jsxs51(Pressable25, { ...a11y, style: [styles47.row, disabled ? styles47.disabled : null], children: [
|
|
5408
|
+
/* @__PURE__ */ jsxs51(View52, { style: styles47.text, children: [
|
|
5409
|
+
/* @__PURE__ */ jsx60(Text18, { style: [styles47.label, { color: theme.textPrimary }], children: label }),
|
|
5410
|
+
description ? /* @__PURE__ */ jsx60(Text18, { style: [styles47.description, { color: theme.textSecondary }], children: description }) : null
|
|
5302
5411
|
] }),
|
|
5303
5412
|
track
|
|
5304
5413
|
] }),
|
|
5305
|
-
error ? /* @__PURE__ */
|
|
5414
|
+
error ? /* @__PURE__ */ jsx60(Text18, { role: "alert", "aria-live": "polite", style: [styles47.description, { color: theme.dangerText }], children: error }) : null
|
|
5306
5415
|
] });
|
|
5307
5416
|
}
|
|
5308
5417
|
var styles47 = StyleSheet47.create({
|
|
@@ -5317,15 +5426,15 @@ var styles47 = StyleSheet47.create({
|
|
|
5317
5426
|
});
|
|
5318
5427
|
|
|
5319
5428
|
// src/native/tab-bar.tsx
|
|
5320
|
-
import { Pressable as Pressable26, StyleSheet as StyleSheet48, Text as Text19, View as
|
|
5321
|
-
import { jsx as
|
|
5429
|
+
import { Pressable as Pressable26, StyleSheet as StyleSheet48, Text as Text19, View as View53 } from "react-native";
|
|
5430
|
+
import { jsx as jsx61, jsxs as jsxs52 } from "react/jsx-runtime";
|
|
5322
5431
|
function TabBar({ items: items2, value, onValueChange, onReselect, "aria-label": label, style }) {
|
|
5323
5432
|
const { theme, insets, haptic } = useTheme();
|
|
5324
|
-
return /* @__PURE__ */
|
|
5433
|
+
return /* @__PURE__ */ jsx61(View53, { role: "tablist", "aria-label": label, style: [styles48.bar, { backgroundColor: theme.glassBg, borderTopColor: theme.glassBorder, paddingBottom: Math.max(6, insets.bottom) }, style], children: items2.map((item) => {
|
|
5325
5434
|
const selected = item.value === value;
|
|
5326
5435
|
const color = selected ? theme.accentText : theme.textSecondary;
|
|
5327
5436
|
const badge = item.badge === true ? "" : typeof item.badge === "number" && item.badge > 0 ? item.badge > 99 ? "99+" : String(item.badge) : null;
|
|
5328
|
-
return /* @__PURE__ */
|
|
5437
|
+
return /* @__PURE__ */ jsxs52(
|
|
5329
5438
|
Pressable26,
|
|
5330
5439
|
{
|
|
5331
5440
|
role: "tab",
|
|
@@ -5337,12 +5446,12 @@ function TabBar({ items: items2, value, onValueChange, onReselect, "aria-label":
|
|
|
5337
5446
|
},
|
|
5338
5447
|
style: ({ pressed }) => [styles48.item, { opacity: pressed ? 0.7 : 1 }],
|
|
5339
5448
|
children: [
|
|
5340
|
-
/* @__PURE__ */
|
|
5449
|
+
/* @__PURE__ */ jsxs52(View53, { "aria-hidden": true, style: styles48.icon, children: [
|
|
5341
5450
|
item.icon(selected, color),
|
|
5342
|
-
badge !== null ? /* @__PURE__ */
|
|
5451
|
+
badge !== null ? /* @__PURE__ */ jsx61(View53, { style: [badge ? styles48.count : styles48.dot, { backgroundColor: theme.danger, borderColor: theme.surface1 }], children: badge ? /* @__PURE__ */ jsx61(Text19, { style: [styles48.countText, { color: theme.onAccent }], children: badge }) : null }) : null
|
|
5343
5452
|
] }),
|
|
5344
|
-
/* @__PURE__ */
|
|
5345
|
-
badge !== null && item.badgeLabel ? /* @__PURE__ */
|
|
5453
|
+
/* @__PURE__ */ jsx61(Text19, { numberOfLines: 1, style: [styles48.label, { color, fontWeight: selected ? "700" : "500" }], children: item.label }),
|
|
5454
|
+
badge !== null && item.badgeLabel ? /* @__PURE__ */ jsx61(Text19, { style: styles48.unseen, children: `, ${item.badgeLabel}` }) : null
|
|
5346
5455
|
]
|
|
5347
5456
|
},
|
|
5348
5457
|
item.value
|
|
@@ -5362,8 +5471,8 @@ var styles48 = StyleSheet48.create({
|
|
|
5362
5471
|
|
|
5363
5472
|
// src/native/tabs.tsx
|
|
5364
5473
|
import * as React43 from "react";
|
|
5365
|
-
import { Pressable as Pressable27, ScrollView as ScrollView7, StyleSheet as StyleSheet49, View as
|
|
5366
|
-
import { jsx as
|
|
5474
|
+
import { Pressable as Pressable27, ScrollView as ScrollView7, StyleSheet as StyleSheet49, View as View54 } from "react-native";
|
|
5475
|
+
import { jsx as jsx62, jsxs as jsxs53 } from "react/jsx-runtime";
|
|
5367
5476
|
function Tabs({ items: items2, value, defaultValue, onValueChange, "aria-label": label, variant = "underline", style }) {
|
|
5368
5477
|
const { theme, radius: radius3, haptic } = useTheme();
|
|
5369
5478
|
const [own, setOwn] = React43.useState(defaultValue ?? items2[0]?.value);
|
|
@@ -5377,7 +5486,7 @@ function Tabs({ items: items2, value, defaultValue, onValueChange, "aria-label":
|
|
|
5377
5486
|
const segmented = variant === "segmented";
|
|
5378
5487
|
const tabs = items2.map((item) => {
|
|
5379
5488
|
const selected = item.value === current;
|
|
5380
|
-
return /* @__PURE__ */
|
|
5489
|
+
return /* @__PURE__ */ jsx62(
|
|
5381
5490
|
Pressable27,
|
|
5382
5491
|
{
|
|
5383
5492
|
role: "tab",
|
|
@@ -5391,18 +5500,18 @@ function Tabs({ items: items2, value, defaultValue, onValueChange, "aria-label":
|
|
|
5391
5500
|
!segmented ? { borderBottomColor: selected ? theme.accent : "transparent" } : null,
|
|
5392
5501
|
item.disabled ? styles49.disabled : null
|
|
5393
5502
|
],
|
|
5394
|
-
children: /* @__PURE__ */
|
|
5503
|
+
children: /* @__PURE__ */ jsxs53(Txt, { variant: "label", tone: selected ? "text" : "secondary", numberOfLines: 1, children: [
|
|
5395
5504
|
item.label,
|
|
5396
|
-
item.count !== void 0 ? /* @__PURE__ */
|
|
5505
|
+
item.count !== void 0 ? /* @__PURE__ */ jsx62(Txt, { variant: "caption", tone: "secondary", children: ` ${item.count}` }) : null
|
|
5397
5506
|
] })
|
|
5398
5507
|
},
|
|
5399
5508
|
item.value
|
|
5400
5509
|
);
|
|
5401
5510
|
});
|
|
5402
5511
|
const panel = items2.find((i) => i.value === current)?.content;
|
|
5403
|
-
return /* @__PURE__ */
|
|
5404
|
-
segmented ? /* @__PURE__ */
|
|
5405
|
-
panel !== void 0 ? /* @__PURE__ */
|
|
5512
|
+
return /* @__PURE__ */ jsxs53(View54, { style: [styles49.root, style], children: [
|
|
5513
|
+
segmented ? /* @__PURE__ */ jsx62(View54, { role: "tablist", "aria-label": label, style: [styles49.track, { backgroundColor: theme.surface2, borderColor: theme.borderSubtle, borderRadius: radius3.md }], children: tabs }) : /* @__PURE__ */ jsx62(View54, { style: [styles49.underline, { borderBottomColor: theme.borderSubtle }], children: /* @__PURE__ */ jsx62(ScrollView7, { horizontal: true, showsHorizontalScrollIndicator: false, role: "tablist", "aria-label": label, contentContainerStyle: styles49.scroll, children: tabs }) }),
|
|
5514
|
+
panel !== void 0 ? /* @__PURE__ */ jsx62(View54, { role: "tabpanel", children: panel }) : null
|
|
5406
5515
|
] });
|
|
5407
5516
|
}
|
|
5408
5517
|
var styles49 = StyleSheet49.create({
|
|
@@ -5416,15 +5525,15 @@ var styles49 = StyleSheet49.create({
|
|
|
5416
5525
|
});
|
|
5417
5526
|
|
|
5418
5527
|
// src/native/tag-selector.tsx
|
|
5419
|
-
import { StyleSheet as StyleSheet50, View as
|
|
5420
|
-
import { jsx as
|
|
5528
|
+
import { StyleSheet as StyleSheet50, View as View55 } from "react-native";
|
|
5529
|
+
import { jsx as jsx63, jsxs as jsxs54 } from "react/jsx-runtime";
|
|
5421
5530
|
function TagSelector({ label, options, value, onValueChange, max, countLabel, style }) {
|
|
5422
5531
|
const { haptic } = useTheme();
|
|
5423
5532
|
const full = max !== void 0 && value.length >= max;
|
|
5424
|
-
return /* @__PURE__ */
|
|
5425
|
-
/* @__PURE__ */
|
|
5533
|
+
return /* @__PURE__ */ jsxs54(View55, { style: [styles50.root, style], children: [
|
|
5534
|
+
/* @__PURE__ */ jsx63(View55, { role: "group", "aria-label": label, style: styles50.wrap, children: options.map((option) => {
|
|
5426
5535
|
const on = value.includes(option.value);
|
|
5427
|
-
return /* @__PURE__ */
|
|
5536
|
+
return /* @__PURE__ */ jsx63(
|
|
5428
5537
|
Chip,
|
|
5429
5538
|
{
|
|
5430
5539
|
selected: on,
|
|
@@ -5438,15 +5547,15 @@ function TagSelector({ label, options, value, onValueChange, max, countLabel, st
|
|
|
5438
5547
|
option.value
|
|
5439
5548
|
);
|
|
5440
5549
|
}) }),
|
|
5441
|
-
max !== void 0 && countLabel ? /* @__PURE__ */
|
|
5550
|
+
max !== void 0 && countLabel ? /* @__PURE__ */ jsx63(Txt, { variant: "caption", tone: full ? "accent" : "secondary", "aria-live": "polite", children: countLabel(value.length, max) }) : null
|
|
5442
5551
|
] });
|
|
5443
5552
|
}
|
|
5444
5553
|
var styles50 = StyleSheet50.create({ root: { gap: 8 }, wrap: { flexDirection: "row", flexWrap: "wrap", gap: 8 } });
|
|
5445
5554
|
|
|
5446
5555
|
// src/native/toast.tsx
|
|
5447
5556
|
import * as React44 from "react";
|
|
5448
|
-
import { AccessibilityInfo as AccessibilityInfo15, Animated as Animated27, PanResponder as PanResponder5, Pressable as Pressable28, StyleSheet as StyleSheet51, Text as Text20, View as
|
|
5449
|
-
import { Fragment as Fragment9, jsx as
|
|
5557
|
+
import { AccessibilityInfo as AccessibilityInfo15, Animated as Animated27, PanResponder as PanResponder5, Pressable as Pressable28, StyleSheet as StyleSheet51, Text as Text20, View as View56 } from "react-native";
|
|
5558
|
+
import { Fragment as Fragment9, jsx as jsx64, jsxs as jsxs55 } from "react/jsx-runtime";
|
|
5450
5559
|
var items = [];
|
|
5451
5560
|
var listeners2 = /* @__PURE__ */ new Set();
|
|
5452
5561
|
var counter = 0;
|
|
@@ -5513,15 +5622,15 @@ function ToastView({ item, closeLabel, duration }) {
|
|
|
5513
5622
|
return () => clearTimeout(timer2);
|
|
5514
5623
|
}, [item.id, ms]);
|
|
5515
5624
|
const edge = { success: theme.success, warning: theme.warning, error: theme.danger, info: theme.info, default: theme.borderDefault }[item.tone ?? "default"];
|
|
5516
|
-
const text = /* @__PURE__ */
|
|
5517
|
-
item.icon ? /* @__PURE__ */
|
|
5518
|
-
/* @__PURE__ */
|
|
5519
|
-
/* @__PURE__ */
|
|
5520
|
-
item.description ? /* @__PURE__ */
|
|
5625
|
+
const text = /* @__PURE__ */ jsxs55(Fragment9, { children: [
|
|
5626
|
+
item.icon ? /* @__PURE__ */ jsx64(View56, { "aria-hidden": true, children: item.icon }) : null,
|
|
5627
|
+
/* @__PURE__ */ jsxs55(View56, { style: styles51.content, children: [
|
|
5628
|
+
/* @__PURE__ */ jsx64(Txt, { variant: "label", numberOfLines: 2, children: item.title }),
|
|
5629
|
+
item.description ? /* @__PURE__ */ jsx64(Txt, { variant: "caption", tone: "secondary", numberOfLines: 3, children: item.description }) : null
|
|
5521
5630
|
] })
|
|
5522
5631
|
] });
|
|
5523
|
-
const body = /* @__PURE__ */
|
|
5524
|
-
item.onPress ? /* @__PURE__ */
|
|
5632
|
+
const body = /* @__PURE__ */ jsxs55(Fragment9, { children: [
|
|
5633
|
+
item.onPress ? /* @__PURE__ */ jsx64(
|
|
5525
5634
|
Pressable28,
|
|
5526
5635
|
{
|
|
5527
5636
|
role: "button",
|
|
@@ -5532,8 +5641,8 @@ function ToastView({ item, closeLabel, duration }) {
|
|
|
5532
5641
|
style: ({ pressed }) => [styles51.main, { opacity: pressed ? 0.8 : 1 }],
|
|
5533
5642
|
children: text
|
|
5534
5643
|
}
|
|
5535
|
-
) : /* @__PURE__ */
|
|
5536
|
-
item.action ? /* @__PURE__ */
|
|
5644
|
+
) : /* @__PURE__ */ jsx64(View56, { style: styles51.main, children: text }),
|
|
5645
|
+
item.action ? /* @__PURE__ */ jsx64(
|
|
5537
5646
|
Pressable28,
|
|
5538
5647
|
{
|
|
5539
5648
|
role: "button",
|
|
@@ -5542,23 +5651,23 @@ function ToastView({ item, closeLabel, duration }) {
|
|
|
5542
5651
|
dismiss(item.id);
|
|
5543
5652
|
},
|
|
5544
5653
|
style: [styles51.action, { backgroundColor: theme.accent, borderRadius: radius3.sm }],
|
|
5545
|
-
children: /* @__PURE__ */
|
|
5654
|
+
children: /* @__PURE__ */ jsx64(Text20, { style: [styles51.actionLabel, { color: theme.onAccent }], children: item.action.label })
|
|
5546
5655
|
}
|
|
5547
5656
|
) : null,
|
|
5548
|
-
/* @__PURE__ */
|
|
5657
|
+
/* @__PURE__ */ jsx64(Pressable28, { role: "button", "aria-label": closeLabel, hitSlop: 10, onPress: () => dismiss(item.id), style: styles51.close, children: /* @__PURE__ */ jsx64(Text20, { style: [styles51.cross, { color: theme.textSecondary }], children: "\xD7" }) })
|
|
5549
5658
|
] });
|
|
5550
5659
|
const frame = [
|
|
5551
5660
|
styles51.toast,
|
|
5552
5661
|
{ backgroundColor: theme.surface2, borderColor: theme.borderDefault, borderLeftColor: edge, borderRadius: radius3.lg, shadowColor: theme.scrimStrong }
|
|
5553
5662
|
];
|
|
5554
5663
|
const motion3 = { transform: [{ translateY: enter.interpolate({ inputRange: [0, 1], outputRange: [-8, 0] }) }, { translateX: swipe }] };
|
|
5555
|
-
return /* @__PURE__ */
|
|
5664
|
+
return /* @__PURE__ */ jsx64(Animated27.View, { "aria-live": "polite", style: motion3, ...drag.panHandlers, children: /* @__PURE__ */ jsx64(View56, { style: frame, children: body }) });
|
|
5556
5665
|
}
|
|
5557
5666
|
function Toaster({ closeLabel, position = "top", offset = 12, duration = 6e3, max = 3 }) {
|
|
5558
5667
|
const all = React44.useSyncExternalStore(subscribe2, snapshot, snapshot);
|
|
5559
5668
|
const shown = all.slice(-max);
|
|
5560
5669
|
if (shown.length === 0) return null;
|
|
5561
|
-
return /* @__PURE__ */
|
|
5670
|
+
return /* @__PURE__ */ jsx64(View56, { pointerEvents: "box-none", style: [styles51.stack, position === "top" ? { top: offset } : { bottom: offset }], children: (position === "top" ? shown : [...shown].reverse()).map((item) => /* @__PURE__ */ jsx64(ToastView, { item, closeLabel, duration }, item.id)) });
|
|
5562
5671
|
}
|
|
5563
5672
|
var styles51 = StyleSheet51.create({
|
|
5564
5673
|
stack: { position: "absolute", left: 12, right: 12, gap: 8, zIndex: 100 },
|
|
@@ -5583,15 +5692,15 @@ var styles51 = StyleSheet51.create({
|
|
|
5583
5692
|
});
|
|
5584
5693
|
|
|
5585
5694
|
// src/native/verified-badge.tsx
|
|
5586
|
-
import { StyleSheet as StyleSheet52, View as
|
|
5587
|
-
import
|
|
5588
|
-
import { jsx as
|
|
5695
|
+
import { StyleSheet as StyleSheet52, View as View57 } from "react-native";
|
|
5696
|
+
import Svg29, { Path as Path24 } from "react-native-svg";
|
|
5697
|
+
import { jsx as jsx65, jsxs as jsxs56 } from "react/jsx-runtime";
|
|
5589
5698
|
function VerifiedBadge({ label, showLabel, size = 16, on = "surface" }) {
|
|
5590
5699
|
const { theme } = useTheme();
|
|
5591
|
-
return /* @__PURE__ */
|
|
5592
|
-
/* @__PURE__ */
|
|
5593
|
-
/* @__PURE__ */
|
|
5594
|
-
|
|
5700
|
+
return /* @__PURE__ */ jsxs56(View57, { accessible: true, role: "img", "aria-label": label, style: styles52.row, children: [
|
|
5701
|
+
/* @__PURE__ */ jsxs56(Svg29, { width: size, height: size, viewBox: "0 0 24 24", "aria-hidden": true, children: [
|
|
5702
|
+
/* @__PURE__ */ jsx65(
|
|
5703
|
+
Path24,
|
|
5595
5704
|
{
|
|
5596
5705
|
d: "M12 2.5l2.4 1.7 2.9-.1.9 2.8 2.3 1.8-.9 2.8.9 2.8-2.3 1.8-.9 2.8-2.9-.1L12 21.5l-2.4-1.7-2.9.1-.9-2.8-2.3-1.8.9-2.8-.9-2.8 2.3-1.8.9-2.8 2.9.1z",
|
|
5597
5706
|
fill: theme.accent,
|
|
@@ -5599,9 +5708,9 @@ function VerifiedBadge({ label, showLabel, size = 16, on = "surface" }) {
|
|
|
5599
5708
|
strokeWidth: 1.2
|
|
5600
5709
|
}
|
|
5601
5710
|
),
|
|
5602
|
-
/* @__PURE__ */
|
|
5711
|
+
/* @__PURE__ */ jsx65(Path24, { d: "M8.3 12.3l2.5 2.5 4.9-5.2", fill: "none", stroke: theme.onAccent, strokeWidth: 2.2, strokeLinecap: "round", strokeLinejoin: "round" })
|
|
5603
5712
|
] }),
|
|
5604
|
-
showLabel ? /* @__PURE__ */
|
|
5713
|
+
showLabel ? /* @__PURE__ */ jsx65(Txt, { variant: "caption", tone: on === "media" ? "onMedia" : "accent", style: styles52.text, children: label }) : null
|
|
5605
5714
|
] });
|
|
5606
5715
|
}
|
|
5607
5716
|
var styles52 = StyleSheet52.create({ row: { flexDirection: "row", alignItems: "center", gap: 4 }, text: { fontWeight: "700" } });
|
|
@@ -5698,6 +5807,7 @@ export {
|
|
|
5698
5807
|
WheelPicker,
|
|
5699
5808
|
YasakiaMark,
|
|
5700
5809
|
YazakiaMark,
|
|
5810
|
+
YomizakaMark,
|
|
5701
5811
|
YororisMark,
|
|
5702
5812
|
addDays,
|
|
5703
5813
|
addMonths,
|
|
@@ -5709,6 +5819,7 @@ export {
|
|
|
5709
5819
|
dateFieldLabels,
|
|
5710
5820
|
datePartsOrder,
|
|
5711
5821
|
daysInMonth,
|
|
5822
|
+
defaultAvatarUrl,
|
|
5712
5823
|
formatTime,
|
|
5713
5824
|
isRealDate,
|
|
5714
5825
|
latestBirthDate,
|