@krizaka/ui 3.20.0 → 3.21.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/dist/action-bar.js +4 -4
- package/dist/argument-card.js +1 -1
- package/dist/blocks.css +1 -1
- package/dist/button.js +3 -2
- package/dist/card.js +3 -3
- package/dist/{chunk-2NB27LM7.js → chunk-3IN6TOPM.js} +4 -4
- package/dist/{chunk-VDR2EP6K.js → chunk-4QN5YJ3D.js} +17 -5
- package/dist/chunk-4QN5YJ3D.js.map +1 -0
- package/dist/chunk-TDG7ED2W.js +1 -0
- package/dist/chunk-TDG7ED2W.js.map +1 -0
- package/dist/code-block.js +17 -5
- package/dist/code-block.js.map +1 -1
- package/dist/date-picker.js +2 -2
- package/dist/date-picker.js.map +1 -1
- package/dist/force-update-screen.d.ts +80 -0
- package/dist/force-update-screen.js +38 -0
- package/dist/force-update-screen.js.map +1 -0
- package/dist/maintenance-screen.d.ts +68 -0
- package/dist/maintenance-screen.js +35 -0
- package/dist/maintenance-screen.js.map +1 -0
- package/dist/media-grid.js +1 -1
- package/dist/media-grid.js.map +1 -1
- package/dist/native.d.ts +68 -1
- package/dist/native.js +767 -681
- package/dist/native.js.map +1 -1
- package/dist/nav-bar.d.ts +30 -7
- package/dist/nav-bar.js +69 -15
- package/dist/nav-bar.js.map +1 -1
- package/dist/page-hero.js +3 -3
- package/dist/radio-group.js +1 -1
- package/dist/settings-layout.js +1 -1
- package/dist/settings-layout.js.map +1 -1
- package/dist/tabs.js +2 -2
- package/dist/tabs.js.map +1 -1
- package/dist/update-prompt.d.ts +86 -0
- package/dist/update-prompt.js +41 -0
- package/dist/update-prompt.js.map +1 -0
- package/dist/video-player.d.ts +1 -1
- package/dist/video-player.js +16 -3
- package/dist/video-player.js.map +1 -1
- package/package.json +51 -9
- package/registry/achievement.json +1 -1
- package/registry/action-bar.json +1 -1
- package/registry/activity-feed.json +1 -1
- package/registry/alert.json +1 -1
- package/registry/app-shell.json +1 -1
- package/registry/argument-card.json +1 -1
- package/registry/audio-player.json +1 -1
- package/registry/auth-layout.json +1 -1
- package/registry/avatar.json +1 -1
- package/registry/badge.json +1 -1
- package/registry/button.json +1 -1
- package/registry/card-grid.json +1 -1
- package/registry/card.json +1 -1
- package/registry/catalogue-page.json +1 -1
- package/registry/changelog-page.json +1 -1
- package/registry/chat.json +1 -1
- package/registry/checkbox.json +1 -1
- package/registry/chip-link.json +1 -1
- package/registry/chip.json +1 -1
- package/registry/choice-grid.json +1 -1
- package/registry/code-block.json +1 -1
- package/registry/combobox.json +1 -1
- package/registry/command.json +1 -1
- package/registry/component-page.json +1 -1
- package/registry/confirm-button.json +1 -1
- package/registry/contact-page.json +1 -1
- package/registry/continue-prompt.json +1 -1
- package/registry/countdown.json +1 -1
- package/registry/cta-panel.json +1 -1
- package/registry/dashboard-layout.json +1 -1
- package/registry/data-table.json +1 -1
- package/registry/date-picker.json +3 -3
- package/registry/decision-list.json +1 -1
- package/registry/description-list.json +1 -1
- package/registry/detail-layout.json +1 -1
- package/registry/dialog.json +1 -1
- package/registry/docs-article-page.json +1 -1
- package/registry/docs-hub-page.json +1 -1
- package/registry/docs-layout.json +1 -1
- package/registry/document-viewer.json +1 -1
- package/registry/dropdown-menu.json +1 -1
- package/registry/empty-state.json +1 -1
- package/registry/error-page.json +1 -1
- package/registry/examples/force-update-screen/default.d.ts +4 -0
- package/registry/examples/force-update-screen/default.js +25 -0
- package/registry/examples/force-update-screen/default.tsx +19 -0
- package/registry/examples/force-update-screen/native/default.d.ts +4 -0
- package/registry/examples/force-update-screen/native/default.dark.png +0 -0
- package/registry/examples/force-update-screen/native/default.js +24 -0
- package/registry/examples/force-update-screen/native/default.light.png +0 -0
- package/registry/examples/force-update-screen/native/default.tsx +18 -0
- package/registry/examples/maintenance-screen/default.d.ts +4 -0
- package/registry/examples/maintenance-screen/default.js +22 -0
- package/registry/examples/maintenance-screen/default.tsx +16 -0
- package/registry/examples/maintenance-screen/native/default.d.ts +4 -0
- package/registry/examples/maintenance-screen/native/default.dark.png +0 -0
- package/registry/examples/maintenance-screen/native/default.js +21 -0
- package/registry/examples/maintenance-screen/native/default.light.png +0 -0
- package/registry/examples/maintenance-screen/native/default.tsx +15 -0
- package/registry/examples/nav-bar/family-product.js +16 -13
- package/registry/examples/nav-bar/family-product.tsx +19 -19
- package/registry/examples/update-prompt/default.d.ts +4 -0
- package/registry/examples/update-prompt/default.js +24 -0
- package/registry/examples/update-prompt/default.tsx +18 -0
- package/registry/examples/update-prompt/native/default.d.ts +4 -0
- package/registry/examples/update-prompt/native/default.dark.png +0 -0
- package/registry/examples/update-prompt/native/default.js +23 -0
- package/registry/examples/update-prompt/native/default.light.png +0 -0
- package/registry/examples/update-prompt/native/default.tsx +17 -0
- package/registry/field.json +1 -1
- package/registry/file-upload.json +1 -1
- package/registry/filter-bar.json +1 -1
- package/registry/force-update-screen.json +323 -0
- package/registry/form.json +1 -1
- package/registry/gallery-page.json +1 -1
- package/registry/glow-card.json +1 -1
- package/registry/goal-gauge.json +1 -1
- package/registry/how-it-works-page.json +1 -1
- package/registry/image-cropper.json +1 -1
- package/registry/index.json +97 -4
- package/registry/iso.json +1 -1
- package/registry/kanban.json +1 -1
- package/registry/kbd.json +1 -1
- package/registry/landing-page.json +1 -1
- package/registry/landscape.json +1 -1
- package/registry/legal-page.json +1 -1
- package/registry/link-card.json +1 -1
- package/registry/list.json +1 -1
- package/registry/loader.json +1 -1
- package/registry/longform-page.json +1 -1
- package/registry/maintenance-screen.json +259 -0
- package/registry/map.json +2 -2
- package/registry/markdown.json +1 -1
- package/registry/marketing-layout.json +1 -1
- package/registry/marquee.json +1 -1
- package/registry/mascot-quote.json +1 -1
- package/registry/mascot-state.json +1 -1
- package/registry/mascots.json +1 -1
- package/registry/match-dialog.json +1 -1
- package/registry/media-capture.json +1 -1
- package/registry/media-grid.json +2 -2
- package/registry/meter.json +1 -1
- package/registry/nav-bar.json +47 -14
- package/registry/number-ticker.json +1 -1
- package/registry/page-header.json +1 -1
- package/registry/page-hero.json +1 -1
- package/registry/page.json +1 -1
- package/registry/pagination.json +1 -1
- package/registry/photo-grid.json +1 -1
- package/registry/pointer-light.json +1 -1
- package/registry/popover.json +1 -1
- package/registry/pricing-page.json +1 -1
- package/registry/product-page.json +1 -1
- package/registry/profile-card.json +1 -1
- package/registry/progress.json +1 -1
- package/registry/promise-card.json +1 -1
- package/registry/radio-group.json +2 -2
- package/registry/recipes.json +1 -1
- package/registry/scroll-stage.json +1 -1
- package/registry/search-field.json +1 -1
- package/registry/section-backdrop.json +1 -1
- package/registry/separator.json +1 -1
- package/registry/settings-layout.json +2 -2
- package/registry/showcase.json +1 -1
- package/registry/site-footer.json +2 -2
- package/registry/sites.json +1 -1
- package/registry/skeleton.json +1 -1
- package/registry/skip-link.json +1 -1
- package/registry/slider.json +1 -1
- package/registry/slot.json +1 -1
- package/registry/spinner.json +1 -1
- package/registry/split-view.json +1 -1
- package/registry/stage-banner.json +1 -1
- package/registry/stat.json +1 -1
- package/registry/status-page.json +1 -1
- package/registry/step-progress.json +1 -1
- package/registry/stepper.json +1 -1
- package/registry/swipe-deck.json +1 -1
- package/registry/switch.json +1 -1
- package/registry/tabs.json +3 -3
- package/registry/tag-input.json +1 -1
- package/registry/tag-selector.json +1 -1
- package/registry/terminal-replay.json +1 -1
- package/registry/theme.json +1 -1
- package/registry/toast.json +1 -1
- package/registry/toc.json +1 -1
- package/registry/tooltip.json +1 -1
- package/registry/tree-view.json +1 -1
- package/registry/update-prompt.json +316 -0
- package/registry/verified-badge.json +1 -1
- package/registry/vertical-video.json +1 -1
- package/registry/video-player.json +4 -4
- package/registry/video-trimmer.json +1 -1
- package/registry/virtual.json +1 -1
- package/dist/chunk-VDR2EP6K.js.map +0 -1
- /package/dist/{chunk-2NB27LM7.js.map → chunk-3IN6TOPM.js.map} +0 -0
package/dist/native.js
CHANGED
|
@@ -2592,8 +2592,32 @@ var styles20 = StyleSheet20.create({
|
|
|
2592
2592
|
disabled: { opacity: 0.5 }
|
|
2593
2593
|
});
|
|
2594
2594
|
|
|
2595
|
+
// src/native/force-update-screen.tsx
|
|
2596
|
+
import { StyleSheet as StyleSheet21, View as View19 } from "react-native";
|
|
2597
|
+
import { jsx as jsx23, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
2598
|
+
function ForceUpdateScreen({ title, message, versionLabel, mark, updateLabel, onUpdate, retryLabel, onRetry, fill = true, style }) {
|
|
2599
|
+
const { theme } = useTheme();
|
|
2600
|
+
return /* @__PURE__ */ jsxs20(View19, { style: [styles21.root, fill ? styles21.fill : null, { backgroundColor: theme.surface0 }, style], children: [
|
|
2601
|
+
mark ? /* @__PURE__ */ jsx23(View19, { accessibilityElementsHidden: true, importantForAccessibility: "no-hide-descendants", style: styles21.mark, children: mark }) : null,
|
|
2602
|
+
/* @__PURE__ */ jsx23(Txt, { variant: "title", style: styles21.centred, children: title }),
|
|
2603
|
+
message ? /* @__PURE__ */ jsx23(Txt, { tone: "secondary", style: styles21.centred, children: message }) : null,
|
|
2604
|
+
versionLabel ? /* @__PURE__ */ jsx23(Txt, { variant: "mono", tone: "secondary", style: styles21.centred, children: versionLabel }) : null,
|
|
2605
|
+
/* @__PURE__ */ jsxs20(View19, { style: styles21.actions, children: [
|
|
2606
|
+
/* @__PURE__ */ jsx23(Button, { label: updateLabel, variant: "primary", size: "lg", onPress: onUpdate }),
|
|
2607
|
+
retryLabel && onRetry ? /* @__PURE__ */ jsx23(Button, { label: retryLabel, variant: "ghost", onPress: onRetry }) : null
|
|
2608
|
+
] })
|
|
2609
|
+
] });
|
|
2610
|
+
}
|
|
2611
|
+
var styles21 = StyleSheet21.create({
|
|
2612
|
+
root: { alignItems: "center", justifyContent: "center", gap: 12, padding: 24 },
|
|
2613
|
+
fill: { flex: 1 },
|
|
2614
|
+
mark: { width: 96, height: 96, alignItems: "center", justifyContent: "center" },
|
|
2615
|
+
centred: { textAlign: "center", maxWidth: 340 },
|
|
2616
|
+
actions: { marginTop: 8, gap: 8, alignSelf: "stretch", maxWidth: 340, width: "100%" }
|
|
2617
|
+
});
|
|
2618
|
+
|
|
2595
2619
|
// src/native/goal-gauge.tsx
|
|
2596
|
-
import { Animated as Animated7, StyleSheet as
|
|
2620
|
+
import { Animated as Animated7, StyleSheet as StyleSheet22, View as View20 } from "react-native";
|
|
2597
2621
|
|
|
2598
2622
|
// src/native/story-motion.ts
|
|
2599
2623
|
import * as React17 from "react";
|
|
@@ -2616,17 +2640,17 @@ function useEntrance(animated, delay = 0, duration = 700) {
|
|
|
2616
2640
|
}
|
|
2617
2641
|
|
|
2618
2642
|
// src/native/goal-gauge.tsx
|
|
2619
|
-
import { jsx as
|
|
2643
|
+
import { jsx as jsx24, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
2620
2644
|
function Cell({ lit, animate, order, animated, arcade }) {
|
|
2621
2645
|
const { theme } = useTheme();
|
|
2622
2646
|
const t = useEntrance(animated && animate, 300 + order * 100, 350);
|
|
2623
2647
|
const spentOpacity = arcade ? 0.14 : 1;
|
|
2624
2648
|
const opacity = !animate ? 1 : lit ? t.interpolate({ inputRange: [0, 1], outputRange: [0.25, 1] }) : t.interpolate({ inputRange: [0, 1], outputRange: [1, arcade ? 0.14 : 1] });
|
|
2625
2649
|
const color = lit || arcade ? theme.accent : theme.surface3;
|
|
2626
|
-
return /* @__PURE__ */
|
|
2650
|
+
return /* @__PURE__ */ jsx24(
|
|
2627
2651
|
Animated7.View,
|
|
2628
2652
|
{
|
|
2629
|
-
style: [
|
|
2653
|
+
style: [styles22.cell, arcade ? styles22.cellArcade : null, { backgroundColor: color, opacity: lit || animate ? opacity : spentOpacity }]
|
|
2630
2654
|
}
|
|
2631
2655
|
);
|
|
2632
2656
|
}
|
|
@@ -2636,8 +2660,8 @@ function GoalGauge({ label, segments, value, valueText, mode = "fill", showLabel
|
|
|
2636
2660
|
const lit = Math.min(total, Math.max(0, Math.round(value ?? total)));
|
|
2637
2661
|
const words2 = valueText ?? `${lit} / ${total}`;
|
|
2638
2662
|
const arcade = variant === "arcade";
|
|
2639
|
-
return /* @__PURE__ */
|
|
2640
|
-
|
|
2663
|
+
return /* @__PURE__ */ jsxs21(
|
|
2664
|
+
View20,
|
|
2641
2665
|
{
|
|
2642
2666
|
accessible: true,
|
|
2643
2667
|
role: "meter",
|
|
@@ -2647,22 +2671,22 @@ function GoalGauge({ label, segments, value, valueText, mode = "fill", showLabel
|
|
|
2647
2671
|
"aria-valuenow": lit,
|
|
2648
2672
|
"aria-valuetext": words2,
|
|
2649
2673
|
...props,
|
|
2650
|
-
style: [
|
|
2674
|
+
style: [styles22.root, style],
|
|
2651
2675
|
children: [
|
|
2652
|
-
showLabel ? /* @__PURE__ */
|
|
2653
|
-
/* @__PURE__ */
|
|
2654
|
-
arcade ? null : /* @__PURE__ */
|
|
2676
|
+
showLabel ? /* @__PURE__ */ jsxs21(View20, { "aria-hidden": true, style: [styles22.head, arcade ? styles22.headArcade : null], children: [
|
|
2677
|
+
/* @__PURE__ */ jsx24(Txt, { variant: arcade ? "mono" : "caption", tone: "secondary", children: arcade ? label.toUpperCase() : label }),
|
|
2678
|
+
arcade ? null : /* @__PURE__ */ jsx24(Txt, { variant: "caption", children: words2 })
|
|
2655
2679
|
] }) : null,
|
|
2656
|
-
/* @__PURE__ */
|
|
2680
|
+
/* @__PURE__ */ jsx24(View20, { "aria-hidden": true, style: [styles22.cells, arcade ? [styles22.cellsArcade, { borderColor: theme.borderSubtle, backgroundColor: theme.surface1 }] : null], children: Array.from({ length: total }, (_, i) => {
|
|
2657
2681
|
const on = i < lit;
|
|
2658
2682
|
const animate = mode === "fill" ? on : !on;
|
|
2659
|
-
return /* @__PURE__ */
|
|
2683
|
+
return /* @__PURE__ */ jsx24(Cell, { lit: on, animate, order: mode === "fill" ? i : i - lit, animated, arcade }, i);
|
|
2660
2684
|
}) })
|
|
2661
2685
|
]
|
|
2662
2686
|
}
|
|
2663
2687
|
);
|
|
2664
2688
|
}
|
|
2665
|
-
var
|
|
2689
|
+
var styles22 = StyleSheet22.create({
|
|
2666
2690
|
root: { alignSelf: "stretch", gap: 8 },
|
|
2667
2691
|
head: { flexDirection: "row", justifyContent: "space-between", alignItems: "baseline", gap: 12 },
|
|
2668
2692
|
headArcade: { justifyContent: "center" },
|
|
@@ -2674,9 +2698,9 @@ var styles21 = StyleSheet21.create({
|
|
|
2674
2698
|
|
|
2675
2699
|
// src/native/header.tsx
|
|
2676
2700
|
import * as React18 from "react";
|
|
2677
|
-
import { Animated as Animated8, Pressable as Pressable12, StyleSheet as
|
|
2701
|
+
import { Animated as Animated8, Pressable as Pressable12, StyleSheet as StyleSheet23, View as View21 } from "react-native";
|
|
2678
2702
|
import Svg8, { Path as Path6 } from "react-native-svg";
|
|
2679
|
-
import { jsx as
|
|
2703
|
+
import { jsx as jsx25, jsxs as jsxs22 } from "react/jsx-runtime";
|
|
2680
2704
|
var BAR = 44;
|
|
2681
2705
|
var LARGE = 52;
|
|
2682
2706
|
function Header({ title, subtitle, scrollY, size = "large", backLabel, onBack, actions, children, style }) {
|
|
@@ -2689,21 +2713,21 @@ function Header({ title, subtitle, scrollY, size = "large", backLabel, onBack, a
|
|
|
2689
2713
|
const largeOpacity = progress.interpolate({ inputRange: [0, 0.7], outputRange: [1, 0], extrapolate: "clamp" });
|
|
2690
2714
|
const largeShift = reduce ? 0 : progress.interpolate({ inputRange: [0, 1], outputRange: [0, -10] });
|
|
2691
2715
|
const largeHeight = progress.interpolate({ inputRange: [0, 1], outputRange: [LARGE + (subtitle ? 18 : 0), 0] });
|
|
2692
|
-
return /* @__PURE__ */
|
|
2693
|
-
/* @__PURE__ */
|
|
2694
|
-
/* @__PURE__ */
|
|
2695
|
-
/* @__PURE__ */
|
|
2696
|
-
/* @__PURE__ */
|
|
2716
|
+
return /* @__PURE__ */ jsxs22(View21, { style: [{ paddingTop: insets.top, backgroundColor: theme.surface0 }, style], children: [
|
|
2717
|
+
/* @__PURE__ */ jsxs22(View21, { style: styles23.bar, children: [
|
|
2718
|
+
/* @__PURE__ */ jsx25(View21, { style: styles23.side, children: onBack && backLabel ? /* @__PURE__ */ jsxs22(Pressable12, { role: "button", "aria-label": backLabel, onPress: onBack, hitSlop: 8, style: styles23.back, children: [
|
|
2719
|
+
/* @__PURE__ */ jsx25(Svg8, { width: 22, height: 22, viewBox: "0 0 24 24", "aria-hidden": true, children: /* @__PURE__ */ jsx25(Path6, { d: "M15 5l-7 7 7 7", stroke: theme.accentText, strokeWidth: 2.4, fill: "none", strokeLinecap: "round", strokeLinejoin: "round" }) }),
|
|
2720
|
+
/* @__PURE__ */ jsx25(Txt, { variant: "label", tone: "accent", numberOfLines: 1, children: backLabel })
|
|
2697
2721
|
] }) : null }),
|
|
2698
|
-
/* @__PURE__ */
|
|
2699
|
-
/* @__PURE__ */
|
|
2722
|
+
/* @__PURE__ */ jsx25(Animated8.View, { style: [styles23.middle, { opacity: smallOpacity }], "aria-hidden": large, children: /* @__PURE__ */ jsx25(Txt, { variant: "label", numberOfLines: 1, role: large ? void 0 : "heading", children: title }) }),
|
|
2723
|
+
/* @__PURE__ */ jsx25(View21, { style: [styles23.side, styles23.right], children: actions })
|
|
2700
2724
|
] }),
|
|
2701
|
-
large ? /* @__PURE__ */
|
|
2702
|
-
/* @__PURE__ */
|
|
2703
|
-
subtitle ? /* @__PURE__ */
|
|
2725
|
+
large ? /* @__PURE__ */ jsx25(Animated8.View, { style: { height: largeHeight, overflow: "hidden" }, children: /* @__PURE__ */ jsxs22(Animated8.View, { style: [styles23.large, { opacity: largeOpacity, transform: [{ translateY: largeShift }] }], children: [
|
|
2726
|
+
/* @__PURE__ */ jsx25(Txt, { variant: "display", numberOfLines: 1, role: "heading", style: styles23.largeTitle, children: title }),
|
|
2727
|
+
subtitle ? /* @__PURE__ */ jsx25(Txt, { variant: "caption", tone: "secondary", children: subtitle }) : null
|
|
2704
2728
|
] }) }) : null,
|
|
2705
|
-
children ? /* @__PURE__ */
|
|
2706
|
-
/* @__PURE__ */
|
|
2729
|
+
children ? /* @__PURE__ */ jsx25(View21, { style: styles23.children, children }) : null,
|
|
2730
|
+
/* @__PURE__ */ jsx25(Animated8.View, { "aria-hidden": true, style: [styles23.rule, { backgroundColor: theme.borderSubtle, opacity: smallOpacity }] })
|
|
2707
2731
|
] });
|
|
2708
2732
|
}
|
|
2709
2733
|
function useCollapsingHeader() {
|
|
@@ -2711,7 +2735,7 @@ function useCollapsingHeader() {
|
|
|
2711
2735
|
const onScroll = React18.useMemo(() => Animated8.event([{ nativeEvent: { contentOffset: { y: scrollY } } }], { useNativeDriver: false }), [scrollY]);
|
|
2712
2736
|
return { scrollY, onScroll };
|
|
2713
2737
|
}
|
|
2714
|
-
var
|
|
2738
|
+
var styles23 = StyleSheet23.create({
|
|
2715
2739
|
bar: { height: BAR, flexDirection: "row", alignItems: "center", paddingHorizontal: 8 },
|
|
2716
2740
|
side: { flex: 1, flexDirection: "row", alignItems: "center" },
|
|
2717
2741
|
right: { justifyContent: "flex-end", gap: 4 },
|
|
@@ -2720,13 +2744,13 @@ var styles22 = StyleSheet22.create({
|
|
|
2720
2744
|
large: { paddingHorizontal: 16, paddingBottom: 6 },
|
|
2721
2745
|
largeTitle: { fontSize: 32, lineHeight: 40 },
|
|
2722
2746
|
children: { paddingHorizontal: 16, paddingBottom: 8 },
|
|
2723
|
-
rule: { height:
|
|
2747
|
+
rule: { height: StyleSheet23.hairlineWidth }
|
|
2724
2748
|
});
|
|
2725
2749
|
|
|
2726
2750
|
// src/native/image-viewer.tsx
|
|
2727
2751
|
import * as React19 from "react";
|
|
2728
|
-
import { AccessibilityInfo as AccessibilityInfo5, Animated as Animated9, Image as Image3, Modal as Modal3, PanResponder, Pressable as Pressable13, StyleSheet as
|
|
2729
|
-
import { jsx as
|
|
2752
|
+
import { AccessibilityInfo as AccessibilityInfo5, Animated as Animated9, Image as Image3, Modal as Modal3, PanResponder, Pressable as Pressable13, StyleSheet as StyleSheet24, useWindowDimensions, View as View22 } from "react-native";
|
|
2753
|
+
import { jsx as jsx26, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
2730
2754
|
var MAX_SCALE = 4;
|
|
2731
2755
|
function ImageViewer({ images, index, onIndexChange, closeLabel, positionLabel = (n, total) => `${n} / ${total}` }) {
|
|
2732
2756
|
const { theme, insets, haptic } = useTheme();
|
|
@@ -2814,12 +2838,12 @@ function ImageViewer({ images, index, onIndexChange, closeLabel, positionLabel =
|
|
|
2814
2838
|
if (!open) return null;
|
|
2815
2839
|
const image = images[index];
|
|
2816
2840
|
const backdrop = dismiss2.interpolate({ inputRange: [0, height / 2], outputRange: [1, 0.3], extrapolate: "clamp" });
|
|
2817
|
-
return /* @__PURE__ */
|
|
2818
|
-
/* @__PURE__ */
|
|
2819
|
-
/* @__PURE__ */
|
|
2820
|
-
|
|
2841
|
+
return /* @__PURE__ */ jsxs23(Modal3, { ...modalName(image.alt), visible: true, transparent: true, animationType: reduce ? "none" : "fade", onRequestClose: () => onIndexChange(null), statusBarTranslucent: true, children: [
|
|
2842
|
+
/* @__PURE__ */ jsx26(Animated9.View, { style: [StyleSheet24.absoluteFill, { backgroundColor: theme.media, opacity: backdrop }] }),
|
|
2843
|
+
/* @__PURE__ */ jsx26(
|
|
2844
|
+
View22,
|
|
2821
2845
|
{
|
|
2822
|
-
style:
|
|
2846
|
+
style: StyleSheet24.absoluteFill,
|
|
2823
2847
|
accessible: true,
|
|
2824
2848
|
role: "img",
|
|
2825
2849
|
"aria-label": `${image.alt}, ${positionLabel(index + 1, images.length)}`,
|
|
@@ -2831,21 +2855,21 @@ function ImageViewer({ images, index, onIndexChange, closeLabel, positionLabel =
|
|
|
2831
2855
|
if (name === "escape") onIndexChange(null);
|
|
2832
2856
|
},
|
|
2833
2857
|
...responder.panHandlers,
|
|
2834
|
-
children: /* @__PURE__ */
|
|
2858
|
+
children: /* @__PURE__ */ jsx26(Animated9.View, { style: { width, height, transform: [{ translateX: pan.x }, { translateY: Animated9.add(pan.y, dismiss2) }, { scale }] }, children: /* @__PURE__ */ jsx26(Image3, { source: { uri: image.uri }, resizeMode: "contain", style: { width, height }, accessibilityIgnoresInvertColors: true }) })
|
|
2835
2859
|
}
|
|
2836
2860
|
),
|
|
2837
|
-
/* @__PURE__ */
|
|
2838
|
-
/* @__PURE__ */
|
|
2839
|
-
/* @__PURE__ */
|
|
2861
|
+
/* @__PURE__ */ jsxs23(View22, { pointerEvents: "box-none", style: [styles24.top, { paddingTop: insets.top + 8 }], children: [
|
|
2862
|
+
/* @__PURE__ */ jsx26(View22, { "aria-hidden": true, style: [styles24.counter, { backgroundColor: theme.scrimStrong }], children: /* @__PURE__ */ jsx26(Txt, { variant: "label", tone: "onMedia", children: positionLabel(index + 1, images.length) }) }),
|
|
2863
|
+
/* @__PURE__ */ jsx26(Pressable13, { role: "button", "aria-label": closeLabel, hitSlop: 12, onPress: () => onIndexChange(null), style: [styles24.close, { backgroundColor: theme.scrimStrong }], children: /* @__PURE__ */ jsx26(Txt, { tone: "onMedia", style: styles24.cross, "aria-hidden": true, children: "\xD7" }) })
|
|
2840
2864
|
] }),
|
|
2841
|
-
image.caption ? /* @__PURE__ */
|
|
2865
|
+
image.caption ? /* @__PURE__ */ jsx26(View22, { pointerEvents: "none", style: [styles24.caption, { paddingBottom: insets.bottom + 16, backgroundColor: theme.scrimStrong }], children: /* @__PURE__ */ jsx26(Txt, { tone: "onMedia", children: image.caption }) }) : null
|
|
2842
2866
|
] });
|
|
2843
2867
|
}
|
|
2844
2868
|
function prefetchNeighbours(images, index) {
|
|
2845
2869
|
if (index === null) return;
|
|
2846
2870
|
for (const i of [index - 1, index + 1]) if (images[i]) void Image3.prefetch(images[i].uri).catch(() => void 0);
|
|
2847
2871
|
}
|
|
2848
|
-
var
|
|
2872
|
+
var styles24 = StyleSheet24.create({
|
|
2849
2873
|
top: { position: "absolute", top: 0, left: 0, right: 0, flexDirection: "row", alignItems: "center", justifyContent: "space-between", paddingHorizontal: 16 },
|
|
2850
2874
|
counter: { paddingHorizontal: 10, paddingVertical: 4, borderRadius: 999 },
|
|
2851
2875
|
close: { width: 40, height: 40, borderRadius: 20, alignItems: "center", justifyContent: "center" },
|
|
@@ -2854,7 +2878,7 @@ var styles23 = StyleSheet23.create({
|
|
|
2854
2878
|
});
|
|
2855
2879
|
|
|
2856
2880
|
// src/native/KachizakaMark.tsx
|
|
2857
|
-
import { View as
|
|
2881
|
+
import { View as View23 } from "react-native";
|
|
2858
2882
|
import Svg9, { Circle as Circle3, Defs as Defs4, LinearGradient as LinearGradient4, Path as Path7, RadialGradient as RadialGradient2, Stop as Stop4 } from "react-native-svg";
|
|
2859
2883
|
|
|
2860
2884
|
// src/marks/kachizaka-geometry.ts
|
|
@@ -2884,41 +2908,41 @@ var KACHIZAKA = {
|
|
|
2884
2908
|
};
|
|
2885
2909
|
|
|
2886
2910
|
// src/native/KachizakaMark.tsx
|
|
2887
|
-
import { jsx as
|
|
2911
|
+
import { jsx as jsx27, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
2888
2912
|
function KachizakaMark({ size = 48, animated = true, title, neutral }) {
|
|
2889
2913
|
const { theme } = useTheme();
|
|
2890
2914
|
const { Animated: Animated28, layer, spinStyle, pulseStyle } = useMarkMotion(size, animated, 28e3);
|
|
2891
2915
|
const id = useSvgId("kzm");
|
|
2892
2916
|
const viewBox = size < 48 ? KACHIZAKA.croppedViewBox : KACHIZAKA.viewBox;
|
|
2893
2917
|
const stroke = neutral ?? theme.textMuted;
|
|
2894
|
-
const gradient = /* @__PURE__ */
|
|
2918
|
+
const gradient = /* @__PURE__ */ jsx27(LinearGradient4, { id: `${id}a`, gradientUnits: "userSpaceOnUse", x1: KACHIZAKA.gradient.x1, y1: KACHIZAKA.gradient.y1, x2: KACHIZAKA.gradient.x2, y2: KACHIZAKA.gradient.y2, children: KACHIZAKA.gradient.stops.map(([offset, color]) => /* @__PURE__ */ jsx27(Stop4, { offset, stopColor: color }, offset)) });
|
|
2895
2919
|
const fill = `url(#${id}a)`;
|
|
2896
|
-
return /* @__PURE__ */
|
|
2897
|
-
/* @__PURE__ */
|
|
2898
|
-
/* @__PURE__ */
|
|
2899
|
-
/* @__PURE__ */
|
|
2900
|
-
/* @__PURE__ */
|
|
2901
|
-
/* @__PURE__ */
|
|
2920
|
+
return /* @__PURE__ */ jsxs24(View23, { style: { width: size, height: size }, ...markA11y(title), children: [
|
|
2921
|
+
/* @__PURE__ */ jsxs24(Svg9, { viewBox, style: layer, children: [
|
|
2922
|
+
/* @__PURE__ */ jsxs24(Defs4, { children: [
|
|
2923
|
+
/* @__PURE__ */ jsxs24(RadialGradient2, { id: `${id}g`, cx: "50%", cy: "50%", r: "50%", children: [
|
|
2924
|
+
/* @__PURE__ */ jsx27(Stop4, { offset: "0%", stopColor: KACHIZAKA.glow.color, stopOpacity: KACHIZAKA.glow.opacity }),
|
|
2925
|
+
/* @__PURE__ */ jsx27(Stop4, { offset: "100%", stopColor: KACHIZAKA.glow.color, stopOpacity: 0 })
|
|
2902
2926
|
] }),
|
|
2903
2927
|
gradient
|
|
2904
2928
|
] }),
|
|
2905
|
-
size >= 48 ? /* @__PURE__ */
|
|
2906
|
-
/* @__PURE__ */
|
|
2907
|
-
/* @__PURE__ */
|
|
2908
|
-
/* @__PURE__ */
|
|
2909
|
-
/* @__PURE__ */
|
|
2929
|
+
size >= 48 ? /* @__PURE__ */ jsx27(Circle3, { cx: KACHIZAKA.center, cy: KACHIZAKA.center, r: 190, fill: `url(#${id}g)` }) : null,
|
|
2930
|
+
/* @__PURE__ */ jsx27(Circle3, { cx: KACHIZAKA.center, cy: KACHIZAKA.center, r: KACHIZAKA.ring.r, stroke, strokeWidth: KACHIZAKA.ring.width, opacity: 0.35, fill: "none" }),
|
|
2931
|
+
/* @__PURE__ */ jsx27(Path7, { d: KACHIZAKA.handles, stroke: fill, strokeWidth: KACHIZAKA.handleWidth, strokeLinecap: "round", fill: "none" }),
|
|
2932
|
+
/* @__PURE__ */ jsx27(Path7, { d: KACHIZAKA.base, fill }),
|
|
2933
|
+
/* @__PURE__ */ jsx27(Path7, { d: KACHIZAKA.cup, fill })
|
|
2910
2934
|
] }),
|
|
2911
|
-
/* @__PURE__ */
|
|
2912
|
-
/* @__PURE__ */
|
|
2913
|
-
/* @__PURE__ */
|
|
2914
|
-
/* @__PURE__ */
|
|
2935
|
+
/* @__PURE__ */ jsx27(Animated28.View, { style: [layer, spinStyle], children: /* @__PURE__ */ jsxs24(Svg9, { viewBox, style: layer, children: [
|
|
2936
|
+
/* @__PURE__ */ jsx27(Defs4, { children: gradient }),
|
|
2937
|
+
/* @__PURE__ */ jsx27(Circle3, { cx: KACHIZAKA.center, cy: KACHIZAKA.center, r: KACHIZAKA.orbit.r, stroke, strokeWidth: KACHIZAKA.orbit.width, strokeDasharray: KACHIZAKA.orbit.dash, opacity: 0.6, fill: "none" }),
|
|
2938
|
+
/* @__PURE__ */ jsx27(Circle3, { cx: KACHIZAKA.node.at[0], cy: KACHIZAKA.node.at[1], r: KACHIZAKA.node.r, fill })
|
|
2915
2939
|
] }) }),
|
|
2916
|
-
/* @__PURE__ */
|
|
2940
|
+
/* @__PURE__ */ jsx27(Animated28.View, { style: [layer, pulseStyle], children: /* @__PURE__ */ jsx27(Svg9, { viewBox, style: layer, children: /* @__PURE__ */ jsx27(Path7, { d: KACHIZAKA.star, fill: KACHIZAKA.starColor }) }) })
|
|
2917
2941
|
] });
|
|
2918
2942
|
}
|
|
2919
2943
|
|
|
2920
2944
|
// src/native/KrizakaMark.tsx
|
|
2921
|
-
import { View as
|
|
2945
|
+
import { View as View24 } from "react-native";
|
|
2922
2946
|
import Svg10, { Circle as Circle4, Defs as Defs5, G as Group, LinearGradient as LinearGradient5, Path as Path8, RadialGradient as RadialGradient3, Stop as Stop5 } from "react-native-svg";
|
|
2923
2947
|
|
|
2924
2948
|
// src/marks/krizaka-geometry.ts
|
|
@@ -2941,39 +2965,39 @@ var KRIZAKA = {
|
|
|
2941
2965
|
};
|
|
2942
2966
|
|
|
2943
2967
|
// src/native/KrizakaMark.tsx
|
|
2944
|
-
import { Fragment as Fragment5, jsx as
|
|
2968
|
+
import { Fragment as Fragment5, jsx as jsx28, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
2945
2969
|
function KrizakaMark({ size = 48, animated = true, title, neutral }) {
|
|
2946
2970
|
const { theme } = useTheme();
|
|
2947
2971
|
const { Animated: Animated28, layer, spinStyle, pulseStyle } = useMarkMotion(size, animated);
|
|
2948
2972
|
const id = useSvgId("kzm");
|
|
2949
2973
|
const viewBox = size < 48 ? KRIZAKA.croppedViewBox : KRIZAKA.viewBox;
|
|
2950
2974
|
const stroke = neutral ?? theme.textMuted;
|
|
2951
|
-
const blue = /* @__PURE__ */
|
|
2952
|
-
const dot = (c) => /* @__PURE__ */
|
|
2953
|
-
/* @__PURE__ */
|
|
2954
|
-
/* @__PURE__ */
|
|
2975
|
+
const blue = /* @__PURE__ */ jsx28(LinearGradient5, { id: `${id}b`, gradientUnits: "userSpaceOnUse", x1: KRIZAKA.blue.x1 + KRIZAKA.offset, y1: KRIZAKA.blue.y1 + KRIZAKA.offset, x2: KRIZAKA.blue.x2 + KRIZAKA.offset, y2: KRIZAKA.blue.y2 + KRIZAKA.offset, children: KRIZAKA.blue.stops.map(([offset, color]) => /* @__PURE__ */ jsx28(Stop5, { offset, stopColor: color }, offset)) });
|
|
2976
|
+
const dot = (c) => /* @__PURE__ */ jsxs25(Fragment5, { children: [
|
|
2977
|
+
/* @__PURE__ */ jsx28(Circle4, { cx: c.cx, cy: c.cy, r: c.r, fill: `url(#${id}b)` }),
|
|
2978
|
+
/* @__PURE__ */ jsx28(Circle4, { cx: c.cx, cy: c.cy, r: c.inner, fill: KRIZAKA.highlight })
|
|
2955
2979
|
] });
|
|
2956
|
-
return /* @__PURE__ */
|
|
2957
|
-
/* @__PURE__ */
|
|
2958
|
-
/* @__PURE__ */
|
|
2959
|
-
/* @__PURE__ */
|
|
2960
|
-
/* @__PURE__ */
|
|
2961
|
-
/* @__PURE__ */
|
|
2980
|
+
return /* @__PURE__ */ jsxs25(View24, { style: { width: size, height: size }, ...markA11y(title), children: [
|
|
2981
|
+
/* @__PURE__ */ jsxs25(Svg10, { viewBox, style: layer, children: [
|
|
2982
|
+
/* @__PURE__ */ jsxs25(Defs5, { children: [
|
|
2983
|
+
/* @__PURE__ */ jsxs25(RadialGradient3, { id: `${id}g`, cx: "50%", cy: "50%", r: "50%", children: [
|
|
2984
|
+
/* @__PURE__ */ jsx28(Stop5, { offset: "0%", stopColor: KRIZAKA.glow.color, stopOpacity: KRIZAKA.glow.opacity }),
|
|
2985
|
+
/* @__PURE__ */ jsx28(Stop5, { offset: "100%", stopColor: KRIZAKA.glow.color, stopOpacity: 0 })
|
|
2962
2986
|
] }),
|
|
2963
|
-
/* @__PURE__ */
|
|
2964
|
-
/* @__PURE__ */
|
|
2965
|
-
/* @__PURE__ */
|
|
2987
|
+
/* @__PURE__ */ jsxs25(LinearGradient5, { id: `${id}i`, gradientUnits: "userSpaceOnUse", x1: KRIZAKA.ink.x1 + KRIZAKA.offset, y1: KRIZAKA.ink.y1 + KRIZAKA.offset, x2: KRIZAKA.ink.x2 + KRIZAKA.offset, y2: KRIZAKA.ink.y2 + KRIZAKA.offset, children: [
|
|
2988
|
+
/* @__PURE__ */ jsx28(Stop5, { offset: "0%", stopColor: theme.textSecondary }),
|
|
2989
|
+
/* @__PURE__ */ jsx28(Stop5, { offset: "100%", stopColor: theme.textPrimary })
|
|
2966
2990
|
] }),
|
|
2967
2991
|
blue
|
|
2968
2992
|
] }),
|
|
2969
|
-
size >= 48 ? /* @__PURE__ */
|
|
2970
|
-
/* @__PURE__ */
|
|
2971
|
-
/* @__PURE__ */
|
|
2993
|
+
size >= 48 ? /* @__PURE__ */ jsx28(Circle4, { cx: 200, cy: 200, r: 190, fill: `url(#${id}g)` }) : null,
|
|
2994
|
+
/* @__PURE__ */ jsx28(Circle4, { cx: 200, cy: 200, r: KRIZAKA.ring.r, stroke, strokeWidth: KRIZAKA.ring.width, opacity: 0.35, fill: "none" }),
|
|
2995
|
+
/* @__PURE__ */ jsx28(Group, { transform: `translate(${KRIZAKA.offset} ${KRIZAKA.offset})`, children: /* @__PURE__ */ jsx28(Path8, { d: KRIZAKA.shield, stroke: `url(#${id}i)`, strokeWidth: KRIZAKA.stroke, strokeLinecap: "round", strokeLinejoin: "round", fill: "none" }) })
|
|
2972
2996
|
] }),
|
|
2973
|
-
/* @__PURE__ */
|
|
2974
|
-
/* @__PURE__ */
|
|
2975
|
-
/* @__PURE__ */
|
|
2976
|
-
/* @__PURE__ */
|
|
2997
|
+
/* @__PURE__ */ jsx28(Animated28.View, { style: [layer, spinStyle], children: /* @__PURE__ */ jsx28(Svg10, { viewBox, style: layer, children: /* @__PURE__ */ jsx28(Circle4, { cx: 200, cy: 200, r: KRIZAKA.orbit.r, stroke, strokeWidth: KRIZAKA.orbit.width, strokeDasharray: KRIZAKA.orbit.dash, opacity: 0.6, fill: "none" }) }) }),
|
|
2998
|
+
/* @__PURE__ */ jsx28(Animated28.View, { style: [layer, pulseStyle], children: /* @__PURE__ */ jsxs25(Svg10, { viewBox, style: layer, children: [
|
|
2999
|
+
/* @__PURE__ */ jsx28(Defs5, { children: blue }),
|
|
3000
|
+
/* @__PURE__ */ jsxs25(Group, { transform: `translate(${KRIZAKA.offset} ${KRIZAKA.offset})`, children: [
|
|
2977
3001
|
dot(KRIZAKA.node),
|
|
2978
3002
|
dot(KRIZAKA.core)
|
|
2979
3003
|
] })
|
|
@@ -2983,11 +3007,11 @@ function KrizakaMark({ size = 48, animated = true, title, neutral }) {
|
|
|
2983
3007
|
|
|
2984
3008
|
// src/native/loader.tsx
|
|
2985
3009
|
import * as React22 from "react";
|
|
2986
|
-
import { AccessibilityInfo as AccessibilityInfo7, Animated as Animated11, Easing as Easing5, StyleSheet as
|
|
3010
|
+
import { AccessibilityInfo as AccessibilityInfo7, Animated as Animated11, Easing as Easing5, StyleSheet as StyleSheet25, View as View30 } from "react-native";
|
|
2987
3011
|
import Svg16, { Circle as Circle10, Path as Path14 } from "react-native-svg";
|
|
2988
3012
|
|
|
2989
3013
|
// src/native/OrazakaMark.tsx
|
|
2990
|
-
import { View as
|
|
3014
|
+
import { View as View25 } from "react-native";
|
|
2991
3015
|
import Svg11, { Circle as Circle5, Defs as Defs6, LinearGradient as LinearGradient6, Path as Path9, RadialGradient as RadialGradient4, Stop as Stop6 } from "react-native-svg";
|
|
2992
3016
|
|
|
2993
3017
|
// src/marks/orazaka-geometry.ts
|
|
@@ -3017,40 +3041,40 @@ var ORAZAKA = {
|
|
|
3017
3041
|
};
|
|
3018
3042
|
|
|
3019
3043
|
// src/native/OrazakaMark.tsx
|
|
3020
|
-
import { jsx as
|
|
3044
|
+
import { jsx as jsx29, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
3021
3045
|
function OrazakaMark({ size = 48, animated = true, title, neutral }) {
|
|
3022
3046
|
const { theme } = useTheme();
|
|
3023
3047
|
const { Animated: Animated28, layer, spinStyle, pulseStyle } = useMarkMotion(size, animated);
|
|
3024
3048
|
const id = useSvgId("ozm");
|
|
3025
3049
|
const viewBox = size < 48 ? ORAZAKA.croppedViewBox : ORAZAKA.viewBox;
|
|
3026
3050
|
const stroke = neutral ?? theme.textMuted;
|
|
3027
|
-
const gradient = /* @__PURE__ */
|
|
3051
|
+
const gradient = /* @__PURE__ */ jsx29(LinearGradient6, { id: `${id}a`, gradientUnits: "userSpaceOnUse", x1: ORAZAKA.gradient.x1, y1: ORAZAKA.gradient.y1, x2: ORAZAKA.gradient.x2, y2: ORAZAKA.gradient.y2, children: ORAZAKA.gradient.stops.map(([offset, color]) => /* @__PURE__ */ jsx29(Stop6, { offset, stopColor: color }, offset)) });
|
|
3028
3052
|
const fill = `url(#${id}a)`;
|
|
3029
|
-
return /* @__PURE__ */
|
|
3030
|
-
/* @__PURE__ */
|
|
3031
|
-
/* @__PURE__ */
|
|
3032
|
-
/* @__PURE__ */
|
|
3033
|
-
/* @__PURE__ */
|
|
3053
|
+
return /* @__PURE__ */ jsxs26(View25, { style: { width: size, height: size }, ...markA11y(title), children: [
|
|
3054
|
+
/* @__PURE__ */ jsxs26(Svg11, { viewBox, style: layer, children: [
|
|
3055
|
+
/* @__PURE__ */ jsx29(Defs6, { children: /* @__PURE__ */ jsxs26(RadialGradient4, { id: `${id}g`, cx: "50%", cy: "50%", r: "50%", children: [
|
|
3056
|
+
/* @__PURE__ */ jsx29(Stop6, { offset: "0%", stopColor: ORAZAKA.glow.color, stopOpacity: ORAZAKA.glow.opacity }),
|
|
3057
|
+
/* @__PURE__ */ jsx29(Stop6, { offset: "100%", stopColor: ORAZAKA.glow.color, stopOpacity: 0 })
|
|
3034
3058
|
] }) }),
|
|
3035
|
-
size >= 48 ? /* @__PURE__ */
|
|
3036
|
-
/* @__PURE__ */
|
|
3037
|
-
/* @__PURE__ */
|
|
3059
|
+
size >= 48 ? /* @__PURE__ */ jsx29(Circle5, { cx: ORAZAKA.center, cy: ORAZAKA.center, r: 190, fill: `url(#${id}g)` }) : null,
|
|
3060
|
+
/* @__PURE__ */ jsx29(Circle5, { cx: ORAZAKA.center, cy: ORAZAKA.center, r: ORAZAKA.orbit.r, stroke, strokeWidth: ORAZAKA.orbit.width, strokeDasharray: ORAZAKA.orbit.dash, opacity: 0.6, fill: "none" }),
|
|
3061
|
+
/* @__PURE__ */ jsx29(Circle5, { cx: ORAZAKA.center, cy: ORAZAKA.center, r: ORAZAKA.ring.r, stroke, strokeWidth: ORAZAKA.ring.width, opacity: 0.35, fill: "none" })
|
|
3038
3062
|
] }),
|
|
3039
|
-
/* @__PURE__ */
|
|
3040
|
-
/* @__PURE__ */
|
|
3041
|
-
ORAZAKA.shards.map((d) => /* @__PURE__ */
|
|
3063
|
+
/* @__PURE__ */ jsx29(Animated28.View, { style: [layer, spinStyle], children: /* @__PURE__ */ jsxs26(Svg11, { viewBox, style: layer, children: [
|
|
3064
|
+
/* @__PURE__ */ jsx29(Defs6, { children: gradient }),
|
|
3065
|
+
ORAZAKA.shards.map((d) => /* @__PURE__ */ jsx29(Path9, { d, fill, stroke: fill, strokeWidth: ORAZAKA.shardStroke, strokeLinejoin: "round" }, d))
|
|
3042
3066
|
] }) }),
|
|
3043
|
-
/* @__PURE__ */
|
|
3044
|
-
/* @__PURE__ */
|
|
3045
|
-
/* @__PURE__ */
|
|
3046
|
-
/* @__PURE__ */
|
|
3067
|
+
/* @__PURE__ */ jsx29(Animated28.View, { style: [layer, pulseStyle], children: /* @__PURE__ */ jsxs26(Svg11, { viewBox, style: layer, children: [
|
|
3068
|
+
/* @__PURE__ */ jsx29(Defs6, { children: gradient }),
|
|
3069
|
+
/* @__PURE__ */ jsx29(Circle5, { cx: ORAZAKA.center, cy: ORAZAKA.center, r: ORAZAKA.core.r, fill }),
|
|
3070
|
+
/* @__PURE__ */ jsx29(Circle5, { cx: ORAZAKA.center, cy: ORAZAKA.center, r: ORAZAKA.core.inner, fill: ORAZAKA.highlight })
|
|
3047
3071
|
] }) })
|
|
3048
3072
|
] });
|
|
3049
3073
|
}
|
|
3050
3074
|
|
|
3051
3075
|
// src/native/OrochiaMark.tsx
|
|
3052
3076
|
import { useEffect as useEffect12, useState as useState20 } from "react";
|
|
3053
|
-
import { AccessibilityInfo as AccessibilityInfo6, Animated as Animated10, Easing as Easing4, View as
|
|
3077
|
+
import { AccessibilityInfo as AccessibilityInfo6, Animated as Animated10, Easing as Easing4, View as View26 } from "react-native";
|
|
3054
3078
|
import Svg12, { Circle as Circle6, Defs as Defs7, Ellipse, G as Group2, LinearGradient as LinearGradient7, Path as Path10, RadialGradient as RadialGradient5, Stop as Stop7 } from "react-native-svg";
|
|
3055
3079
|
|
|
3056
3080
|
// src/marks/orochia-geometry.ts
|
|
@@ -3078,7 +3102,7 @@ var OROCHIA = {
|
|
|
3078
3102
|
};
|
|
3079
3103
|
|
|
3080
3104
|
// src/native/OrochiaMark.tsx
|
|
3081
|
-
import { jsx as
|
|
3105
|
+
import { jsx as jsx30, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
3082
3106
|
var CENTER = OROCHIA.offset + 180;
|
|
3083
3107
|
function OrochiaMark({ size = 48, animated = true, title, neutral: neutralProp }) {
|
|
3084
3108
|
const { theme } = useTheme();
|
|
@@ -3110,33 +3134,33 @@ function OrochiaMark({ size = 48, animated = true, title, neutral: neutralProp }
|
|
|
3110
3134
|
const viewBox = size < 48 ? OROCHIA.croppedViewBox : OROCHIA.viewBox;
|
|
3111
3135
|
const layer = { position: "absolute", width: size, height: size };
|
|
3112
3136
|
const a11y = title ? { accessible: true, accessibilityRole: "image", accessibilityLabel: title } : { accessibilityElementsHidden: true, importantForAccessibility: "no-hide-descendants" };
|
|
3113
|
-
const bodyGradient = /* @__PURE__ */
|
|
3114
|
-
return /* @__PURE__ */
|
|
3115
|
-
/* @__PURE__ */
|
|
3116
|
-
/* @__PURE__ */
|
|
3117
|
-
/* @__PURE__ */
|
|
3118
|
-
/* @__PURE__ */
|
|
3137
|
+
const bodyGradient = /* @__PURE__ */ jsx30(LinearGradient7, { id: "body", gradientUnits: "userSpaceOnUse", x1: OROCHIA.body.x1 + OROCHIA.offset, y1: OROCHIA.body.y1 + OROCHIA.offset, x2: OROCHIA.body.x2 + OROCHIA.offset, y2: OROCHIA.body.y2 + OROCHIA.offset, children: OROCHIA.body.stops.map(([offset, color]) => /* @__PURE__ */ jsx30(Stop7, { offset, stopColor: color }, offset)) });
|
|
3138
|
+
return /* @__PURE__ */ jsxs27(View26, { style: { width: size, height: size }, ...a11y, children: [
|
|
3139
|
+
/* @__PURE__ */ jsxs27(Svg12, { viewBox, style: layer, children: [
|
|
3140
|
+
/* @__PURE__ */ jsx30(Defs7, { children: /* @__PURE__ */ jsxs27(RadialGradient5, { id: "glow", cx: "50%", cy: "50%", r: "50%", children: [
|
|
3141
|
+
/* @__PURE__ */ jsx30(Stop7, { offset: "0%", stopColor: OROCHIA.glow.color, stopOpacity: OROCHIA.glow.opacity }),
|
|
3142
|
+
/* @__PURE__ */ jsx30(Stop7, { offset: "100%", stopColor: OROCHIA.glow.color, stopOpacity: 0 })
|
|
3119
3143
|
] }) }),
|
|
3120
|
-
/* @__PURE__ */
|
|
3121
|
-
/* @__PURE__ */
|
|
3144
|
+
/* @__PURE__ */ jsx30(Circle6, { cx: CENTER, cy: CENTER, r: 170, fill: "url(#glow)" }),
|
|
3145
|
+
/* @__PURE__ */ jsx30(Circle6, { cx: CENTER, cy: CENTER, r: OROCHIA.ring.r, stroke: neutral, strokeWidth: OROCHIA.ring.width, opacity: 0.35, fill: "none" })
|
|
3122
3146
|
] }),
|
|
3123
|
-
/* @__PURE__ */
|
|
3124
|
-
/* @__PURE__ */
|
|
3125
|
-
/* @__PURE__ */
|
|
3126
|
-
/* @__PURE__ */
|
|
3127
|
-
/* @__PURE__ */
|
|
3128
|
-
/* @__PURE__ */
|
|
3129
|
-
/* @__PURE__ */
|
|
3130
|
-
/* @__PURE__ */
|
|
3131
|
-
/* @__PURE__ */
|
|
3132
|
-
/* @__PURE__ */
|
|
3147
|
+
/* @__PURE__ */ jsx30(Animated10.View, { style: [layer, { transform: [{ rotate: spin.interpolate({ inputRange: [0, 1], outputRange: ["0deg", "360deg"] }) }] }], children: /* @__PURE__ */ jsx30(Svg12, { viewBox, style: layer, children: /* @__PURE__ */ jsx30(Circle6, { cx: CENTER, cy: CENTER, r: OROCHIA.orbit.r, stroke: neutral, strokeWidth: OROCHIA.orbit.width, strokeDasharray: OROCHIA.orbit.dash, opacity: 0.6, fill: "none" }) }) }),
|
|
3148
|
+
/* @__PURE__ */ jsxs27(Svg12, { viewBox, style: layer, children: [
|
|
3149
|
+
/* @__PURE__ */ jsx30(Defs7, { children: bodyGradient }),
|
|
3150
|
+
/* @__PURE__ */ jsxs27(Group2, { transform: `translate(${OROCHIA.offset} ${OROCHIA.offset})`, children: [
|
|
3151
|
+
/* @__PURE__ */ jsx30(Path10, { d: OROCHIA.arc, stroke: "url(#body)", strokeWidth: 22, strokeLinecap: "round", fill: "none" }),
|
|
3152
|
+
/* @__PURE__ */ jsx30(Path10, { d: OROCHIA.arc, stroke: OROCHIA.scales.color, strokeOpacity: OROCHIA.scales.opacity, strokeWidth: OROCHIA.scales.width, strokeLinecap: "round", strokeDasharray: OROCHIA.scales.dash, fill: "none" }),
|
|
3153
|
+
/* @__PURE__ */ jsx30(Path10, { d: OROCHIA.neck, stroke: "url(#body)", strokeWidth: 14, strokeLinecap: "round", fill: "none" }),
|
|
3154
|
+
/* @__PURE__ */ jsx30(Path10, { d: OROCHIA.tail, stroke: "url(#body)", strokeWidth: 6, strokeLinecap: "round", fill: "none" }),
|
|
3155
|
+
/* @__PURE__ */ jsx30(Ellipse, { cx: OROCHIA.head.cx, cy: OROCHIA.head.cy, rx: OROCHIA.head.rx, ry: OROCHIA.head.ry, rotation: OROCHIA.head.rotate, origin: `${OROCHIA.head.cx}, ${OROCHIA.head.cy}`, fill: "url(#body)" }),
|
|
3156
|
+
/* @__PURE__ */ jsx30(Path10, { d: OROCHIA.tongue.d, stroke: OROCHIA.tongue.color, strokeWidth: 3, strokeLinecap: "round", fill: "none" })
|
|
3133
3157
|
] })
|
|
3134
3158
|
] }),
|
|
3135
|
-
/* @__PURE__ */
|
|
3136
|
-
/* @__PURE__ */
|
|
3137
|
-
/* @__PURE__ */
|
|
3138
|
-
/* @__PURE__ */
|
|
3139
|
-
/* @__PURE__ */
|
|
3159
|
+
/* @__PURE__ */ jsx30(Animated10.View, { style: [layer, { opacity: pulse.interpolate({ inputRange: [0, 1], outputRange: [0.85, 1] }) }], children: /* @__PURE__ */ jsxs27(Svg12, { viewBox, style: layer, children: [
|
|
3160
|
+
/* @__PURE__ */ jsx30(Defs7, { children: /* @__PURE__ */ jsx30(LinearGradient7, { id: "flame", x1: "50%", y1: "100%", x2: "50%", y2: "0%", children: OROCHIA.flameGradient.stops.map(([offset, color]) => /* @__PURE__ */ jsx30(Stop7, { offset, stopColor: color }, offset)) }) }),
|
|
3161
|
+
/* @__PURE__ */ jsxs27(Group2, { transform: `translate(${OROCHIA.offset} ${OROCHIA.offset})`, children: [
|
|
3162
|
+
/* @__PURE__ */ jsx30(Circle6, { cx: OROCHIA.eye.cx, cy: OROCHIA.eye.cy, r: OROCHIA.eye.r, fill: OROCHIA.eye.color }),
|
|
3163
|
+
/* @__PURE__ */ jsx30(Path10, { d: OROCHIA.flame.d, transform: `translate(${OROCHIA.flame.translate[0]} ${OROCHIA.flame.translate[1]}) scale(${OROCHIA.flame.scale})`, fill: "url(#flame)" })
|
|
3140
3164
|
] })
|
|
3141
3165
|
] }) })
|
|
3142
3166
|
] });
|
|
@@ -3144,7 +3168,7 @@ function OrochiaMark({ size = 48, animated = true, title, neutral: neutralProp }
|
|
|
3144
3168
|
|
|
3145
3169
|
// src/native/YasakiaMark.tsx
|
|
3146
3170
|
import React21 from "react";
|
|
3147
|
-
import { View as
|
|
3171
|
+
import { View as View27 } from "react-native";
|
|
3148
3172
|
import Svg13, { Circle as Circle7, Defs as Defs8, LinearGradient as LinearGradient8, Path as Path11, RadialGradient as RadialGradient6, Stop as Stop8 } from "react-native-svg";
|
|
3149
3173
|
|
|
3150
3174
|
// src/marks/yasakia-geometry.ts
|
|
@@ -3175,54 +3199,54 @@ var YASAKIA = {
|
|
|
3175
3199
|
};
|
|
3176
3200
|
|
|
3177
3201
|
// src/native/YasakiaMark.tsx
|
|
3178
|
-
import { jsx as
|
|
3202
|
+
import { jsx as jsx31, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
3179
3203
|
function YasakiaMark({ size = 48, animated = true, title, neutral }) {
|
|
3180
3204
|
const { theme } = useTheme();
|
|
3181
3205
|
const { Animated: Animated28, layer, spinStyle, pulseStyle } = useMarkMotion(size, animated);
|
|
3182
3206
|
const id = useSvgId("yzm");
|
|
3183
3207
|
const viewBox = size < 48 ? YASAKIA.croppedViewBox : YASAKIA.viewBox;
|
|
3184
3208
|
const stroke = neutral ?? theme.textMuted;
|
|
3185
|
-
const gradient = /* @__PURE__ */
|
|
3209
|
+
const gradient = /* @__PURE__ */ jsx31(LinearGradient8, { id: `${id}a`, gradientUnits: "userSpaceOnUse", x1: YASAKIA.gradient.x1, y1: YASAKIA.gradient.y1, x2: YASAKIA.gradient.x2, y2: YASAKIA.gradient.y2, children: YASAKIA.gradient.stops.map(([offset, color]) => /* @__PURE__ */ jsx31(Stop8, { offset, stopColor: color }, offset)) });
|
|
3186
3210
|
const fill = `url(#${id}a)`;
|
|
3187
|
-
return /* @__PURE__ */
|
|
3188
|
-
/* @__PURE__ */
|
|
3189
|
-
/* @__PURE__ */
|
|
3190
|
-
/* @__PURE__ */
|
|
3191
|
-
/* @__PURE__ */
|
|
3192
|
-
/* @__PURE__ */
|
|
3211
|
+
return /* @__PURE__ */ jsxs28(View27, { style: { width: size, height: size }, ...markA11y(title), children: [
|
|
3212
|
+
/* @__PURE__ */ jsxs28(Svg13, { viewBox, style: layer, children: [
|
|
3213
|
+
/* @__PURE__ */ jsxs28(Defs8, { children: [
|
|
3214
|
+
/* @__PURE__ */ jsxs28(RadialGradient6, { id: `${id}g`, cx: "50%", cy: "50%", r: "50%", children: [
|
|
3215
|
+
/* @__PURE__ */ jsx31(Stop8, { offset: "0%", stopColor: YASAKIA.glow.color, stopOpacity: YASAKIA.glow.opacity }),
|
|
3216
|
+
/* @__PURE__ */ jsx31(Stop8, { offset: "100%", stopColor: YASAKIA.glow.color, stopOpacity: 0 })
|
|
3193
3217
|
] }),
|
|
3194
3218
|
gradient
|
|
3195
3219
|
] }),
|
|
3196
|
-
size >= 48 ? /* @__PURE__ */
|
|
3197
|
-
/* @__PURE__ */
|
|
3198
|
-
YASAKIA.voices.map((v, i) => /* @__PURE__ */
|
|
3199
|
-
/* @__PURE__ */
|
|
3200
|
-
/* @__PURE__ */
|
|
3201
|
-
i === 0 ? /* @__PURE__ */
|
|
3220
|
+
size >= 48 ? /* @__PURE__ */ jsx31(Circle7, { cx: YASAKIA.center, cy: YASAKIA.center, r: 190, fill: `url(#${id}g)` }) : null,
|
|
3221
|
+
/* @__PURE__ */ jsx31(Circle7, { cx: YASAKIA.center, cy: YASAKIA.center, r: YASAKIA.ring.r, stroke, strokeWidth: YASAKIA.ring.width, opacity: 0.35, fill: "none" }),
|
|
3222
|
+
YASAKIA.voices.map((v, i) => /* @__PURE__ */ jsxs28(React21.Fragment, { children: [
|
|
3223
|
+
/* @__PURE__ */ jsx31(Path11, { d: v.body, fill }),
|
|
3224
|
+
/* @__PURE__ */ jsx31(Path11, { d: v.tail, fill }),
|
|
3225
|
+
i === 0 ? /* @__PURE__ */ jsx31(Path11, { d: `${v.body} ${v.tail}`, fill: YASAKIA.shade.color, opacity: YASAKIA.shade.opacity }) : null
|
|
3202
3226
|
] }, v.body))
|
|
3203
3227
|
] }),
|
|
3204
|
-
/* @__PURE__ */
|
|
3205
|
-
/* @__PURE__ */
|
|
3206
|
-
/* @__PURE__ */
|
|
3207
|
-
YASAKIA.pair.at.map(([cx, cy]) => /* @__PURE__ */
|
|
3228
|
+
/* @__PURE__ */ jsx31(Animated28.View, { style: [layer, spinStyle], children: /* @__PURE__ */ jsxs28(Svg13, { viewBox, style: layer, children: [
|
|
3229
|
+
/* @__PURE__ */ jsx31(Defs8, { children: gradient }),
|
|
3230
|
+
/* @__PURE__ */ jsx31(Circle7, { cx: YASAKIA.center, cy: YASAKIA.center, r: YASAKIA.orbit.r, stroke, strokeWidth: YASAKIA.orbit.width, strokeDasharray: YASAKIA.orbit.dash, opacity: 0.6, fill: "none" }),
|
|
3231
|
+
YASAKIA.pair.at.map(([cx, cy]) => /* @__PURE__ */ jsx31(Circle7, { cx, cy, r: YASAKIA.pair.r, fill }, cx))
|
|
3208
3232
|
] }) }),
|
|
3209
|
-
/* @__PURE__ */
|
|
3210
|
-
/* @__PURE__ */
|
|
3233
|
+
/* @__PURE__ */ jsx31(Animated28.View, { style: [layer, pulseStyle], children: /* @__PURE__ */ jsxs28(Svg13, { viewBox, style: layer, children: [
|
|
3234
|
+
/* @__PURE__ */ jsxs28(Defs8, { children: [
|
|
3211
3235
|
gradient,
|
|
3212
|
-
/* @__PURE__ */
|
|
3213
|
-
/* @__PURE__ */
|
|
3214
|
-
/* @__PURE__ */
|
|
3236
|
+
/* @__PURE__ */ jsxs28(LinearGradient8, { id: `${id}l`, gradientUnits: "userSpaceOnUse", x1: 0, y1: YASAKIA.lens.y1, x2: 0, y2: YASAKIA.lens.y2, children: [
|
|
3237
|
+
/* @__PURE__ */ jsx31(Stop8, { offset: "0%", stopColor: YASAKIA.highlight.color, stopOpacity: YASAKIA.highlight.from }),
|
|
3238
|
+
/* @__PURE__ */ jsx31(Stop8, { offset: "100%", stopColor: YASAKIA.highlight.color, stopOpacity: YASAKIA.highlight.to })
|
|
3215
3239
|
] })
|
|
3216
3240
|
] }),
|
|
3217
|
-
/* @__PURE__ */
|
|
3218
|
-
/* @__PURE__ */
|
|
3241
|
+
/* @__PURE__ */ jsx31(Path11, { d: YASAKIA.lens.d, fill }),
|
|
3242
|
+
/* @__PURE__ */ jsx31(Path11, { d: YASAKIA.lens.d, fill: `url(#${id}l)` })
|
|
3219
3243
|
] }) })
|
|
3220
3244
|
] });
|
|
3221
3245
|
}
|
|
3222
3246
|
var YazakiaMark = YasakiaMark;
|
|
3223
3247
|
|
|
3224
3248
|
// src/native/YomizakaMark.tsx
|
|
3225
|
-
import { View as
|
|
3249
|
+
import { View as View28 } from "react-native";
|
|
3226
3250
|
import Svg14, { Circle as Circle8, Defs as Defs9, LinearGradient as LinearGradient9, Path as Path12, RadialGradient as RadialGradient7, Stop as Stop9 } from "react-native-svg";
|
|
3227
3251
|
|
|
3228
3252
|
// src/marks/yomizaka-geometry.ts
|
|
@@ -3256,48 +3280,48 @@ var YOMIZAKA = {
|
|
|
3256
3280
|
};
|
|
3257
3281
|
|
|
3258
3282
|
// src/native/YomizakaMark.tsx
|
|
3259
|
-
import { jsx as
|
|
3283
|
+
import { jsx as jsx32, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
3260
3284
|
function YomizakaMark({ size = 48, animated = true, title, neutral }) {
|
|
3261
3285
|
const { theme } = useTheme();
|
|
3262
3286
|
const { Animated: Animated28, layer, spinStyle, pulseStyle } = useMarkMotion(size, animated, 32e3);
|
|
3263
3287
|
const id = useSvgId("ymm");
|
|
3264
3288
|
const viewBox = size < 48 ? YOMIZAKA.croppedViewBox : YOMIZAKA.viewBox;
|
|
3265
3289
|
const stroke = neutral ?? theme.textMuted;
|
|
3266
|
-
const gradient = /* @__PURE__ */
|
|
3290
|
+
const gradient = /* @__PURE__ */ jsx32(LinearGradient9, { 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__ */ jsx32(Stop9, { offset, stopColor: color }, offset)) });
|
|
3267
3291
|
const fill = `url(#${id}a)`;
|
|
3268
|
-
return /* @__PURE__ */
|
|
3269
|
-
/* @__PURE__ */
|
|
3270
|
-
/* @__PURE__ */
|
|
3271
|
-
/* @__PURE__ */
|
|
3272
|
-
/* @__PURE__ */
|
|
3273
|
-
/* @__PURE__ */
|
|
3292
|
+
return /* @__PURE__ */ jsxs29(View28, { style: { width: size, height: size }, ...markA11y(title), children: [
|
|
3293
|
+
/* @__PURE__ */ jsxs29(Svg14, { viewBox, style: layer, children: [
|
|
3294
|
+
/* @__PURE__ */ jsxs29(Defs9, { children: [
|
|
3295
|
+
/* @__PURE__ */ jsxs29(RadialGradient7, { id: `${id}g`, cx: "50%", cy: "50%", r: "50%", children: [
|
|
3296
|
+
/* @__PURE__ */ jsx32(Stop9, { offset: "0%", stopColor: YOMIZAKA.glow.color, stopOpacity: YOMIZAKA.glow.opacity }),
|
|
3297
|
+
/* @__PURE__ */ jsx32(Stop9, { offset: "100%", stopColor: YOMIZAKA.glow.color, stopOpacity: 0 })
|
|
3274
3298
|
] }),
|
|
3275
3299
|
gradient
|
|
3276
3300
|
] }),
|
|
3277
|
-
size >= 48 ? /* @__PURE__ */
|
|
3278
|
-
/* @__PURE__ */
|
|
3279
|
-
/* @__PURE__ */
|
|
3280
|
-
/* @__PURE__ */
|
|
3281
|
-
/* @__PURE__ */
|
|
3301
|
+
size >= 48 ? /* @__PURE__ */ jsx32(Circle8, { cx: YOMIZAKA.center, cy: YOMIZAKA.center, r: 190, fill: `url(#${id}g)` }) : null,
|
|
3302
|
+
/* @__PURE__ */ jsx32(Circle8, { cx: YOMIZAKA.center, cy: YOMIZAKA.center, r: YOMIZAKA.ring.r, stroke, strokeWidth: YOMIZAKA.ring.width, opacity: 0.35, fill: "none" }),
|
|
3303
|
+
/* @__PURE__ */ jsx32(Path12, { d: YOMIZAKA.page, fill }),
|
|
3304
|
+
/* @__PURE__ */ jsx32(Path12, { d: YOMIZAKA.lines, stroke: YOMIZAKA.line.color, strokeOpacity: YOMIZAKA.line.opacity, strokeWidth: YOMIZAKA.line.width, strokeLinecap: "round", fill: "none" }),
|
|
3305
|
+
/* @__PURE__ */ jsx32(Path12, { d: YOMIZAKA.handle, stroke: fill, strokeWidth: YOMIZAKA.handleWidth, strokeLinecap: "round", fill: "none" })
|
|
3282
3306
|
] }),
|
|
3283
|
-
/* @__PURE__ */
|
|
3284
|
-
/* @__PURE__ */
|
|
3285
|
-
/* @__PURE__ */
|
|
3286
|
-
/* @__PURE__ */
|
|
3307
|
+
/* @__PURE__ */ jsx32(Animated28.View, { style: [layer, spinStyle], children: /* @__PURE__ */ jsxs29(Svg14, { viewBox, style: layer, children: [
|
|
3308
|
+
/* @__PURE__ */ jsx32(Defs9, { children: gradient }),
|
|
3309
|
+
/* @__PURE__ */ jsx32(Circle8, { cx: YOMIZAKA.center, cy: YOMIZAKA.center, r: YOMIZAKA.orbit.r, stroke, strokeWidth: YOMIZAKA.orbit.width, strokeDasharray: YOMIZAKA.orbit.dash, opacity: 0.6, fill: "none" }),
|
|
3310
|
+
/* @__PURE__ */ jsx32(Circle8, { cx: YOMIZAKA.node.at[0], cy: YOMIZAKA.node.at[1], r: YOMIZAKA.node.r, fill })
|
|
3287
3311
|
] }) }),
|
|
3288
|
-
/* @__PURE__ */
|
|
3289
|
-
/* @__PURE__ */
|
|
3312
|
+
/* @__PURE__ */ jsx32(Animated28.View, { style: [layer, pulseStyle], children: /* @__PURE__ */ jsxs29(Svg14, { viewBox, style: layer, children: [
|
|
3313
|
+
/* @__PURE__ */ jsxs29(Defs9, { children: [
|
|
3290
3314
|
gradient,
|
|
3291
|
-
/* @__PURE__ */
|
|
3315
|
+
/* @__PURE__ */ jsx32(LinearGradient9, { id: `${id}c`, x1: "50%", y1: "100%", x2: "50%", y2: "0%", children: YOMIZAKA.coreGradient.stops.map(([offset, color]) => /* @__PURE__ */ jsx32(Stop9, { offset, stopColor: color }, offset)) })
|
|
3292
3316
|
] }),
|
|
3293
|
-
/* @__PURE__ */
|
|
3294
|
-
/* @__PURE__ */
|
|
3317
|
+
/* @__PURE__ */ jsx32(Circle8, { cx: YOMIZAKA.lens.cx, cy: YOMIZAKA.lens.cy, r: YOMIZAKA.lens.r, stroke: fill, strokeWidth: YOMIZAKA.lens.width, fill: `url(#${id}c)` }),
|
|
3318
|
+
/* @__PURE__ */ jsx32(Circle8, { cx: YOMIZAKA.lens.glint.cx, cy: YOMIZAKA.lens.glint.cy, r: YOMIZAKA.lens.glint.r, fill: YOMIZAKA.highlight })
|
|
3295
3319
|
] }) })
|
|
3296
3320
|
] });
|
|
3297
3321
|
}
|
|
3298
3322
|
|
|
3299
3323
|
// src/native/YororisMark.tsx
|
|
3300
|
-
import { View as
|
|
3324
|
+
import { View as View29 } from "react-native";
|
|
3301
3325
|
import Svg15, { Circle as Circle9, Defs as Defs10, LinearGradient as LinearGradient10, Path as Path13, RadialGradient as RadialGradient8, Stop as Stop10 } from "react-native-svg";
|
|
3302
3326
|
|
|
3303
3327
|
// src/marks/yororis-geometry.ts
|
|
@@ -3334,58 +3358,58 @@ var YORORIS = {
|
|
|
3334
3358
|
};
|
|
3335
3359
|
|
|
3336
3360
|
// src/native/YororisMark.tsx
|
|
3337
|
-
import { jsx as
|
|
3361
|
+
import { jsx as jsx33, jsxs as jsxs30 } from "react/jsx-runtime";
|
|
3338
3362
|
function YororisMark({ size = 48, animated = true, title, neutral }) {
|
|
3339
3363
|
const { theme } = useTheme();
|
|
3340
3364
|
const { Animated: Animated28, layer, spinStyle, pulseStyle } = useMarkMotion(size, animated, 36e3);
|
|
3341
3365
|
const id = useSvgId("yrm");
|
|
3342
3366
|
const viewBox = size < 48 ? YORORIS.croppedViewBox : YORORIS.viewBox;
|
|
3343
3367
|
const stroke = neutral ?? theme.textMuted;
|
|
3344
|
-
const gradient = /* @__PURE__ */
|
|
3368
|
+
const gradient = /* @__PURE__ */ jsx33(LinearGradient10, { 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__ */ jsx33(Stop10, { offset, stopColor: color }, offset)) });
|
|
3345
3369
|
const fill = `url(#${id}a)`;
|
|
3346
|
-
return /* @__PURE__ */
|
|
3347
|
-
/* @__PURE__ */
|
|
3348
|
-
/* @__PURE__ */
|
|
3349
|
-
/* @__PURE__ */
|
|
3350
|
-
/* @__PURE__ */
|
|
3351
|
-
/* @__PURE__ */
|
|
3370
|
+
return /* @__PURE__ */ jsxs30(View29, { style: { width: size, height: size }, ...markA11y(title), children: [
|
|
3371
|
+
/* @__PURE__ */ jsxs30(Svg15, { viewBox, style: layer, children: [
|
|
3372
|
+
/* @__PURE__ */ jsxs30(Defs10, { children: [
|
|
3373
|
+
/* @__PURE__ */ jsxs30(RadialGradient8, { id: `${id}g`, cx: "50%", cy: "50%", r: "50%", children: [
|
|
3374
|
+
/* @__PURE__ */ jsx33(Stop10, { offset: "0%", stopColor: YORORIS.glow.color, stopOpacity: YORORIS.glow.opacity }),
|
|
3375
|
+
/* @__PURE__ */ jsx33(Stop10, { offset: "100%", stopColor: YORORIS.glow.color, stopOpacity: 0 })
|
|
3352
3376
|
] }),
|
|
3353
3377
|
gradient
|
|
3354
3378
|
] }),
|
|
3355
|
-
size >= 48 ? /* @__PURE__ */
|
|
3356
|
-
/* @__PURE__ */
|
|
3357
|
-
/* @__PURE__ */
|
|
3358
|
-
YORORIS.leaves.map((d) => /* @__PURE__ */
|
|
3359
|
-
/* @__PURE__ */
|
|
3379
|
+
size >= 48 ? /* @__PURE__ */ jsx33(Circle9, { cx: YORORIS.center, cy: YORORIS.center, r: 190, fill: `url(#${id}g)` }) : null,
|
|
3380
|
+
/* @__PURE__ */ jsx33(Circle9, { cx: YORORIS.center, cy: YORORIS.center, r: YORORIS.ring.r, stroke, strokeWidth: YORORIS.ring.width, opacity: 0.35, fill: "none" }),
|
|
3381
|
+
/* @__PURE__ */ jsx33(Path13, { d: YORORIS.stem, stroke: fill, strokeWidth: YORORIS.stroke, strokeLinecap: "round", fill: "none" }),
|
|
3382
|
+
YORORIS.leaves.map((d) => /* @__PURE__ */ jsx33(Path13, { d, fill }, d)),
|
|
3383
|
+
/* @__PURE__ */ jsx33(Path13, { d: YORORIS.veins, stroke: YORORIS.vein.color, strokeOpacity: YORORIS.vein.opacity, strokeWidth: YORORIS.vein.width, strokeLinecap: "round", strokeDasharray: YORORIS.vein.dash, fill: "none" })
|
|
3360
3384
|
] }),
|
|
3361
|
-
/* @__PURE__ */
|
|
3362
|
-
/* @__PURE__ */
|
|
3363
|
-
/* @__PURE__ */
|
|
3364
|
-
/* @__PURE__ */
|
|
3385
|
+
/* @__PURE__ */ jsx33(Animated28.View, { style: [layer, spinStyle], children: /* @__PURE__ */ jsxs30(Svg15, { viewBox, style: layer, children: [
|
|
3386
|
+
/* @__PURE__ */ jsx33(Defs10, { children: gradient }),
|
|
3387
|
+
/* @__PURE__ */ jsx33(Circle9, { cx: YORORIS.center, cy: YORORIS.center, r: YORORIS.orbit.r, stroke, strokeWidth: YORORIS.orbit.width, strokeDasharray: YORORIS.orbit.dash, opacity: 0.6, fill: "none" }),
|
|
3388
|
+
/* @__PURE__ */ jsx33(Circle9, { cx: YORORIS.moment.at[0], cy: YORORIS.moment.at[1], r: YORORIS.moment.r, fill })
|
|
3365
3389
|
] }) }),
|
|
3366
|
-
/* @__PURE__ */
|
|
3367
|
-
/* @__PURE__ */
|
|
3368
|
-
/* @__PURE__ */
|
|
3369
|
-
/* @__PURE__ */
|
|
3390
|
+
/* @__PURE__ */ jsx33(Animated28.View, { style: [layer, pulseStyle], children: /* @__PURE__ */ jsxs30(Svg15, { viewBox, style: layer, children: [
|
|
3391
|
+
/* @__PURE__ */ jsx33(Defs10, { children: /* @__PURE__ */ jsx33(LinearGradient10, { id: `${id}c`, x1: "50%", y1: "100%", x2: "50%", y2: "0%", children: YORORIS.coreGradient.stops.map(([offset, color]) => /* @__PURE__ */ jsx33(Stop10, { offset, stopColor: color }, offset)) }) }),
|
|
3392
|
+
/* @__PURE__ */ jsx33(Circle9, { cx: YORORIS.core.cx, cy: YORORIS.core.cy, r: YORORIS.core.r, fill: `url(#${id}c)` }),
|
|
3393
|
+
/* @__PURE__ */ jsx33(Circle9, { cx: YORORIS.core.cx, cy: YORORIS.core.cy, r: YORORIS.core.inner, fill: YORORIS.highlight })
|
|
3370
3394
|
] }) })
|
|
3371
3395
|
] });
|
|
3372
3396
|
}
|
|
3373
3397
|
|
|
3374
3398
|
// src/native/ProductMark.tsx
|
|
3375
|
-
import { jsx as
|
|
3399
|
+
import { jsx as jsx34 } from "react/jsx-runtime";
|
|
3376
3400
|
function ProductMark({ id, ...props }) {
|
|
3377
|
-
if (id === "krizaka") return /* @__PURE__ */
|
|
3378
|
-
if (id === "orazaka") return /* @__PURE__ */
|
|
3379
|
-
if (id === "yasakia" || id === "yazakia") return /* @__PURE__ */
|
|
3380
|
-
if (id === "yororis") return /* @__PURE__ */
|
|
3381
|
-
if (id === "yomizaka") return /* @__PURE__ */
|
|
3382
|
-
if (id === "kachizaka") return /* @__PURE__ */
|
|
3383
|
-
if (id === "akinaza") return /* @__PURE__ */
|
|
3384
|
-
return /* @__PURE__ */
|
|
3401
|
+
if (id === "krizaka") return /* @__PURE__ */ jsx34(KrizakaMark, { ...props });
|
|
3402
|
+
if (id === "orazaka") return /* @__PURE__ */ jsx34(OrazakaMark, { ...props });
|
|
3403
|
+
if (id === "yasakia" || id === "yazakia") return /* @__PURE__ */ jsx34(YasakiaMark, { ...props });
|
|
3404
|
+
if (id === "yororis") return /* @__PURE__ */ jsx34(YororisMark, { ...props });
|
|
3405
|
+
if (id === "yomizaka") return /* @__PURE__ */ jsx34(YomizakaMark, { ...props });
|
|
3406
|
+
if (id === "kachizaka") return /* @__PURE__ */ jsx34(KachizakaMark, { ...props });
|
|
3407
|
+
if (id === "akinaza") return /* @__PURE__ */ jsx34(AkinazaMark, { ...props });
|
|
3408
|
+
return /* @__PURE__ */ jsx34(OrochiaMark, { ...props });
|
|
3385
3409
|
}
|
|
3386
3410
|
|
|
3387
3411
|
// src/native/loader.tsx
|
|
3388
|
-
import { jsx as
|
|
3412
|
+
import { jsx as jsx35, jsxs as jsxs31 } from "react/jsx-runtime";
|
|
3389
3413
|
var HEX = "M12 3 19.79 7.5 19.79 16.5 12 21 4.21 16.5 4.21 7.5Z";
|
|
3390
3414
|
var PERIMETER = 54;
|
|
3391
3415
|
function LoaderGlyph({ state = "loading", value, size = 20, color }) {
|
|
@@ -3402,12 +3426,12 @@ function LoaderGlyph({ state = "loading", value, size = 20, color }) {
|
|
|
3402
3426
|
const stroke = color ?? (state === "success" ? theme.success : state === "error" ? theme.danger : theme.accent);
|
|
3403
3427
|
const fill = state !== "loading" ? 1 : known ? Math.min(1, Math.max(0, value)) : 0.3;
|
|
3404
3428
|
const rotate = spin.interpolate({ inputRange: [0, 1], outputRange: ["0deg", "360deg"] });
|
|
3405
|
-
return /* @__PURE__ */
|
|
3406
|
-
/* @__PURE__ */
|
|
3407
|
-
/* @__PURE__ */
|
|
3408
|
-
state === "loading" ? /* @__PURE__ */
|
|
3409
|
-
state === "success" ? /* @__PURE__ */
|
|
3410
|
-
state === "error" ? /* @__PURE__ */
|
|
3429
|
+
return /* @__PURE__ */ jsx35(Animated11.View, { "aria-hidden": true, style: { width: size, height: size, transform: state === "loading" && !known ? [{ rotate }] : [] }, children: /* @__PURE__ */ jsxs31(Svg16, { width: size, height: size, viewBox: "0 0 24 24", fill: "none", children: [
|
|
3430
|
+
/* @__PURE__ */ jsx35(Path14, { d: HEX, stroke, strokeOpacity: 0.22, strokeWidth: 2.2, strokeLinejoin: "round" }),
|
|
3431
|
+
/* @__PURE__ */ jsx35(Path14, { d: HEX, stroke, strokeWidth: 2.2, strokeLinejoin: "round", strokeLinecap: "round", strokeDasharray: `${fill * PERIMETER} ${PERIMETER}` }),
|
|
3432
|
+
state === "loading" ? /* @__PURE__ */ jsx35(Circle10, { cx: 12, cy: 12, r: 2.6, fill: stroke }) : null,
|
|
3433
|
+
state === "success" ? /* @__PURE__ */ jsx35(Path14, { d: "M8.3 12.3l2.6 2.6 4.9-5.3", stroke, strokeWidth: 2.2, strokeLinecap: "round", strokeLinejoin: "round" }) : null,
|
|
3434
|
+
state === "error" ? /* @__PURE__ */ jsx35(Path14, { d: "M9.4 9.4l5.2 5.2M14.6 9.4l-5.2 5.2", stroke, strokeWidth: 2.2, strokeLinecap: "round" }) : null
|
|
3411
3435
|
] }) });
|
|
3412
3436
|
}
|
|
3413
3437
|
function useDelayedWait(active, delay = 250, minDuration = 600) {
|
|
@@ -3459,22 +3483,22 @@ function Loader({ label, status = "loading", successLabel, errorLabel, value, et
|
|
|
3459
3483
|
const known = phase === "loading" && typeof value === "number" && Number.isFinite(value);
|
|
3460
3484
|
const detail = phase === "loading" ? [known ? `${Math.round(Math.min(1, Math.max(0, value)) * 100)} %` : null, eta].filter(Boolean).join(" \xB7 ") : "";
|
|
3461
3485
|
const stacked = variant !== "inline";
|
|
3462
|
-
const box = /* @__PURE__ */
|
|
3463
|
-
product && phase === "loading" ? /* @__PURE__ */
|
|
3464
|
-
/* @__PURE__ */
|
|
3465
|
-
/* @__PURE__ */
|
|
3466
|
-
detail ? /* @__PURE__ */
|
|
3486
|
+
const box = /* @__PURE__ */ jsxs31(View30, { style: [stacked ? styles25.stacked : styles25.inline, variant === "overlay" ? { backgroundColor: alpha(theme.surface1, 0.92), borderColor: theme.borderDefault, borderRadius: radius3.lg, ...styles25.card } : null], children: [
|
|
3487
|
+
product && phase === "loading" ? /* @__PURE__ */ jsx35(ProductMark, { id: product, size: GLYPH[variant], animated: true }) : /* @__PURE__ */ jsx35(LoaderGlyph, { state: phase, value: known ? value : null, size: GLYPH[variant] }),
|
|
3488
|
+
/* @__PURE__ */ jsxs31(View30, { style: stacked ? styles25.center : styles25.text, children: [
|
|
3489
|
+
/* @__PURE__ */ jsx35(Txt, { variant: variant === "page" ? "title" : "label", style: stacked ? styles25.centered : null, children: words2 }),
|
|
3490
|
+
detail ? /* @__PURE__ */ jsx35(Txt, { variant: "caption", tone: "secondary", style: stacked ? styles25.centered : null, children: detail }) : null
|
|
3467
3491
|
] })
|
|
3468
3492
|
] });
|
|
3469
3493
|
const a11y = { accessible: true, role: "progressbar", "aria-label": words2, "aria-busy": phase === "loading", accessibilityLiveRegion: "polite" };
|
|
3470
3494
|
if (variant === "overlay" || variant === "page")
|
|
3471
|
-
return /* @__PURE__ */
|
|
3472
|
-
return /* @__PURE__ */
|
|
3495
|
+
return /* @__PURE__ */ jsx35(View30, { ...a11y, style: [StyleSheet25.absoluteFill, styles25.cover, variant === "page" ? { backgroundColor: alpha(theme.surface0, 0.86) } : null, style], children: box });
|
|
3496
|
+
return /* @__PURE__ */ jsx35(View30, { ...a11y, style: [variant === "block" ? styles25.block : null, style], children: box });
|
|
3473
3497
|
}
|
|
3474
|
-
var
|
|
3498
|
+
var styles25 = StyleSheet25.create({
|
|
3475
3499
|
inline: { flexDirection: "row", alignItems: "center", gap: 10 },
|
|
3476
3500
|
stacked: { alignItems: "center", gap: 10 },
|
|
3477
|
-
card: { paddingHorizontal: 24, paddingVertical: 20, borderWidth:
|
|
3501
|
+
card: { paddingHorizontal: 24, paddingVertical: 20, borderWidth: StyleSheet25.hairlineWidth },
|
|
3478
3502
|
text: { flexShrink: 1, gap: 2 },
|
|
3479
3503
|
center: { alignItems: "center", gap: 2 },
|
|
3480
3504
|
centered: { textAlign: "center" },
|
|
@@ -3482,13 +3506,36 @@ var styles24 = StyleSheet24.create({
|
|
|
3482
3506
|
cover: { alignItems: "center", justifyContent: "center", zIndex: 10 }
|
|
3483
3507
|
});
|
|
3484
3508
|
|
|
3509
|
+
// src/native/maintenance-screen.tsx
|
|
3510
|
+
import { StyleSheet as StyleSheet26, View as View31 } from "react-native";
|
|
3511
|
+
import { jsx as jsx36, jsxs as jsxs32 } from "react/jsx-runtime";
|
|
3512
|
+
function MaintenanceScreen({ title, message, mark, retryLabel, onRetry, fill = true, style }) {
|
|
3513
|
+
const { theme } = useTheme();
|
|
3514
|
+
return /* @__PURE__ */ jsxs32(View31, { style: [styles26.root, fill ? styles26.fill : null, { backgroundColor: theme.surface0 }, style], children: [
|
|
3515
|
+
mark ? /* @__PURE__ */ jsx36(View31, { accessibilityElementsHidden: true, importantForAccessibility: "no-hide-descendants", style: styles26.mark, children: mark }) : null,
|
|
3516
|
+
/* @__PURE__ */ jsxs32(View31, { role: "status", style: styles26.text, children: [
|
|
3517
|
+
/* @__PURE__ */ jsx36(Txt, { variant: "title", style: styles26.centred, children: title }),
|
|
3518
|
+
message ? /* @__PURE__ */ jsx36(Txt, { tone: "secondary", style: styles26.centred, children: message }) : null
|
|
3519
|
+
] }),
|
|
3520
|
+
retryLabel && onRetry ? /* @__PURE__ */ jsx36(View31, { style: styles26.actions, children: /* @__PURE__ */ jsx36(Button, { label: retryLabel, variant: "secondary", onPress: onRetry }) }) : null
|
|
3521
|
+
] });
|
|
3522
|
+
}
|
|
3523
|
+
var styles26 = StyleSheet26.create({
|
|
3524
|
+
root: { alignItems: "center", justifyContent: "center", gap: 12, padding: 24 },
|
|
3525
|
+
fill: { flex: 1 },
|
|
3526
|
+
mark: { width: 96, height: 96, alignItems: "center", justifyContent: "center" },
|
|
3527
|
+
text: { gap: 8, alignItems: "center" },
|
|
3528
|
+
centred: { textAlign: "center", maxWidth: 340 },
|
|
3529
|
+
actions: { marginTop: 8, alignSelf: "stretch", maxWidth: 340, width: "100%" }
|
|
3530
|
+
});
|
|
3531
|
+
|
|
3485
3532
|
// src/native/mascot-state.tsx
|
|
3486
3533
|
import * as React24 from "react";
|
|
3487
|
-
import { AccessibilityInfo as AccessibilityInfo9, Animated as Animated13, Easing as Easing7, StyleSheet as
|
|
3534
|
+
import { AccessibilityInfo as AccessibilityInfo9, Animated as Animated13, Easing as Easing7, StyleSheet as StyleSheet27, View as View33 } from "react-native";
|
|
3488
3535
|
|
|
3489
3536
|
// src/native/mascots.tsx
|
|
3490
3537
|
import { useEffect as useEffect14, useState as useState22 } from "react";
|
|
3491
|
-
import { AccessibilityInfo as AccessibilityInfo8, Animated as Animated12, Easing as Easing6, View as
|
|
3538
|
+
import { AccessibilityInfo as AccessibilityInfo8, Animated as Animated12, Easing as Easing6, View as View32 } from "react-native";
|
|
3492
3539
|
import Svg17, { Circle as Circle11, Defs as Defs11, Ellipse as Ellipse2, G, LinearGradient as LinearGradient11, Path as Path15, Rect as Rect3, Stop as Stop11 } from "react-native-svg";
|
|
3493
3540
|
|
|
3494
3541
|
// src/mascots/geometry.ts
|
|
@@ -3691,7 +3738,7 @@ var SHADE = "#000000";
|
|
|
3691
3738
|
var PARCEL = ["#f59e0b", "#d97706", "#b45309"];
|
|
3692
3739
|
|
|
3693
3740
|
// src/native/mascots.tsx
|
|
3694
|
-
import { jsx as
|
|
3741
|
+
import { jsx as jsx37, jsxs as jsxs33 } from "react/jsx-runtime";
|
|
3695
3742
|
function useBob(animated) {
|
|
3696
3743
|
const [y] = useState22(() => new Animated12.Value(0));
|
|
3697
3744
|
useEffect14(() => {
|
|
@@ -3725,52 +3772,52 @@ function Mascot({ bird = "owl", mood = "welcome", tone: tone3 = "brand", size =
|
|
|
3725
3772
|
const look3 = mood === "thinking" ? 1.4 : 0;
|
|
3726
3773
|
const rot = (deg, [x, y]) => `rotate(${deg} ${x} ${y})`;
|
|
3727
3774
|
const [wl, wr] = g.wings;
|
|
3728
|
-
return /* @__PURE__ */
|
|
3729
|
-
/* @__PURE__ */
|
|
3730
|
-
/* @__PURE__ */
|
|
3731
|
-
/* @__PURE__ */
|
|
3775
|
+
return /* @__PURE__ */ jsx37(View32, { style: [{ width: size, height: size }, style], ...markA11y(title), children: /* @__PURE__ */ jsx37(Animated12.View, { style: { transform: [{ translateY: bob }] }, children: /* @__PURE__ */ jsxs33(Svg17, { width: size, height: size, viewBox: "0 0 120 120", children: [
|
|
3776
|
+
/* @__PURE__ */ jsx37(Defs11, { children: /* @__PURE__ */ jsxs33(LinearGradient11, { id, x1: "0", y1: "0", x2: "0", y2: "1", children: [
|
|
3777
|
+
/* @__PURE__ */ jsx37(Stop11, { offset: "0%", stopColor: p.from }),
|
|
3778
|
+
/* @__PURE__ */ jsx37(Stop11, { offset: "100%", stopColor: p.to })
|
|
3732
3779
|
] }) }),
|
|
3733
|
-
/* @__PURE__ */
|
|
3734
|
-
mood === "empty" && /* @__PURE__ */
|
|
3735
|
-
g.legs.map((d) => /* @__PURE__ */
|
|
3736
|
-
g.back?.map((d) => d.endsWith("Z") ? /* @__PURE__ */
|
|
3737
|
-
g.parcel?.map((d, i) => /* @__PURE__ */
|
|
3738
|
-
/* @__PURE__ */
|
|
3739
|
-
/* @__PURE__ */
|
|
3780
|
+
/* @__PURE__ */ jsx37(Ellipse2, { cx: g.shadow[0], cy: g.shadow[1], rx: g.shadow[2], ry: g.shadow[3], fill: SHADE, opacity: 0.14 }),
|
|
3781
|
+
mood === "empty" && /* @__PURE__ */ jsx37(Path15, { d: MOOD_PARTS.tray, stroke: outline, strokeWidth: 1.6, strokeDasharray: "3 3", fill: "none" }),
|
|
3782
|
+
g.legs.map((d) => /* @__PURE__ */ jsx37(Path15, { d, stroke: p.beak, strokeWidth: 2.6, strokeLinecap: "round", fill: "none" }, d)),
|
|
3783
|
+
g.back?.map((d) => d.endsWith("Z") ? /* @__PURE__ */ jsx37(Path15, { d, fill: p.detail, ...line }, d) : /* @__PURE__ */ jsx37(Path15, { d, stroke: outline, strokeWidth: 1.4, fill: "none" }, d)),
|
|
3784
|
+
g.parcel?.map((d, i) => /* @__PURE__ */ jsx37(Path15, { d, fill: PARCEL[i], ...line }, d)),
|
|
3785
|
+
/* @__PURE__ */ jsx37(Path15, { d: g.body, fill: body, ...line }),
|
|
3786
|
+
/* @__PURE__ */ jsx37(Path15, { d: g.belly, fill: LIGHT, opacity: 0.28 }),
|
|
3740
3787
|
[wl, wr].map((w, i) => {
|
|
3741
3788
|
const turn = mood === "success" ? i === 0 ? 28 : -28 : mood === "welcome" && i === 1 ? -20 : 0;
|
|
3742
|
-
return /* @__PURE__ */
|
|
3743
|
-
/* @__PURE__ */
|
|
3744
|
-
/* @__PURE__ */
|
|
3789
|
+
return /* @__PURE__ */ jsxs33(G, { transform: turn ? rot(turn, w.pivot) : void 0, children: [
|
|
3790
|
+
/* @__PURE__ */ jsx37(Path15, { d: w.d, fill: p.wing, ...line }),
|
|
3791
|
+
/* @__PURE__ */ jsx37(Path15, { d: w.d, fill: SHADE, opacity: 0.16 })
|
|
3745
3792
|
] }, i);
|
|
3746
3793
|
}),
|
|
3747
|
-
g.neck && /* @__PURE__ */
|
|
3748
|
-
g.head.r > 0 && /* @__PURE__ */
|
|
3749
|
-
g.details.map((d) => /* @__PURE__ */
|
|
3750
|
-
g.visor && /* @__PURE__ */
|
|
3794
|
+
g.neck && /* @__PURE__ */ jsx37(Path15, { d: g.neck.d, stroke: body, strokeWidth: g.neck.width, strokeLinecap: "round", fill: "none" }),
|
|
3795
|
+
g.head.r > 0 && /* @__PURE__ */ jsx37(Circle11, { cx: g.head.cx, cy: g.head.cy, r: g.head.r, fill: body, ...line }),
|
|
3796
|
+
g.details.map((d) => /* @__PURE__ */ jsx37(Path15, { d, fill: p.detail, ...line }, d)),
|
|
3797
|
+
g.visor && /* @__PURE__ */ jsx37(Rect3, { x: g.visor.x, y: g.visor.y, width: g.visor.w, height: g.visor.h, rx: 4, fill: theme.surface0, ...line }),
|
|
3751
3798
|
g.eyes.at.map(
|
|
3752
|
-
(at, i) => mood === "empty" && g.eyes.white > 0 ? /* @__PURE__ */
|
|
3753
|
-
/* @__PURE__ */
|
|
3754
|
-
/* @__PURE__ */
|
|
3755
|
-
/* @__PURE__ */
|
|
3756
|
-
] }, i) : mood === "success" || mood === "empty" ? /* @__PURE__ */
|
|
3757
|
-
g.eyes.white > 0 && /* @__PURE__ */
|
|
3758
|
-
/* @__PURE__ */
|
|
3799
|
+
(at, i) => mood === "empty" && g.eyes.white > 0 ? /* @__PURE__ */ jsxs33(G, { children: [
|
|
3800
|
+
/* @__PURE__ */ jsx37(Circle11, { cx: at[0], cy: at[1], r: g.eyes.white, fill: LIGHT, ...line }),
|
|
3801
|
+
/* @__PURE__ */ jsx37(Circle11, { cx: at[0], cy: at[1] + g.eyes.pupil * 0.7, r: g.eyes.pupil, fill: SHADE }),
|
|
3802
|
+
/* @__PURE__ */ jsx37(Path15, { d: upperLid(at, g.eyes.white), fill: p.detail, ...line })
|
|
3803
|
+
] }, i) : mood === "success" || mood === "empty" ? /* @__PURE__ */ jsx37(Path15, { 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__ */ jsxs33(G, { children: [
|
|
3804
|
+
g.eyes.white > 0 && /* @__PURE__ */ jsx37(Circle11, { cx: at[0], cy: at[1], r: g.eyes.white, fill: LIGHT, ...line }),
|
|
3805
|
+
/* @__PURE__ */ jsx37(Circle11, { cx: at[0] + look3, cy: at[1] - look3, r: g.eyes.pupil, fill: g.visor ? p.eye : SHADE })
|
|
3759
3806
|
] }, i)
|
|
3760
3807
|
),
|
|
3761
|
-
g.glasses && g.eyes.at.map(([x, y]) => /* @__PURE__ */
|
|
3762
|
-
mood === "error" && g.eyes.at.map((at, i) => /* @__PURE__ */
|
|
3763
|
-
/* @__PURE__ */
|
|
3764
|
-
mood === "thinking" && MOOD_PARTS.dots.map(([cx, cy, r], i) => /* @__PURE__ */
|
|
3765
|
-
(mood === "success" || mood === "error") && /* @__PURE__ */
|
|
3766
|
-
mood === "success" && /* @__PURE__ */
|
|
3767
|
-
mood === "error" && /* @__PURE__ */
|
|
3768
|
-
mood === "error" && /* @__PURE__ */
|
|
3808
|
+
g.glasses && g.eyes.at.map(([x, y]) => /* @__PURE__ */ jsx37(Circle11, { cx: x, cy: y, r: 6.5, fill: "none", stroke: outline, strokeWidth: 1.3 }, x)),
|
|
3809
|
+
mood === "error" && g.eyes.at.map((at, i) => /* @__PURE__ */ jsx37(Path15, { d: brow(at, eyeR, g.eyes.at.length === 1 ? 1 : i === 0 ? -1 : 1), stroke: outline, strokeWidth: 2, strokeLinecap: "round" }, i)),
|
|
3810
|
+
/* @__PURE__ */ jsx37(Path15, { d: g.beak, fill: p.beak, ...line }),
|
|
3811
|
+
mood === "thinking" && MOOD_PARTS.dots.map(([cx, cy, r], i) => /* @__PURE__ */ jsx37(Circle11, { cx, cy, r, fill: theme.textSecondary, opacity: 0.5 + i * 0.25 }, cx)),
|
|
3812
|
+
(mood === "success" || mood === "error") && /* @__PURE__ */ jsx37(Circle11, { cx: MOOD_PARTS.badge.cx, cy: MOOD_PARTS.badge.cy, r: MOOD_PARTS.badge.r, fill: mood === "success" ? theme.success : theme.danger }),
|
|
3813
|
+
mood === "success" && /* @__PURE__ */ jsx37(Path15, { d: MOOD_PARTS.check, stroke: theme.surface0, strokeWidth: 2.6, strokeLinecap: "round", strokeLinejoin: "round", fill: "none" }),
|
|
3814
|
+
mood === "error" && /* @__PURE__ */ jsx37(Path15, { d: MOOD_PARTS.bang.line, stroke: theme.surface0, strokeWidth: 2.8, strokeLinecap: "round" }),
|
|
3815
|
+
mood === "error" && /* @__PURE__ */ jsx37(Circle11, { cx: MOOD_PARTS.bang.dot[0], cy: MOOD_PARTS.bang.dot[1], r: 1.6, fill: theme.surface0 })
|
|
3769
3816
|
] }) }) });
|
|
3770
3817
|
}
|
|
3771
3818
|
|
|
3772
3819
|
// src/native/mascot-state.tsx
|
|
3773
|
-
import { jsx as
|
|
3820
|
+
import { jsx as jsx38, jsxs as jsxs34 } from "react/jsx-runtime";
|
|
3774
3821
|
var SIZE = { sm: 64, md: 96, lg: 128 };
|
|
3775
3822
|
function useArrival(animated) {
|
|
3776
3823
|
const [value] = React24.useState(() => new Animated13.Value(animated ? 0 : 1));
|
|
@@ -3791,30 +3838,30 @@ function useArrival(animated) {
|
|
|
3791
3838
|
function MascotState({ bird = "owl", mood = "empty", title, description, action, size = "md", layout = "stacked", tone: tone3, animated = true, style, ...props }) {
|
|
3792
3839
|
const opacity = useArrival(animated);
|
|
3793
3840
|
const inline = layout === "inline";
|
|
3794
|
-
return /* @__PURE__ */
|
|
3841
|
+
return /* @__PURE__ */ jsxs34(
|
|
3795
3842
|
Animated13.View,
|
|
3796
3843
|
{
|
|
3797
3844
|
role: mood === "error" ? "alert" : "status",
|
|
3798
3845
|
accessibilityLiveRegion: mood === "error" ? "assertive" : "polite",
|
|
3799
3846
|
"aria-busy": mood === "thinking" ? true : void 0,
|
|
3800
3847
|
...props,
|
|
3801
|
-
style: [inline ?
|
|
3848
|
+
style: [inline ? styles27.inline : styles27.stacked, { opacity, transform: [{ translateY: opacity.interpolate({ inputRange: [0, 1], outputRange: [6, 0] }) }] }, style],
|
|
3802
3849
|
children: [
|
|
3803
|
-
/* @__PURE__ */
|
|
3804
|
-
/* @__PURE__ */
|
|
3805
|
-
/* @__PURE__ */
|
|
3806
|
-
description ? /* @__PURE__ */
|
|
3807
|
-
action ? /* @__PURE__ */
|
|
3850
|
+
/* @__PURE__ */ jsx38(Mascot, { bird, mood, tone: tone3, size: SIZE[size], animated }),
|
|
3851
|
+
/* @__PURE__ */ jsxs34(View33, { style: inline ? styles27.wordsInline : styles27.words, children: [
|
|
3852
|
+
/* @__PURE__ */ jsx38(Txt, { variant: "label", role: "heading", style: inline ? null : styles27.center, children: title }),
|
|
3853
|
+
description ? /* @__PURE__ */ jsx38(Txt, { tone: "secondary", style: inline ? null : styles27.center, children: description }) : null,
|
|
3854
|
+
action ? /* @__PURE__ */ jsx38(View33, { style: [styles27.action, inline ? null : styles27.actionCentred], children: action }) : null
|
|
3808
3855
|
] })
|
|
3809
3856
|
]
|
|
3810
3857
|
}
|
|
3811
3858
|
);
|
|
3812
3859
|
}
|
|
3813
|
-
var ErrorState = (props) => /* @__PURE__ */
|
|
3814
|
-
var SuccessState = (props) => /* @__PURE__ */
|
|
3815
|
-
var LoadingState = (props) => /* @__PURE__ */
|
|
3816
|
-
var WelcomeState = (props) => /* @__PURE__ */
|
|
3817
|
-
var
|
|
3860
|
+
var ErrorState = (props) => /* @__PURE__ */ jsx38(MascotState, { mood: "error", ...props });
|
|
3861
|
+
var SuccessState = (props) => /* @__PURE__ */ jsx38(MascotState, { mood: "success", ...props });
|
|
3862
|
+
var LoadingState = (props) => /* @__PURE__ */ jsx38(MascotState, { mood: "thinking", ...props });
|
|
3863
|
+
var WelcomeState = (props) => /* @__PURE__ */ jsx38(MascotState, { mood: "welcome", ...props });
|
|
3864
|
+
var styles27 = StyleSheet27.create({
|
|
3818
3865
|
stacked: { alignItems: "center", justifyContent: "center", gap: 12, paddingVertical: 40, paddingHorizontal: 24 },
|
|
3819
3866
|
inline: { flexDirection: "row", alignItems: "center", gap: 16 },
|
|
3820
3867
|
words: { alignItems: "center", gap: 6 },
|
|
@@ -3826,9 +3873,9 @@ var styles25 = StyleSheet25.create({
|
|
|
3826
3873
|
|
|
3827
3874
|
// src/native/match-dialog.tsx
|
|
3828
3875
|
import * as React25 from "react";
|
|
3829
|
-
import { AccessibilityInfo as AccessibilityInfo10, Animated as Animated14, Easing as Easing8, Modal as Modal4, Pressable as Pressable14, StyleSheet as
|
|
3876
|
+
import { AccessibilityInfo as AccessibilityInfo10, Animated as Animated14, Easing as Easing8, Modal as Modal4, Pressable as Pressable14, StyleSheet as StyleSheet28, View as View34 } from "react-native";
|
|
3830
3877
|
import Svg18, { Path as Path16 } from "react-native-svg";
|
|
3831
|
-
import { jsx as
|
|
3878
|
+
import { jsx as jsx39, jsxs as jsxs35 } from "react/jsx-runtime";
|
|
3832
3879
|
function MatchDialog({ open, onOpenChange, title, description, people, primaryLabel, onPrimary, secondaryLabel }) {
|
|
3833
3880
|
const { theme, haptic } = useTheme();
|
|
3834
3881
|
const reduce = useReducedMotion();
|
|
@@ -3848,17 +3895,17 @@ function MatchDialog({ open, onOpenChange, title, description, people, primaryLa
|
|
|
3848
3895
|
}
|
|
3849
3896
|
}, [open, reduce, t]);
|
|
3850
3897
|
const side = (dir) => ({ transform: [{ translateX: t.interpolate({ inputRange: [0, 1], outputRange: [dir * 110, dir * 50] }) }, { rotate: dir === -1 ? "-8deg" : "8deg" }] });
|
|
3851
|
-
return /* @__PURE__ */
|
|
3852
|
-
/* @__PURE__ */
|
|
3853
|
-
/* @__PURE__ */
|
|
3854
|
-
description ? /* @__PURE__ */
|
|
3855
|
-
/* @__PURE__ */
|
|
3856
|
-
/* @__PURE__ */
|
|
3857
|
-
/* @__PURE__ */
|
|
3858
|
-
/* @__PURE__ */
|
|
3898
|
+
return /* @__PURE__ */ jsx39(Modal4, { ...modalName(title), visible: open, transparent: true, animationType: reduce ? "none" : "fade", onRequestClose: () => onOpenChange(false), statusBarTranslucent: true, children: /* @__PURE__ */ jsxs35(View34, { accessibilityViewIsModal: true, style: [styles28.screen, { backgroundColor: theme.accent }], children: [
|
|
3899
|
+
/* @__PURE__ */ jsx39(View34, { style: [StyleSheet28.absoluteFill, { backgroundColor: theme.accent2, opacity: 0.55 }] }),
|
|
3900
|
+
/* @__PURE__ */ jsx39(Txt, { variant: "display", tone: "onAccent", style: styles28.title, children: title }),
|
|
3901
|
+
description ? /* @__PURE__ */ jsx39(Txt, { tone: "onAccent", style: styles28.center, children: description }) : null,
|
|
3902
|
+
/* @__PURE__ */ jsxs35(View34, { style: styles28.pair, "aria-hidden": true, children: [
|
|
3903
|
+
/* @__PURE__ */ jsx39(Animated14.View, { style: [styles28.photo, side(-1), { borderColor: theme.onAccent }], children: /* @__PURE__ */ jsx39(Avatar, { src: people[0].src, alt: "", fallback: people[0].name.charAt(0), size: 112 }) }),
|
|
3904
|
+
/* @__PURE__ */ jsx39(Animated14.View, { style: [styles28.photo, side(1), { borderColor: theme.onAccent }], children: /* @__PURE__ */ jsx39(Avatar, { src: people[1].src, alt: "", fallback: people[1].name.charAt(0), size: 112 }) }),
|
|
3905
|
+
/* @__PURE__ */ jsx39(Animated14.View, { style: [styles28.heart, { backgroundColor: theme.onAccent, transform: [{ scale: t }] }], children: /* @__PURE__ */ jsx39(Svg18, { width: 26, height: 26, viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx39(Path16, { 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 }) }) })
|
|
3859
3906
|
] }),
|
|
3860
|
-
/* @__PURE__ */
|
|
3861
|
-
/* @__PURE__ */
|
|
3907
|
+
/* @__PURE__ */ jsxs35(View34, { style: styles28.actions, children: [
|
|
3908
|
+
/* @__PURE__ */ jsx39(
|
|
3862
3909
|
Button,
|
|
3863
3910
|
{
|
|
3864
3911
|
label: primaryLabel,
|
|
@@ -3869,11 +3916,11 @@ function MatchDialog({ open, onOpenChange, title, description, people, primaryLa
|
|
|
3869
3916
|
}
|
|
3870
3917
|
}
|
|
3871
3918
|
),
|
|
3872
|
-
/* @__PURE__ */
|
|
3919
|
+
/* @__PURE__ */ jsx39(Pressable14, { role: "button", onPress: () => onOpenChange(false), style: ({ pressed }) => [styles28.secondary, { borderColor: theme.onAccent, opacity: pressed ? 0.8 : 1 }], children: /* @__PURE__ */ jsx39(Txt, { variant: "label", tone: "onAccent", children: secondaryLabel }) })
|
|
3873
3920
|
] })
|
|
3874
3921
|
] }) });
|
|
3875
3922
|
}
|
|
3876
|
-
var
|
|
3923
|
+
var styles28 = StyleSheet28.create({
|
|
3877
3924
|
screen: { flex: 1, alignItems: "center", justifyContent: "center", gap: 12, padding: 32 },
|
|
3878
3925
|
title: { textAlign: "center", fontSize: 40, lineHeight: 46 },
|
|
3879
3926
|
center: { textAlign: "center", maxWidth: 300 },
|
|
@@ -3885,9 +3932,9 @@ var styles26 = StyleSheet26.create({
|
|
|
3885
3932
|
});
|
|
3886
3933
|
|
|
3887
3934
|
// src/native/meter.tsx
|
|
3888
|
-
import { StyleSheet as
|
|
3935
|
+
import { StyleSheet as StyleSheet29, View as View35 } from "react-native";
|
|
3889
3936
|
import Svg19, { Circle as Circle12 } from "react-native-svg";
|
|
3890
|
-
import { jsx as
|
|
3937
|
+
import { jsx as jsx40, jsxs as jsxs36 } from "react/jsx-runtime";
|
|
3891
3938
|
var THICK = { sm: 6, md: 8, lg: 12 };
|
|
3892
3939
|
var RING = { sm: 56, md: 96, lg: 144 };
|
|
3893
3940
|
var partColor = (t, i) => [t.accent, t.warning, t.success, t.textSecondary, t.danger][i % 5];
|
|
@@ -3900,10 +3947,10 @@ function Meter({ label, value = 0, min = 0, max = 100, valueText, thresholds, op
|
|
|
3900
3947
|
const words2 = valueText ?? `${Math.round(ratio * 100)} %`;
|
|
3901
3948
|
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)} %` }));
|
|
3902
3949
|
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 };
|
|
3903
|
-
const legend = parts ? /* @__PURE__ */
|
|
3904
|
-
/* @__PURE__ */
|
|
3905
|
-
/* @__PURE__ */
|
|
3906
|
-
/* @__PURE__ */
|
|
3950
|
+
const legend = parts ? /* @__PURE__ */ jsx40(View35, { style: styles29.legend, "aria-hidden": true, children: shares.map((p, i) => /* @__PURE__ */ jsxs36(View35, { style: styles29.legendItem, children: [
|
|
3951
|
+
/* @__PURE__ */ jsx40(View35, { style: [styles29.swatch, { backgroundColor: p.color }] }),
|
|
3952
|
+
/* @__PURE__ */ jsx40(Txt, { variant: "caption", children: p.label }),
|
|
3953
|
+
/* @__PURE__ */ jsx40(Txt, { variant: "caption", tone: "secondary", children: p.words })
|
|
3907
3954
|
] }, i)) }) : null;
|
|
3908
3955
|
if (variant === "ring") {
|
|
3909
3956
|
const side = RING[size];
|
|
@@ -3915,27 +3962,27 @@ function Meter({ label, value = 0, min = 0, max = 100, valueText, thresholds, op
|
|
|
3915
3962
|
offset += p.ratio;
|
|
3916
3963
|
return arc;
|
|
3917
3964
|
}) : [{ color: tone3, len: ratio, start: 0 }];
|
|
3918
|
-
return /* @__PURE__ */
|
|
3919
|
-
/* @__PURE__ */
|
|
3920
|
-
/* @__PURE__ */
|
|
3921
|
-
/* @__PURE__ */
|
|
3922
|
-
arcs.map((a, i) => /* @__PURE__ */
|
|
3965
|
+
return /* @__PURE__ */ jsxs36(View35, { accessible: true, ...a11y, style: [styles29.ringRoot, style], children: [
|
|
3966
|
+
/* @__PURE__ */ jsxs36(View35, { style: { width: side, height: side }, children: [
|
|
3967
|
+
/* @__PURE__ */ jsxs36(Svg19, { width: side, height: side, viewBox: "0 0 100 100", style: { transform: [{ rotate: "-90deg" }] }, children: [
|
|
3968
|
+
/* @__PURE__ */ jsx40(Circle12, { cx: 50, cy: 50, r, fill: "none", stroke: theme.borderDefault, strokeWidth: 9 }),
|
|
3969
|
+
arcs.map((a, i) => /* @__PURE__ */ jsx40(Circle12, { 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))
|
|
3923
3970
|
] }),
|
|
3924
|
-
children !== void 0 ? /* @__PURE__ */
|
|
3971
|
+
children !== void 0 ? /* @__PURE__ */ jsx40(View35, { style: [StyleSheet29.absoluteFill, styles29.center], children }) : null
|
|
3925
3972
|
] }),
|
|
3926
3973
|
legend
|
|
3927
3974
|
] });
|
|
3928
3975
|
}
|
|
3929
|
-
return /* @__PURE__ */
|
|
3930
|
-
showLabel ? /* @__PURE__ */
|
|
3931
|
-
/* @__PURE__ */
|
|
3932
|
-
!parts ? /* @__PURE__ */
|
|
3976
|
+
return /* @__PURE__ */ jsxs36(View35, { accessible: true, ...a11y, style: [styles29.root, style], children: [
|
|
3977
|
+
showLabel ? /* @__PURE__ */ jsxs36(View35, { style: styles29.header, "aria-hidden": true, children: [
|
|
3978
|
+
/* @__PURE__ */ jsx40(Txt, { variant: "caption", numberOfLines: 1, style: styles29.caption, children: label }),
|
|
3979
|
+
!parts ? /* @__PURE__ */ jsx40(Txt, { variant: "caption", tone: "secondary", children: words2 }) : null
|
|
3933
3980
|
] }) : null,
|
|
3934
|
-
/* @__PURE__ */
|
|
3981
|
+
/* @__PURE__ */ jsx40(View35, { style: [styles29.track, { height: THICK[size], backgroundColor: theme.surface3 }], children: parts ? shares.map((p, i) => /* @__PURE__ */ jsx40(View35, { style: { width: `${p.ratio * 100}%`, backgroundColor: p.color } }, i)) : /* @__PURE__ */ jsx40(View35, { style: [styles29.fill, { width: `${ratio * 100}%`, backgroundColor: tone3 }] }) }),
|
|
3935
3982
|
legend
|
|
3936
3983
|
] });
|
|
3937
3984
|
}
|
|
3938
|
-
var
|
|
3985
|
+
var styles29 = StyleSheet29.create({
|
|
3939
3986
|
root: { width: "100%", gap: 6 },
|
|
3940
3987
|
header: { flexDirection: "row", alignItems: "baseline", gap: 8 },
|
|
3941
3988
|
caption: { flex: 1, fontWeight: "600" },
|
|
@@ -3951,7 +3998,7 @@ var styles27 = StyleSheet27.create({
|
|
|
3951
3998
|
// src/native/number-ticker.tsx
|
|
3952
3999
|
import * as React26 from "react";
|
|
3953
4000
|
import { AccessibilityInfo as AccessibilityInfo11, Animated as Animated15, Easing as Easing9, Text as Text13 } from "react-native";
|
|
3954
|
-
import { jsx as
|
|
4001
|
+
import { jsx as jsx41 } from "react/jsx-runtime";
|
|
3955
4002
|
function NumberTicker({ value, locale, format, trigger = "mount", duration = 1100, announce, variant = "display", tone: tone3 = "text", style }) {
|
|
3956
4003
|
const reduce = useReducedMotion();
|
|
3957
4004
|
const writer = React26.useMemo(() => new Intl.NumberFormat(locale, format), [locale, format]);
|
|
@@ -3979,13 +4026,13 @@ function NumberTicker({ value, locale, format, trigger = "mount", duration = 110
|
|
|
3979
4026
|
};
|
|
3980
4027
|
}, [value, reduce, trigger, duration, announce, anim, writer]);
|
|
3981
4028
|
const digits = Number.isInteger(value) ? Math.round(shown) : shown;
|
|
3982
|
-
return /* @__PURE__ */
|
|
4029
|
+
return /* @__PURE__ */ jsx41(Txt, { variant, tone: tone3, "aria-label": writer.format(value), style: [{ fontVariant: ["tabular-nums"] }, style], children: /* @__PURE__ */ jsx41(Text13, { "aria-hidden": true, children: writer.format(digits) }) });
|
|
3983
4030
|
}
|
|
3984
4031
|
|
|
3985
4032
|
// src/native/onboarding.tsx
|
|
3986
4033
|
import * as React27 from "react";
|
|
3987
|
-
import { ScrollView as ScrollView5, StyleSheet as
|
|
3988
|
-
import { jsx as
|
|
4034
|
+
import { ScrollView as ScrollView5, StyleSheet as StyleSheet30, View as View36 } from "react-native";
|
|
4035
|
+
import { jsx as jsx42, jsxs as jsxs37 } from "react/jsx-runtime";
|
|
3989
4036
|
function Onboarding({ slides, labels, onDone, style }) {
|
|
3990
4037
|
const { theme, insets, haptic } = useTheme();
|
|
3991
4038
|
const [width, setWidth] = React27.useState(0);
|
|
@@ -4000,18 +4047,18 @@ function Onboarding({ slides, labels, onDone, style }) {
|
|
|
4000
4047
|
const onScroll = (e) => {
|
|
4001
4048
|
if (width > 0) setPage(Math.round(e.nativeEvent.contentOffset.x / width));
|
|
4002
4049
|
};
|
|
4003
|
-
return /* @__PURE__ */
|
|
4004
|
-
/* @__PURE__ */
|
|
4005
|
-
/* @__PURE__ */
|
|
4006
|
-
slide.visual ? /* @__PURE__ */
|
|
4007
|
-
/* @__PURE__ */
|
|
4008
|
-
/* @__PURE__ */
|
|
4050
|
+
return /* @__PURE__ */ jsxs37(View36, { style: [styles30.root, { backgroundColor: theme.surface0, paddingTop: insets.top + 8, paddingBottom: insets.bottom + 16 }, style], onLayout: (e) => setWidth(e.nativeEvent.layout.width), children: [
|
|
4051
|
+
/* @__PURE__ */ jsx42(View36, { style: styles30.top, children: !last ? /* @__PURE__ */ jsx42(Button, { label: labels.skip, variant: "ghost", size: "sm", onPress: onDone }) : /* @__PURE__ */ jsx42(View36, { style: styles30.spacer }) }),
|
|
4052
|
+
/* @__PURE__ */ jsx42(ScrollView5, { ref: scroller, tabIndex: 0, horizontal: true, pagingEnabled: true, showsHorizontalScrollIndicator: false, onMomentumScrollEnd: onScroll, style: styles30.flex, children: slides.map((slide, i) => /* @__PURE__ */ jsxs37(View36, { style: [styles30.slide, { width: width || void 0 }], accessible: true, "aria-label": `${labels.position(i + 1, slides.length)}. ${slide.title}. ${slide.description}`, "aria-hidden": i !== page, children: [
|
|
4053
|
+
slide.visual ? /* @__PURE__ */ jsx42(View36, { style: styles30.visual, children: slide.visual }) : null,
|
|
4054
|
+
/* @__PURE__ */ jsx42(Txt, { variant: "display", style: styles30.centred, children: slide.title }),
|
|
4055
|
+
/* @__PURE__ */ jsx42(Txt, { tone: "secondary", style: [styles30.centred, styles30.description], children: slide.description })
|
|
4009
4056
|
] }, i)) }),
|
|
4010
|
-
/* @__PURE__ */
|
|
4011
|
-
/* @__PURE__ */
|
|
4057
|
+
/* @__PURE__ */ jsx42(View36, { style: styles30.dots, "aria-hidden": true, children: slides.map((_, i) => /* @__PURE__ */ jsx42(View36, { style: [styles30.dot, { width: i === page ? 22 : 8, backgroundColor: i === page ? theme.accent : theme.borderStrong }] }, i)) }),
|
|
4058
|
+
/* @__PURE__ */ jsx42(View36, { style: styles30.bottom, children: /* @__PURE__ */ jsx42(Button, { label: last ? labels.done : labels.next, variant: last ? "gradient" : "primary", size: "lg", onPress: () => last ? onDone() : go(page + 1) }) })
|
|
4012
4059
|
] });
|
|
4013
4060
|
}
|
|
4014
|
-
var
|
|
4061
|
+
var styles30 = StyleSheet30.create({
|
|
4015
4062
|
root: { flex: 1 },
|
|
4016
4063
|
top: { flexDirection: "row", justifyContent: "flex-end", paddingHorizontal: 16, minHeight: 32 },
|
|
4017
4064
|
spacer: { height: 32 },
|
|
@@ -4027,8 +4074,8 @@ var styles28 = StyleSheet28.create({
|
|
|
4027
4074
|
|
|
4028
4075
|
// src/native/otp-input.tsx
|
|
4029
4076
|
import * as React28 from "react";
|
|
4030
|
-
import { Platform as Platform2, Pressable as Pressable15, StyleSheet as
|
|
4031
|
-
import { jsx as
|
|
4077
|
+
import { Platform as Platform2, Pressable as Pressable15, StyleSheet as StyleSheet31, TextInput as TextInput5, View as View37 } from "react-native";
|
|
4078
|
+
import { jsx as jsx43, jsxs as jsxs38 } from "react/jsx-runtime";
|
|
4032
4079
|
function OtpInput({ label, length = 6, value, onValueChange, onComplete, mode = "numeric", invalid, disabled, autoFocus, style }) {
|
|
4033
4080
|
const { theme, radius: radius3, haptic } = useTheme();
|
|
4034
4081
|
const [own, setOwn] = React28.useState("");
|
|
@@ -4047,14 +4094,14 @@ function OtpInput({ label, length = 6, value, onValueChange, onComplete, mode =
|
|
|
4047
4094
|
onComplete?.(next);
|
|
4048
4095
|
}
|
|
4049
4096
|
};
|
|
4050
|
-
return /* @__PURE__ */
|
|
4051
|
-
/* @__PURE__ */
|
|
4097
|
+
return /* @__PURE__ */ jsxs38(Pressable15, { onPress: () => input.current?.focus(), disabled, accessible: false, style: [styles31.root, style], children: [
|
|
4098
|
+
/* @__PURE__ */ jsx43(View37, { style: styles31.boxes, "aria-hidden": true, children: Array.from({ length }, (_, i) => {
|
|
4052
4099
|
const active = focused && i === Math.min(code.length, length - 1);
|
|
4053
|
-
return /* @__PURE__ */
|
|
4054
|
-
|
|
4100
|
+
return /* @__PURE__ */ jsx43(
|
|
4101
|
+
View37,
|
|
4055
4102
|
{
|
|
4056
4103
|
style: [
|
|
4057
|
-
|
|
4104
|
+
styles31.box,
|
|
4058
4105
|
{
|
|
4059
4106
|
borderRadius: radius3.md,
|
|
4060
4107
|
backgroundColor: theme.surface2,
|
|
@@ -4062,12 +4109,12 @@ function OtpInput({ label, length = 6, value, onValueChange, onComplete, mode =
|
|
|
4062
4109
|
borderWidth: invalid || active ? 2 : 1
|
|
4063
4110
|
}
|
|
4064
4111
|
],
|
|
4065
|
-
children: /* @__PURE__ */
|
|
4112
|
+
children: /* @__PURE__ */ jsx43(Txt, { variant: "title", children: code[i] ?? "" })
|
|
4066
4113
|
},
|
|
4067
4114
|
i
|
|
4068
4115
|
);
|
|
4069
4116
|
}) }),
|
|
4070
|
-
/* @__PURE__ */
|
|
4117
|
+
/* @__PURE__ */ jsx43(
|
|
4071
4118
|
TextInput5,
|
|
4072
4119
|
{
|
|
4073
4120
|
ref: input,
|
|
@@ -4086,12 +4133,12 @@ function OtpInput({ label, length = 6, value, onValueChange, onComplete, mode =
|
|
|
4086
4133
|
caretHidden: true,
|
|
4087
4134
|
onFocus: () => setFocused(true),
|
|
4088
4135
|
onBlur: () => setFocused(false),
|
|
4089
|
-
style:
|
|
4136
|
+
style: styles31.hidden
|
|
4090
4137
|
}
|
|
4091
4138
|
)
|
|
4092
4139
|
] });
|
|
4093
4140
|
}
|
|
4094
|
-
var
|
|
4141
|
+
var styles31 = StyleSheet31.create({
|
|
4095
4142
|
root: { alignSelf: "flex-start" },
|
|
4096
4143
|
boxes: { flexDirection: "row", gap: 8 },
|
|
4097
4144
|
box: { width: 46, height: 56, alignItems: "center", justifyContent: "center" },
|
|
@@ -4099,11 +4146,11 @@ var styles29 = StyleSheet29.create({
|
|
|
4099
4146
|
});
|
|
4100
4147
|
|
|
4101
4148
|
// src/native/pagination.tsx
|
|
4102
|
-
import { Pressable as Pressable16, StyleSheet as
|
|
4149
|
+
import { Pressable as Pressable16, StyleSheet as StyleSheet32, Text as Text14, View as View38 } from "react-native";
|
|
4103
4150
|
import Svg20, { Path as Path17 } from "react-native-svg";
|
|
4104
|
-
import { jsx as
|
|
4151
|
+
import { jsx as jsx44, jsxs as jsxs39 } from "react/jsx-runtime";
|
|
4105
4152
|
function Chevron3({ direction, color }) {
|
|
4106
|
-
return /* @__PURE__ */
|
|
4153
|
+
return /* @__PURE__ */ jsx44(Svg20, { 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__ */ jsx44(Path17, { d: direction === "left" ? "m15 6-6 6 6 6" : "m9 6 6 6-6 6" }) });
|
|
4107
4154
|
}
|
|
4108
4155
|
function Pagination({ page = 1, pageCount, onPageChange, hasPrevious, hasNext, onPrevious, onNext, status, disabled, labels, style }) {
|
|
4109
4156
|
const { theme, radius: radius3 } = useTheme();
|
|
@@ -4112,7 +4159,7 @@ function Pagination({ page = 1, pageCount, onPageChange, hasPrevious, hasNext, o
|
|
|
4112
4159
|
const current = Math.min(Math.max(1, page), count);
|
|
4113
4160
|
const canPrevious = !disabled && (paged ? current > 1 : Boolean(hasPrevious));
|
|
4114
4161
|
const canNext = !disabled && (paged ? current < count : Boolean(hasNext));
|
|
4115
|
-
const button = (direction, enabled, onPress, label) => /* @__PURE__ */
|
|
4162
|
+
const button = (direction, enabled, onPress, label) => /* @__PURE__ */ jsx44(
|
|
4116
4163
|
Pressable16,
|
|
4117
4164
|
{
|
|
4118
4165
|
role: "button",
|
|
@@ -4122,28 +4169,28 @@ function Pagination({ page = 1, pageCount, onPageChange, hasPrevious, hasNext, o
|
|
|
4122
4169
|
hitSlop: 6,
|
|
4123
4170
|
onPress,
|
|
4124
4171
|
style: ({ pressed }) => [
|
|
4125
|
-
|
|
4172
|
+
styles32.button,
|
|
4126
4173
|
{ borderRadius: radius3.sm, borderColor: theme.borderDefault, backgroundColor: theme.surface1, opacity: enabled ? pressed ? 0.8 : 1 : 0.4 }
|
|
4127
4174
|
],
|
|
4128
|
-
children: /* @__PURE__ */
|
|
4175
|
+
children: /* @__PURE__ */ jsx44(Chevron3, { direction, color: theme.textPrimary })
|
|
4129
4176
|
}
|
|
4130
4177
|
);
|
|
4131
4178
|
const text = status ?? (paged ? labels.compact(current, count) : null);
|
|
4132
|
-
return /* @__PURE__ */
|
|
4179
|
+
return /* @__PURE__ */ jsxs39(View38, { role: "navigation", style: [styles32.row, style], children: [
|
|
4133
4180
|
button("left", canPrevious, paged ? () => onPageChange?.(current - 1) : onPrevious, labels.previous),
|
|
4134
|
-
text ? /* @__PURE__ */
|
|
4181
|
+
text ? /* @__PURE__ */ jsx44(Text14, { "aria-live": "polite", style: [styles32.status, { color: theme.textSecondary }], children: text }) : null,
|
|
4135
4182
|
button("right", canNext, paged ? () => onPageChange?.(current + 1) : onNext, labels.next)
|
|
4136
4183
|
] });
|
|
4137
4184
|
}
|
|
4138
|
-
var
|
|
4185
|
+
var styles32 = StyleSheet32.create({
|
|
4139
4186
|
row: { flexDirection: "row", alignItems: "center", justifyContent: "space-between", gap: 12 },
|
|
4140
|
-
button: { width: 44, height: 44, alignItems: "center", justifyContent: "center", borderWidth:
|
|
4187
|
+
button: { width: 44, height: 44, alignItems: "center", justifyContent: "center", borderWidth: StyleSheet32.hairlineWidth },
|
|
4141
4188
|
status: { fontSize: 13, fontWeight: "600", fontVariant: ["tabular-nums"] }
|
|
4142
4189
|
});
|
|
4143
4190
|
|
|
4144
4191
|
// src/native/permission-prompt.tsx
|
|
4145
|
-
import { StyleSheet as
|
|
4146
|
-
import { Fragment as Fragment6, jsx as
|
|
4192
|
+
import { StyleSheet as StyleSheet33, View as View39 } from "react-native";
|
|
4193
|
+
import { Fragment as Fragment6, jsx as jsx45, jsxs as jsxs40 } from "react/jsx-runtime";
|
|
4147
4194
|
function PermissionPrompt({
|
|
4148
4195
|
status,
|
|
4149
4196
|
title,
|
|
@@ -4160,27 +4207,27 @@ function PermissionPrompt({
|
|
|
4160
4207
|
style
|
|
4161
4208
|
}) {
|
|
4162
4209
|
const { theme, radius: radius3 } = useTheme();
|
|
4163
|
-
if (status === "granted") return /* @__PURE__ */
|
|
4210
|
+
if (status === "granted") return /* @__PURE__ */ jsx45(Fragment6, { children: children ?? null });
|
|
4164
4211
|
const blocked = status === "blocked" || status === "denied" && Boolean(onOpenSettings);
|
|
4165
|
-
return /* @__PURE__ */
|
|
4166
|
-
/* @__PURE__ */
|
|
4167
|
-
/* @__PURE__ */
|
|
4168
|
-
/* @__PURE__ */
|
|
4169
|
-
/* @__PURE__ */
|
|
4170
|
-
blocked && settingsLabel && onOpenSettings ? /* @__PURE__ */
|
|
4171
|
-
dismissLabel && onDismiss ? /* @__PURE__ */
|
|
4212
|
+
return /* @__PURE__ */ jsxs40(View39, { style: [styles33.root, { backgroundColor: theme.surface1, borderColor: theme.borderSubtle, borderRadius: radius3.xl }, style], children: [
|
|
4213
|
+
/* @__PURE__ */ jsx45(Mascot, { bird: mascot, mood: blocked ? "error" : "welcome", size: 104 }),
|
|
4214
|
+
/* @__PURE__ */ jsx45(Txt, { variant: "title", style: styles33.centred, children: title }),
|
|
4215
|
+
/* @__PURE__ */ jsx45(Txt, { tone: "secondary", style: styles33.centred, children: blocked && blockedDescription ? blockedDescription : description }),
|
|
4216
|
+
/* @__PURE__ */ jsxs40(View39, { style: styles33.actions, children: [
|
|
4217
|
+
blocked && settingsLabel && onOpenSettings ? /* @__PURE__ */ jsx45(Button, { label: settingsLabel, variant: "primary", onPress: onOpenSettings }) : /* @__PURE__ */ jsx45(Button, { label: allowLabel, variant: "primary", onPress: onAllow }),
|
|
4218
|
+
dismissLabel && onDismiss ? /* @__PURE__ */ jsx45(Button, { label: dismissLabel, variant: "ghost", onPress: onDismiss }) : null
|
|
4172
4219
|
] })
|
|
4173
4220
|
] });
|
|
4174
4221
|
}
|
|
4175
|
-
var
|
|
4176
|
-
root: { alignItems: "center", gap: 10, padding: 24, borderWidth:
|
|
4222
|
+
var styles33 = StyleSheet33.create({
|
|
4223
|
+
root: { alignItems: "center", gap: 10, padding: 24, borderWidth: StyleSheet33.hairlineWidth },
|
|
4177
4224
|
centred: { textAlign: "center", maxWidth: 340 },
|
|
4178
4225
|
actions: { marginTop: 8, gap: 8, alignSelf: "stretch" }
|
|
4179
4226
|
});
|
|
4180
4227
|
|
|
4181
4228
|
// src/native/phoenix.tsx
|
|
4182
4229
|
import { useEffect as useEffect19, useState as useState28 } from "react";
|
|
4183
|
-
import { AccessibilityInfo as AccessibilityInfo12, Animated as Animated16, Easing as Easing10, View as
|
|
4230
|
+
import { AccessibilityInfo as AccessibilityInfo12, Animated as Animated16, Easing as Easing10, View as View40 } from "react-native";
|
|
4184
4231
|
import Svg21, { Circle as Circle13, Defs as Defs12, LinearGradient as LinearGradient12, Path as Path18, RadialGradient as RadialGradient9, Stop as Stop12 } from "react-native-svg";
|
|
4185
4232
|
|
|
4186
4233
|
// src/mascots/phoenix-geometry.ts
|
|
@@ -4204,7 +4251,7 @@ var PHOENIX_PALETTES = {
|
|
|
4204
4251
|
};
|
|
4205
4252
|
|
|
4206
4253
|
// src/native/phoenix.tsx
|
|
4207
|
-
import { jsx as
|
|
4254
|
+
import { jsx as jsx46, jsxs as jsxs41 } from "react/jsx-runtime";
|
|
4208
4255
|
function useFloat(animated) {
|
|
4209
4256
|
const [y] = useState28(() => new Animated16.Value(0));
|
|
4210
4257
|
useEffect19(() => {
|
|
@@ -4229,37 +4276,37 @@ function Phoenix({ tone: tone3 = "own", size = 120, animated = true, title, styl
|
|
|
4229
4276
|
const id = useSvgId("kzp");
|
|
4230
4277
|
const y = useFloat(animated);
|
|
4231
4278
|
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;
|
|
4232
|
-
return /* @__PURE__ */
|
|
4233
|
-
/* @__PURE__ */
|
|
4234
|
-
/* @__PURE__ */
|
|
4235
|
-
/* @__PURE__ */
|
|
4236
|
-
/* @__PURE__ */
|
|
4279
|
+
return /* @__PURE__ */ jsx46(View40, { style: [{ width: size, height: size }, style], ...markA11y(title), children: /* @__PURE__ */ jsx46(Animated16.View, { style: { transform: [{ translateY: y }] }, children: /* @__PURE__ */ jsxs41(Svg21, { width: size, height: size, viewBox: "0 0 120 120", children: [
|
|
4280
|
+
/* @__PURE__ */ jsxs41(Defs12, { children: [
|
|
4281
|
+
/* @__PURE__ */ jsxs41(LinearGradient12, { id: `${id}l`, x1: "1", y1: "0", x2: "0", y2: "1", children: [
|
|
4282
|
+
/* @__PURE__ */ jsx46(Stop12, { offset: "0%", stopColor: p.left[0] }),
|
|
4283
|
+
/* @__PURE__ */ jsx46(Stop12, { offset: "100%", stopColor: p.left[1] })
|
|
4237
4284
|
] }),
|
|
4238
|
-
/* @__PURE__ */
|
|
4239
|
-
/* @__PURE__ */
|
|
4240
|
-
/* @__PURE__ */
|
|
4285
|
+
/* @__PURE__ */ jsxs41(LinearGradient12, { id: `${id}r`, x1: "0", y1: "0", x2: "1", y2: "1", children: [
|
|
4286
|
+
/* @__PURE__ */ jsx46(Stop12, { offset: "0%", stopColor: p.right[0] }),
|
|
4287
|
+
/* @__PURE__ */ jsx46(Stop12, { offset: "100%", stopColor: p.right[1] })
|
|
4241
4288
|
] }),
|
|
4242
|
-
/* @__PURE__ */
|
|
4243
|
-
/* @__PURE__ */
|
|
4244
|
-
/* @__PURE__ */
|
|
4289
|
+
/* @__PURE__ */ jsxs41(RadialGradient9, { id: `${id}c`, children: [
|
|
4290
|
+
/* @__PURE__ */ jsx46(Stop12, { offset: "0%", stopColor: p.core[0] }),
|
|
4291
|
+
/* @__PURE__ */ jsx46(Stop12, { offset: "100%", stopColor: p.core[1], stopOpacity: 0 })
|
|
4245
4292
|
] })
|
|
4246
4293
|
] }),
|
|
4247
|
-
/* @__PURE__ */
|
|
4248
|
-
/* @__PURE__ */
|
|
4249
|
-
/* @__PURE__ */
|
|
4250
|
-
/* @__PURE__ */
|
|
4251
|
-
/* @__PURE__ */
|
|
4252
|
-
/* @__PURE__ */
|
|
4253
|
-
/* @__PURE__ */
|
|
4254
|
-
/* @__PURE__ */
|
|
4294
|
+
/* @__PURE__ */ jsx46(Path18, { d: PHOENIX.wingL, fill: `url(#${id}l)` }),
|
|
4295
|
+
/* @__PURE__ */ jsx46(Path18, { d: PHOENIX.wingR, fill: `url(#${id}r)` }),
|
|
4296
|
+
/* @__PURE__ */ jsx46(Path18, { d: PHOENIX.tailL, fill: `url(#${id}l)`, opacity: 0.7 }),
|
|
4297
|
+
/* @__PURE__ */ jsx46(Path18, { d: PHOENIX.tailR, fill: `url(#${id}r)`, opacity: 0.7 }),
|
|
4298
|
+
/* @__PURE__ */ jsx46(Path18, { d: PHOENIX.body, fill: p.body, stroke: p.edge, strokeOpacity: 0.5 }),
|
|
4299
|
+
/* @__PURE__ */ jsx46(Circle13, { cx: 60, cy: 58, r: 12, fill: `url(#${id}c)` }),
|
|
4300
|
+
/* @__PURE__ */ jsx46(Circle13, { cx: 60, cy: 58, r: 3.5, fill: "#ffffff" }),
|
|
4301
|
+
/* @__PURE__ */ jsx46(Path18, { d: PHOENIX.crest, stroke: p.crest, strokeWidth: 2, strokeLinecap: "round" })
|
|
4255
4302
|
] }) }) });
|
|
4256
4303
|
}
|
|
4257
4304
|
|
|
4258
4305
|
// src/native/photo-grid.tsx
|
|
4259
4306
|
import * as React30 from "react";
|
|
4260
|
-
import { Image as Image4, Pressable as Pressable17, StyleSheet as
|
|
4307
|
+
import { Image as Image4, Pressable as Pressable17, StyleSheet as StyleSheet34, View as View41 } from "react-native";
|
|
4261
4308
|
import Svg22, { Path as Path19 } from "react-native-svg";
|
|
4262
|
-
import { jsx as
|
|
4309
|
+
import { jsx as jsx47, jsxs as jsxs42 } from "react/jsx-runtime";
|
|
4263
4310
|
function PhotoGrid({ value, onValueChange, onAdd, slots = 6, required = 1, columns = 3, labels, style }) {
|
|
4264
4311
|
const { theme, radius: radius3, haptic } = useTheme();
|
|
4265
4312
|
const [menu, setMenu] = React30.useState(null);
|
|
@@ -4276,11 +4323,11 @@ function PhotoGrid({ value, onValueChange, onAdd, slots = 6, required = 1, colum
|
|
|
4276
4323
|
onValueChange(value.filter((_, j) => j !== i));
|
|
4277
4324
|
};
|
|
4278
4325
|
const width = `${100 / columns}%`;
|
|
4279
|
-
return /* @__PURE__ */
|
|
4326
|
+
return /* @__PURE__ */ jsxs42(View41, { style: [styles34.grid, style], children: [
|
|
4280
4327
|
Array.from({ length: slots }, (_, i) => {
|
|
4281
4328
|
const photo = value[i];
|
|
4282
|
-
const cell = [
|
|
4283
|
-
return /* @__PURE__ */
|
|
4329
|
+
const cell = [styles34.slot, { borderRadius: radius3.lg, aspectRatio: 3 / 4 }];
|
|
4330
|
+
return /* @__PURE__ */ jsx47(View41, { style: [styles34.cell, { width }], children: photo ? /* @__PURE__ */ jsxs42(
|
|
4284
4331
|
Pressable17,
|
|
4285
4332
|
{
|
|
4286
4333
|
role: "button",
|
|
@@ -4304,11 +4351,11 @@ function PhotoGrid({ value, onValueChange, onAdd, slots = 6, required = 1, colum
|
|
|
4304
4351
|
},
|
|
4305
4352
|
style: [...cell, { backgroundColor: theme.surface3, overflow: "hidden" }],
|
|
4306
4353
|
children: [
|
|
4307
|
-
/* @__PURE__ */
|
|
4308
|
-
i === 0 ? /* @__PURE__ */
|
|
4354
|
+
/* @__PURE__ */ jsx47(Image4, { source: { uri: photo.uri }, style: StyleSheet34.absoluteFill, resizeMode: "cover" }),
|
|
4355
|
+
i === 0 ? /* @__PURE__ */ jsx47(View41, { style: [styles34.main, { backgroundColor: theme.accent, borderRadius: radius3.full }], children: /* @__PURE__ */ jsx47(Txt, { variant: "caption", tone: "onAccent", style: styles34.mainText, children: labels.main }) }) : null
|
|
4309
4356
|
]
|
|
4310
4357
|
}
|
|
4311
|
-
) : /* @__PURE__ */
|
|
4358
|
+
) : /* @__PURE__ */ jsx47(
|
|
4312
4359
|
Pressable17,
|
|
4313
4360
|
{
|
|
4314
4361
|
role: "button",
|
|
@@ -4317,14 +4364,14 @@ function PhotoGrid({ value, onValueChange, onAdd, slots = 6, required = 1, colum
|
|
|
4317
4364
|
onPress: onAdd,
|
|
4318
4365
|
style: ({ pressed }) => [
|
|
4319
4366
|
...cell,
|
|
4320
|
-
|
|
4367
|
+
styles34.empty,
|
|
4321
4368
|
{ borderColor: i < required ? theme.accent : theme.borderStrong, backgroundColor: pressed ? theme.surface2 : theme.surface1, opacity: i > value.length ? 0.5 : 1 }
|
|
4322
4369
|
],
|
|
4323
|
-
children: /* @__PURE__ */
|
|
4370
|
+
children: /* @__PURE__ */ jsx47(View41, { style: [styles34.plus, { backgroundColor: i === value.length ? theme.accent : theme.surface3, borderRadius: radius3.full }], children: /* @__PURE__ */ jsx47(Svg22, { width: 16, height: 16, viewBox: "0 0 24 24", "aria-hidden": true, children: /* @__PURE__ */ jsx47(Path19, { d: "M12 5v14M5 12h14", stroke: i === value.length ? theme.onAccent : theme.textSecondary, strokeWidth: 2.6, strokeLinecap: "round" }) }) })
|
|
4324
4371
|
}
|
|
4325
4372
|
) }, photo?.id ?? `empty-${i}`);
|
|
4326
4373
|
}),
|
|
4327
|
-
/* @__PURE__ */
|
|
4374
|
+
/* @__PURE__ */ jsx47(
|
|
4328
4375
|
ActionSheet,
|
|
4329
4376
|
{
|
|
4330
4377
|
open: menu !== null,
|
|
@@ -4340,7 +4387,7 @@ function PhotoGrid({ value, onValueChange, onAdd, slots = 6, required = 1, colum
|
|
|
4340
4387
|
)
|
|
4341
4388
|
] });
|
|
4342
4389
|
}
|
|
4343
|
-
var
|
|
4390
|
+
var styles34 = StyleSheet34.create({
|
|
4344
4391
|
grid: { flexDirection: "row", flexWrap: "wrap", marginHorizontal: -4 },
|
|
4345
4392
|
cell: { padding: 4 },
|
|
4346
4393
|
slot: { width: "100%" },
|
|
@@ -4352,16 +4399,16 @@ var styles32 = StyleSheet32.create({
|
|
|
4352
4399
|
|
|
4353
4400
|
// src/native/profile-card.tsx
|
|
4354
4401
|
import * as React31 from "react";
|
|
4355
|
-
import { Animated as Animated17, StyleSheet as
|
|
4356
|
-
import { jsx as
|
|
4402
|
+
import { Animated as Animated17, StyleSheet as StyleSheet35, View as View42 } from "react-native";
|
|
4403
|
+
import { jsx as jsx48, jsxs as jsxs43 } from "react/jsx-runtime";
|
|
4357
4404
|
var ratioOf = (value, max = 100) => Math.min(1, Math.max(0, value / (max || 1)));
|
|
4358
4405
|
function Bar({ label, ratio, words: words2, animated, delay }) {
|
|
4359
4406
|
const { theme } = useTheme();
|
|
4360
4407
|
const t = useEntrance(animated, delay, 900);
|
|
4361
4408
|
const [width, setWidth] = React31.useState(0);
|
|
4362
4409
|
const translateX = t.interpolate({ inputRange: [0, 1], outputRange: [-width * ratio, 0] });
|
|
4363
|
-
return /* @__PURE__ */
|
|
4364
|
-
|
|
4410
|
+
return /* @__PURE__ */ jsx48(
|
|
4411
|
+
View42,
|
|
4365
4412
|
{
|
|
4366
4413
|
accessible: true,
|
|
4367
4414
|
role: "meter",
|
|
@@ -4371,42 +4418,42 @@ function Bar({ label, ratio, words: words2, animated, delay }) {
|
|
|
4371
4418
|
"aria-valuenow": Math.round(ratio * 100),
|
|
4372
4419
|
"aria-valuetext": words2,
|
|
4373
4420
|
onLayout: (e) => setWidth(e.nativeEvent.layout.width),
|
|
4374
|
-
style: [
|
|
4375
|
-
children: /* @__PURE__ */
|
|
4421
|
+
style: [styles35.track, { backgroundColor: theme.surface3 }],
|
|
4422
|
+
children: /* @__PURE__ */ jsx48(Animated17.View, { style: [styles35.fill, { width: `${ratio * 100}%`, backgroundColor: theme.accent, transform: [{ translateX }] }] })
|
|
4376
4423
|
}
|
|
4377
4424
|
);
|
|
4378
4425
|
}
|
|
4379
4426
|
function ProfileCard({ visual, name, statLabel, value = 100, valueText, stats, caption, children, animated = true, style, ...props }) {
|
|
4380
4427
|
const { theme, radius: radius3 } = useTheme();
|
|
4381
4428
|
const ratio = ratioOf(value);
|
|
4382
|
-
return /* @__PURE__ */
|
|
4383
|
-
/* @__PURE__ */
|
|
4384
|
-
/* @__PURE__ */
|
|
4385
|
-
/* @__PURE__ */
|
|
4386
|
-
statLabel ? /* @__PURE__ */
|
|
4429
|
+
return /* @__PURE__ */ jsxs43(View42, { ...props, style: [styles35.root, { backgroundColor: theme.surface1, borderColor: theme.borderSubtle, borderRadius: radius3.xl }, style], children: [
|
|
4430
|
+
/* @__PURE__ */ jsx48(View42, { "aria-hidden": true, style: [styles35.disc, { backgroundColor: theme.surface2, borderColor: theme.accentSoft }], children: visual }),
|
|
4431
|
+
/* @__PURE__ */ jsxs43(View42, { style: styles35.head, children: [
|
|
4432
|
+
/* @__PURE__ */ jsx48(Txt, { variant: "title", style: styles35.name, children: name }),
|
|
4433
|
+
statLabel ? /* @__PURE__ */ jsxs43(Txt, { variant: "caption", tone: "secondary", children: [
|
|
4387
4434
|
statLabel,
|
|
4388
4435
|
" ",
|
|
4389
|
-
/* @__PURE__ */
|
|
4436
|
+
/* @__PURE__ */ jsx48(Txt, { variant: "caption", children: valueText ?? `${Math.round(ratio * 100)} %` })
|
|
4390
4437
|
] }) : null
|
|
4391
4438
|
] }),
|
|
4392
|
-
statLabel ? /* @__PURE__ */
|
|
4439
|
+
statLabel ? /* @__PURE__ */ jsx48(Bar, { label: statLabel, ratio, words: valueText ?? `${Math.round(ratio * 100)} %`, animated, delay: 200 }) : null,
|
|
4393
4440
|
stats?.map((s, i) => {
|
|
4394
4441
|
const r = ratioOf(s.value, s.max);
|
|
4395
4442
|
const words2 = s.valueText ?? `${Math.round(r * 100)} %`;
|
|
4396
|
-
return /* @__PURE__ */
|
|
4397
|
-
/* @__PURE__ */
|
|
4398
|
-
/* @__PURE__ */
|
|
4399
|
-
/* @__PURE__ */
|
|
4443
|
+
return /* @__PURE__ */ jsxs43(View42, { style: styles35.stat, children: [
|
|
4444
|
+
/* @__PURE__ */ jsxs43(View42, { "aria-hidden": true, style: styles35.statHead, children: [
|
|
4445
|
+
/* @__PURE__ */ jsx48(Txt, { variant: "caption", tone: "secondary", children: s.label }),
|
|
4446
|
+
/* @__PURE__ */ jsx48(Txt, { variant: "caption", children: words2 })
|
|
4400
4447
|
] }),
|
|
4401
|
-
/* @__PURE__ */
|
|
4448
|
+
/* @__PURE__ */ jsx48(Bar, { label: s.label, ratio: r, words: words2, animated, delay: 320 + i * 120 })
|
|
4402
4449
|
] }, s.label);
|
|
4403
4450
|
}),
|
|
4404
|
-
caption ? /* @__PURE__ */
|
|
4405
|
-
children ? /* @__PURE__ */
|
|
4451
|
+
caption ? /* @__PURE__ */ jsx48(Txt, { variant: "caption", tone: "secondary", style: styles35.caption, children: caption }) : null,
|
|
4452
|
+
children ? /* @__PURE__ */ jsx48(View42, { style: styles35.extra, children }) : null
|
|
4406
4453
|
] });
|
|
4407
4454
|
}
|
|
4408
|
-
var
|
|
4409
|
-
root: { alignItems: "center", gap: 12, padding: 20, borderWidth:
|
|
4455
|
+
var styles35 = StyleSheet35.create({
|
|
4456
|
+
root: { alignItems: "center", gap: 12, padding: 20, borderWidth: StyleSheet35.hairlineWidth },
|
|
4410
4457
|
disc: { width: 104, height: 104, borderRadius: 52, borderWidth: 1, alignItems: "center", justifyContent: "center", overflow: "hidden" },
|
|
4411
4458
|
head: { flexDirection: "row", alignSelf: "stretch", alignItems: "center", justifyContent: "space-between", gap: 8 },
|
|
4412
4459
|
name: { flexShrink: 1, fontSize: 17 },
|
|
@@ -4420,9 +4467,9 @@ var styles33 = StyleSheet33.create({
|
|
|
4420
4467
|
|
|
4421
4468
|
// src/native/progress.tsx
|
|
4422
4469
|
import * as React32 from "react";
|
|
4423
|
-
import { Animated as Animated18, Easing as Easing11, StyleSheet as
|
|
4470
|
+
import { Animated as Animated18, Easing as Easing11, StyleSheet as StyleSheet36, View as View43 } from "react-native";
|
|
4424
4471
|
import Svg23, { Circle as Circle14, Defs as Defs13, LinearGradient as LinearGradient13, Rect as Rect4, Stop as Stop13 } from "react-native-svg";
|
|
4425
|
-
import { jsx as
|
|
4472
|
+
import { jsx as jsx49, jsxs as jsxs44 } from "react/jsx-runtime";
|
|
4426
4473
|
var AnimatedCircle = Animated18.createAnimatedComponent(Circle14);
|
|
4427
4474
|
var BAR2 = { sm: 4, md: 8, lg: 12 };
|
|
4428
4475
|
var RING2 = { sm: 40, md: 80, lg: 144 };
|
|
@@ -4464,9 +4511,9 @@ function Progress({ variant = "bar", size = "md", value, max = 100, label, value
|
|
|
4464
4511
|
"aria-valuenow": known ? Math.min(max, Math.max(0, value)) : void 0,
|
|
4465
4512
|
"aria-valuetext": known ? valueText ?? `${percent}%` : valueText
|
|
4466
4513
|
};
|
|
4467
|
-
const gradient = /* @__PURE__ */
|
|
4468
|
-
/* @__PURE__ */
|
|
4469
|
-
/* @__PURE__ */
|
|
4514
|
+
const gradient = /* @__PURE__ */ jsx49(Defs13, { children: /* @__PURE__ */ jsxs44(LinearGradient13, { id, x1: "0", y1: "0", x2: "1", y2: variant === "ring" ? "1" : "0", children: [
|
|
4515
|
+
/* @__PURE__ */ jsx49(Stop13, { offset: "0", stopColor: theme.accent }),
|
|
4516
|
+
/* @__PURE__ */ jsx49(Stop13, { offset: "1", stopColor: theme.accent2 })
|
|
4470
4517
|
] }) });
|
|
4471
4518
|
if (variant === "ring") {
|
|
4472
4519
|
const side = RING2[size];
|
|
@@ -4475,11 +4522,11 @@ function Progress({ variant = "bar", size = "md", value, max = 100, label, value
|
|
|
4475
4522
|
const circumference = 2 * Math.PI * r;
|
|
4476
4523
|
const offset = known ? progress.interpolate({ inputRange: [0, 1], outputRange: [circumference, 0] }) : circumference * 0.75;
|
|
4477
4524
|
const rotate = spin.interpolate({ inputRange: [0, 1], outputRange: ["0deg", "360deg"] });
|
|
4478
|
-
return /* @__PURE__ */
|
|
4479
|
-
/* @__PURE__ */
|
|
4525
|
+
return /* @__PURE__ */ jsxs44(View43, { ...a11y, style: [styles36.ring, { width: side, height: side }, style], children: [
|
|
4526
|
+
/* @__PURE__ */ jsx49(Animated18.View, { style: [StyleSheet36.absoluteFill, { transform: [{ rotate: known ? "-90deg" : rotate }] }], children: /* @__PURE__ */ jsxs44(Svg23, { width: side, height: side, viewBox: "0 0 100 100", children: [
|
|
4480
4527
|
gradient,
|
|
4481
|
-
/* @__PURE__ */
|
|
4482
|
-
/* @__PURE__ */
|
|
4528
|
+
/* @__PURE__ */ jsx49(Circle14, { cx: 50, cy: 50, r, fill: "none", stroke: theme.borderDefault, strokeWidth: stroke }),
|
|
4529
|
+
/* @__PURE__ */ jsx49(
|
|
4483
4530
|
AnimatedCircle,
|
|
4484
4531
|
{
|
|
4485
4532
|
cx: 50,
|
|
@@ -4499,20 +4546,20 @@ function Progress({ variant = "bar", size = "md", value, max = 100, label, value
|
|
|
4499
4546
|
}
|
|
4500
4547
|
const width = known ? progress.interpolate({ inputRange: [0, 1], outputRange: ["0%", "100%"] }) : "40%";
|
|
4501
4548
|
const translate = spin.interpolate({ inputRange: [0, 1], outputRange: [-0.4 * track, track] });
|
|
4502
|
-
return /* @__PURE__ */
|
|
4503
|
-
|
|
4549
|
+
return /* @__PURE__ */ jsx49(
|
|
4550
|
+
View43,
|
|
4504
4551
|
{
|
|
4505
4552
|
...a11y,
|
|
4506
4553
|
onLayout: known ? void 0 : (event) => setTrack(event.nativeEvent.layout.width),
|
|
4507
|
-
style: [
|
|
4508
|
-
children: /* @__PURE__ */
|
|
4554
|
+
style: [styles36.bar, { height: BAR2[size], backgroundColor: theme.surface3 }, style],
|
|
4555
|
+
children: /* @__PURE__ */ jsx49(Animated18.View, { style: [styles36.fill, { width }, known || reduce ? null : { transform: [{ translateX: translate }] }], children: /* @__PURE__ */ jsxs44(Svg23, { width: "100%", height: "100%", preserveAspectRatio: "none", children: [
|
|
4509
4556
|
gradient,
|
|
4510
|
-
/* @__PURE__ */
|
|
4557
|
+
/* @__PURE__ */ jsx49(Rect4, { x: 0, y: 0, width: "100%", height: "100%", fill: `url(#${id})` })
|
|
4511
4558
|
] }) })
|
|
4512
4559
|
}
|
|
4513
4560
|
);
|
|
4514
4561
|
}
|
|
4515
|
-
var
|
|
4562
|
+
var styles36 = StyleSheet36.create({
|
|
4516
4563
|
ring: { alignItems: "center", justifyContent: "center" },
|
|
4517
4564
|
bar: { width: "100%", overflow: "hidden", borderRadius: 9999 },
|
|
4518
4565
|
fill: { height: "100%", overflow: "hidden", borderRadius: 9999 }
|
|
@@ -4520,11 +4567,11 @@ var styles34 = StyleSheet34.create({
|
|
|
4520
4567
|
|
|
4521
4568
|
// src/native/pull-to-refresh.tsx
|
|
4522
4569
|
import * as React33 from "react";
|
|
4523
|
-
import { AccessibilityInfo as AccessibilityInfo13, Animated as Animated19, RefreshControl, StyleSheet as
|
|
4524
|
-
import { jsx as
|
|
4570
|
+
import { AccessibilityInfo as AccessibilityInfo13, Animated as Animated19, RefreshControl, StyleSheet as StyleSheet37, View as View44 } from "react-native";
|
|
4571
|
+
import { jsx as jsx50, jsxs as jsxs45 } from "react/jsx-runtime";
|
|
4525
4572
|
function PullToRefresh({ label, ...props }) {
|
|
4526
4573
|
const { theme } = useTheme();
|
|
4527
|
-
return /* @__PURE__ */
|
|
4574
|
+
return /* @__PURE__ */ jsx50(RefreshControl, { ...props, tintColor: theme.accent, colors: [theme.accent], progressBackgroundColor: theme.surface2, title: label, titleColor: theme.textSecondary });
|
|
4528
4575
|
}
|
|
4529
4576
|
var pullProgress = (offset, threshold) => Math.min(1, Math.max(0, -offset / threshold));
|
|
4530
4577
|
function BrandedRefresh({ product, refreshing, onRefresh, label, children, threshold = 72 }) {
|
|
@@ -4541,28 +4588,28 @@ function BrandedRefresh({ product, refreshing, onRefresh, label, children, thres
|
|
|
4541
4588
|
const shown = refreshing ? 1 : pull;
|
|
4542
4589
|
const scale = refreshing || reduce ? 1 : pull.interpolate({ inputRange: [0, 1], outputRange: [0.4, 1] });
|
|
4543
4590
|
const rotate = refreshing || reduce ? "0deg" : pull.interpolate({ inputRange: [0, 1], outputRange: ["-90deg", "0deg"] });
|
|
4544
|
-
return /* @__PURE__ */
|
|
4591
|
+
return /* @__PURE__ */ jsxs45(View44, { style: styles37.root, children: [
|
|
4545
4592
|
children({
|
|
4546
4593
|
// The platform's control does the gesture and the haptics, drawn transparent: the mark is ours.
|
|
4547
|
-
refreshControl: /* @__PURE__ */
|
|
4594
|
+
refreshControl: /* @__PURE__ */ jsx50(RefreshControl, { refreshing, onRefresh, tintColor: "transparent", colors: ["transparent"], progressBackgroundColor: "transparent" }),
|
|
4548
4595
|
onScroll,
|
|
4549
4596
|
scrollEventThrottle: 16
|
|
4550
4597
|
}),
|
|
4551
|
-
/* @__PURE__ */
|
|
4598
|
+
/* @__PURE__ */ jsx50(Animated19.View, { pointerEvents: "none", "aria-hidden": true, style: [styles37.mark, { opacity: shown, transform: [{ scale }, { rotate }] }], children: /* @__PURE__ */ jsx50(ProductMark, { id: product, size: 32, animated: refreshing, neutral: theme.textMuted }) })
|
|
4552
4599
|
] });
|
|
4553
4600
|
}
|
|
4554
|
-
var
|
|
4601
|
+
var styles37 = StyleSheet37.create({
|
|
4555
4602
|
root: { flex: 1 },
|
|
4556
4603
|
mark: { position: "absolute", top: 12, left: 0, right: 0, alignItems: "center" }
|
|
4557
4604
|
});
|
|
4558
4605
|
|
|
4559
4606
|
// src/native/radio-group.tsx
|
|
4560
4607
|
import * as React34 from "react";
|
|
4561
|
-
import { Animated as Animated20, Pressable as Pressable18, StyleSheet as
|
|
4608
|
+
import { Animated as Animated20, Pressable as Pressable18, StyleSheet as StyleSheet38, Text as Text15, View as View45 } from "react-native";
|
|
4562
4609
|
import Svg24, { Path as Path20 } from "react-native-svg";
|
|
4563
|
-
import { jsx as
|
|
4610
|
+
import { jsx as jsx51, jsxs as jsxs46 } from "react/jsx-runtime";
|
|
4564
4611
|
function Check({ color }) {
|
|
4565
|
-
return /* @__PURE__ */
|
|
4612
|
+
return /* @__PURE__ */ jsx51(Svg24, { 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__ */ jsx51(Path20, { d: "M20 6 9 17l-5-5" }) });
|
|
4566
4613
|
}
|
|
4567
4614
|
function Key({ option, checked, disabled, onPress }) {
|
|
4568
4615
|
const { theme, radius: radius3, motion: motion3 } = useTheme();
|
|
@@ -4572,7 +4619,7 @@ function Key({ option, checked, disabled, onPress }) {
|
|
|
4572
4619
|
React34.useEffect(() => {
|
|
4573
4620
|
Animated20.timing(sink, { toValue: down ? 1 : 0, duration: motion3.duration.fast, useNativeDriver: true }).start();
|
|
4574
4621
|
}, [down, sink, motion3.duration.fast]);
|
|
4575
|
-
return /* @__PURE__ */
|
|
4622
|
+
return /* @__PURE__ */ jsxs46(
|
|
4576
4623
|
Pressable18,
|
|
4577
4624
|
{
|
|
4578
4625
|
role: "radio",
|
|
@@ -4583,14 +4630,14 @@ function Key({ option, checked, disabled, onPress }) {
|
|
|
4583
4630
|
onPress,
|
|
4584
4631
|
onPressIn: () => setHeld(true),
|
|
4585
4632
|
onPressOut: () => setHeld(false),
|
|
4586
|
-
style: [
|
|
4633
|
+
style: [styles38.keySlot, disabled ? styles38.disabled : null],
|
|
4587
4634
|
children: [
|
|
4588
|
-
/* @__PURE__ */
|
|
4589
|
-
/* @__PURE__ */
|
|
4635
|
+
/* @__PURE__ */ jsx51(View45, { style: [styles38.ledge, { borderRadius: radius3.lg, backgroundColor: checked ? theme.accentHover : theme.borderStrong }] }),
|
|
4636
|
+
/* @__PURE__ */ jsxs46(
|
|
4590
4637
|
Animated20.View,
|
|
4591
4638
|
{
|
|
4592
4639
|
style: [
|
|
4593
|
-
|
|
4640
|
+
styles38.key,
|
|
4594
4641
|
{
|
|
4595
4642
|
borderRadius: radius3.lg,
|
|
4596
4643
|
backgroundColor: checked ? theme.accent : theme.surface2,
|
|
@@ -4599,8 +4646,8 @@ function Key({ option, checked, disabled, onPress }) {
|
|
|
4599
4646
|
}
|
|
4600
4647
|
],
|
|
4601
4648
|
children: [
|
|
4602
|
-
/* @__PURE__ */
|
|
4603
|
-
option.hint ? /* @__PURE__ */
|
|
4649
|
+
/* @__PURE__ */ jsx51(Text15, { style: [styles38.keyLabel, { color: checked ? theme.onAccent : theme.textPrimary }], children: option.label }),
|
|
4650
|
+
option.hint ? /* @__PURE__ */ jsx51(Text15, { style: [styles38.keyHint, { color: checked ? theme.onAccent : theme.textSecondary }], children: option.hint }) : null
|
|
4604
4651
|
]
|
|
4605
4652
|
}
|
|
4606
4653
|
)
|
|
@@ -4621,9 +4668,9 @@ function RadioGroup({ label, options, value: valueProp, defaultValue = null, onV
|
|
|
4621
4668
|
const checked = o.value === value;
|
|
4622
4669
|
const off = Boolean(disabled || o.disabled);
|
|
4623
4670
|
const name = o.description ? `${o.label}, ${o.description}` : o.label;
|
|
4624
|
-
if (variant === "buttons") return /* @__PURE__ */
|
|
4671
|
+
if (variant === "buttons") return /* @__PURE__ */ jsx51(Key, { option: o, checked, disabled: off, onPress: () => pick(o.value) }, o.value);
|
|
4625
4672
|
if (variant === "segmented")
|
|
4626
|
-
return /* @__PURE__ */
|
|
4673
|
+
return /* @__PURE__ */ jsx51(
|
|
4627
4674
|
Pressable18,
|
|
4628
4675
|
{
|
|
4629
4676
|
role: "radio",
|
|
@@ -4632,13 +4679,13 @@ function RadioGroup({ label, options, value: valueProp, defaultValue = null, onV
|
|
|
4632
4679
|
"aria-disabled": off || void 0,
|
|
4633
4680
|
disabled: off,
|
|
4634
4681
|
onPress: () => pick(o.value),
|
|
4635
|
-
style: [
|
|
4636
|
-
children: /* @__PURE__ */
|
|
4682
|
+
style: [styles38.segment, { borderRadius: radius3.md }, checked ? { backgroundColor: theme.surface0, borderColor: theme.borderDefault } : null, off ? styles38.disabled : null],
|
|
4683
|
+
children: /* @__PURE__ */ jsx51(Text15, { numberOfLines: 1, style: [styles38.segmentLabel, { color: checked ? theme.textPrimary : theme.textSecondary }], children: o.label })
|
|
4637
4684
|
},
|
|
4638
4685
|
o.value
|
|
4639
4686
|
);
|
|
4640
4687
|
if (variant === "cards")
|
|
4641
|
-
return /* @__PURE__ */
|
|
4688
|
+
return /* @__PURE__ */ jsxs46(
|
|
4642
4689
|
Pressable18,
|
|
4643
4690
|
{
|
|
4644
4691
|
role: "radio",
|
|
@@ -4648,40 +4695,40 @@ function RadioGroup({ label, options, value: valueProp, defaultValue = null, onV
|
|
|
4648
4695
|
disabled: off,
|
|
4649
4696
|
onPress: () => pick(o.value),
|
|
4650
4697
|
style: ({ pressed }) => [
|
|
4651
|
-
|
|
4698
|
+
styles38.card,
|
|
4652
4699
|
{ borderRadius: radius3.xl, backgroundColor: checked ? theme.accentSoft : theme.surface1, borderColor: checked ? theme.accent : theme.borderDefault, transform: [{ scale: pressed ? 0.98 : 1 }] },
|
|
4653
|
-
off ?
|
|
4700
|
+
off ? styles38.disabled : null
|
|
4654
4701
|
],
|
|
4655
4702
|
children: [
|
|
4656
|
-
/* @__PURE__ */
|
|
4657
|
-
/* @__PURE__ */
|
|
4658
|
-
o.description ? /* @__PURE__ */
|
|
4703
|
+
/* @__PURE__ */ jsx51(View45, { style: [styles38.cardCheck, { borderColor: checked ? theme.accent : theme.borderStrong, backgroundColor: checked ? theme.accent : theme.surface1 }], children: checked ? /* @__PURE__ */ jsx51(Check, { color: theme.onAccent }) : null }),
|
|
4704
|
+
/* @__PURE__ */ jsx51(Text15, { style: [styles38.cardLabel, { color: theme.textPrimary }], children: o.label }),
|
|
4705
|
+
o.description ? /* @__PURE__ */ jsx51(Text15, { style: [styles38.cardDescription, { color: theme.textSecondary }], children: o.description }) : null
|
|
4659
4706
|
]
|
|
4660
4707
|
},
|
|
4661
4708
|
o.value
|
|
4662
4709
|
);
|
|
4663
|
-
return /* @__PURE__ */
|
|
4664
|
-
/* @__PURE__ */
|
|
4665
|
-
/* @__PURE__ */
|
|
4666
|
-
/* @__PURE__ */
|
|
4667
|
-
o.description ? /* @__PURE__ */
|
|
4710
|
+
return /* @__PURE__ */ jsxs46(Pressable18, { role: "radio", "aria-checked": checked, "aria-label": name, "aria-disabled": off || void 0, disabled: off, onPress: () => pick(o.value), style: [styles38.row, off ? styles38.disabled : null], children: [
|
|
4711
|
+
/* @__PURE__ */ jsx51(View45, { style: [styles38.dot, { borderColor: checked ? theme.accent : theme.borderStrong, backgroundColor: checked ? theme.accent : theme.surface1 }], children: checked ? /* @__PURE__ */ jsx51(View45, { style: [styles38.dotIn, { backgroundColor: theme.onAccent }] }) : null }),
|
|
4712
|
+
/* @__PURE__ */ jsxs46(View45, { style: styles38.rowText, children: [
|
|
4713
|
+
/* @__PURE__ */ jsx51(Text15, { style: [styles38.rowLabel, { color: theme.textPrimary }], children: o.label }),
|
|
4714
|
+
o.description ? /* @__PURE__ */ jsx51(Text15, { style: [styles38.cardDescription, { color: theme.textSecondary }], children: o.description }) : null
|
|
4668
4715
|
] })
|
|
4669
4716
|
] }, o.value);
|
|
4670
4717
|
});
|
|
4671
|
-
return /* @__PURE__ */
|
|
4672
|
-
/* @__PURE__ */
|
|
4673
|
-
|
|
4718
|
+
return /* @__PURE__ */ jsxs46(View45, { style: [styles38.root, style], children: [
|
|
4719
|
+
/* @__PURE__ */ jsx51(
|
|
4720
|
+
View45,
|
|
4674
4721
|
{
|
|
4675
4722
|
role: "radiogroup",
|
|
4676
4723
|
"aria-label": label,
|
|
4677
|
-
style: variant === "segmented" ? [
|
|
4724
|
+
style: variant === "segmented" ? [styles38.track, { borderRadius: radius3.lg, backgroundColor: theme.surface2, borderColor: error ? theme.danger : theme.borderDefault }] : variant === "buttons" ? styles38.keys : variant === "cards" ? styles38.cards : styles38.list,
|
|
4678
4725
|
children: body
|
|
4679
4726
|
}
|
|
4680
4727
|
),
|
|
4681
|
-
error ? /* @__PURE__ */
|
|
4728
|
+
error ? /* @__PURE__ */ jsx51(Text15, { role: "alert", "aria-live": "polite", style: [styles38.error, { color: theme.dangerText }], children: error }) : null
|
|
4682
4729
|
] });
|
|
4683
4730
|
}
|
|
4684
|
-
var
|
|
4731
|
+
var styles38 = StyleSheet38.create({
|
|
4685
4732
|
root: { gap: 6, alignSelf: "stretch" },
|
|
4686
4733
|
list: { gap: 2 },
|
|
4687
4734
|
row: { flexDirection: "row", alignItems: "center", gap: 12, minHeight: 44 },
|
|
@@ -4700,34 +4747,34 @@ var styles36 = StyleSheet36.create({
|
|
|
4700
4747
|
key: { minHeight: 48, paddingHorizontal: 16, paddingVertical: 8, alignItems: "center", justifyContent: "center", gap: 1, borderWidth: 1 },
|
|
4701
4748
|
keyLabel: { fontSize: 15, fontWeight: "700" },
|
|
4702
4749
|
keyHint: { fontSize: 11, fontWeight: "500" },
|
|
4703
|
-
track: { flexDirection: "row", padding: 3, gap: 3, borderWidth:
|
|
4704
|
-
segment: { flex: 1, alignItems: "center", justifyContent: "center", paddingHorizontal: 8, borderWidth:
|
|
4750
|
+
track: { flexDirection: "row", padding: 3, gap: 3, borderWidth: StyleSheet38.hairlineWidth, height: 42 },
|
|
4751
|
+
segment: { flex: 1, alignItems: "center", justifyContent: "center", paddingHorizontal: 8, borderWidth: StyleSheet38.hairlineWidth, borderColor: "transparent" },
|
|
4705
4752
|
segmentLabel: { fontSize: 13, fontWeight: "600" },
|
|
4706
4753
|
error: { fontSize: 12, lineHeight: 16 },
|
|
4707
4754
|
disabled: { opacity: 0.4 }
|
|
4708
4755
|
});
|
|
4709
4756
|
|
|
4710
4757
|
// src/native/screen.tsx
|
|
4711
|
-
import { KeyboardAvoidingView, Platform as Platform3, ScrollView as ScrollView6, StyleSheet as
|
|
4712
|
-
import { Fragment as Fragment7, jsx as
|
|
4758
|
+
import { KeyboardAvoidingView, Platform as Platform3, ScrollView as ScrollView6, StyleSheet as StyleSheet39, View as View46 } from "react-native";
|
|
4759
|
+
import { Fragment as Fragment7, jsx as jsx52, jsxs as jsxs47 } from "react/jsx-runtime";
|
|
4713
4760
|
function Screen({ header, footer, children, scroll = true, keyboard = true, padding = 16, surface = "surface0", contentStyle }) {
|
|
4714
4761
|
const { theme, insets } = useTheme();
|
|
4715
|
-
const body = scroll ? /* @__PURE__ */
|
|
4716
|
-
const inner = /* @__PURE__ */
|
|
4762
|
+
const body = scroll ? /* @__PURE__ */ jsx52(ScrollView6, { style: styles39.flex, contentContainerStyle: [{ padding, paddingTop: header ? padding : padding + insets.top, gap: 16 }, contentStyle], keyboardShouldPersistTaps: "handled", tabIndex: 0, children }) : /* @__PURE__ */ jsx52(View46, { style: [styles39.flex, { paddingTop: header ? 0 : insets.top }, contentStyle], children });
|
|
4763
|
+
const inner = /* @__PURE__ */ jsxs47(Fragment7, { children: [
|
|
4717
4764
|
header,
|
|
4718
4765
|
body,
|
|
4719
4766
|
footer
|
|
4720
4767
|
] });
|
|
4721
|
-
return /* @__PURE__ */
|
|
4768
|
+
return /* @__PURE__ */ jsx52(View46, { style: [styles39.flex, { backgroundColor: theme[surface] }], children: keyboard ? /* @__PURE__ */ jsx52(KeyboardAvoidingView, { style: styles39.flex, behavior: Platform3.OS === "ios" ? "padding" : void 0, children: inner }) : inner });
|
|
4722
4769
|
}
|
|
4723
|
-
var
|
|
4770
|
+
var styles39 = StyleSheet39.create({ flex: { flex: 1 } });
|
|
4724
4771
|
|
|
4725
4772
|
// src/native/search-field.tsx
|
|
4726
4773
|
import { useDebouncedCallback } from "@krizaka/pacer/react";
|
|
4727
4774
|
import * as React35 from "react";
|
|
4728
|
-
import { Pressable as Pressable19, StyleSheet as
|
|
4775
|
+
import { Pressable as Pressable19, StyleSheet as StyleSheet40, TextInput as TextInput6, View as View47 } from "react-native";
|
|
4729
4776
|
import Svg25, { Circle as Circle15, Path as Path21 } from "react-native-svg";
|
|
4730
|
-
import { jsx as
|
|
4777
|
+
import { jsx as jsx53, jsxs as jsxs48 } from "react/jsx-runtime";
|
|
4731
4778
|
function SearchField({ label, value, defaultValue = "", onValueChange, onSearch, debounce = 300, onSubmit, clearLabel, cancelLabel, onCancel, style, placeholder, onFocus, onBlur, ...props }) {
|
|
4732
4779
|
const [focused, setFocused] = React35.useState(false);
|
|
4733
4780
|
const input = React35.useRef(null);
|
|
@@ -4741,12 +4788,12 @@ function SearchField({ label, value, defaultValue = "", onValueChange, onSearch,
|
|
|
4741
4788
|
search.cancel();
|
|
4742
4789
|
if (onSearch) search(next);
|
|
4743
4790
|
};
|
|
4744
|
-
const field = /* @__PURE__ */
|
|
4745
|
-
/* @__PURE__ */
|
|
4746
|
-
/* @__PURE__ */
|
|
4747
|
-
/* @__PURE__ */
|
|
4791
|
+
const field = /* @__PURE__ */ jsxs48(View47, { style: [styles40.frame, { borderRadius: radius3.md, borderColor: theme.borderDefault, backgroundColor: theme.surface2 }, style], children: [
|
|
4792
|
+
/* @__PURE__ */ jsxs48(Svg25, { width: 18, height: 18, viewBox: "0 0 24 24", fill: "none", stroke: theme.textSecondary, strokeWidth: 2, strokeLinecap: "round", "aria-hidden": true, children: [
|
|
4793
|
+
/* @__PURE__ */ jsx53(Circle15, { cx: 11, cy: 11, r: 7 }),
|
|
4794
|
+
/* @__PURE__ */ jsx53(Path21, { d: "m20 20-3.5-3.5" })
|
|
4748
4795
|
] }),
|
|
4749
|
-
/* @__PURE__ */
|
|
4796
|
+
/* @__PURE__ */ jsx53(
|
|
4750
4797
|
TextInput6,
|
|
4751
4798
|
{
|
|
4752
4799
|
ref: input,
|
|
@@ -4765,7 +4812,7 @@ function SearchField({ label, value, defaultValue = "", onValueChange, onSearch,
|
|
|
4765
4812
|
onSearch?.(query);
|
|
4766
4813
|
onSubmit?.(query);
|
|
4767
4814
|
},
|
|
4768
|
-
style: [
|
|
4815
|
+
style: [styles40.input, { color: theme.textPrimary }],
|
|
4769
4816
|
onFocus: (e) => {
|
|
4770
4817
|
setFocused(true);
|
|
4771
4818
|
onFocus?.(e);
|
|
@@ -4777,12 +4824,12 @@ function SearchField({ label, value, defaultValue = "", onValueChange, onSearch,
|
|
|
4777
4824
|
...props
|
|
4778
4825
|
}
|
|
4779
4826
|
),
|
|
4780
|
-
query ? /* @__PURE__ */
|
|
4827
|
+
query ? /* @__PURE__ */ jsx53(Pressable19, { role: "button", "aria-label": clearLabel, hitSlop: 10, onPress: () => change(""), style: styles40.clear, children: /* @__PURE__ */ jsx53(Svg25, { width: 16, height: 16, viewBox: "0 0 24 24", fill: "none", stroke: theme.textSecondary, strokeWidth: 2.4, strokeLinecap: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx53(Path21, { d: "M18 6 6 18M6 6l12 12" }) }) }) : null
|
|
4781
4828
|
] });
|
|
4782
4829
|
if (!cancelLabel || !onCancel) return field;
|
|
4783
|
-
return /* @__PURE__ */
|
|
4784
|
-
/* @__PURE__ */
|
|
4785
|
-
focused || query ? /* @__PURE__ */
|
|
4830
|
+
return /* @__PURE__ */ jsxs48(View47, { style: styles40.bar, children: [
|
|
4831
|
+
/* @__PURE__ */ jsx53(View47, { style: styles40.grow, children: field }),
|
|
4832
|
+
focused || query ? /* @__PURE__ */ jsx53(
|
|
4786
4833
|
Pressable19,
|
|
4787
4834
|
{
|
|
4788
4835
|
role: "button",
|
|
@@ -4792,14 +4839,14 @@ function SearchField({ label, value, defaultValue = "", onValueChange, onSearch,
|
|
|
4792
4839
|
onCancel();
|
|
4793
4840
|
},
|
|
4794
4841
|
hitSlop: 8,
|
|
4795
|
-
style:
|
|
4796
|
-
children: /* @__PURE__ */
|
|
4842
|
+
style: styles40.cancel,
|
|
4843
|
+
children: /* @__PURE__ */ jsx53(Txt, { variant: "label", tone: "accent", children: cancelLabel })
|
|
4797
4844
|
}
|
|
4798
4845
|
) : null
|
|
4799
4846
|
] });
|
|
4800
4847
|
}
|
|
4801
|
-
var
|
|
4802
|
-
frame: { flexDirection: "row", alignItems: "center", gap: 8, height: 44, paddingLeft: 12, paddingRight: 6, borderWidth:
|
|
4848
|
+
var styles40 = StyleSheet40.create({
|
|
4849
|
+
frame: { flexDirection: "row", alignItems: "center", gap: 8, height: 44, paddingLeft: 12, paddingRight: 6, borderWidth: StyleSheet40.hairlineWidth },
|
|
4803
4850
|
input: { flex: 1, height: "100%", fontSize: 15, paddingVertical: 0 },
|
|
4804
4851
|
bar: { flexDirection: "row", alignItems: "center", gap: 10 },
|
|
4805
4852
|
grow: { flex: 1 },
|
|
@@ -4808,19 +4855,19 @@ var styles38 = StyleSheet38.create({
|
|
|
4808
4855
|
});
|
|
4809
4856
|
|
|
4810
4857
|
// src/native/segmented.tsx
|
|
4811
|
-
import { Pressable as Pressable20, StyleSheet as
|
|
4812
|
-
import { jsx as
|
|
4858
|
+
import { Pressable as Pressable20, StyleSheet as StyleSheet41, Text as Text16, View as View48 } from "react-native";
|
|
4859
|
+
import { jsx as jsx54 } from "react/jsx-runtime";
|
|
4813
4860
|
function Segmented({ options, value, onValueChange, size = "md", "aria-label": label, style }) {
|
|
4814
4861
|
const { theme, radius: radius3 } = useTheme();
|
|
4815
|
-
return /* @__PURE__ */
|
|
4816
|
-
|
|
4862
|
+
return /* @__PURE__ */ jsx54(
|
|
4863
|
+
View48,
|
|
4817
4864
|
{
|
|
4818
4865
|
role: "tablist",
|
|
4819
4866
|
"aria-label": label,
|
|
4820
|
-
style: [
|
|
4867
|
+
style: [styles41.track, { backgroundColor: theme.surface2, borderColor: theme.borderSubtle, borderRadius: radius3.md, height: size === "sm" ? 32 : 40 }, style],
|
|
4821
4868
|
children: options.map((option) => {
|
|
4822
4869
|
const selected = option.value === value;
|
|
4823
|
-
return /* @__PURE__ */
|
|
4870
|
+
return /* @__PURE__ */ jsx54(
|
|
4824
4871
|
Pressable20,
|
|
4825
4872
|
{
|
|
4826
4873
|
role: "tab",
|
|
@@ -4831,12 +4878,12 @@ function Segmented({ options, value, onValueChange, size = "md", "aria-label": l
|
|
|
4831
4878
|
if (!selected) onValueChange(option.value);
|
|
4832
4879
|
},
|
|
4833
4880
|
style: [
|
|
4834
|
-
|
|
4881
|
+
styles41.segment,
|
|
4835
4882
|
{ borderRadius: radius3.sm },
|
|
4836
4883
|
selected ? { backgroundColor: theme.surface0, borderColor: theme.borderDefault } : null,
|
|
4837
|
-
option.disabled ?
|
|
4884
|
+
option.disabled ? styles41.disabled : null
|
|
4838
4885
|
],
|
|
4839
|
-
children: /* @__PURE__ */
|
|
4886
|
+
children: /* @__PURE__ */ jsx54(Text16, { numberOfLines: 1, style: [styles41.label, { color: selected ? theme.textPrimary : theme.textSecondary, fontSize: size === "sm" ? 12 : 13 }], children: option.label })
|
|
4840
4887
|
},
|
|
4841
4888
|
option.value
|
|
4842
4889
|
);
|
|
@@ -4844,18 +4891,18 @@ function Segmented({ options, value, onValueChange, size = "md", "aria-label": l
|
|
|
4844
4891
|
}
|
|
4845
4892
|
);
|
|
4846
4893
|
}
|
|
4847
|
-
var
|
|
4848
|
-
track: { flexDirection: "row", padding: 3, gap: 3, borderWidth:
|
|
4849
|
-
segment: { flex: 1, alignItems: "center", justifyContent: "center", paddingHorizontal: 8, borderWidth:
|
|
4894
|
+
var styles41 = StyleSheet41.create({
|
|
4895
|
+
track: { flexDirection: "row", padding: 3, gap: 3, borderWidth: StyleSheet41.hairlineWidth },
|
|
4896
|
+
segment: { flex: 1, alignItems: "center", justifyContent: "center", paddingHorizontal: 8, borderWidth: StyleSheet41.hairlineWidth, borderColor: "transparent" },
|
|
4850
4897
|
label: { fontWeight: "600" },
|
|
4851
4898
|
disabled: { opacity: 0.4 }
|
|
4852
4899
|
});
|
|
4853
4900
|
|
|
4854
4901
|
// src/native/showcase.tsx
|
|
4855
4902
|
import * as React36 from "react";
|
|
4856
|
-
import { Animated as Animated21, AppState, Easing as Easing12, FlatList, Pressable as Pressable21, StyleSheet as
|
|
4903
|
+
import { Animated as Animated21, AppState, Easing as Easing12, FlatList, Pressable as Pressable21, StyleSheet as StyleSheet42, View as View49 } from "react-native";
|
|
4857
4904
|
import Svg26, { Path as Path22 } from "react-native-svg";
|
|
4858
|
-
import { jsx as
|
|
4905
|
+
import { jsx as jsx55, jsxs as jsxs49 } from "react/jsx-runtime";
|
|
4859
4906
|
var showcaseLabels = {
|
|
4860
4907
|
previous: "Previous slide",
|
|
4861
4908
|
next: "Next slide",
|
|
@@ -4913,10 +4960,10 @@ function Showcase({ label, items: items2, getId, renderItem, getTitle, interval
|
|
|
4913
4960
|
}, [running, current, interval]);
|
|
4914
4961
|
const item = items2[current];
|
|
4915
4962
|
const title = item !== void 0 ? getTitle?.(item) : void 0;
|
|
4916
|
-
const control = [
|
|
4917
|
-
const icon = (d) => /* @__PURE__ */
|
|
4918
|
-
return /* @__PURE__ */
|
|
4919
|
-
/* @__PURE__ */
|
|
4963
|
+
const control = [styles42.control, { borderColor: theme.borderDefault, backgroundColor: theme.surface1 }];
|
|
4964
|
+
const icon = (d) => /* @__PURE__ */ jsx55(Svg26, { width: 16, height: 16, viewBox: "0 0 24 24", "aria-hidden": true, children: /* @__PURE__ */ jsx55(Path22, { d, stroke: theme.textSecondary, strokeWidth: 2.2, fill: "none", strokeLinecap: "round", strokeLinejoin: "round" }) });
|
|
4965
|
+
return /* @__PURE__ */ jsxs49(View49, { role: "group", "aria-label": label, style: [styles42.root, style], children: [
|
|
4966
|
+
/* @__PURE__ */ jsx55(View49, { "aria-live": announce ? "polite" : "off", onLayout: (e) => setWidth(e.nativeEvent.layout.width), children: /* @__PURE__ */ jsx55(
|
|
4920
4967
|
FlatList,
|
|
4921
4968
|
{
|
|
4922
4969
|
ref: list,
|
|
@@ -4937,25 +4984,25 @@ function Showcase({ label, items: items2, getId, renderItem, getTitle, interval
|
|
|
4937
4984
|
onIndexChange?.(next, true);
|
|
4938
4985
|
}
|
|
4939
4986
|
},
|
|
4940
|
-
renderItem: ({ item: slide, index }) => /* @__PURE__ */
|
|
4987
|
+
renderItem: ({ item: slide, index }) => /* @__PURE__ */ jsx55(View49, { role: "group", "aria-label": labels.slide(index + 1, total), style: { width }, children: Math.abs(index - current) <= 1 ? renderItem(slide, { index, active: index === current }) : null })
|
|
4941
4988
|
}
|
|
4942
4989
|
) }),
|
|
4943
|
-
/* @__PURE__ */
|
|
4944
|
-
i < current || i === current && !playing ? /* @__PURE__ */
|
|
4945
|
-
i === current && playing ? /* @__PURE__ */
|
|
4990
|
+
/* @__PURE__ */ jsx55(View49, { style: styles42.segments, children: items2.map((slide, i) => /* @__PURE__ */ jsx55(Pressable21, { role: "button", "aria-label": labels.goTo(i + 1, total), "aria-current": i === current ? true : void 0, onPress: () => go(i, true), style: styles42.segment, children: /* @__PURE__ */ jsxs49(View49, { style: [styles42.track, { backgroundColor: theme.surface3 }], children: [
|
|
4991
|
+
i < current || i === current && !playing ? /* @__PURE__ */ jsx55(View49, { style: [StyleSheet42.absoluteFill, { backgroundColor: theme.accent }] }) : null,
|
|
4992
|
+
i === current && playing ? /* @__PURE__ */ jsx55(Animated21.View, { style: [styles42.fill, { backgroundColor: theme.accent, width: fill.interpolate({ inputRange: [0, 1], outputRange: ["0%", "100%"] }) }] }) : null
|
|
4946
4993
|
] }) }, getId(slide))) }),
|
|
4947
|
-
/* @__PURE__ */
|
|
4948
|
-
/* @__PURE__ */
|
|
4994
|
+
/* @__PURE__ */ jsxs49(View49, { style: styles42.bar, children: [
|
|
4995
|
+
/* @__PURE__ */ jsxs49(Txt, { variant: "caption", tone: "secondary", numberOfLines: 1, style: styles42.counter, children: [
|
|
4949
4996
|
title ? `${title} \xB7 ` : "",
|
|
4950
4997
|
labels.counter(current + 1, total)
|
|
4951
4998
|
] }),
|
|
4952
|
-
/* @__PURE__ */
|
|
4953
|
-
playing ? /* @__PURE__ */
|
|
4954
|
-
/* @__PURE__ */
|
|
4999
|
+
/* @__PURE__ */ jsx55(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") }),
|
|
5000
|
+
playing ? /* @__PURE__ */ jsx55(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,
|
|
5001
|
+
/* @__PURE__ */ jsx55(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") })
|
|
4955
5002
|
] })
|
|
4956
5003
|
] });
|
|
4957
5004
|
}
|
|
4958
|
-
var
|
|
5005
|
+
var styles42 = StyleSheet42.create({
|
|
4959
5006
|
root: { gap: 8 },
|
|
4960
5007
|
segments: { flexDirection: "row", gap: 4 },
|
|
4961
5008
|
segment: { flex: 1, height: 24, justifyContent: "center" },
|
|
@@ -4969,7 +5016,7 @@ var styles40 = StyleSheet40.create({
|
|
|
4969
5016
|
// src/native/skeleton.tsx
|
|
4970
5017
|
import * as React37 from "react";
|
|
4971
5018
|
import { Animated as Animated22 } from "react-native";
|
|
4972
|
-
import { jsx as
|
|
5019
|
+
import { jsx as jsx56 } from "react/jsx-runtime";
|
|
4973
5020
|
var SHAPE = {
|
|
4974
5021
|
text: { width: "100%", height: 12, radius: 4 },
|
|
4975
5022
|
circle: { width: 40, height: 40, radius: 9999 },
|
|
@@ -4995,7 +5042,7 @@ function Skeleton({ shape = "text", width, height, style, testID }) {
|
|
|
4995
5042
|
}, [reduce, opacity]);
|
|
4996
5043
|
const s = SHAPE[shape];
|
|
4997
5044
|
const side = shape === "circle" ? width ?? height ?? s.width : void 0;
|
|
4998
|
-
return /* @__PURE__ */
|
|
5045
|
+
return /* @__PURE__ */ jsx56(
|
|
4999
5046
|
Animated22.View,
|
|
5000
5047
|
{
|
|
5001
5048
|
testID,
|
|
@@ -5010,9 +5057,9 @@ function Skeleton({ shape = "text", width, height, style, testID }) {
|
|
|
5010
5057
|
|
|
5011
5058
|
// src/native/slider.tsx
|
|
5012
5059
|
import * as React38 from "react";
|
|
5013
|
-
import { PanResponder as PanResponder2, StyleSheet as
|
|
5060
|
+
import { PanResponder as PanResponder2, StyleSheet as StyleSheet43, Text as Text17, View as View50 } from "react-native";
|
|
5014
5061
|
import Svg27, { Defs as Defs14, LinearGradient as LinearGradient14, Rect as Rect5, Stop as Stop14 } from "react-native-svg";
|
|
5015
|
-
import { jsx as
|
|
5062
|
+
import { jsx as jsx57, jsxs as jsxs50 } from "react/jsx-runtime";
|
|
5016
5063
|
var THUMB = 26;
|
|
5017
5064
|
var toArray = (v) => v === void 0 ? void 0 : typeof v === "number" ? [v] : [...v];
|
|
5018
5065
|
function Slider({
|
|
@@ -5104,24 +5151,24 @@ function Slider({
|
|
|
5104
5151
|
const along = (p) => vertical ? { bottom: p * length } : { left: p * length };
|
|
5105
5152
|
const onLayout = (e) => setLength(vertical ? e.nativeEvent.layout.height : e.nativeEvent.layout.width);
|
|
5106
5153
|
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 };
|
|
5107
|
-
return /* @__PURE__ */
|
|
5108
|
-
showLabel ? /* @__PURE__ */
|
|
5109
|
-
/* @__PURE__ */
|
|
5110
|
-
/* @__PURE__ */
|
|
5154
|
+
return /* @__PURE__ */ jsxs50(View50, { style: [styles43.root, vertical ? styles43.rootVertical : null, disabled ? styles43.disabled : null, style], children: [
|
|
5155
|
+
showLabel ? /* @__PURE__ */ jsxs50(View50, { style: styles43.header, children: [
|
|
5156
|
+
/* @__PURE__ */ jsx57(Text17, { style: [styles43.label, { color: theme.textSecondary }], children: label }),
|
|
5157
|
+
/* @__PURE__ */ jsx57(Text17, { "aria-hidden": true, style: [styles43.value, { color: theme.textSecondary }], children: current.map(formatValue).join(" \u2013 ") })
|
|
5111
5158
|
] }) : null,
|
|
5112
|
-
/* @__PURE__ */
|
|
5113
|
-
/* @__PURE__ */
|
|
5114
|
-
/* @__PURE__ */
|
|
5115
|
-
/* @__PURE__ */
|
|
5116
|
-
/* @__PURE__ */
|
|
5117
|
-
/* @__PURE__ */
|
|
5159
|
+
/* @__PURE__ */ jsxs50(View50, { ...responder.panHandlers, style: vertical ? styles43.controlVertical : styles43.control, children: [
|
|
5160
|
+
/* @__PURE__ */ jsxs50(View50, { onLayout, pointerEvents: "none", style: [vertical ? styles43.trackVertical : styles43.track, { borderRadius: radius3.full, backgroundColor: theme.surface3 }], children: [
|
|
5161
|
+
/* @__PURE__ */ jsx57(View50, { style: [styles43.fill, fill, { borderRadius: radius3.full, overflow: "hidden", backgroundColor: theme.accent }], children: tone3 === "gradient" ? /* @__PURE__ */ jsxs50(Svg27, { width: "100%", height: "100%", "aria-hidden": true, children: [
|
|
5162
|
+
/* @__PURE__ */ jsx57(Defs14, { children: /* @__PURE__ */ jsxs50(LinearGradient14, { id: gradientId, x1: "0", y1: vertical ? "1" : "0", x2: vertical ? "0" : "1", y2: "0", children: [
|
|
5163
|
+
/* @__PURE__ */ jsx57(Stop14, { offset: "0", stopColor: theme.accent }),
|
|
5164
|
+
/* @__PURE__ */ jsx57(Stop14, { offset: "1", stopColor: theme.accent2 })
|
|
5118
5165
|
] }) }),
|
|
5119
|
-
/* @__PURE__ */
|
|
5166
|
+
/* @__PURE__ */ jsx57(Rect5, { width: "100%", height: "100%", fill: `url(#${gradientId})` })
|
|
5120
5167
|
] }) : null }),
|
|
5121
|
-
tickValues.map((t) => /* @__PURE__ */
|
|
5168
|
+
tickValues.map((t) => /* @__PURE__ */ jsx57(View50, { style: [vertical ? styles43.tickVertical : styles43.tick, along(pct(t)), { backgroundColor: t > lo && t < hi ? theme.onAccent : theme.borderStrong }] }, t))
|
|
5122
5169
|
] }),
|
|
5123
|
-
current.map((v, i) => /* @__PURE__ */
|
|
5124
|
-
|
|
5170
|
+
current.map((v, i) => /* @__PURE__ */ jsx57(
|
|
5171
|
+
View50,
|
|
5125
5172
|
{
|
|
5126
5173
|
accessible: true,
|
|
5127
5174
|
role: "slider",
|
|
@@ -5140,16 +5187,16 @@ function Slider({
|
|
|
5140
5187
|
onValueCommit?.(out(values));
|
|
5141
5188
|
},
|
|
5142
5189
|
pointerEvents: "none",
|
|
5143
|
-
style: [
|
|
5144
|
-
children: floatingValue === "always" || floatingValue && dragging === i ? /* @__PURE__ */
|
|
5190
|
+
style: [styles43.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 }],
|
|
5191
|
+
children: floatingValue === "always" || floatingValue && dragging === i ? /* @__PURE__ */ jsx57(View50, { "aria-hidden": true, style: [vertical ? styles43.bubbleVertical : styles43.bubble, { backgroundColor: theme.textPrimary, borderRadius: radius3.md }], children: /* @__PURE__ */ jsx57(Text17, { style: [styles43.bubbleText, { color: theme.surface0 }], children: formatValue(v) }) }) : null
|
|
5145
5192
|
},
|
|
5146
5193
|
i
|
|
5147
5194
|
))
|
|
5148
5195
|
] }),
|
|
5149
|
-
marks2?.length && !vertical ? /* @__PURE__ */
|
|
5196
|
+
marks2?.length && !vertical ? /* @__PURE__ */ jsx57(View50, { "aria-hidden": true, style: styles43.marks, children: marks2.map((m) => /* @__PURE__ */ jsx57(Text17, { style: [styles43.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
|
|
5150
5197
|
] });
|
|
5151
5198
|
}
|
|
5152
|
-
var
|
|
5199
|
+
var styles43 = StyleSheet43.create({
|
|
5153
5200
|
root: { gap: 8, alignSelf: "stretch" },
|
|
5154
5201
|
rootVertical: { alignSelf: "flex-start", alignItems: "center" },
|
|
5155
5202
|
header: { flexDirection: "row", justifyContent: "space-between", alignItems: "baseline", gap: 12 },
|
|
@@ -5185,10 +5232,10 @@ var styles41 = StyleSheet41.create({
|
|
|
5185
5232
|
|
|
5186
5233
|
// src/native/spinner.tsx
|
|
5187
5234
|
import { ActivityIndicator as ActivityIndicator2 } from "react-native";
|
|
5188
|
-
import { jsx as
|
|
5235
|
+
import { jsx as jsx58 } from "react/jsx-runtime";
|
|
5189
5236
|
function Spinner({ label, size = "md", ...props }) {
|
|
5190
5237
|
const { theme } = useTheme();
|
|
5191
|
-
return /* @__PURE__ */
|
|
5238
|
+
return /* @__PURE__ */ jsx58(
|
|
5192
5239
|
ActivityIndicator2,
|
|
5193
5240
|
{
|
|
5194
5241
|
accessible: true,
|
|
@@ -5204,8 +5251,8 @@ function Spinner({ label, size = "md", ...props }) {
|
|
|
5204
5251
|
|
|
5205
5252
|
// src/native/splash-handoff.tsx
|
|
5206
5253
|
import * as React39 from "react";
|
|
5207
|
-
import { Animated as Animated23, Easing as Easing13, StyleSheet as
|
|
5208
|
-
import { jsx as
|
|
5254
|
+
import { Animated as Animated23, Easing as Easing13, StyleSheet as StyleSheet44, View as View51 } from "react-native";
|
|
5255
|
+
import { jsx as jsx59 } from "react/jsx-runtime";
|
|
5209
5256
|
function SplashHandoff({ product, ready, onShown, onDone, size = 96, background, label, duration = 320, style }) {
|
|
5210
5257
|
const { theme } = useTheme();
|
|
5211
5258
|
const reduce = useReducedMotion();
|
|
@@ -5223,7 +5270,7 @@ function SplashHandoff({ product, ready, onShown, onDone, size = 96, background,
|
|
|
5223
5270
|
return () => animation.stop();
|
|
5224
5271
|
}, [ready, reduce, duration, opacity, onDone]);
|
|
5225
5272
|
if (gone) return null;
|
|
5226
|
-
return /* @__PURE__ */
|
|
5273
|
+
return /* @__PURE__ */ jsx59(
|
|
5227
5274
|
Animated23.View,
|
|
5228
5275
|
{
|
|
5229
5276
|
accessible: true,
|
|
@@ -5232,30 +5279,30 @@ function SplashHandoff({ product, ready, onShown, onDone, size = 96, background,
|
|
|
5232
5279
|
"aria-busy": true,
|
|
5233
5280
|
pointerEvents: ready ? "none" : "auto",
|
|
5234
5281
|
onLayout: onShown,
|
|
5235
|
-
style: [
|
|
5236
|
-
children: /* @__PURE__ */
|
|
5282
|
+
style: [StyleSheet44.absoluteFill, styles44.root, { backgroundColor: background ?? theme.surface0, opacity }, style],
|
|
5283
|
+
children: /* @__PURE__ */ jsx59(View51, { children: /* @__PURE__ */ jsx59(ProductMark, { id: product, size, animated: true }) })
|
|
5237
5284
|
}
|
|
5238
5285
|
);
|
|
5239
5286
|
}
|
|
5240
|
-
var
|
|
5287
|
+
var styles44 = StyleSheet44.create({ root: { alignItems: "center", justifyContent: "center", zIndex: 100 } });
|
|
5241
5288
|
|
|
5242
5289
|
// src/native/step-progress.tsx
|
|
5243
|
-
import { Pressable as Pressable22, StyleSheet as
|
|
5290
|
+
import { Pressable as Pressable22, StyleSheet as StyleSheet45, View as View52 } from "react-native";
|
|
5244
5291
|
import Svg28, { Path as Path23 } from "react-native-svg";
|
|
5245
|
-
import { jsx as
|
|
5292
|
+
import { jsx as jsx60, jsxs as jsxs51 } from "react/jsx-runtime";
|
|
5246
5293
|
function StepProgress({ step, total, label, backLabel, onBack, trailing, style }) {
|
|
5247
5294
|
const { theme, insets } = useTheme();
|
|
5248
5295
|
const words2 = label(step, total);
|
|
5249
|
-
return /* @__PURE__ */
|
|
5250
|
-
/* @__PURE__ */
|
|
5251
|
-
onBack && backLabel ? /* @__PURE__ */
|
|
5252
|
-
/* @__PURE__ */
|
|
5253
|
-
/* @__PURE__ */
|
|
5296
|
+
return /* @__PURE__ */ jsxs51(View52, { style: [styles45.root, { paddingTop: insets.top + 8 }, style], children: [
|
|
5297
|
+
/* @__PURE__ */ jsxs51(View52, { style: styles45.row, children: [
|
|
5298
|
+
onBack && backLabel ? /* @__PURE__ */ jsx60(Pressable22, { role: "button", "aria-label": backLabel, hitSlop: 10, onPress: onBack, style: styles45.back, children: /* @__PURE__ */ jsx60(Svg28, { width: 22, height: 22, viewBox: "0 0 24 24", "aria-hidden": true, children: /* @__PURE__ */ jsx60(Path23, { d: "M15 5l-7 7 7 7", stroke: theme.textPrimary, strokeWidth: 2.4, fill: "none", strokeLinecap: "round", strokeLinejoin: "round" }) }) }) : /* @__PURE__ */ jsx60(View52, { style: styles45.back }),
|
|
5299
|
+
/* @__PURE__ */ jsx60(View52, { accessible: true, role: "progressbar", "aria-label": words2, "aria-valuemin": 1, "aria-valuemax": total, "aria-valuenow": step, "aria-valuetext": words2, style: styles45.bars, children: Array.from({ length: total }, (_, i) => /* @__PURE__ */ jsx60(View52, { style: [styles45.bar, { backgroundColor: i < step ? theme.accent : theme.surface3 }] }, i)) }),
|
|
5300
|
+
/* @__PURE__ */ jsx60(View52, { style: styles45.trailing, children: trailing })
|
|
5254
5301
|
] }),
|
|
5255
|
-
/* @__PURE__ */
|
|
5302
|
+
/* @__PURE__ */ jsx60(Txt, { variant: "caption", tone: "secondary", style: styles45.words, "aria-hidden": true, children: words2 })
|
|
5256
5303
|
] });
|
|
5257
5304
|
}
|
|
5258
|
-
var
|
|
5305
|
+
var styles45 = StyleSheet45.create({
|
|
5259
5306
|
root: { paddingHorizontal: 12, gap: 6 },
|
|
5260
5307
|
row: { flexDirection: "row", alignItems: "center", gap: 8 },
|
|
5261
5308
|
back: { width: 40, height: 40, alignItems: "center", justifyContent: "center" },
|
|
@@ -5266,36 +5313,36 @@ var styles43 = StyleSheet43.create({
|
|
|
5266
5313
|
});
|
|
5267
5314
|
|
|
5268
5315
|
// src/native/stepper.tsx
|
|
5269
|
-
import { StyleSheet as
|
|
5316
|
+
import { StyleSheet as StyleSheet46, View as View53 } from "react-native";
|
|
5270
5317
|
import Svg29, { Circle as Circle16, Path as Path24 } from "react-native-svg";
|
|
5271
|
-
import { jsx as
|
|
5318
|
+
import { jsx as jsx61, jsxs as jsxs52 } from "react/jsx-runtime";
|
|
5272
5319
|
var WORDS = { done: "done", current: "in progress", upcoming: "to come", error: "failed" };
|
|
5273
5320
|
function Stepper({ steps, current = 0, orientation = "vertical", statusLabels, "aria-label": label, style }) {
|
|
5274
5321
|
const { theme } = useTheme();
|
|
5275
5322
|
const words2 = { ...WORDS, ...statusLabels };
|
|
5276
5323
|
const vertical = orientation === "vertical";
|
|
5277
|
-
return /* @__PURE__ */
|
|
5324
|
+
return /* @__PURE__ */ jsx61(View53, { role: "list", "aria-label": label, style: [vertical ? styles46.column : styles46.row, style], children: steps.map((step, i) => {
|
|
5278
5325
|
const status = step.status ?? (i < current ? "done" : i === current ? "current" : "upcoming");
|
|
5279
5326
|
const last = i === steps.length - 1;
|
|
5280
|
-
const node = status === "current" ? /* @__PURE__ */
|
|
5281
|
-
/* @__PURE__ */
|
|
5282
|
-
status === "done" ? /* @__PURE__ */
|
|
5327
|
+
const node = status === "current" ? /* @__PURE__ */ jsx61(LoaderGlyph, { value: step.value ?? null, size: 24 }) : status === "error" ? /* @__PURE__ */ jsx61(LoaderGlyph, { state: "error", size: 24 }) : /* @__PURE__ */ jsxs52(Svg29, { width: 24, height: 24, viewBox: "0 0 24 24", "aria-hidden": true, children: [
|
|
5328
|
+
/* @__PURE__ */ jsx61(Circle16, { cx: 12, cy: 12, r: 10, fill: status === "done" ? theme.accent : "none", stroke: status === "done" ? theme.accent : theme.borderStrong, strokeWidth: 2 }),
|
|
5329
|
+
status === "done" ? /* @__PURE__ */ jsx61(Path24, { d: "M7.5 12.3l3 3 6-6.3", stroke: theme.onAccent, strokeWidth: 2.2, fill: "none", strokeLinecap: "round", strokeLinejoin: "round" }) : null
|
|
5283
5330
|
] });
|
|
5284
|
-
const connector = !last ? /* @__PURE__ */
|
|
5285
|
-
return /* @__PURE__ */
|
|
5286
|
-
/* @__PURE__ */
|
|
5331
|
+
const connector = !last ? /* @__PURE__ */ jsx61(View53, { "aria-hidden": true, style: [vertical ? styles46.vLine : styles46.hLine, { backgroundColor: status === "done" ? theme.accent : theme.borderDefault }] }) : null;
|
|
5332
|
+
return /* @__PURE__ */ jsxs52(View53, { role: "listitem", accessible: true, "aria-label": `${step.title}, ${words2[status]}`, style: vertical ? styles46.vStep : styles46.hStep, children: [
|
|
5333
|
+
/* @__PURE__ */ jsxs52(View53, { style: vertical ? styles46.vRail : styles46.hRail, children: [
|
|
5287
5334
|
node,
|
|
5288
5335
|
connector
|
|
5289
5336
|
] }),
|
|
5290
|
-
/* @__PURE__ */
|
|
5291
|
-
/* @__PURE__ */
|
|
5292
|
-
step.description ? /* @__PURE__ */
|
|
5293
|
-
step.content && (status === "current" || status === "error") ? /* @__PURE__ */
|
|
5337
|
+
/* @__PURE__ */ jsxs52(View53, { style: [styles46.body, vertical && !last ? { paddingBottom: 20 } : null], children: [
|
|
5338
|
+
/* @__PURE__ */ jsx61(Txt, { variant: "label", tone: status === "upcoming" ? "secondary" : "text", numberOfLines: vertical ? void 0 : 2, children: step.title }),
|
|
5339
|
+
step.description ? /* @__PURE__ */ jsx61(Txt, { variant: "caption", tone: "secondary", children: step.description }) : null,
|
|
5340
|
+
step.content && (status === "current" || status === "error") ? /* @__PURE__ */ jsx61(View53, { style: styles46.content, children: step.content }) : null
|
|
5294
5341
|
] })
|
|
5295
5342
|
] }, i);
|
|
5296
5343
|
}) });
|
|
5297
5344
|
}
|
|
5298
|
-
var
|
|
5345
|
+
var styles46 = StyleSheet46.create({
|
|
5299
5346
|
column: { gap: 0 },
|
|
5300
5347
|
row: { flexDirection: "row" },
|
|
5301
5348
|
vStep: { flexDirection: "row", gap: 12 },
|
|
@@ -5310,58 +5357,58 @@ var styles44 = StyleSheet44.create({
|
|
|
5310
5357
|
|
|
5311
5358
|
// src/native/swipe-deck.tsx
|
|
5312
5359
|
import * as React40 from "react";
|
|
5313
|
-
import { AccessibilityInfo as AccessibilityInfo14, Animated as Animated24, Image as Image5, PanResponder as PanResponder3, Platform as Platform4, Pressable as Pressable23, StyleSheet as
|
|
5360
|
+
import { AccessibilityInfo as AccessibilityInfo14, Animated as Animated24, Image as Image5, PanResponder as PanResponder3, Platform as Platform4, Pressable as Pressable23, StyleSheet as StyleSheet47, useWindowDimensions as useWindowDimensions2, View as View54 } from "react-native";
|
|
5314
5361
|
import Svg30, { Defs as Defs15, LinearGradient as LinearGradient15, Path as Path25, Rect as Rect6, Stop as Stop15 } from "react-native-svg";
|
|
5315
|
-
import { Fragment as Fragment8, jsx as
|
|
5362
|
+
import { Fragment as Fragment8, jsx as jsx62, jsxs as jsxs53 } from "react/jsx-runtime";
|
|
5316
5363
|
function PersonCard({ photos, name, age, badge, meta, bio, footer, photoLabel = (n, t) => `Photo ${n} of ${t}`, style }) {
|
|
5317
5364
|
const { theme, radius: radius3 } = useTheme();
|
|
5318
5365
|
const [index, setIndex] = React40.useState(0);
|
|
5319
5366
|
const gradient = useSvgId("kz-profile-");
|
|
5320
5367
|
const [box, setBox] = React40.useState(null);
|
|
5321
5368
|
const photo = photos[index];
|
|
5322
|
-
return /* @__PURE__ */
|
|
5323
|
-
|
|
5369
|
+
return /* @__PURE__ */ jsxs53(
|
|
5370
|
+
View54,
|
|
5324
5371
|
{
|
|
5325
5372
|
accessible: Platform4.OS !== "web",
|
|
5326
5373
|
accessibilityActions: photos.length > 1 ? [{ name: "increment" }, { name: "decrement" }] : [],
|
|
5327
5374
|
onAccessibilityAction: (e) => setIndex((i) => Math.max(0, Math.min(photos.length - 1, i + (e.nativeEvent.actionName === "increment" ? 1 : -1)))),
|
|
5328
5375
|
role: Platform4.OS === "web" ? "group" : "img",
|
|
5329
5376
|
"aria-label": [`${name}${age !== void 0 ? `, ${age}` : ""}`, bio, photos.length > 1 ? photoLabel(index + 1, photos.length) : null].filter(Boolean).join(". "),
|
|
5330
|
-
style: [
|
|
5377
|
+
style: [styles47.card, { borderRadius: radius3.xl, backgroundColor: theme.media }, style],
|
|
5331
5378
|
children: [
|
|
5332
|
-
photo ? /* @__PURE__ */
|
|
5333
|
-
photos.length > 1 ? /* @__PURE__ */
|
|
5334
|
-
/* @__PURE__ */
|
|
5335
|
-
/* @__PURE__ */
|
|
5336
|
-
/* @__PURE__ */
|
|
5379
|
+
photo ? /* @__PURE__ */ jsx62(Image5, { testID: "person-card-photo", source: { uri: photo.uri }, style: StyleSheet47.absoluteFill, resizeMode: "cover" }) : null,
|
|
5380
|
+
photos.length > 1 ? /* @__PURE__ */ jsxs53(Fragment8, { children: [
|
|
5381
|
+
/* @__PURE__ */ jsx62(View54, { style: styles47.bars, "aria-hidden": true, children: photos.map((_, i) => /* @__PURE__ */ jsx62(View54, { style: [styles47.bar, { backgroundColor: theme.textOnMedia, opacity: i === index ? 1 : 0.4 }] }, i)) }),
|
|
5382
|
+
/* @__PURE__ */ jsx62(Pressable23, { "aria-hidden": true, accessible: false, focusable: false, tabIndex: -1, style: [styles47.half, { left: 0 }], onPress: () => setIndex((i) => Math.max(0, i - 1)) }),
|
|
5383
|
+
/* @__PURE__ */ jsx62(Pressable23, { "aria-hidden": true, accessible: false, focusable: false, tabIndex: -1, style: [styles47.half, { right: 0 }], onPress: () => setIndex((i) => Math.min(photos.length - 1, i + 1)) })
|
|
5337
5384
|
] }) : null,
|
|
5338
|
-
/* @__PURE__ */
|
|
5339
|
-
|
|
5385
|
+
/* @__PURE__ */ jsxs53(
|
|
5386
|
+
View54,
|
|
5340
5387
|
{
|
|
5341
5388
|
testID: "person-card-overlay",
|
|
5342
5389
|
pointerEvents: "box-none",
|
|
5343
|
-
style:
|
|
5390
|
+
style: styles47.bottom,
|
|
5344
5391
|
onLayout: (e) => setBox({ width: e.nativeEvent.layout.width, height: e.nativeEvent.layout.height }),
|
|
5345
5392
|
children: [
|
|
5346
|
-
box ? /* @__PURE__ */
|
|
5347
|
-
/* @__PURE__ */
|
|
5348
|
-
/* @__PURE__ */
|
|
5349
|
-
/* @__PURE__ */
|
|
5350
|
-
/* @__PURE__ */
|
|
5393
|
+
box ? /* @__PURE__ */ jsxs53(Svg30, { testID: "person-card-scrim", style: styles47.scrim, width: box.width, height: box.height, "aria-hidden": true, children: [
|
|
5394
|
+
/* @__PURE__ */ jsx62(Defs15, { children: /* @__PURE__ */ jsxs53(LinearGradient15, { id: gradient, x1: "0", y1: "0", x2: "0", y2: "1", children: [
|
|
5395
|
+
/* @__PURE__ */ jsx62(Stop15, { offset: "0", stopColor: theme.scrimStrong, stopOpacity: 0 }),
|
|
5396
|
+
/* @__PURE__ */ jsx62(Stop15, { offset: "0.5", stopColor: theme.scrimStrong, stopOpacity: 0.8 }),
|
|
5397
|
+
/* @__PURE__ */ jsx62(Stop15, { offset: "1", stopColor: theme.scrimStrong, stopOpacity: 1 })
|
|
5351
5398
|
] }) }),
|
|
5352
|
-
/* @__PURE__ */
|
|
5399
|
+
/* @__PURE__ */ jsx62(Rect6, { x: 0, y: 0, width: box.width, height: box.height, fill: `url(#${gradient})` })
|
|
5353
5400
|
] }) : null,
|
|
5354
|
-
/* @__PURE__ */
|
|
5355
|
-
/* @__PURE__ */
|
|
5356
|
-
/* @__PURE__ */
|
|
5401
|
+
/* @__PURE__ */ jsxs53(View54, { style: styles47.text, children: [
|
|
5402
|
+
/* @__PURE__ */ jsxs53(View54, { style: styles47.nameRow, children: [
|
|
5403
|
+
/* @__PURE__ */ jsxs53(Txt, { variant: "display", tone: "onMedia", style: styles47.name, numberOfLines: 1, children: [
|
|
5357
5404
|
name,
|
|
5358
|
-
age !== void 0 ? /* @__PURE__ */
|
|
5405
|
+
age !== void 0 ? /* @__PURE__ */ jsx62(Txt, { variant: "display", tone: "onMedia", style: styles47.age, children: ` ${age}` }) : null
|
|
5359
5406
|
] }),
|
|
5360
5407
|
badge
|
|
5361
5408
|
] }),
|
|
5362
5409
|
meta,
|
|
5363
|
-
bio ? /* @__PURE__ */
|
|
5364
|
-
footer ? /* @__PURE__ */
|
|
5410
|
+
bio ? /* @__PURE__ */ jsx62(Txt, { tone: "onMedia", numberOfLines: 2, children: bio }) : null,
|
|
5411
|
+
footer ? /* @__PURE__ */ jsx62(View54, { style: styles47.footer, children: footer }) : null
|
|
5365
5412
|
] })
|
|
5366
5413
|
]
|
|
5367
5414
|
}
|
|
@@ -5405,7 +5452,7 @@ function SwipeDeck({ items: items2, getId, renderCard, onSwipe, empty: empty2, l
|
|
|
5405
5452
|
const rotate = x.interpolate({ inputRange: [-width, 0, width], outputRange: ["-14deg", "0deg", "14deg"] });
|
|
5406
5453
|
const likeOpacity = x.interpolate({ inputRange: [0, width / 4], outputRange: [0, 1], extrapolate: "clamp" });
|
|
5407
5454
|
const passOpacity = x.interpolate({ inputRange: [-width / 4, 0], outputRange: [1, 0], extrapolate: "clamp" });
|
|
5408
|
-
const button = (direction) => /* @__PURE__ */
|
|
5455
|
+
const button = (direction) => /* @__PURE__ */ jsx62(
|
|
5409
5456
|
Pressable23,
|
|
5410
5457
|
{
|
|
5411
5458
|
role: "button",
|
|
@@ -5413,18 +5460,18 @@ function SwipeDeck({ items: items2, getId, renderCard, onSwipe, empty: empty2, l
|
|
|
5413
5460
|
disabled: !top,
|
|
5414
5461
|
onPress: () => decide(direction),
|
|
5415
5462
|
style: ({ pressed }) => [
|
|
5416
|
-
|
|
5463
|
+
styles47.button,
|
|
5417
5464
|
{ borderColor: direction === "like" ? theme.success : theme.danger, backgroundColor: theme.surface1, transform: [{ scale: pressed ? 0.92 : 1 }], opacity: top ? 1 : 0.4 }
|
|
5418
5465
|
],
|
|
5419
|
-
children: /* @__PURE__ */
|
|
5466
|
+
children: /* @__PURE__ */ jsx62(Svg30, { width: 28, height: 28, viewBox: "0 0 24 24", "aria-hidden": true, children: direction === "like" ? /* @__PURE__ */ jsx62(Path25, { 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__ */ jsx62(Path25, { d: "M6 6l12 12M18 6 6 18", stroke: theme.danger, strokeWidth: 3, strokeLinecap: "round" }) })
|
|
5420
5467
|
}
|
|
5421
5468
|
);
|
|
5422
|
-
return /* @__PURE__ */
|
|
5423
|
-
/* @__PURE__ */
|
|
5469
|
+
return /* @__PURE__ */ jsxs53(View54, { style: [styles47.deck, style], children: [
|
|
5470
|
+
/* @__PURE__ */ jsxs53(View54, { style: styles47.stack, children: [
|
|
5424
5471
|
!top ? empty2 ?? null : null,
|
|
5425
5472
|
items2.slice(0, 2).reverse().map((item) => {
|
|
5426
5473
|
const isTop = item === top;
|
|
5427
|
-
return /* @__PURE__ */
|
|
5474
|
+
return /* @__PURE__ */ jsxs53(
|
|
5428
5475
|
Animated24.View,
|
|
5429
5476
|
{
|
|
5430
5477
|
...isTop ? pan.panHandlers : {},
|
|
@@ -5433,12 +5480,12 @@ function SwipeDeck({ items: items2, getId, renderCard, onSwipe, empty: empty2, l
|
|
|
5433
5480
|
"aria-hidden": !isTop,
|
|
5434
5481
|
importantForAccessibility: isTop ? "auto" : "no-hide-descendants",
|
|
5435
5482
|
pointerEvents: isTop ? "auto" : "none",
|
|
5436
|
-
style: [
|
|
5483
|
+
style: [StyleSheet47.absoluteFill, isTop ? { transform: [{ translateX: x }, { rotate }] } : { transform: [{ scale: 0.96 }], opacity: 0.9 }],
|
|
5437
5484
|
children: [
|
|
5438
5485
|
renderCard(item),
|
|
5439
|
-
isTop ? /* @__PURE__ */
|
|
5440
|
-
/* @__PURE__ */
|
|
5441
|
-
/* @__PURE__ */
|
|
5486
|
+
isTop ? /* @__PURE__ */ jsxs53(Fragment8, { children: [
|
|
5487
|
+
/* @__PURE__ */ jsx62(Animated24.View, { pointerEvents: "none", style: [styles47.stamp, styles47.stampLike, { borderColor: theme.success, opacity: likeOpacity }], "aria-hidden": true, children: /* @__PURE__ */ jsx62(Txt, { variant: "title", style: { color: theme.success }, children: labels.likeStamp ?? labels.like.toUpperCase() }) }),
|
|
5488
|
+
/* @__PURE__ */ jsx62(Animated24.View, { pointerEvents: "none", style: [styles47.stamp, styles47.stampPass, { borderColor: theme.danger, opacity: passOpacity }], "aria-hidden": true, children: /* @__PURE__ */ jsx62(Txt, { variant: "title", style: { color: theme.danger }, children: labels.passStamp ?? labels.pass.toUpperCase() }) })
|
|
5442
5489
|
] }) : null
|
|
5443
5490
|
]
|
|
5444
5491
|
},
|
|
@@ -5446,13 +5493,13 @@ function SwipeDeck({ items: items2, getId, renderCard, onSwipe, empty: empty2, l
|
|
|
5446
5493
|
);
|
|
5447
5494
|
})
|
|
5448
5495
|
] }),
|
|
5449
|
-
hideButtons ? null : /* @__PURE__ */
|
|
5496
|
+
hideButtons ? null : /* @__PURE__ */ jsxs53(View54, { style: styles47.buttons, children: [
|
|
5450
5497
|
button("pass"),
|
|
5451
5498
|
button("like")
|
|
5452
5499
|
] })
|
|
5453
5500
|
] });
|
|
5454
5501
|
}
|
|
5455
|
-
var
|
|
5502
|
+
var styles47 = StyleSheet47.create({
|
|
5456
5503
|
card: { flex: 1, overflow: "hidden" },
|
|
5457
5504
|
bars: { position: "absolute", top: 8, left: 8, right: 8, flexDirection: "row", gap: 4 },
|
|
5458
5505
|
bar: { flex: 1, height: 3, borderRadius: 2 },
|
|
@@ -5475,8 +5522,8 @@ var styles45 = StyleSheet45.create({
|
|
|
5475
5522
|
|
|
5476
5523
|
// src/native/swipeable-row.tsx
|
|
5477
5524
|
import * as React41 from "react";
|
|
5478
|
-
import { Animated as Animated25, PanResponder as PanResponder4, Pressable as Pressable24, StyleSheet as
|
|
5479
|
-
import { jsx as
|
|
5525
|
+
import { Animated as Animated25, PanResponder as PanResponder4, Pressable as Pressable24, StyleSheet as StyleSheet48, View as View55 } from "react-native";
|
|
5526
|
+
import { jsx as jsx63, jsxs as jsxs54 } from "react/jsx-runtime";
|
|
5480
5527
|
var toneColor = (t, tone3) => ({ neutral: t.surface3, accent: t.accent, success: t.success, warning: t.warning, danger: t.danger })[tone3 ?? "neutral"];
|
|
5481
5528
|
var toneText = (tone3) => tone3 === "neutral" || tone3 === void 0 ? "text" : "onAccent";
|
|
5482
5529
|
function SwipeableRow({ children, trailing = [], leading = [], fullSwipe = 0.6, actionWidth = 80, onActivate, testID, style }) {
|
|
@@ -5524,18 +5571,18 @@ function SwipeableRow({ children, trailing = [], leading = [], fullSwipe = 0.6,
|
|
|
5524
5571
|
[trailing, leading, fullSwipe, width, actionWidth]
|
|
5525
5572
|
// eslint-disable-line react-hooks/exhaustive-deps -- run/settle are stable in effect
|
|
5526
5573
|
);
|
|
5527
|
-
const side = (actions, edge) => /* @__PURE__ */
|
|
5574
|
+
const side = (actions, edge) => /* @__PURE__ */ jsx63(View55, { "aria-hidden": true, style: [styles48.side, edge === "left" ? { left: 0 } : { right: 0, flexDirection: "row-reverse" }], children: actions.map((action, i) => (
|
|
5528
5575
|
// eslint-disable-next-line react-hooks/refs -- runs on a press, never during render
|
|
5529
|
-
/* @__PURE__ */
|
|
5576
|
+
/* @__PURE__ */ jsxs54(Pressable24, { focusable: false, tabIndex: -1, onPress: () => run(action), style: [styles48.action, { width: actionWidth, backgroundColor: toneColor(theme, action.tone) }], children: [
|
|
5530
5577
|
action.icon,
|
|
5531
|
-
/* @__PURE__ */
|
|
5578
|
+
/* @__PURE__ */ jsx63(Txt, { variant: "caption", tone: toneText(action.tone), style: styles48.actionText, numberOfLines: 1, children: action.label })
|
|
5532
5579
|
] }, i)
|
|
5533
5580
|
)) });
|
|
5534
5581
|
const all = [...leading, ...trailing];
|
|
5535
|
-
return /* @__PURE__ */
|
|
5582
|
+
return /* @__PURE__ */ jsxs54(View55, { style: [styles48.root, style], onLayout: (e) => setWidth(e.nativeEvent.layout.width), children: [
|
|
5536
5583
|
leading.length > 0 ? side(leading, "left") : null,
|
|
5537
5584
|
trailing.length > 0 ? side(trailing, "right") : null,
|
|
5538
|
-
/* @__PURE__ */
|
|
5585
|
+
/* @__PURE__ */ jsx63(
|
|
5539
5586
|
Animated25.View,
|
|
5540
5587
|
{
|
|
5541
5588
|
...pan.panHandlers,
|
|
@@ -5547,13 +5594,13 @@ function SwipeableRow({ children, trailing = [], leading = [], fullSwipe = 0.6,
|
|
|
5547
5594
|
const action = all.find((a) => a.label === e.nativeEvent.actionName);
|
|
5548
5595
|
if (action) action.onPress();
|
|
5549
5596
|
},
|
|
5550
|
-
style: [
|
|
5597
|
+
style: [styles48.front, { backgroundColor: theme.surface0, transform: [{ translateX: x }] }],
|
|
5551
5598
|
children
|
|
5552
5599
|
}
|
|
5553
5600
|
)
|
|
5554
5601
|
] });
|
|
5555
5602
|
}
|
|
5556
|
-
var
|
|
5603
|
+
var styles48 = StyleSheet48.create({
|
|
5557
5604
|
root: { overflow: "hidden" },
|
|
5558
5605
|
side: { position: "absolute", top: 0, bottom: 0, flexDirection: "row" },
|
|
5559
5606
|
action: { alignItems: "center", justifyContent: "center", gap: 4, paddingHorizontal: 6 },
|
|
@@ -5563,8 +5610,8 @@ var styles46 = StyleSheet46.create({
|
|
|
5563
5610
|
|
|
5564
5611
|
// src/native/switch.tsx
|
|
5565
5612
|
import * as React42 from "react";
|
|
5566
|
-
import { Animated as Animated26, Pressable as Pressable25, StyleSheet as
|
|
5567
|
-
import { jsx as
|
|
5613
|
+
import { Animated as Animated26, Pressable as Pressable25, StyleSheet as StyleSheet49, Text as Text18, View as View56 } from "react-native";
|
|
5614
|
+
import { jsx as jsx64, jsxs as jsxs55 } from "react/jsx-runtime";
|
|
5568
5615
|
var SIZES = { sm: { w: 40, h: 24, knob: 18 }, md: { w: 52, h: 32, knob: 26 } };
|
|
5569
5616
|
function Switch({ label, checked, defaultChecked = false, onCheckedChange, description, showLabel, size = "md", error, disabled, style }) {
|
|
5570
5617
|
const { theme, motion: motion3, haptic } = useTheme();
|
|
@@ -5581,11 +5628,11 @@ function Switch({ label, checked, defaultChecked = false, onCheckedChange, descr
|
|
|
5581
5628
|
if (checked === void 0) setOwn(!on);
|
|
5582
5629
|
onCheckedChange?.(!on);
|
|
5583
5630
|
};
|
|
5584
|
-
const track = /* @__PURE__ */
|
|
5631
|
+
const track = /* @__PURE__ */ jsx64(View56, { style: [styles49.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__ */ jsx64(
|
|
5585
5632
|
Animated26.View,
|
|
5586
5633
|
{
|
|
5587
5634
|
style: [
|
|
5588
|
-
|
|
5635
|
+
styles49.knob,
|
|
5589
5636
|
{
|
|
5590
5637
|
width: d.knob,
|
|
5591
5638
|
height: d.knob,
|
|
@@ -5607,19 +5654,19 @@ function Switch({ label, checked, defaultChecked = false, onCheckedChange, descr
|
|
|
5607
5654
|
onPress: toggle
|
|
5608
5655
|
};
|
|
5609
5656
|
if (!showLabel)
|
|
5610
|
-
return /* @__PURE__ */
|
|
5611
|
-
return /* @__PURE__ */
|
|
5612
|
-
/* @__PURE__ */
|
|
5613
|
-
/* @__PURE__ */
|
|
5614
|
-
/* @__PURE__ */
|
|
5615
|
-
description ? /* @__PURE__ */
|
|
5657
|
+
return /* @__PURE__ */ jsx64(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 ? styles49.disabled : null, style], children: track });
|
|
5658
|
+
return /* @__PURE__ */ jsxs55(View56, { style: [styles49.root, style], children: [
|
|
5659
|
+
/* @__PURE__ */ jsxs55(Pressable25, { ...a11y, style: [styles49.row, disabled ? styles49.disabled : null], children: [
|
|
5660
|
+
/* @__PURE__ */ jsxs55(View56, { style: styles49.text, children: [
|
|
5661
|
+
/* @__PURE__ */ jsx64(Text18, { style: [styles49.label, { color: theme.textPrimary }], children: label }),
|
|
5662
|
+
description ? /* @__PURE__ */ jsx64(Text18, { style: [styles49.description, { color: theme.textSecondary }], children: description }) : null
|
|
5616
5663
|
] }),
|
|
5617
5664
|
track
|
|
5618
5665
|
] }),
|
|
5619
|
-
error ? /* @__PURE__ */
|
|
5666
|
+
error ? /* @__PURE__ */ jsx64(Text18, { role: "alert", "aria-live": "polite", style: [styles49.description, { color: theme.dangerText }], children: error }) : null
|
|
5620
5667
|
] });
|
|
5621
5668
|
}
|
|
5622
|
-
var
|
|
5669
|
+
var styles49 = StyleSheet49.create({
|
|
5623
5670
|
root: { gap: 2, alignSelf: "stretch" },
|
|
5624
5671
|
row: { flexDirection: "row", alignItems: "center", gap: 16, minHeight: 48 },
|
|
5625
5672
|
text: { flex: 1, gap: 2 },
|
|
@@ -5631,15 +5678,15 @@ var styles47 = StyleSheet47.create({
|
|
|
5631
5678
|
});
|
|
5632
5679
|
|
|
5633
5680
|
// src/native/tab-bar.tsx
|
|
5634
|
-
import { Pressable as Pressable26, StyleSheet as
|
|
5635
|
-
import { jsx as
|
|
5681
|
+
import { Pressable as Pressable26, StyleSheet as StyleSheet50, Text as Text19, View as View57 } from "react-native";
|
|
5682
|
+
import { jsx as jsx65, jsxs as jsxs56 } from "react/jsx-runtime";
|
|
5636
5683
|
function TabBar({ items: items2, value, onValueChange, onReselect, "aria-label": label, style }) {
|
|
5637
5684
|
const { theme, insets, haptic } = useTheme();
|
|
5638
|
-
return /* @__PURE__ */
|
|
5685
|
+
return /* @__PURE__ */ jsx65(View57, { role: "tablist", "aria-label": label, style: [styles50.bar, { backgroundColor: theme.glassBg, borderTopColor: theme.glassBorder, paddingBottom: Math.max(6, insets.bottom) }, style], children: items2.map((item) => {
|
|
5639
5686
|
const selected = item.value === value;
|
|
5640
5687
|
const color = selected ? theme.accentText : theme.textSecondary;
|
|
5641
5688
|
const badge = item.badge === true ? "" : typeof item.badge === "number" && item.badge > 0 ? item.badge > 99 ? "99+" : String(item.badge) : null;
|
|
5642
|
-
return /* @__PURE__ */
|
|
5689
|
+
return /* @__PURE__ */ jsxs56(
|
|
5643
5690
|
Pressable26,
|
|
5644
5691
|
{
|
|
5645
5692
|
role: "tab",
|
|
@@ -5649,22 +5696,22 @@ function TabBar({ items: items2, value, onValueChange, onReselect, "aria-label":
|
|
|
5649
5696
|
if (selected) onReselect?.(item.value);
|
|
5650
5697
|
else onValueChange(item.value);
|
|
5651
5698
|
},
|
|
5652
|
-
style: ({ pressed }) => [
|
|
5699
|
+
style: ({ pressed }) => [styles50.item, { opacity: pressed ? 0.7 : 1 }],
|
|
5653
5700
|
children: [
|
|
5654
|
-
/* @__PURE__ */
|
|
5701
|
+
/* @__PURE__ */ jsxs56(View57, { "aria-hidden": true, style: styles50.icon, children: [
|
|
5655
5702
|
item.icon(selected, color),
|
|
5656
|
-
badge !== null ? /* @__PURE__ */
|
|
5703
|
+
badge !== null ? /* @__PURE__ */ jsx65(View57, { style: [badge ? styles50.count : styles50.dot, { backgroundColor: theme.danger, borderColor: theme.surface1 }], children: badge ? /* @__PURE__ */ jsx65(Text19, { style: [styles50.countText, { color: theme.onAccent }], children: badge }) : null }) : null
|
|
5657
5704
|
] }),
|
|
5658
|
-
/* @__PURE__ */
|
|
5659
|
-
badge !== null && item.badgeLabel ? /* @__PURE__ */
|
|
5705
|
+
/* @__PURE__ */ jsx65(Text19, { numberOfLines: 1, style: [styles50.label, { color, fontWeight: selected ? "700" : "500" }], children: item.label }),
|
|
5706
|
+
badge !== null && item.badgeLabel ? /* @__PURE__ */ jsx65(Text19, { style: styles50.unseen, children: `, ${item.badgeLabel}` }) : null
|
|
5660
5707
|
]
|
|
5661
5708
|
},
|
|
5662
5709
|
item.value
|
|
5663
5710
|
);
|
|
5664
5711
|
}) });
|
|
5665
5712
|
}
|
|
5666
|
-
var
|
|
5667
|
-
bar: { flexDirection: "row", borderTopWidth:
|
|
5713
|
+
var styles50 = StyleSheet50.create({
|
|
5714
|
+
bar: { flexDirection: "row", borderTopWidth: StyleSheet50.hairlineWidth, paddingTop: 6 },
|
|
5668
5715
|
item: { flex: 1, alignItems: "center", gap: 2, minHeight: 48, justifyContent: "center" },
|
|
5669
5716
|
icon: { width: 28, height: 26, alignItems: "center", justifyContent: "center" },
|
|
5670
5717
|
label: { fontSize: 11, lineHeight: 14 },
|
|
@@ -5676,8 +5723,8 @@ var styles48 = StyleSheet48.create({
|
|
|
5676
5723
|
|
|
5677
5724
|
// src/native/tabs.tsx
|
|
5678
5725
|
import * as React43 from "react";
|
|
5679
|
-
import { Pressable as Pressable27, ScrollView as ScrollView7, StyleSheet as
|
|
5680
|
-
import { jsx as
|
|
5726
|
+
import { Pressable as Pressable27, ScrollView as ScrollView7, StyleSheet as StyleSheet51, View as View58 } from "react-native";
|
|
5727
|
+
import { jsx as jsx66, jsxs as jsxs57 } from "react/jsx-runtime";
|
|
5681
5728
|
function Tabs({ items: items2, value, defaultValue, onValueChange, "aria-label": label, variant = "underline", style }) {
|
|
5682
5729
|
const { theme, radius: radius3, haptic } = useTheme();
|
|
5683
5730
|
const [own, setOwn] = React43.useState(defaultValue ?? items2[0]?.value);
|
|
@@ -5691,7 +5738,7 @@ function Tabs({ items: items2, value, defaultValue, onValueChange, "aria-label":
|
|
|
5691
5738
|
const segmented = variant === "segmented";
|
|
5692
5739
|
const tabs = items2.map((item) => {
|
|
5693
5740
|
const selected = item.value === current;
|
|
5694
|
-
return /* @__PURE__ */
|
|
5741
|
+
return /* @__PURE__ */ jsx66(
|
|
5695
5742
|
Pressable27,
|
|
5696
5743
|
{
|
|
5697
5744
|
role: "tab",
|
|
@@ -5700,45 +5747,45 @@ function Tabs({ items: items2, value, defaultValue, onValueChange, "aria-label":
|
|
|
5700
5747
|
disabled: item.disabled,
|
|
5701
5748
|
onPress: () => select(item.value),
|
|
5702
5749
|
style: [
|
|
5703
|
-
segmented ?
|
|
5750
|
+
segmented ? styles51.segment : styles51.tab,
|
|
5704
5751
|
segmented && selected ? { backgroundColor: theme.surface0, borderColor: theme.borderDefault, borderRadius: radius3.sm } : null,
|
|
5705
5752
|
!segmented ? { borderBottomColor: selected ? theme.accent : "transparent" } : null,
|
|
5706
|
-
item.disabled ?
|
|
5753
|
+
item.disabled ? styles51.disabled : null
|
|
5707
5754
|
],
|
|
5708
|
-
children: /* @__PURE__ */
|
|
5755
|
+
children: /* @__PURE__ */ jsxs57(Txt, { variant: "label", tone: selected ? "text" : "secondary", numberOfLines: 1, children: [
|
|
5709
5756
|
item.label,
|
|
5710
|
-
item.count !== void 0 ? /* @__PURE__ */
|
|
5757
|
+
item.count !== void 0 ? /* @__PURE__ */ jsx66(Txt, { variant: "caption", tone: "secondary", children: ` ${item.count}` }) : null
|
|
5711
5758
|
] })
|
|
5712
5759
|
},
|
|
5713
5760
|
item.value
|
|
5714
5761
|
);
|
|
5715
5762
|
});
|
|
5716
5763
|
const panel = items2.find((i) => i.value === current)?.content;
|
|
5717
|
-
return /* @__PURE__ */
|
|
5718
|
-
segmented ? /* @__PURE__ */
|
|
5719
|
-
panel !== void 0 ? /* @__PURE__ */
|
|
5764
|
+
return /* @__PURE__ */ jsxs57(View58, { style: [styles51.root, style], children: [
|
|
5765
|
+
segmented ? /* @__PURE__ */ jsx66(View58, { role: "tablist", "aria-label": label, style: [styles51.track, { backgroundColor: theme.surface2, borderColor: theme.borderSubtle, borderRadius: radius3.md }], children: tabs }) : /* @__PURE__ */ jsx66(View58, { style: [styles51.underline, { borderBottomColor: theme.borderSubtle }], children: /* @__PURE__ */ jsx66(ScrollView7, { horizontal: true, showsHorizontalScrollIndicator: false, role: "tablist", "aria-label": label, contentContainerStyle: styles51.scroll, children: tabs }) }),
|
|
5766
|
+
panel !== void 0 ? /* @__PURE__ */ jsx66(View58, { role: "tabpanel", children: panel }) : null
|
|
5720
5767
|
] });
|
|
5721
5768
|
}
|
|
5722
|
-
var
|
|
5769
|
+
var styles51 = StyleSheet51.create({
|
|
5723
5770
|
root: { gap: 12 },
|
|
5724
|
-
underline: { borderBottomWidth:
|
|
5771
|
+
underline: { borderBottomWidth: StyleSheet51.hairlineWidth },
|
|
5725
5772
|
scroll: { gap: 4, paddingHorizontal: 4 },
|
|
5726
5773
|
tab: { minHeight: 44, justifyContent: "center", paddingHorizontal: 12, borderBottomWidth: 2 },
|
|
5727
|
-
track: { flexDirection: "row", padding: 3, gap: 3, borderWidth:
|
|
5728
|
-
segment: { flex: 1, alignItems: "center", justifyContent: "center", paddingHorizontal: 8, borderWidth:
|
|
5774
|
+
track: { flexDirection: "row", padding: 3, gap: 3, borderWidth: StyleSheet51.hairlineWidth, height: 40 },
|
|
5775
|
+
segment: { flex: 1, alignItems: "center", justifyContent: "center", paddingHorizontal: 8, borderWidth: StyleSheet51.hairlineWidth, borderColor: "transparent" },
|
|
5729
5776
|
disabled: { opacity: 0.4 }
|
|
5730
5777
|
});
|
|
5731
5778
|
|
|
5732
5779
|
// src/native/tag-selector.tsx
|
|
5733
|
-
import { StyleSheet as
|
|
5734
|
-
import { jsx as
|
|
5780
|
+
import { StyleSheet as StyleSheet52, View as View59 } from "react-native";
|
|
5781
|
+
import { jsx as jsx67, jsxs as jsxs58 } from "react/jsx-runtime";
|
|
5735
5782
|
function TagSelector({ label, options, value, onValueChange, max, countLabel, style }) {
|
|
5736
5783
|
const { haptic } = useTheme();
|
|
5737
5784
|
const full = max !== void 0 && value.length >= max;
|
|
5738
|
-
return /* @__PURE__ */
|
|
5739
|
-
/* @__PURE__ */
|
|
5785
|
+
return /* @__PURE__ */ jsxs58(View59, { style: [styles52.root, style], children: [
|
|
5786
|
+
/* @__PURE__ */ jsx67(View59, { role: "group", "aria-label": label, style: styles52.wrap, children: options.map((option) => {
|
|
5740
5787
|
const on = value.includes(option.value);
|
|
5741
|
-
return /* @__PURE__ */
|
|
5788
|
+
return /* @__PURE__ */ jsx67(
|
|
5742
5789
|
Chip,
|
|
5743
5790
|
{
|
|
5744
5791
|
selected: on,
|
|
@@ -5752,15 +5799,15 @@ function TagSelector({ label, options, value, onValueChange, max, countLabel, st
|
|
|
5752
5799
|
option.value
|
|
5753
5800
|
);
|
|
5754
5801
|
}) }),
|
|
5755
|
-
max !== void 0 && countLabel ? /* @__PURE__ */
|
|
5802
|
+
max !== void 0 && countLabel ? /* @__PURE__ */ jsx67(Txt, { variant: "caption", tone: full ? "accent" : "secondary", "aria-live": "polite", children: countLabel(value.length, max) }) : null
|
|
5756
5803
|
] });
|
|
5757
5804
|
}
|
|
5758
|
-
var
|
|
5805
|
+
var styles52 = StyleSheet52.create({ root: { gap: 8 }, wrap: { flexDirection: "row", flexWrap: "wrap", gap: 8 } });
|
|
5759
5806
|
|
|
5760
5807
|
// src/native/toast.tsx
|
|
5761
5808
|
import * as React44 from "react";
|
|
5762
|
-
import { AccessibilityInfo as AccessibilityInfo15, Animated as Animated27, PanResponder as PanResponder5, Pressable as Pressable28, StyleSheet as
|
|
5763
|
-
import { Fragment as Fragment9, jsx as
|
|
5809
|
+
import { AccessibilityInfo as AccessibilityInfo15, Animated as Animated27, PanResponder as PanResponder5, Pressable as Pressable28, StyleSheet as StyleSheet53, Text as Text20, View as View60 } from "react-native";
|
|
5810
|
+
import { Fragment as Fragment9, jsx as jsx68, jsxs as jsxs59 } from "react/jsx-runtime";
|
|
5764
5811
|
var items = [];
|
|
5765
5812
|
var listeners2 = /* @__PURE__ */ new Set();
|
|
5766
5813
|
var counter = 0;
|
|
@@ -5827,15 +5874,15 @@ function ToastView({ item, closeLabel, duration }) {
|
|
|
5827
5874
|
return () => clearTimeout(timer2);
|
|
5828
5875
|
}, [item.id, ms]);
|
|
5829
5876
|
const edge = { success: theme.success, warning: theme.warning, error: theme.danger, info: theme.info, default: theme.borderDefault }[item.tone ?? "default"];
|
|
5830
|
-
const text = /* @__PURE__ */
|
|
5831
|
-
item.icon ? /* @__PURE__ */
|
|
5832
|
-
/* @__PURE__ */
|
|
5833
|
-
/* @__PURE__ */
|
|
5834
|
-
item.description ? /* @__PURE__ */
|
|
5877
|
+
const text = /* @__PURE__ */ jsxs59(Fragment9, { children: [
|
|
5878
|
+
item.icon ? /* @__PURE__ */ jsx68(View60, { "aria-hidden": true, children: item.icon }) : null,
|
|
5879
|
+
/* @__PURE__ */ jsxs59(View60, { style: styles53.content, children: [
|
|
5880
|
+
/* @__PURE__ */ jsx68(Txt, { variant: "label", numberOfLines: 2, children: item.title }),
|
|
5881
|
+
item.description ? /* @__PURE__ */ jsx68(Txt, { variant: "caption", tone: "secondary", numberOfLines: 3, children: item.description }) : null
|
|
5835
5882
|
] })
|
|
5836
5883
|
] });
|
|
5837
|
-
const body = /* @__PURE__ */
|
|
5838
|
-
item.onPress ? /* @__PURE__ */
|
|
5884
|
+
const body = /* @__PURE__ */ jsxs59(Fragment9, { children: [
|
|
5885
|
+
item.onPress ? /* @__PURE__ */ jsx68(
|
|
5839
5886
|
Pressable28,
|
|
5840
5887
|
{
|
|
5841
5888
|
role: "button",
|
|
@@ -5843,11 +5890,11 @@ function ToastView({ item, closeLabel, duration }) {
|
|
|
5843
5890
|
item.onPress?.();
|
|
5844
5891
|
dismiss(item.id);
|
|
5845
5892
|
},
|
|
5846
|
-
style: ({ pressed }) => [
|
|
5893
|
+
style: ({ pressed }) => [styles53.main, { opacity: pressed ? 0.8 : 1 }],
|
|
5847
5894
|
children: text
|
|
5848
5895
|
}
|
|
5849
|
-
) : /* @__PURE__ */
|
|
5850
|
-
item.action ? /* @__PURE__ */
|
|
5896
|
+
) : /* @__PURE__ */ jsx68(View60, { style: styles53.main, children: text }),
|
|
5897
|
+
item.action ? /* @__PURE__ */ jsx68(
|
|
5851
5898
|
Pressable28,
|
|
5852
5899
|
{
|
|
5853
5900
|
role: "button",
|
|
@@ -5855,33 +5902,33 @@ function ToastView({ item, closeLabel, duration }) {
|
|
|
5855
5902
|
item.action?.onPress();
|
|
5856
5903
|
dismiss(item.id);
|
|
5857
5904
|
},
|
|
5858
|
-
style: [
|
|
5859
|
-
children: /* @__PURE__ */
|
|
5905
|
+
style: [styles53.action, { backgroundColor: theme.accent, borderRadius: radius3.sm }],
|
|
5906
|
+
children: /* @__PURE__ */ jsx68(Text20, { style: [styles53.actionLabel, { color: theme.onAccent }], children: item.action.label })
|
|
5860
5907
|
}
|
|
5861
5908
|
) : null,
|
|
5862
|
-
/* @__PURE__ */
|
|
5909
|
+
/* @__PURE__ */ jsx68(Pressable28, { role: "button", "aria-label": closeLabel, hitSlop: 10, onPress: () => dismiss(item.id), style: styles53.close, children: /* @__PURE__ */ jsx68(Text20, { style: [styles53.cross, { color: theme.textSecondary }], children: "\xD7" }) })
|
|
5863
5910
|
] });
|
|
5864
5911
|
const frame = [
|
|
5865
|
-
|
|
5912
|
+
styles53.toast,
|
|
5866
5913
|
{ backgroundColor: theme.surface2, borderColor: theme.borderDefault, borderLeftColor: edge, borderRadius: radius3.lg, shadowColor: theme.scrimStrong }
|
|
5867
5914
|
];
|
|
5868
5915
|
const motion3 = { transform: [{ translateY: enter.interpolate({ inputRange: [0, 1], outputRange: [-8, 0] }) }, { translateX: swipe }] };
|
|
5869
|
-
return /* @__PURE__ */
|
|
5916
|
+
return /* @__PURE__ */ jsx68(Animated27.View, { "aria-live": "polite", style: motion3, ...drag.panHandlers, children: /* @__PURE__ */ jsx68(View60, { style: frame, children: body }) });
|
|
5870
5917
|
}
|
|
5871
5918
|
function Toaster({ closeLabel, position = "top", offset = 12, duration = 6e3, max = 3 }) {
|
|
5872
5919
|
const all = React44.useSyncExternalStore(subscribe2, snapshot, snapshot);
|
|
5873
5920
|
const shown = all.slice(-max);
|
|
5874
5921
|
if (shown.length === 0) return null;
|
|
5875
|
-
return /* @__PURE__ */
|
|
5922
|
+
return /* @__PURE__ */ jsx68(View60, { pointerEvents: "box-none", style: [styles53.stack, position === "top" ? { top: offset } : { bottom: offset }], children: (position === "top" ? shown : [...shown].reverse()).map((item) => /* @__PURE__ */ jsx68(ToastView, { item, closeLabel, duration }, item.id)) });
|
|
5876
5923
|
}
|
|
5877
|
-
var
|
|
5924
|
+
var styles53 = StyleSheet53.create({
|
|
5878
5925
|
stack: { position: "absolute", left: 12, right: 12, gap: 8, zIndex: 100 },
|
|
5879
5926
|
toast: {
|
|
5880
5927
|
flexDirection: "row",
|
|
5881
5928
|
alignItems: "center",
|
|
5882
5929
|
gap: 10,
|
|
5883
5930
|
padding: 12,
|
|
5884
|
-
borderWidth:
|
|
5931
|
+
borderWidth: StyleSheet53.hairlineWidth,
|
|
5885
5932
|
borderLeftWidth: 4,
|
|
5886
5933
|
shadowOpacity: 0.3,
|
|
5887
5934
|
shadowRadius: 16,
|
|
@@ -5896,15 +5943,51 @@ var styles51 = StyleSheet51.create({
|
|
|
5896
5943
|
cross: { fontSize: 18, lineHeight: 20, fontWeight: "700" }
|
|
5897
5944
|
});
|
|
5898
5945
|
|
|
5946
|
+
// src/native/update-prompt.tsx
|
|
5947
|
+
import { StyleSheet as StyleSheet54, View as View61 } from "react-native";
|
|
5948
|
+
import { jsx as jsx69, jsxs as jsxs60 } from "react/jsx-runtime";
|
|
5949
|
+
function UpdatePrompt({ title, message, versionLabel, mark, updateLabel, onUpdate, laterLabel, onLater, style }) {
|
|
5950
|
+
const { theme, radius: radius3 } = useTheme();
|
|
5951
|
+
return /* @__PURE__ */ jsxs60(
|
|
5952
|
+
View61,
|
|
5953
|
+
{
|
|
5954
|
+
role: "region",
|
|
5955
|
+
"aria-label": title,
|
|
5956
|
+
style: [styles54.root, { backgroundColor: theme.surface1, borderColor: theme.borderSubtle, borderRadius: radius3.xl }, style],
|
|
5957
|
+
children: [
|
|
5958
|
+
/* @__PURE__ */ jsxs60(View61, { style: styles54.head, children: [
|
|
5959
|
+
mark ? /* @__PURE__ */ jsx69(View61, { accessibilityElementsHidden: true, importantForAccessibility: "no-hide-descendants", style: styles54.mark, children: mark }) : null,
|
|
5960
|
+
/* @__PURE__ */ jsxs60(View61, { style: styles54.text, children: [
|
|
5961
|
+
/* @__PURE__ */ jsx69(Txt, { variant: "label", children: title }),
|
|
5962
|
+
message ? /* @__PURE__ */ jsx69(Txt, { tone: "secondary", children: message }) : null,
|
|
5963
|
+
versionLabel ? /* @__PURE__ */ jsx69(Txt, { variant: "mono", tone: "secondary", children: versionLabel }) : null
|
|
5964
|
+
] })
|
|
5965
|
+
] }),
|
|
5966
|
+
/* @__PURE__ */ jsxs60(View61, { style: styles54.actions, children: [
|
|
5967
|
+
/* @__PURE__ */ jsx69(Button, { label: laterLabel, variant: "ghost", size: "sm", onPress: onLater }),
|
|
5968
|
+
/* @__PURE__ */ jsx69(Button, { label: updateLabel, variant: "primary", size: "sm", onPress: onUpdate })
|
|
5969
|
+
] })
|
|
5970
|
+
]
|
|
5971
|
+
}
|
|
5972
|
+
);
|
|
5973
|
+
}
|
|
5974
|
+
var styles54 = StyleSheet54.create({
|
|
5975
|
+
root: { gap: 12, padding: 16, borderWidth: StyleSheet54.hairlineWidth },
|
|
5976
|
+
head: { flexDirection: "row", gap: 12, alignItems: "center" },
|
|
5977
|
+
mark: { width: 40, height: 40, alignItems: "center", justifyContent: "center" },
|
|
5978
|
+
text: { flex: 1, gap: 2 },
|
|
5979
|
+
actions: { flexDirection: "row", justifyContent: "flex-end", gap: 8 }
|
|
5980
|
+
});
|
|
5981
|
+
|
|
5899
5982
|
// src/native/verified-badge.tsx
|
|
5900
|
-
import { StyleSheet as
|
|
5983
|
+
import { StyleSheet as StyleSheet55, View as View62 } from "react-native";
|
|
5901
5984
|
import Svg31, { Path as Path26 } from "react-native-svg";
|
|
5902
|
-
import { jsx as
|
|
5985
|
+
import { jsx as jsx70, jsxs as jsxs61 } from "react/jsx-runtime";
|
|
5903
5986
|
function VerifiedBadge({ label, showLabel, size = 16, on = "surface" }) {
|
|
5904
5987
|
const { theme } = useTheme();
|
|
5905
|
-
return /* @__PURE__ */
|
|
5906
|
-
/* @__PURE__ */
|
|
5907
|
-
/* @__PURE__ */
|
|
5988
|
+
return /* @__PURE__ */ jsxs61(View62, { accessible: true, role: "img", "aria-label": label, style: styles55.row, children: [
|
|
5989
|
+
/* @__PURE__ */ jsxs61(Svg31, { width: size, height: size, viewBox: "0 0 24 24", "aria-hidden": true, children: [
|
|
5990
|
+
/* @__PURE__ */ jsx70(
|
|
5908
5991
|
Path26,
|
|
5909
5992
|
{
|
|
5910
5993
|
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",
|
|
@@ -5913,12 +5996,12 @@ function VerifiedBadge({ label, showLabel, size = 16, on = "surface" }) {
|
|
|
5913
5996
|
strokeWidth: 1.2
|
|
5914
5997
|
}
|
|
5915
5998
|
),
|
|
5916
|
-
/* @__PURE__ */
|
|
5999
|
+
/* @__PURE__ */ jsx70(Path26, { d: "M8.3 12.3l2.5 2.5 4.9-5.2", fill: "none", stroke: theme.onAccent, strokeWidth: 2.2, strokeLinecap: "round", strokeLinejoin: "round" })
|
|
5917
6000
|
] }),
|
|
5918
|
-
showLabel ? /* @__PURE__ */
|
|
6001
|
+
showLabel ? /* @__PURE__ */ jsx70(Txt, { variant: "caption", tone: on === "media" ? "onMedia" : "accent", style: styles55.text, children: label }) : null
|
|
5919
6002
|
] });
|
|
5920
6003
|
}
|
|
5921
|
-
var
|
|
6004
|
+
var styles55 = StyleSheet55.create({ row: { flexDirection: "row", alignItems: "center", gap: 4 }, text: { fontWeight: "700" } });
|
|
5922
6005
|
export {
|
|
5923
6006
|
ActionSheet,
|
|
5924
6007
|
ActivityFeed,
|
|
@@ -5951,6 +6034,7 @@ export {
|
|
|
5951
6034
|
EmptyState,
|
|
5952
6035
|
ErrorState,
|
|
5953
6036
|
Fab,
|
|
6037
|
+
ForceUpdateScreen,
|
|
5954
6038
|
GoalGauge,
|
|
5955
6039
|
Header,
|
|
5956
6040
|
IconButton,
|
|
@@ -5960,6 +6044,7 @@ export {
|
|
|
5960
6044
|
Loader,
|
|
5961
6045
|
LoaderGlyph,
|
|
5962
6046
|
LoadingState,
|
|
6047
|
+
MaintenanceScreen,
|
|
5963
6048
|
Mascot,
|
|
5964
6049
|
MascotState,
|
|
5965
6050
|
MatchDialog,
|
|
@@ -6007,6 +6092,7 @@ export {
|
|
|
6007
6092
|
Toaster,
|
|
6008
6093
|
Txt,
|
|
6009
6094
|
TypingIndicator,
|
|
6095
|
+
UpdatePrompt,
|
|
6010
6096
|
VerifiedBadge,
|
|
6011
6097
|
WelcomeState,
|
|
6012
6098
|
Wheel,
|