panelui-native 0.9.0 → 0.12.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +5 -3
- package/lib/module/components/bottom-sheet/index.js +38 -2
- package/lib/module/components/bottom-sheet/index.js.map +1 -1
- package/lib/module/components/button/index.js +19 -1
- package/lib/module/components/button/index.js.map +1 -1
- package/lib/module/components/frame/index.js +128 -15
- package/lib/module/components/frame/index.js.map +1 -1
- package/lib/module/components/input/index.js +107 -15
- package/lib/module/components/input/index.js.map +1 -1
- package/lib/module/components/popover/index.js +22 -11
- package/lib/module/components/popover/index.js.map +1 -1
- package/lib/module/components/progress/index.js +52 -2
- package/lib/module/components/progress/index.js.map +1 -1
- package/lib/module/components/radio-group/index.js +34 -7
- package/lib/module/components/radio-group/index.js.map +1 -1
- package/lib/module/components/section-rail/index.js +355 -0
- package/lib/module/components/section-rail/index.js.map +1 -0
- package/lib/module/components/select/index.js +245 -56
- package/lib/module/components/select/index.js.map +1 -1
- package/lib/module/components/slider/index.js +355 -0
- package/lib/module/components/slider/index.js.map +1 -0
- package/lib/module/components/switch/index.js +10 -1
- package/lib/module/components/switch/index.js.map +1 -1
- package/lib/module/components/tabs/index.js +186 -16
- package/lib/module/components/tabs/index.js.map +1 -1
- package/lib/module/components/toggle-button/index.js +297 -0
- package/lib/module/components/toggle-button/index.js.map +1 -0
- package/lib/module/hooks/index.js +1 -0
- package/lib/module/hooks/index.js.map +1 -1
- package/lib/module/hooks/use-keyboard-avoidance.js +57 -8
- package/lib/module/hooks/use-keyboard-avoidance.js.map +1 -1
- package/lib/module/hooks/use-scroll-sections.js +89 -0
- package/lib/module/hooks/use-scroll-sections.js.map +1 -0
- package/lib/module/index.js +4 -1
- package/lib/module/index.js.map +1 -1
- package/lib/module/native/index.js.map +1 -1
- package/lib/module/primitives/keyboard-avoider.js +2 -0
- package/lib/module/primitives/keyboard-avoider.js.map +1 -1
- package/lib/module/utils/haptics.js +57 -0
- package/lib/module/utils/haptics.js.map +1 -0
- package/lib/typescript/src/components/bottom-sheet/index.d.ts.map +1 -1
- package/lib/typescript/src/components/button/index.d.ts +9 -4
- package/lib/typescript/src/components/button/index.d.ts.map +1 -1
- package/lib/typescript/src/components/frame/index.d.ts +47 -7
- package/lib/typescript/src/components/frame/index.d.ts.map +1 -1
- package/lib/typescript/src/components/input/index.d.ts +113 -2
- package/lib/typescript/src/components/input/index.d.ts.map +1 -1
- package/lib/typescript/src/components/popover/index.d.ts +7 -1
- package/lib/typescript/src/components/popover/index.d.ts.map +1 -1
- package/lib/typescript/src/components/progress/index.d.ts +33 -0
- package/lib/typescript/src/components/progress/index.d.ts.map +1 -1
- package/lib/typescript/src/components/radio-group/index.d.ts +7 -0
- package/lib/typescript/src/components/radio-group/index.d.ts.map +1 -1
- package/lib/typescript/src/components/section-rail/index.d.ts +115 -0
- package/lib/typescript/src/components/section-rail/index.d.ts.map +1 -0
- package/lib/typescript/src/components/select/index.d.ts +46 -7
- package/lib/typescript/src/components/select/index.d.ts.map +1 -1
- package/lib/typescript/src/components/slider/index.d.ts +203 -0
- package/lib/typescript/src/components/slider/index.d.ts.map +1 -0
- package/lib/typescript/src/components/switch/index.d.ts.map +1 -1
- package/lib/typescript/src/components/tabs/index.d.ts +46 -4
- package/lib/typescript/src/components/tabs/index.d.ts.map +1 -1
- package/lib/typescript/src/components/toggle-button/index.d.ts +244 -0
- package/lib/typescript/src/components/toggle-button/index.d.ts.map +1 -0
- package/lib/typescript/src/hooks/index.d.ts +1 -0
- package/lib/typescript/src/hooks/index.d.ts.map +1 -1
- package/lib/typescript/src/hooks/use-keyboard-avoidance.d.ts +10 -1
- package/lib/typescript/src/hooks/use-keyboard-avoidance.d.ts.map +1 -1
- package/lib/typescript/src/hooks/use-scroll-sections.d.ts +31 -0
- package/lib/typescript/src/hooks/use-scroll-sections.d.ts.map +1 -0
- package/lib/typescript/src/index.d.ts +6 -3
- package/lib/typescript/src/index.d.ts.map +1 -1
- package/lib/typescript/src/native/index.d.ts +16 -1
- package/lib/typescript/src/native/index.d.ts.map +1 -1
- package/lib/typescript/src/primitives/keyboard-avoider.d.ts +8 -1
- package/lib/typescript/src/primitives/keyboard-avoider.d.ts.map +1 -1
- package/lib/typescript/src/utils/haptics.d.ts +12 -0
- package/lib/typescript/src/utils/haptics.d.ts.map +1 -0
- package/package.json +5 -1
- package/src/components/bottom-sheet/index.tsx +38 -2
- package/src/components/button/index.tsx +26 -5
- package/src/components/frame/index.tsx +175 -29
- package/src/components/input/index.tsx +122 -16
- package/src/components/popover/index.tsx +49 -24
- package/src/components/progress/index.tsx +81 -1
- package/src/components/radio-group/index.tsx +55 -8
- package/src/components/section-rail/index.tsx +459 -0
- package/src/components/select/index.tsx +265 -52
- package/src/components/slider/index.tsx +371 -0
- package/src/components/switch/index.tsx +8 -1
- package/src/components/tabs/index.tsx +208 -28
- package/src/components/toggle-button/index.tsx +374 -0
- package/src/hooks/index.ts +5 -0
- package/src/hooks/use-keyboard-avoidance.ts +73 -7
- package/src/hooks/use-scroll-sections.ts +127 -0
- package/src/index.ts +37 -6
- package/src/native/index.ts +13 -1
- package/src/primitives/keyboard-avoider.tsx +9 -1
- package/src/utils/haptics.ts +63 -0
- package/theme.css +6 -2
- package/lib/module/components/inline-select/index.js +0 -284
- package/lib/module/components/inline-select/index.js.map +0 -1
- package/lib/typescript/src/components/inline-select/index.d.ts +0 -48
- package/lib/typescript/src/components/inline-select/index.d.ts.map +0 -1
- package/src/components/inline-select/index.tsx +0 -332
|
@@ -0,0 +1,355 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* SectionRail — a floating navigator for a long screen.
|
|
5
|
+
*
|
|
6
|
+
* A stack of short bars pinned to one edge, one per section, that expands into
|
|
7
|
+
* a labelled panel when you touch it. Collapsed it is a position indicator you
|
|
8
|
+
* can read at a glance without giving up any content width; expanded it is a
|
|
9
|
+
* list you can jump from.
|
|
10
|
+
*
|
|
11
|
+
* The bars are deliberately unlabelled. A permanent list of section titles
|
|
12
|
+
* down the side of a phone screen is either too small to read or too wide to
|
|
13
|
+
* keep — the bars carry only the two things that survive at that size, which
|
|
14
|
+
* section you are in and roughly how deep it sits.
|
|
15
|
+
*
|
|
16
|
+
* ```tsx
|
|
17
|
+
* <SectionRail value={active} onValueChange={scrollTo}>
|
|
18
|
+
* <SectionRail.Trigger>
|
|
19
|
+
* <SectionRail.Bar value="intro" />
|
|
20
|
+
* <SectionRail.Bar value="setup" level={1} />
|
|
21
|
+
* </SectionRail.Trigger>
|
|
22
|
+
* <SectionRail.Content>
|
|
23
|
+
* <SectionRail.Item value="intro">Introduction</SectionRail.Item>
|
|
24
|
+
* <SectionRail.Item value="setup" level={1}>Setup</SectionRail.Item>
|
|
25
|
+
* </SectionRail.Content>
|
|
26
|
+
* </SectionRail>
|
|
27
|
+
* ```
|
|
28
|
+
*
|
|
29
|
+
* It floats: the root is absolutely positioned and lets touches through
|
|
30
|
+
* everywhere it is not drawing, so the content underneath still scrolls.
|
|
31
|
+
*/
|
|
32
|
+
import { createContext, useCallback, useContext, useEffect, useMemo, useRef, useState } from 'react';
|
|
33
|
+
import { Pressable, ScrollView, View } from 'react-native';
|
|
34
|
+
import Animated, { FadeIn, FadeOut, interpolateColor, useAnimatedStyle, useSharedValue, withSpring, withTiming } from 'react-native-reanimated';
|
|
35
|
+
import { useSafeAreaInsets } from 'react-native-safe-area-context';
|
|
36
|
+
import { useCSSVariable } from 'uniwind';
|
|
37
|
+
import { Portal } from "../../primitives/portal.js";
|
|
38
|
+
import { Text } from "../../primitives/text.js";
|
|
39
|
+
import { cn } from "../../utils/cn.js";
|
|
40
|
+
import { selectionTick } from "../../utils/haptics.js";
|
|
41
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
42
|
+
const SPRING = {
|
|
43
|
+
damping: 20,
|
|
44
|
+
stiffness: 260,
|
|
45
|
+
mass: 0.6
|
|
46
|
+
};
|
|
47
|
+
/** Bar width at the top level, and how much each nested level takes off it. */
|
|
48
|
+
const BAR_WIDTH = 16;
|
|
49
|
+
const BAR_LEVEL_STEP = 4;
|
|
50
|
+
/** How much wider the active bar gets, so position is readable at a glance. */
|
|
51
|
+
const BAR_ACTIVE_EXTRA = 8;
|
|
52
|
+
/** Indent per level in the expanded panel. */
|
|
53
|
+
const ITEM_INDENT = 12;
|
|
54
|
+
/** Vertical position of the rail, and of the panel that opens from it. */
|
|
55
|
+
const ALIGNMENT = {
|
|
56
|
+
center: 'justify-center',
|
|
57
|
+
top: 'justify-start',
|
|
58
|
+
bottom: 'justify-end'
|
|
59
|
+
};
|
|
60
|
+
const SectionRailContext = /*#__PURE__*/createContext(null);
|
|
61
|
+
function useSectionRail(component) {
|
|
62
|
+
const context = useContext(SectionRailContext);
|
|
63
|
+
if (!context) {
|
|
64
|
+
throw new Error(`${component} must be used within a <SectionRail>`);
|
|
65
|
+
}
|
|
66
|
+
return context;
|
|
67
|
+
}
|
|
68
|
+
function SectionRailRoot({
|
|
69
|
+
className,
|
|
70
|
+
placement = 'right',
|
|
71
|
+
align = 'center',
|
|
72
|
+
haptics = false,
|
|
73
|
+
value: valueProp,
|
|
74
|
+
defaultValue,
|
|
75
|
+
onValueChange,
|
|
76
|
+
open: openProp,
|
|
77
|
+
defaultOpen = false,
|
|
78
|
+
onOpenChange,
|
|
79
|
+
closeDelay = 300,
|
|
80
|
+
offset = 12,
|
|
81
|
+
children,
|
|
82
|
+
...props
|
|
83
|
+
}) {
|
|
84
|
+
const [internalValue, setInternalValue] = useState(defaultValue);
|
|
85
|
+
const [internalOpen, setInternalOpen] = useState(defaultOpen);
|
|
86
|
+
const insets = useSafeAreaInsets();
|
|
87
|
+
const timer = useRef(null);
|
|
88
|
+
const isControlled = valueProp !== undefined;
|
|
89
|
+
const value = isControlled ? valueProp : internalValue;
|
|
90
|
+
const isOpenControlled = openProp !== undefined;
|
|
91
|
+
const open = isOpenControlled ? openProp : internalOpen;
|
|
92
|
+
const setOpen = useCallback(next => {
|
|
93
|
+
if (timer.current) {
|
|
94
|
+
clearTimeout(timer.current);
|
|
95
|
+
timer.current = null;
|
|
96
|
+
}
|
|
97
|
+
if (!isOpenControlled) setInternalOpen(next);
|
|
98
|
+
onOpenChange?.(next);
|
|
99
|
+
}, [isOpenControlled, onOpenChange]);
|
|
100
|
+
const close = useCallback(() => setOpen(false), [setOpen]);
|
|
101
|
+
|
|
102
|
+
// A pending close must not fire after the rail has gone.
|
|
103
|
+
useEffect(() => () => {
|
|
104
|
+
if (timer.current) clearTimeout(timer.current);
|
|
105
|
+
}, []);
|
|
106
|
+
const handleValueChange = useCallback(next => {
|
|
107
|
+
if (!isControlled) setInternalValue(next);
|
|
108
|
+
onValueChange?.(next);
|
|
109
|
+
if (closeDelay <= 0) {
|
|
110
|
+
setOpen(false);
|
|
111
|
+
return;
|
|
112
|
+
}
|
|
113
|
+
if (timer.current) clearTimeout(timer.current);
|
|
114
|
+
timer.current = setTimeout(() => setOpen(false), closeDelay);
|
|
115
|
+
}, [isControlled, onValueChange, closeDelay, setOpen]);
|
|
116
|
+
|
|
117
|
+
/*
|
|
118
|
+
* Fired from the resolved value rather than from the change handler, so a
|
|
119
|
+
* section arrived at by scrolling ticks as well as one that was tapped —
|
|
120
|
+
* "every change" means every change. The ref skips the first run, since
|
|
121
|
+
* mounting is not a change of section.
|
|
122
|
+
*/
|
|
123
|
+
const ticked = useRef(false);
|
|
124
|
+
useEffect(() => {
|
|
125
|
+
if (!haptics) return;
|
|
126
|
+
if (!ticked.current) {
|
|
127
|
+
ticked.current = true;
|
|
128
|
+
return;
|
|
129
|
+
}
|
|
130
|
+
selectionTick();
|
|
131
|
+
}, [value, haptics]);
|
|
132
|
+
const context = useMemo(() => ({
|
|
133
|
+
value,
|
|
134
|
+
onValueChange: handleValueChange,
|
|
135
|
+
open,
|
|
136
|
+
setOpen,
|
|
137
|
+
close,
|
|
138
|
+
placement,
|
|
139
|
+
align
|
|
140
|
+
}), [value, handleValueChange, open, setOpen, close, placement, align]);
|
|
141
|
+
return /*#__PURE__*/_jsx(SectionRailContext.Provider, {
|
|
142
|
+
value: context,
|
|
143
|
+
children: /*#__PURE__*/_jsx(View
|
|
144
|
+
// `box-none` and not `none`: the rail's own children still take
|
|
145
|
+
// touches, but the empty column around them does not — otherwise a
|
|
146
|
+
// strip down the side of the screen would swallow every scroll.
|
|
147
|
+
, {
|
|
148
|
+
pointerEvents: "box-none",
|
|
149
|
+
className: cn('absolute', ALIGNMENT[align], placement === 'right' ? 'right-0' : 'left-0', className),
|
|
150
|
+
style: {
|
|
151
|
+
top: insets.top,
|
|
152
|
+
bottom: insets.bottom,
|
|
153
|
+
[placement === 'right' ? 'right' : 'left']: (placement === 'right' ? insets.right : insets.left) + offset
|
|
154
|
+
},
|
|
155
|
+
...props,
|
|
156
|
+
children: children
|
|
157
|
+
})
|
|
158
|
+
});
|
|
159
|
+
}
|
|
160
|
+
/**
|
|
161
|
+
* The collapsed rail. Wraps the bars and opens the panel on press — one target
|
|
162
|
+
* over the whole stack rather than one per bar, because a 3px bar is not
|
|
163
|
+
* something anyone can hit.
|
|
164
|
+
*/
|
|
165
|
+
function SectionRailTrigger({
|
|
166
|
+
className,
|
|
167
|
+
children,
|
|
168
|
+
...props
|
|
169
|
+
}) {
|
|
170
|
+
const {
|
|
171
|
+
open,
|
|
172
|
+
setOpen,
|
|
173
|
+
placement
|
|
174
|
+
} = useSectionRail('SectionRail.Trigger');
|
|
175
|
+
return /*#__PURE__*/_jsx(Pressable, {
|
|
176
|
+
accessibilityRole: "button",
|
|
177
|
+
accessibilityLabel: "Sections",
|
|
178
|
+
accessibilityState: {
|
|
179
|
+
expanded: open
|
|
180
|
+
},
|
|
181
|
+
onPress: () => setOpen(!open)
|
|
182
|
+
// Generous padding is the hit target; the bars themselves are hairlines.
|
|
183
|
+
,
|
|
184
|
+
hitSlop: 8,
|
|
185
|
+
className: cn('gap-2 py-3', placement === 'right' ? 'items-end pl-6 pr-2' : 'items-start pl-2 pr-6', className),
|
|
186
|
+
...props,
|
|
187
|
+
children: children
|
|
188
|
+
});
|
|
189
|
+
}
|
|
190
|
+
/** One section, drawn as a bar. Widens and brightens when it is the active one. */
|
|
191
|
+
function SectionRailBar({
|
|
192
|
+
className,
|
|
193
|
+
value,
|
|
194
|
+
level = 0
|
|
195
|
+
}) {
|
|
196
|
+
const {
|
|
197
|
+
value: active
|
|
198
|
+
} = useSectionRail('SectionRail.Bar');
|
|
199
|
+
const selected = active === value;
|
|
200
|
+
const restColor = useCSSVariable('--color-muted-foreground');
|
|
201
|
+
const activeColor = useCSSVariable('--color-foreground');
|
|
202
|
+
const base = Math.max(BAR_WIDTH - level * BAR_LEVEL_STEP, 6);
|
|
203
|
+
const progress = useSharedValue(selected ? 1 : 0);
|
|
204
|
+
useEffect(() => {
|
|
205
|
+
progress.value = withSpring(selected ? 1 : 0, SPRING);
|
|
206
|
+
}, [selected, progress]);
|
|
207
|
+
const idle = typeof restColor === 'string' ? restColor : '#818181';
|
|
208
|
+
const on = typeof activeColor === 'string' ? activeColor : '#f5f5f5';
|
|
209
|
+
const style = useAnimatedStyle(() => ({
|
|
210
|
+
width: base + progress.value * BAR_ACTIVE_EXTRA,
|
|
211
|
+
// The inactive bars are dim on purpose — the rail is a position
|
|
212
|
+
// indicator, so only one of them is meant to be read.
|
|
213
|
+
opacity: 0.4 + progress.value * 0.6,
|
|
214
|
+
backgroundColor: interpolateColor(progress.value, [0, 1], [idle, on])
|
|
215
|
+
}));
|
|
216
|
+
return /*#__PURE__*/_jsx(Animated.View, {
|
|
217
|
+
accessibilityElementsHidden: true,
|
|
218
|
+
importantForAccessibility: "no-hide-descendants",
|
|
219
|
+
style: style,
|
|
220
|
+
className: cn('h-0.5 rounded-full', className)
|
|
221
|
+
});
|
|
222
|
+
}
|
|
223
|
+
/**
|
|
224
|
+
* The expanded panel. Mounted through a portal so it floats over everything,
|
|
225
|
+
* and unmounted after it fades out rather than left behind hidden.
|
|
226
|
+
*/
|
|
227
|
+
function SectionRailContent({
|
|
228
|
+
className,
|
|
229
|
+
children,
|
|
230
|
+
...props
|
|
231
|
+
}) {
|
|
232
|
+
const context = useSectionRail('SectionRail.Content');
|
|
233
|
+
const {
|
|
234
|
+
open,
|
|
235
|
+
close,
|
|
236
|
+
placement,
|
|
237
|
+
align
|
|
238
|
+
} = context;
|
|
239
|
+
const insets = useSafeAreaInsets();
|
|
240
|
+
if (!open) return null;
|
|
241
|
+
return /*#__PURE__*/_jsxs(Portal, {
|
|
242
|
+
children: [/*#__PURE__*/_jsx(Pressable, {
|
|
243
|
+
accessibilityRole: "button",
|
|
244
|
+
accessibilityLabel: "Close",
|
|
245
|
+
onPress: close,
|
|
246
|
+
style: {
|
|
247
|
+
position: 'absolute',
|
|
248
|
+
top: 0,
|
|
249
|
+
left: 0,
|
|
250
|
+
right: 0,
|
|
251
|
+
bottom: 0
|
|
252
|
+
}
|
|
253
|
+
}), /*#__PURE__*/_jsx(SectionRailContext.Provider, {
|
|
254
|
+
value: context,
|
|
255
|
+
children: /*#__PURE__*/_jsx(Animated.View, {
|
|
256
|
+
entering: FadeIn.duration(140),
|
|
257
|
+
exiting: FadeOut.duration(120)
|
|
258
|
+
// Aligned the same way the rail is, so a panel opened from a corner
|
|
259
|
+
// unfolds out of that corner instead of appearing across the middle
|
|
260
|
+
// of the screen away from the thing that was pressed.
|
|
261
|
+
,
|
|
262
|
+
className: cn('absolute', ALIGNMENT[align]),
|
|
263
|
+
style: {
|
|
264
|
+
top: insets.top,
|
|
265
|
+
bottom: insets.bottom,
|
|
266
|
+
[placement === 'right' ? 'right' : 'left']: (placement === 'right' ? insets.right : insets.left) + 12
|
|
267
|
+
},
|
|
268
|
+
pointerEvents: "box-none",
|
|
269
|
+
children: /*#__PURE__*/_jsx(SectionRailPanel, {
|
|
270
|
+
className: className,
|
|
271
|
+
...props,
|
|
272
|
+
children: children
|
|
273
|
+
})
|
|
274
|
+
})
|
|
275
|
+
})]
|
|
276
|
+
});
|
|
277
|
+
}
|
|
278
|
+
|
|
279
|
+
/**
|
|
280
|
+
* Split out from Content so the slide-in animated style is not on the same
|
|
281
|
+
* view as the entering/exiting fade — Reanimated will let a layout animation
|
|
282
|
+
* overwrite an animated style that touches the same property.
|
|
283
|
+
*/
|
|
284
|
+
function SectionRailPanel({
|
|
285
|
+
className,
|
|
286
|
+
children,
|
|
287
|
+
...props
|
|
288
|
+
}) {
|
|
289
|
+
const {
|
|
290
|
+
placement
|
|
291
|
+
} = useSectionRail('SectionRail.Content');
|
|
292
|
+
const slide = useSharedValue(0);
|
|
293
|
+
useEffect(() => {
|
|
294
|
+
slide.value = withTiming(1, {
|
|
295
|
+
duration: 180
|
|
296
|
+
});
|
|
297
|
+
}, [slide]);
|
|
298
|
+
|
|
299
|
+
// Arrives from the edge it is anchored to, so it reads as the rail
|
|
300
|
+
// unfolding rather than as a panel appearing over it.
|
|
301
|
+
const style = useAnimatedStyle(() => ({
|
|
302
|
+
transform: [{
|
|
303
|
+
translateX: (1 - slide.value) * (placement === 'right' ? 16 : -16)
|
|
304
|
+
}]
|
|
305
|
+
}));
|
|
306
|
+
return /*#__PURE__*/_jsx(Animated.View, {
|
|
307
|
+
style: style,
|
|
308
|
+
accessibilityRole: "menu",
|
|
309
|
+
className: cn('max-w-[60%] gap-0.5 rounded-2xl border border-border bg-popover p-2 shadow-lg', className),
|
|
310
|
+
...props,
|
|
311
|
+
children: /*#__PURE__*/_jsx(ScrollView, {
|
|
312
|
+
bounces: false,
|
|
313
|
+
showsVerticalScrollIndicator: false,
|
|
314
|
+
children: children
|
|
315
|
+
})
|
|
316
|
+
});
|
|
317
|
+
}
|
|
318
|
+
/** A labelled row in the expanded panel. */
|
|
319
|
+
function SectionRailItem({
|
|
320
|
+
className,
|
|
321
|
+
value,
|
|
322
|
+
level = 0,
|
|
323
|
+
children
|
|
324
|
+
}) {
|
|
325
|
+
const {
|
|
326
|
+
value: active,
|
|
327
|
+
onValueChange
|
|
328
|
+
} = useSectionRail('SectionRail.Item');
|
|
329
|
+
const selected = active === value;
|
|
330
|
+
return /*#__PURE__*/_jsx(Pressable, {
|
|
331
|
+
accessibilityRole: "menuitem",
|
|
332
|
+
accessibilityState: {
|
|
333
|
+
selected
|
|
334
|
+
},
|
|
335
|
+
onPress: () => onValueChange?.(value),
|
|
336
|
+
style: {
|
|
337
|
+
paddingLeft: 12 + level * ITEM_INDENT
|
|
338
|
+
},
|
|
339
|
+
className: cn('rounded-lg py-2 pr-3 active:bg-accent', selected && 'bg-accent', className),
|
|
340
|
+
children: /*#__PURE__*/_jsx(Text, {
|
|
341
|
+
size: "sm",
|
|
342
|
+
weight: selected ? 'medium' : 'normal',
|
|
343
|
+
className: selected ? 'text-foreground' : 'text-muted-foreground',
|
|
344
|
+
numberOfLines: 1,
|
|
345
|
+
children: children
|
|
346
|
+
})
|
|
347
|
+
});
|
|
348
|
+
}
|
|
349
|
+
export const SectionRail = Object.assign(SectionRailRoot, {
|
|
350
|
+
Trigger: SectionRailTrigger,
|
|
351
|
+
Bar: SectionRailBar,
|
|
352
|
+
Content: SectionRailContent,
|
|
353
|
+
Item: SectionRailItem
|
|
354
|
+
});
|
|
355
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["createContext","useCallback","useContext","useEffect","useMemo","useRef","useState","Pressable","ScrollView","View","Animated","FadeIn","FadeOut","interpolateColor","useAnimatedStyle","useSharedValue","withSpring","withTiming","useSafeAreaInsets","useCSSVariable","Portal","Text","cn","selectionTick","jsx","_jsx","jsxs","_jsxs","SPRING","damping","stiffness","mass","BAR_WIDTH","BAR_LEVEL_STEP","BAR_ACTIVE_EXTRA","ITEM_INDENT","ALIGNMENT","center","top","bottom","SectionRailContext","useSectionRail","component","context","Error","SectionRailRoot","className","placement","align","haptics","value","valueProp","defaultValue","onValueChange","open","openProp","defaultOpen","onOpenChange","closeDelay","offset","children","props","internalValue","setInternalValue","internalOpen","setInternalOpen","insets","timer","isControlled","undefined","isOpenControlled","setOpen","next","current","clearTimeout","close","handleValueChange","setTimeout","ticked","Provider","pointerEvents","style","right","left","SectionRailTrigger","accessibilityRole","accessibilityLabel","accessibilityState","expanded","onPress","hitSlop","SectionRailBar","level","active","selected","restColor","activeColor","base","Math","max","progress","idle","on","width","opacity","backgroundColor","accessibilityElementsHidden","importantForAccessibility","SectionRailContent","position","entering","duration","exiting","SectionRailPanel","slide","transform","translateX","bounces","showsVerticalScrollIndicator","SectionRailItem","paddingLeft","size","weight","numberOfLines","SectionRail","Object","assign","Trigger","Bar","Content","Item"],"sourceRoot":"../../../../src","sources":["components/section-rail/index.tsx"],"mappings":"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","ignoreList":[]}
|