@tutti-os/ui-system 0.0.268 → 0.0.270
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/metadata/components.json +17 -0
- package/dist/metadata/index.js +17 -0
- package/dist/metadata/index.js.map +1 -1
- package/dist/native.d.ts +14 -2
- package/dist/native.js +150 -44
- package/dist/native.js.map +1 -1
- package/package.json +1 -1
- package/ui-system.md +5 -0
package/dist/native.d.ts
CHANGED
|
@@ -1,6 +1,18 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import { StyleProp, ViewStyle, GestureResponderEvent } from 'react-native';
|
|
2
3
|
import { ReactNode, PropsWithChildren } from 'react';
|
|
3
|
-
|
|
4
|
+
|
|
5
|
+
type NativeAvatarSize = "compact" | "regular" | "large";
|
|
6
|
+
interface NativeAvatarProps {
|
|
7
|
+
initial?: string;
|
|
8
|
+
label: string;
|
|
9
|
+
loading?: boolean;
|
|
10
|
+
size?: NativeAvatarSize;
|
|
11
|
+
src?: string | null;
|
|
12
|
+
style?: StyleProp<ViewStyle>;
|
|
13
|
+
}
|
|
14
|
+
/** Decorative identity image with loading and broken-image fallback states. */
|
|
15
|
+
declare function NativeAvatar({ initial, label, loading, size, src, style }: NativeAvatarProps): react_jsx_runtime.JSX.Element;
|
|
4
16
|
|
|
5
17
|
type ButtonVariant = "primary" | "secondary" | "destructive" | "destructiveGhost" | "ghost";
|
|
6
18
|
type ButtonSize = "regular" | "large" | "compact" | "icon";
|
|
@@ -219,4 +231,4 @@ interface NativeThemeProviderProps extends PropsWithChildren {
|
|
|
219
231
|
declare function NativeThemeProvider({ children, mode }: NativeThemeProviderProps): react_jsx_runtime.JSX.Element;
|
|
220
232
|
declare function useNativeTheme(): NativeTheme;
|
|
221
233
|
|
|
222
|
-
export { type ButtonSize, type ButtonVariant, NativeButton, type NativeButtonProps, NativeIconButton, type NativeIconButtonProps, NativeListRow, type NativeListRowProps, NativeSheet, type NativeSheetProps, type NativeTheme, type NativeThemeMode, type NativeThemePalette, type NativeThemePreference, NativeThemeProvider, type NativeThemeProviderProps, nativeTheme, nativeThemeDimensions, nativeThemes, resolveNativeTheme, useNativeTheme };
|
|
234
|
+
export { type ButtonSize, type ButtonVariant, NativeAvatar, type NativeAvatarProps, type NativeAvatarSize, NativeButton, type NativeButtonProps, NativeIconButton, type NativeIconButtonProps, NativeListRow, type NativeListRowProps, NativeSheet, type NativeSheetProps, type NativeTheme, type NativeThemeMode, type NativeThemePalette, type NativeThemePreference, NativeThemeProvider, type NativeThemeProviderProps, nativeTheme, nativeThemeDimensions, nativeThemes, resolveNativeTheme, useNativeTheme };
|
package/dist/native.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
// src/native/
|
|
2
|
-
import { useState } from "react";
|
|
1
|
+
// src/native/avatar.tsx
|
|
2
|
+
import { useEffect, useState } from "react";
|
|
3
3
|
import {
|
|
4
4
|
ActivityIndicator,
|
|
5
|
-
|
|
5
|
+
Image,
|
|
6
6
|
StyleSheet,
|
|
7
7
|
Text,
|
|
8
8
|
View
|
|
@@ -117,8 +117,113 @@ function useNativeTheme() {
|
|
|
117
117
|
return useContext(NativeThemeContext);
|
|
118
118
|
}
|
|
119
119
|
|
|
120
|
+
// src/native/avatar.tsx
|
|
121
|
+
import { jsx as jsx2, jsxs } from "react/jsx-runtime";
|
|
122
|
+
function avatarInitial(label, initial) {
|
|
123
|
+
const value = initial?.trim() || label.trim();
|
|
124
|
+
return Array.from(value)[0]?.toLocaleUpperCase() || "?";
|
|
125
|
+
}
|
|
126
|
+
function NativeAvatar({
|
|
127
|
+
initial,
|
|
128
|
+
label,
|
|
129
|
+
loading = false,
|
|
130
|
+
size = "regular",
|
|
131
|
+
src,
|
|
132
|
+
style
|
|
133
|
+
}) {
|
|
134
|
+
const theme = useNativeTheme();
|
|
135
|
+
const styles2 = createStyles(theme);
|
|
136
|
+
const normalizedSrc = src?.trim() ?? "";
|
|
137
|
+
const [failedSrc, setFailedSrc] = useState("");
|
|
138
|
+
const [loadedSrc, setLoadedSrc] = useState("");
|
|
139
|
+
useEffect(() => {
|
|
140
|
+
setFailedSrc("");
|
|
141
|
+
setLoadedSrc("");
|
|
142
|
+
}, [normalizedSrc]);
|
|
143
|
+
const imageAvailable = !loading && normalizedSrc.length > 0 && failedSrc !== normalizedSrc;
|
|
144
|
+
const imageLoaded = imageAvailable && loadedSrc === normalizedSrc;
|
|
145
|
+
const dimension = avatarDimensions(theme)[size];
|
|
146
|
+
const imageStyle = [
|
|
147
|
+
styles2.image,
|
|
148
|
+
imageLoaded ? styles2.imageVisible : styles2.imageHidden
|
|
149
|
+
];
|
|
150
|
+
return /* @__PURE__ */ jsxs(
|
|
151
|
+
View,
|
|
152
|
+
{
|
|
153
|
+
accessibilityElementsHidden: true,
|
|
154
|
+
accessible: false,
|
|
155
|
+
importantForAccessibility: "no-hide-descendants",
|
|
156
|
+
style: [styles2.root, dimension, style],
|
|
157
|
+
children: [
|
|
158
|
+
loading || imageAvailable ? imageLoaded ? null : /* @__PURE__ */ jsx2(ActivityIndicator, { color: theme.color.muted, size: "small" }) : /* @__PURE__ */ jsx2(Text, { numberOfLines: 1, style: styles2.initial, children: avatarInitial(label, initial) }),
|
|
159
|
+
imageAvailable ? /* @__PURE__ */ jsx2(
|
|
160
|
+
Image,
|
|
161
|
+
{
|
|
162
|
+
onError: () => setFailedSrc(normalizedSrc),
|
|
163
|
+
onLoad: () => setLoadedSrc(normalizedSrc),
|
|
164
|
+
resizeMode: "cover",
|
|
165
|
+
source: { uri: normalizedSrc },
|
|
166
|
+
style: imageStyle
|
|
167
|
+
}
|
|
168
|
+
) : null
|
|
169
|
+
]
|
|
170
|
+
}
|
|
171
|
+
);
|
|
172
|
+
}
|
|
173
|
+
function avatarDimensions(theme) {
|
|
174
|
+
return {
|
|
175
|
+
compact: {
|
|
176
|
+
height: theme.control.compact,
|
|
177
|
+
width: theme.control.compact
|
|
178
|
+
},
|
|
179
|
+
large: {
|
|
180
|
+
height: theme.control.row,
|
|
181
|
+
width: theme.control.row
|
|
182
|
+
},
|
|
183
|
+
regular: {
|
|
184
|
+
height: theme.control.regular,
|
|
185
|
+
width: theme.control.regular
|
|
186
|
+
}
|
|
187
|
+
};
|
|
188
|
+
}
|
|
189
|
+
function createStyles(theme) {
|
|
190
|
+
return StyleSheet.create({
|
|
191
|
+
image: {
|
|
192
|
+
height: "100%",
|
|
193
|
+
left: 0,
|
|
194
|
+
position: "absolute",
|
|
195
|
+
top: 0,
|
|
196
|
+
width: "100%"
|
|
197
|
+
},
|
|
198
|
+
imageHidden: { opacity: 0 },
|
|
199
|
+
imageVisible: { opacity: 1 },
|
|
200
|
+
initial: {
|
|
201
|
+
color: theme.color.text,
|
|
202
|
+
fontSize: theme.space.medium,
|
|
203
|
+
fontWeight: "700"
|
|
204
|
+
},
|
|
205
|
+
root: {
|
|
206
|
+
alignItems: "center",
|
|
207
|
+
backgroundColor: theme.color.panelRaised,
|
|
208
|
+
borderColor: theme.color.border,
|
|
209
|
+
borderRadius: theme.control.row / 2,
|
|
210
|
+
borderWidth: StyleSheet.hairlineWidth,
|
|
211
|
+
justifyContent: "center",
|
|
212
|
+
overflow: "hidden"
|
|
213
|
+
}
|
|
214
|
+
});
|
|
215
|
+
}
|
|
216
|
+
|
|
120
217
|
// src/native/button.tsx
|
|
121
|
-
import {
|
|
218
|
+
import { useState as useState2 } from "react";
|
|
219
|
+
import {
|
|
220
|
+
ActivityIndicator as ActivityIndicator2,
|
|
221
|
+
Pressable,
|
|
222
|
+
StyleSheet as StyleSheet2,
|
|
223
|
+
Text as Text2,
|
|
224
|
+
View as View2
|
|
225
|
+
} from "react-native";
|
|
226
|
+
import { Fragment, jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
122
227
|
function NativeButton({
|
|
123
228
|
accessibilityLabel,
|
|
124
229
|
disabled = false,
|
|
@@ -132,12 +237,12 @@ function NativeButton({
|
|
|
132
237
|
variant = "primary"
|
|
133
238
|
}) {
|
|
134
239
|
const theme = useNativeTheme();
|
|
135
|
-
const styles2 =
|
|
136
|
-
const [pressed, setPressed] =
|
|
240
|
+
const styles2 = createStyles2(theme);
|
|
241
|
+
const [pressed, setPressed] = useState2(false);
|
|
137
242
|
const unavailable = disabled || loading;
|
|
138
243
|
const foreground = textColorByVariant(theme)[variant];
|
|
139
244
|
const hasLabel = label.trim().length > 0;
|
|
140
|
-
return /* @__PURE__ */
|
|
245
|
+
return /* @__PURE__ */ jsx3(
|
|
141
246
|
Pressable,
|
|
142
247
|
{
|
|
143
248
|
accessibilityLabel: accessibilityLabel ?? label,
|
|
@@ -156,10 +261,10 @@ function NativeButton({
|
|
|
156
261
|
style
|
|
157
262
|
],
|
|
158
263
|
testID,
|
|
159
|
-
children: /* @__PURE__ */
|
|
160
|
-
leading ? /* @__PURE__ */
|
|
161
|
-
hasLabel ? /* @__PURE__ */
|
|
162
|
-
|
|
264
|
+
children: /* @__PURE__ */ jsx3(View2, { style: styles2.content, children: loading ? /* @__PURE__ */ jsx3(ActivityIndicator2, { color: foreground, size: "small" }) : /* @__PURE__ */ jsxs2(Fragment, { children: [
|
|
265
|
+
leading ? /* @__PURE__ */ jsx3(View2, { style: [styles2.leading, !hasLabel && styles2.leadingOnly], children: leading }) : null,
|
|
266
|
+
hasLabel ? /* @__PURE__ */ jsx3(
|
|
267
|
+
Text2,
|
|
163
268
|
{
|
|
164
269
|
numberOfLines: 1,
|
|
165
270
|
style: [styles2.label, { color: foreground }],
|
|
@@ -185,15 +290,15 @@ function variantStyles(theme) {
|
|
|
185
290
|
secondary: {
|
|
186
291
|
backgroundColor: theme.color.panelRaised,
|
|
187
292
|
borderColor: theme.color.border,
|
|
188
|
-
borderWidth:
|
|
293
|
+
borderWidth: StyleSheet2.hairlineWidth
|
|
189
294
|
},
|
|
190
295
|
destructive: { backgroundColor: theme.color.danger },
|
|
191
296
|
destructiveGhost: { backgroundColor: "transparent" },
|
|
192
297
|
ghost: { backgroundColor: "transparent" }
|
|
193
298
|
};
|
|
194
299
|
}
|
|
195
|
-
function
|
|
196
|
-
return
|
|
300
|
+
function createStyles2(theme) {
|
|
301
|
+
return StyleSheet2.create({
|
|
197
302
|
button: {
|
|
198
303
|
alignItems: "center",
|
|
199
304
|
borderRadius: theme.radius.medium,
|
|
@@ -231,9 +336,9 @@ function createStyles(theme) {
|
|
|
231
336
|
|
|
232
337
|
// src/native/icon-button.tsx
|
|
233
338
|
import {
|
|
234
|
-
StyleSheet as
|
|
339
|
+
StyleSheet as StyleSheet3
|
|
235
340
|
} from "react-native";
|
|
236
|
-
import { jsx as
|
|
341
|
+
import { jsx as jsx4 } from "react/jsx-runtime";
|
|
237
342
|
function NativeIconButton({
|
|
238
343
|
accessibilityLabel,
|
|
239
344
|
disabled = false,
|
|
@@ -244,7 +349,7 @@ function NativeIconButton({
|
|
|
244
349
|
testID,
|
|
245
350
|
variant = "ghost"
|
|
246
351
|
}) {
|
|
247
|
-
return /* @__PURE__ */
|
|
352
|
+
return /* @__PURE__ */ jsx4(
|
|
248
353
|
NativeButton,
|
|
249
354
|
{
|
|
250
355
|
accessibilityLabel,
|
|
@@ -259,18 +364,18 @@ function NativeIconButton({
|
|
|
259
364
|
}
|
|
260
365
|
);
|
|
261
366
|
}
|
|
262
|
-
var styles =
|
|
367
|
+
var styles = StyleSheet3.create({
|
|
263
368
|
button: { paddingHorizontal: 0 }
|
|
264
369
|
});
|
|
265
370
|
|
|
266
371
|
// src/native/list-row.tsx
|
|
267
372
|
import {
|
|
268
373
|
Pressable as Pressable2,
|
|
269
|
-
StyleSheet as
|
|
270
|
-
Text as
|
|
271
|
-
View as
|
|
374
|
+
StyleSheet as StyleSheet4,
|
|
375
|
+
Text as Text3,
|
|
376
|
+
View as View3
|
|
272
377
|
} from "react-native";
|
|
273
|
-
import { jsx as
|
|
378
|
+
import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
274
379
|
function NativeListRow({
|
|
275
380
|
accessibilityLabel,
|
|
276
381
|
description,
|
|
@@ -283,9 +388,9 @@ function NativeListRow({
|
|
|
283
388
|
trailing
|
|
284
389
|
}) {
|
|
285
390
|
const theme = useNativeTheme();
|
|
286
|
-
const styles2 =
|
|
391
|
+
const styles2 = createStyles3(theme);
|
|
287
392
|
const interactive = onPress !== void 0;
|
|
288
|
-
return /* @__PURE__ */
|
|
393
|
+
return /* @__PURE__ */ jsx5(
|
|
289
394
|
Pressable2,
|
|
290
395
|
{
|
|
291
396
|
accessibilityLabel: accessibilityLabel ?? title,
|
|
@@ -300,27 +405,27 @@ function NativeListRow({
|
|
|
300
405
|
disabled ? styles2.disabled : void 0,
|
|
301
406
|
style
|
|
302
407
|
],
|
|
303
|
-
children: /* @__PURE__ */
|
|
304
|
-
selected ? /* @__PURE__ */
|
|
305
|
-
leading ? /* @__PURE__ */
|
|
306
|
-
/* @__PURE__ */
|
|
307
|
-
/* @__PURE__ */
|
|
308
|
-
|
|
408
|
+
children: /* @__PURE__ */ jsxs3(View3, { style: styles2.content, children: [
|
|
409
|
+
selected ? /* @__PURE__ */ jsx5(View3, { style: styles2.selectedIndicator }) : null,
|
|
410
|
+
leading ? /* @__PURE__ */ jsx5(View3, { style: styles2.leading, children: leading }) : null,
|
|
411
|
+
/* @__PURE__ */ jsxs3(View3, { style: styles2.copy, children: [
|
|
412
|
+
/* @__PURE__ */ jsx5(
|
|
413
|
+
Text3,
|
|
309
414
|
{
|
|
310
415
|
numberOfLines: 2,
|
|
311
416
|
style: [styles2.title, selected ? styles2.titleSelected : void 0],
|
|
312
417
|
children: title
|
|
313
418
|
}
|
|
314
419
|
),
|
|
315
|
-
typeof description === "string" ? /* @__PURE__ */
|
|
420
|
+
typeof description === "string" ? /* @__PURE__ */ jsx5(Text3, { numberOfLines: 1, style: styles2.description, children: description }) : description ? /* @__PURE__ */ jsx5(View3, { style: styles2.descriptionSlot, children: description }) : null
|
|
316
421
|
] }),
|
|
317
|
-
trailing ? /* @__PURE__ */
|
|
422
|
+
trailing ? /* @__PURE__ */ jsx5(View3, { style: styles2.trailing, children: trailing }) : null
|
|
318
423
|
] })
|
|
319
424
|
}
|
|
320
425
|
);
|
|
321
426
|
}
|
|
322
|
-
function
|
|
323
|
-
return
|
|
427
|
+
function createStyles3(theme) {
|
|
428
|
+
return StyleSheet4.create({
|
|
324
429
|
content: {
|
|
325
430
|
alignItems: "center",
|
|
326
431
|
flex: 1,
|
|
@@ -372,9 +477,9 @@ import {
|
|
|
372
477
|
Modal,
|
|
373
478
|
Platform,
|
|
374
479
|
Pressable as Pressable3,
|
|
375
|
-
StyleSheet as
|
|
480
|
+
StyleSheet as StyleSheet5
|
|
376
481
|
} from "react-native";
|
|
377
|
-
import { jsx as
|
|
482
|
+
import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
378
483
|
function NativeSheet({
|
|
379
484
|
children,
|
|
380
485
|
closeAccessibilityLabel,
|
|
@@ -383,9 +488,9 @@ function NativeSheet({
|
|
|
383
488
|
open
|
|
384
489
|
}) {
|
|
385
490
|
const theme = useNativeTheme();
|
|
386
|
-
const styles2 =
|
|
491
|
+
const styles2 = createStyles4(theme);
|
|
387
492
|
const dismiss = () => onOpenChange(false);
|
|
388
|
-
return /* @__PURE__ */
|
|
493
|
+
return /* @__PURE__ */ jsx6(
|
|
389
494
|
Modal,
|
|
390
495
|
{
|
|
391
496
|
animationType: "fade",
|
|
@@ -394,7 +499,7 @@ function NativeSheet({
|
|
|
394
499
|
statusBarTranslucent: true,
|
|
395
500
|
transparent: true,
|
|
396
501
|
visible: open,
|
|
397
|
-
children: /* @__PURE__ */
|
|
502
|
+
children: /* @__PURE__ */ jsxs4(
|
|
398
503
|
KeyboardAvoidingView,
|
|
399
504
|
{
|
|
400
505
|
accessible: false,
|
|
@@ -403,18 +508,18 @@ function NativeSheet({
|
|
|
403
508
|
onAccessibilityEscape: dismiss,
|
|
404
509
|
style: styles2.backdrop,
|
|
405
510
|
children: [
|
|
406
|
-
/* @__PURE__ */
|
|
511
|
+
/* @__PURE__ */ jsx6(
|
|
407
512
|
Pressable3,
|
|
408
513
|
{
|
|
409
514
|
accessibilityLabel: closeAccessibilityLabel,
|
|
410
515
|
accessibilityRole: "button",
|
|
411
516
|
accessible: true,
|
|
412
517
|
onPress: dismiss,
|
|
413
|
-
style:
|
|
518
|
+
style: StyleSheet5.absoluteFill,
|
|
414
519
|
testID: "native-sheet-backdrop"
|
|
415
520
|
}
|
|
416
521
|
),
|
|
417
|
-
/* @__PURE__ */
|
|
522
|
+
/* @__PURE__ */ jsx6(
|
|
418
523
|
Pressable3,
|
|
419
524
|
{
|
|
420
525
|
accessible: false,
|
|
@@ -430,8 +535,8 @@ function NativeSheet({
|
|
|
430
535
|
}
|
|
431
536
|
);
|
|
432
537
|
}
|
|
433
|
-
function
|
|
434
|
-
return
|
|
538
|
+
function createStyles4(theme) {
|
|
539
|
+
return StyleSheet5.create({
|
|
435
540
|
backdrop: {
|
|
436
541
|
backgroundColor: theme.color.scrim,
|
|
437
542
|
flex: 1,
|
|
@@ -447,6 +552,7 @@ function createStyles3(theme) {
|
|
|
447
552
|
});
|
|
448
553
|
}
|
|
449
554
|
export {
|
|
555
|
+
NativeAvatar,
|
|
450
556
|
NativeButton,
|
|
451
557
|
NativeIconButton,
|
|
452
558
|
NativeListRow,
|
package/dist/native.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/native/button.tsx","../src/native/theme-provider.tsx","../src/native/generated-tokens.ts","../src/native/tokens.ts","../src/native/icon-button.tsx","../src/native/list-row.tsx","../src/native/sheet.tsx"],"sourcesContent":["import { type ReactNode, useState } from \"react\";\nimport {\n ActivityIndicator,\n type GestureResponderEvent,\n Pressable,\n StyleSheet,\n Text,\n View,\n type StyleProp,\n type ViewStyle\n} from \"react-native\";\nimport { type NativeTheme } from \"./tokens\";\nimport { useNativeTheme } from \"./theme-provider\";\n\nexport type ButtonVariant =\n | \"primary\"\n | \"secondary\"\n | \"destructive\"\n | \"destructiveGhost\"\n | \"ghost\";\n\nexport type ButtonSize = \"regular\" | \"large\" | \"compact\" | \"icon\";\n\nexport interface NativeButtonProps {\n accessibilityLabel?: string;\n disabled?: boolean;\n label: string;\n leading?: ReactNode;\n loading?: boolean;\n onPress(event: GestureResponderEvent): void;\n size?: ButtonSize;\n style?: StyleProp<ViewStyle>;\n testID?: string;\n variant?: ButtonVariant;\n}\n\n/**\n * Native counterpart of the UI System Button contract.\n *\n * Its interaction hierarchy is adapted from React Native Reusables' Button,\n * while the styling is deliberately token-backed and platform-native.\n */\nexport function NativeButton({\n accessibilityLabel,\n disabled = false,\n label,\n leading,\n loading = false,\n onPress,\n size = \"regular\",\n style,\n testID,\n variant = \"primary\"\n}: NativeButtonProps) {\n const theme = useNativeTheme();\n const styles = createStyles(theme);\n const [pressed, setPressed] = useState(false);\n const unavailable = disabled || loading;\n const foreground = textColorByVariant(theme)[variant];\n const hasLabel = label.trim().length > 0;\n\n return (\n <Pressable\n accessibilityLabel={accessibilityLabel ?? label}\n accessibilityRole=\"button\"\n accessibilityState={{ busy: loading, disabled: unavailable }}\n disabled={unavailable}\n onPress={onPress}\n onPressIn={() => setPressed(true)}\n onPressOut={() => setPressed(false)}\n style={[\n styles.button,\n styles[size],\n variantStyles(theme)[variant],\n pressed && !unavailable ? styles.pressed : undefined,\n unavailable ? styles.disabled : undefined,\n style\n ]}\n testID={testID}\n >\n <View style={styles.content}>\n {loading ? (\n <ActivityIndicator color={foreground} size=\"small\" />\n ) : (\n <>\n {leading ? (\n <View style={[styles.leading, !hasLabel && styles.leadingOnly]}>\n {leading}\n </View>\n ) : null}\n {hasLabel ? (\n <Text\n numberOfLines={1}\n style={[styles.label, { color: foreground }]}\n >\n {label}\n </Text>\n ) : null}\n </>\n )}\n </View>\n </Pressable>\n );\n}\n\nfunction textColorByVariant(theme: NativeTheme): Record<ButtonVariant, string> {\n return {\n primary: theme.color.background,\n secondary: theme.color.text,\n destructive: theme.color.background,\n destructiveGhost: theme.color.danger,\n ghost: theme.color.text\n };\n}\n\nfunction variantStyles(theme: NativeTheme): Record<ButtonVariant, ViewStyle> {\n return {\n primary: { backgroundColor: theme.color.accent },\n secondary: {\n backgroundColor: theme.color.panelRaised,\n borderColor: theme.color.border,\n borderWidth: StyleSheet.hairlineWidth\n },\n destructive: { backgroundColor: theme.color.danger },\n destructiveGhost: { backgroundColor: \"transparent\" },\n ghost: { backgroundColor: \"transparent\" }\n };\n}\n\nfunction createStyles(theme: NativeTheme) {\n return StyleSheet.create({\n button: {\n alignItems: \"center\",\n borderRadius: theme.radius.medium,\n justifyContent: \"center\"\n },\n compact: {\n minHeight: theme.control.compact,\n paddingHorizontal: theme.space.small\n },\n content: {\n alignItems: \"center\",\n flexDirection: \"row\",\n justifyContent: \"center\"\n },\n disabled: { opacity: 0.45 },\n icon: {\n height: theme.control.icon,\n paddingHorizontal: 0,\n width: theme.control.icon\n },\n label: { fontSize: theme.space.medium, fontWeight: \"700\" },\n large: {\n minHeight: theme.control.large,\n paddingHorizontal: theme.space.medium\n },\n leading: { marginRight: theme.space.small },\n leadingOnly: { marginRight: 0 },\n pressed: { opacity: 0.82 },\n regular: {\n minHeight: theme.control.regular,\n paddingHorizontal: theme.space.medium\n }\n });\n}\n","import {\n createContext,\n type PropsWithChildren,\n useContext,\n useMemo\n} from \"react\";\nimport { useColorScheme } from \"react-native\";\nimport {\n nativeTheme,\n resolveNativeTheme,\n type NativeTheme,\n type NativeThemeMode\n} from \"./tokens\";\n\nexport type NativeThemePreference = NativeThemeMode | \"system\";\n\nconst NativeThemeContext = createContext<NativeTheme>(nativeTheme);\n\nexport interface NativeThemeProviderProps extends PropsWithChildren {\n /** Defaults to the operating system preference when no product override exists. */\n mode?: NativeThemePreference;\n}\n\n/**\n * Supplies the resolved Native semantic theme to UI System primitives and\n * application composition. The provider is intentionally UI-only: product\n * settings decide which preference, if any, it receives.\n */\nexport function NativeThemeProvider({\n children,\n mode = \"system\"\n}: NativeThemeProviderProps) {\n const systemMode = useColorScheme();\n const resolvedMode =\n mode === \"system\" ? (systemMode === \"light\" ? \"light\" : \"dark\") : mode;\n const theme = useMemo(() => resolveNativeTheme(resolvedMode), [resolvedMode]);\n\n return (\n <NativeThemeContext.Provider value={theme}>\n {children}\n </NativeThemeContext.Provider>\n );\n}\n\nexport function useNativeTheme(): NativeTheme {\n return useContext(NativeThemeContext);\n}\n","/* This file is generated from ../tokens/renderer-theme.json. Do not edit it directly. */\nexport const nativeThemeDimensions = {\n control: {\n compact: 40,\n icon: 40,\n large: 52,\n regular: 48,\n row: 60\n },\n radius: {\n large: 18,\n medium: 12,\n small: 8\n },\n space: {\n large: 24,\n medium: 16,\n small: 10,\n xlarge: 32\n }\n} as const;\n\nexport const nativeThemes = {\n light: {\n accent: \"#4182f5\",\n accentPressed: \"#3975df\",\n background: \"#f7f8fa\",\n backgroundFronted: \"#ffffff\",\n backgroundPanel: \"#f8fafc\",\n border: \"#e5e7eb\",\n danger: \"#dc2626\",\n foreground: \"#29313d\",\n muted: \"#6b7280\",\n panel: \"#f8f8fa\",\n scrim: \"rgba(0, 0, 0, 0.6)\",\n scrimStrong: \"rgba(0, 0, 0, 0.64)\",\n success: \"#22c55e\",\n textPrimary: \"#3c3c3c\",\n textSecondary: \"#6c6c6c\"\n },\n dark: {\n accent: \"#5a9bff\",\n accentPressed: \"#4f8fff\",\n background: \"#111216\",\n backgroundFronted: \"#22252d\",\n backgroundPanel: \"#1a1c22\",\n border: \"#30333b\",\n danger: \"#ff716c\",\n foreground: \"#f6f6f7\",\n muted: \"#9398a5\",\n panel: \"#1a1c22\",\n scrim: \"rgba(0, 0, 0, 0.6)\",\n scrimStrong: \"rgba(0, 0, 0, 0.64)\",\n success: \"#62d49f\",\n textPrimary: \"#f6f6f7\",\n textSecondary: \"#c3c6ce\"\n }\n} as const;\n\nexport type NativeThemeMode = keyof typeof nativeThemes;\nexport type NativeThemePalette = (typeof nativeThemes)[NativeThemeMode];\n","import {\n nativeThemeDimensions,\n nativeThemes,\n type NativeThemeMode,\n type NativeThemePalette\n} from \"./generated-tokens\";\n\nexport { nativeThemeDimensions, nativeThemes };\nexport type { NativeThemeMode, NativeThemePalette };\n\n/**\n * Resolves a renderer-neutral semantic theme for React Native.\n */\nexport function resolveNativeTheme(mode: NativeThemeMode) {\n const palette = nativeThemes[mode];\n\n return {\n control: nativeThemeDimensions.control,\n color: {\n accent: palette.accent,\n accentPressed: palette.accentPressed,\n background: palette.background,\n border: palette.border,\n danger: palette.danger,\n muted: palette.muted,\n panel: palette.panel,\n panelRaised: palette.backgroundFronted,\n scrim: palette.scrim,\n scrimStrong: palette.scrimStrong,\n success: palette.success,\n text: palette.textPrimary,\n textSecondary: palette.textSecondary\n },\n mode,\n radius: nativeThemeDimensions.radius,\n space: nativeThemeDimensions.space\n } as const;\n}\n\n/**\n * Backwards-compatible dark Native theme.\n *\n * New components should consume the context-backed `useNativeTheme` hook so\n * they respond to the Native renderer's configured color scheme.\n */\nexport const nativeTheme = resolveNativeTheme(\"dark\");\n\nexport type NativeTheme = typeof nativeTheme;\n","import type { ReactNode } from \"react\";\nimport {\n StyleSheet,\n type GestureResponderEvent,\n type StyleProp,\n type ViewStyle\n} from \"react-native\";\nimport { NativeButton, type ButtonSize, type ButtonVariant } from \"./button\";\n\nexport interface NativeIconButtonProps {\n accessibilityLabel: string;\n disabled?: boolean;\n icon: ReactNode;\n onPress(event: GestureResponderEvent): void;\n size?: Extract<ButtonSize, \"compact\" | \"icon\">;\n style?: StyleProp<ViewStyle>;\n testID?: string;\n variant?: ButtonVariant;\n}\n\nexport function NativeIconButton({\n accessibilityLabel,\n disabled = false,\n icon,\n onPress,\n size = \"icon\",\n style,\n testID,\n variant = \"ghost\"\n}: NativeIconButtonProps) {\n return (\n <NativeButton\n accessibilityLabel={accessibilityLabel}\n disabled={disabled}\n label=\"\"\n leading={icon}\n onPress={onPress}\n size={size}\n style={[styles.button, style]}\n testID={testID}\n variant={variant}\n />\n );\n}\n\nconst styles = StyleSheet.create({\n button: { paddingHorizontal: 0 }\n});\n","import type { ReactNode } from \"react\";\nimport {\n Pressable,\n StyleSheet,\n Text,\n View,\n type StyleProp,\n type ViewStyle\n} from \"react-native\";\nimport { type NativeTheme } from \"./tokens\";\nimport { useNativeTheme } from \"./theme-provider\";\n\nexport interface NativeListRowProps {\n accessibilityLabel?: string;\n description?: ReactNode;\n disabled?: boolean;\n leading?: ReactNode;\n onPress?(): void;\n selected?: boolean;\n style?: StyleProp<ViewStyle>;\n title: string;\n trailing?: ReactNode;\n}\n\nexport function NativeListRow({\n accessibilityLabel,\n description,\n disabled = false,\n leading,\n onPress,\n selected = false,\n style,\n title,\n trailing\n}: NativeListRowProps) {\n const theme = useNativeTheme();\n const styles = createStyles(theme);\n const interactive = onPress !== undefined;\n\n return (\n <Pressable\n accessibilityLabel={accessibilityLabel ?? title}\n accessibilityRole={interactive ? \"button\" : undefined}\n accessibilityState={{ disabled, selected }}\n disabled={!interactive || disabled}\n onPress={onPress}\n style={({ pressed }) => [\n styles.row,\n selected ? styles.selected : undefined,\n pressed && interactive && !disabled ? styles.pressed : undefined,\n disabled ? styles.disabled : undefined,\n style\n ]}\n >\n <View style={styles.content}>\n {selected ? <View style={styles.selectedIndicator} /> : null}\n {leading ? <View style={styles.leading}>{leading}</View> : null}\n <View style={styles.copy}>\n <Text\n numberOfLines={2}\n style={[styles.title, selected ? styles.titleSelected : undefined]}\n >\n {title}\n </Text>\n {typeof description === \"string\" ? (\n <Text numberOfLines={1} style={styles.description}>\n {description}\n </Text>\n ) : description ? (\n <View style={styles.descriptionSlot}>{description}</View>\n ) : null}\n </View>\n {trailing ? <View style={styles.trailing}>{trailing}</View> : null}\n </View>\n </Pressable>\n );\n}\n\nfunction createStyles(theme: NativeTheme) {\n return StyleSheet.create({\n content: {\n alignItems: \"center\",\n flex: 1,\n flexDirection: \"row\",\n minHeight: theme.control.row,\n paddingHorizontal: theme.space.small,\n position: \"relative\",\n width: \"100%\"\n },\n copy: { flex: 1, paddingVertical: theme.space.small },\n description: {\n color: theme.color.muted,\n fontSize: theme.space.small,\n marginTop: theme.space.small / 2\n },\n descriptionSlot: { marginTop: theme.space.small / 2 },\n disabled: { opacity: 0.45 },\n leading: { marginRight: theme.space.small },\n pressed: { opacity: 0.7 },\n row: {\n borderRadius: theme.radius.small,\n minHeight: theme.control.row,\n overflow: \"hidden\"\n },\n selected: { backgroundColor: theme.color.panelRaised },\n selectedIndicator: {\n backgroundColor: theme.color.accent,\n borderRadius: theme.radius.small / 2,\n bottom: theme.radius.small,\n left: 0,\n position: \"absolute\",\n top: theme.radius.small,\n width: theme.radius.small / 2\n },\n title: {\n color: theme.color.textSecondary,\n fontSize: theme.space.medium - 2,\n fontWeight: \"600\",\n lineHeight: theme.space.medium + theme.space.small - 1\n },\n titleSelected: { color: theme.color.text },\n trailing: { marginLeft: theme.space.small }\n });\n}\n","import type { ReactNode } from \"react\";\nimport {\n KeyboardAvoidingView,\n Modal,\n Platform,\n Pressable,\n StyleSheet\n} from \"react-native\";\nimport { useNativeTheme } from \"./theme-provider\";\n\nexport interface NativeSheetProps {\n children: ReactNode;\n closeAccessibilityLabel: string;\n height?: number | `${number}%`;\n onOpenChange(open: boolean): void;\n open: boolean;\n}\n\n/**\n * Controlled sheet backed by React Native's window-level Modal.\n *\n * Callers own whether the sheet is open and what product actions its content\n * performs.\n */\nexport function NativeSheet({\n children,\n closeAccessibilityLabel,\n height,\n onOpenChange,\n open\n}: NativeSheetProps) {\n const theme = useNativeTheme();\n const styles = createStyles(theme);\n const dismiss = () => onOpenChange(false);\n\n return (\n <Modal\n animationType=\"fade\"\n onRequestClose={dismiss}\n presentationStyle=\"overFullScreen\"\n statusBarTranslucent\n transparent\n visible={open}\n >\n <KeyboardAvoidingView\n accessible={false}\n behavior={Platform.OS === \"ios\" ? \"padding\" : \"height\"}\n keyboardVerticalOffset={0}\n onAccessibilityEscape={dismiss}\n style={styles.backdrop}\n >\n <Pressable\n accessibilityLabel={closeAccessibilityLabel}\n accessibilityRole=\"button\"\n accessible\n onPress={dismiss}\n style={StyleSheet.absoluteFill}\n testID=\"native-sheet-backdrop\"\n />\n <Pressable\n accessible={false}\n onPress={() => undefined}\n style={[styles.sheet, height === undefined ? null : { height }]}\n testID=\"native-sheet-panel\"\n >\n {children}\n </Pressable>\n </KeyboardAvoidingView>\n </Modal>\n );\n}\n\nfunction createStyles(theme: ReturnType<typeof useNativeTheme>) {\n return StyleSheet.create({\n backdrop: {\n backgroundColor: theme.color.scrim,\n flex: 1,\n justifyContent: \"flex-end\"\n },\n sheet: {\n backgroundColor: theme.color.panelRaised,\n borderTopLeftRadius: theme.radius.large,\n borderTopRightRadius: theme.radius.large,\n maxHeight: \"80%\",\n overflow: \"hidden\"\n }\n });\n}\n"],"mappings":"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","names":["jsx","styles","StyleSheet","jsx","StyleSheet","Pressable","StyleSheet","Text","View","jsx","jsxs","styles","createStyles","Pressable","View","Text","StyleSheet","Pressable","StyleSheet","jsx","jsxs","styles","createStyles","Pressable","StyleSheet"]}
|
|
1
|
+
{"version":3,"sources":["../src/native/avatar.tsx","../src/native/theme-provider.tsx","../src/native/generated-tokens.ts","../src/native/tokens.ts","../src/native/button.tsx","../src/native/icon-button.tsx","../src/native/list-row.tsx","../src/native/sheet.tsx"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport {\n ActivityIndicator,\n Image,\n StyleSheet,\n Text,\n View,\n type ImageStyle,\n type StyleProp,\n type ViewStyle\n} from \"react-native\";\nimport { type NativeTheme } from \"./tokens\";\nimport { useNativeTheme } from \"./theme-provider\";\n\nexport type NativeAvatarSize = \"compact\" | \"regular\" | \"large\";\n\nexport interface NativeAvatarProps {\n initial?: string;\n label: string;\n loading?: boolean;\n size?: NativeAvatarSize;\n src?: string | null;\n style?: StyleProp<ViewStyle>;\n}\n\nfunction avatarInitial(label: string, initial?: string): string {\n const value = initial?.trim() || label.trim();\n return Array.from(value)[0]?.toLocaleUpperCase() || \"?\";\n}\n\n/** Decorative identity image with loading and broken-image fallback states. */\nexport function NativeAvatar({\n initial,\n label,\n loading = false,\n size = \"regular\",\n src,\n style\n}: NativeAvatarProps) {\n const theme = useNativeTheme();\n const styles = createStyles(theme);\n const normalizedSrc = src?.trim() ?? \"\";\n const [failedSrc, setFailedSrc] = useState(\"\");\n const [loadedSrc, setLoadedSrc] = useState(\"\");\n\n useEffect(() => {\n setFailedSrc(\"\");\n setLoadedSrc(\"\");\n }, [normalizedSrc]);\n\n const imageAvailable =\n !loading && normalizedSrc.length > 0 && failedSrc !== normalizedSrc;\n const imageLoaded = imageAvailable && loadedSrc === normalizedSrc;\n const dimension = avatarDimensions(theme)[size];\n const imageStyle: StyleProp<ImageStyle> = [\n styles.image,\n imageLoaded ? styles.imageVisible : styles.imageHidden\n ];\n\n return (\n <View\n accessibilityElementsHidden\n accessible={false}\n importantForAccessibility=\"no-hide-descendants\"\n style={[styles.root, dimension, style]}\n >\n {loading || imageAvailable ? (\n imageLoaded ? null : (\n <ActivityIndicator color={theme.color.muted} size=\"small\" />\n )\n ) : (\n <Text numberOfLines={1} style={styles.initial}>\n {avatarInitial(label, initial)}\n </Text>\n )}\n {imageAvailable ? (\n <Image\n onError={() => setFailedSrc(normalizedSrc)}\n onLoad={() => setLoadedSrc(normalizedSrc)}\n resizeMode=\"cover\"\n source={{ uri: normalizedSrc }}\n style={imageStyle}\n />\n ) : null}\n </View>\n );\n}\n\nfunction avatarDimensions(\n theme: NativeTheme\n): Record<NativeAvatarSize, ViewStyle> {\n return {\n compact: {\n height: theme.control.compact,\n width: theme.control.compact\n },\n large: {\n height: theme.control.row,\n width: theme.control.row\n },\n regular: {\n height: theme.control.regular,\n width: theme.control.regular\n }\n };\n}\n\nfunction createStyles(theme: NativeTheme) {\n return StyleSheet.create({\n image: {\n height: \"100%\",\n left: 0,\n position: \"absolute\",\n top: 0,\n width: \"100%\"\n },\n imageHidden: { opacity: 0 },\n imageVisible: { opacity: 1 },\n initial: {\n color: theme.color.text,\n fontSize: theme.space.medium,\n fontWeight: \"700\"\n },\n root: {\n alignItems: \"center\",\n backgroundColor: theme.color.panelRaised,\n borderColor: theme.color.border,\n borderRadius: theme.control.row / 2,\n borderWidth: StyleSheet.hairlineWidth,\n justifyContent: \"center\",\n overflow: \"hidden\"\n }\n });\n}\n","import {\n createContext,\n type PropsWithChildren,\n useContext,\n useMemo\n} from \"react\";\nimport { useColorScheme } from \"react-native\";\nimport {\n nativeTheme,\n resolveNativeTheme,\n type NativeTheme,\n type NativeThemeMode\n} from \"./tokens\";\n\nexport type NativeThemePreference = NativeThemeMode | \"system\";\n\nconst NativeThemeContext = createContext<NativeTheme>(nativeTheme);\n\nexport interface NativeThemeProviderProps extends PropsWithChildren {\n /** Defaults to the operating system preference when no product override exists. */\n mode?: NativeThemePreference;\n}\n\n/**\n * Supplies the resolved Native semantic theme to UI System primitives and\n * application composition. The provider is intentionally UI-only: product\n * settings decide which preference, if any, it receives.\n */\nexport function NativeThemeProvider({\n children,\n mode = \"system\"\n}: NativeThemeProviderProps) {\n const systemMode = useColorScheme();\n const resolvedMode =\n mode === \"system\" ? (systemMode === \"light\" ? \"light\" : \"dark\") : mode;\n const theme = useMemo(() => resolveNativeTheme(resolvedMode), [resolvedMode]);\n\n return (\n <NativeThemeContext.Provider value={theme}>\n {children}\n </NativeThemeContext.Provider>\n );\n}\n\nexport function useNativeTheme(): NativeTheme {\n return useContext(NativeThemeContext);\n}\n","/* This file is generated from ../tokens/renderer-theme.json. Do not edit it directly. */\nexport const nativeThemeDimensions = {\n control: {\n compact: 40,\n icon: 40,\n large: 52,\n regular: 48,\n row: 60\n },\n radius: {\n large: 18,\n medium: 12,\n small: 8\n },\n space: {\n large: 24,\n medium: 16,\n small: 10,\n xlarge: 32\n }\n} as const;\n\nexport const nativeThemes = {\n light: {\n accent: \"#4182f5\",\n accentPressed: \"#3975df\",\n background: \"#f7f8fa\",\n backgroundFronted: \"#ffffff\",\n backgroundPanel: \"#f8fafc\",\n border: \"#e5e7eb\",\n danger: \"#dc2626\",\n foreground: \"#29313d\",\n muted: \"#6b7280\",\n panel: \"#f8f8fa\",\n scrim: \"rgba(0, 0, 0, 0.6)\",\n scrimStrong: \"rgba(0, 0, 0, 0.64)\",\n success: \"#22c55e\",\n textPrimary: \"#3c3c3c\",\n textSecondary: \"#6c6c6c\"\n },\n dark: {\n accent: \"#5a9bff\",\n accentPressed: \"#4f8fff\",\n background: \"#111216\",\n backgroundFronted: \"#22252d\",\n backgroundPanel: \"#1a1c22\",\n border: \"#30333b\",\n danger: \"#ff716c\",\n foreground: \"#f6f6f7\",\n muted: \"#9398a5\",\n panel: \"#1a1c22\",\n scrim: \"rgba(0, 0, 0, 0.6)\",\n scrimStrong: \"rgba(0, 0, 0, 0.64)\",\n success: \"#62d49f\",\n textPrimary: \"#f6f6f7\",\n textSecondary: \"#c3c6ce\"\n }\n} as const;\n\nexport type NativeThemeMode = keyof typeof nativeThemes;\nexport type NativeThemePalette = (typeof nativeThemes)[NativeThemeMode];\n","import {\n nativeThemeDimensions,\n nativeThemes,\n type NativeThemeMode,\n type NativeThemePalette\n} from \"./generated-tokens\";\n\nexport { nativeThemeDimensions, nativeThemes };\nexport type { NativeThemeMode, NativeThemePalette };\n\n/**\n * Resolves a renderer-neutral semantic theme for React Native.\n */\nexport function resolveNativeTheme(mode: NativeThemeMode) {\n const palette = nativeThemes[mode];\n\n return {\n control: nativeThemeDimensions.control,\n color: {\n accent: palette.accent,\n accentPressed: palette.accentPressed,\n background: palette.background,\n border: palette.border,\n danger: palette.danger,\n muted: palette.muted,\n panel: palette.panel,\n panelRaised: palette.backgroundFronted,\n scrim: palette.scrim,\n scrimStrong: palette.scrimStrong,\n success: palette.success,\n text: palette.textPrimary,\n textSecondary: palette.textSecondary\n },\n mode,\n radius: nativeThemeDimensions.radius,\n space: nativeThemeDimensions.space\n } as const;\n}\n\n/**\n * Backwards-compatible dark Native theme.\n *\n * New components should consume the context-backed `useNativeTheme` hook so\n * they respond to the Native renderer's configured color scheme.\n */\nexport const nativeTheme = resolveNativeTheme(\"dark\");\n\nexport type NativeTheme = typeof nativeTheme;\n","import { type ReactNode, useState } from \"react\";\nimport {\n ActivityIndicator,\n type GestureResponderEvent,\n Pressable,\n StyleSheet,\n Text,\n View,\n type StyleProp,\n type ViewStyle\n} from \"react-native\";\nimport { type NativeTheme } from \"./tokens\";\nimport { useNativeTheme } from \"./theme-provider\";\n\nexport type ButtonVariant =\n | \"primary\"\n | \"secondary\"\n | \"destructive\"\n | \"destructiveGhost\"\n | \"ghost\";\n\nexport type ButtonSize = \"regular\" | \"large\" | \"compact\" | \"icon\";\n\nexport interface NativeButtonProps {\n accessibilityLabel?: string;\n disabled?: boolean;\n label: string;\n leading?: ReactNode;\n loading?: boolean;\n onPress(event: GestureResponderEvent): void;\n size?: ButtonSize;\n style?: StyleProp<ViewStyle>;\n testID?: string;\n variant?: ButtonVariant;\n}\n\n/**\n * Native counterpart of the UI System Button contract.\n *\n * Its interaction hierarchy is adapted from React Native Reusables' Button,\n * while the styling is deliberately token-backed and platform-native.\n */\nexport function NativeButton({\n accessibilityLabel,\n disabled = false,\n label,\n leading,\n loading = false,\n onPress,\n size = \"regular\",\n style,\n testID,\n variant = \"primary\"\n}: NativeButtonProps) {\n const theme = useNativeTheme();\n const styles = createStyles(theme);\n const [pressed, setPressed] = useState(false);\n const unavailable = disabled || loading;\n const foreground = textColorByVariant(theme)[variant];\n const hasLabel = label.trim().length > 0;\n\n return (\n <Pressable\n accessibilityLabel={accessibilityLabel ?? label}\n accessibilityRole=\"button\"\n accessibilityState={{ busy: loading, disabled: unavailable }}\n disabled={unavailable}\n onPress={onPress}\n onPressIn={() => setPressed(true)}\n onPressOut={() => setPressed(false)}\n style={[\n styles.button,\n styles[size],\n variantStyles(theme)[variant],\n pressed && !unavailable ? styles.pressed : undefined,\n unavailable ? styles.disabled : undefined,\n style\n ]}\n testID={testID}\n >\n <View style={styles.content}>\n {loading ? (\n <ActivityIndicator color={foreground} size=\"small\" />\n ) : (\n <>\n {leading ? (\n <View style={[styles.leading, !hasLabel && styles.leadingOnly]}>\n {leading}\n </View>\n ) : null}\n {hasLabel ? (\n <Text\n numberOfLines={1}\n style={[styles.label, { color: foreground }]}\n >\n {label}\n </Text>\n ) : null}\n </>\n )}\n </View>\n </Pressable>\n );\n}\n\nfunction textColorByVariant(theme: NativeTheme): Record<ButtonVariant, string> {\n return {\n primary: theme.color.background,\n secondary: theme.color.text,\n destructive: theme.color.background,\n destructiveGhost: theme.color.danger,\n ghost: theme.color.text\n };\n}\n\nfunction variantStyles(theme: NativeTheme): Record<ButtonVariant, ViewStyle> {\n return {\n primary: { backgroundColor: theme.color.accent },\n secondary: {\n backgroundColor: theme.color.panelRaised,\n borderColor: theme.color.border,\n borderWidth: StyleSheet.hairlineWidth\n },\n destructive: { backgroundColor: theme.color.danger },\n destructiveGhost: { backgroundColor: \"transparent\" },\n ghost: { backgroundColor: \"transparent\" }\n };\n}\n\nfunction createStyles(theme: NativeTheme) {\n return StyleSheet.create({\n button: {\n alignItems: \"center\",\n borderRadius: theme.radius.medium,\n justifyContent: \"center\"\n },\n compact: {\n minHeight: theme.control.compact,\n paddingHorizontal: theme.space.small\n },\n content: {\n alignItems: \"center\",\n flexDirection: \"row\",\n justifyContent: \"center\"\n },\n disabled: { opacity: 0.45 },\n icon: {\n height: theme.control.icon,\n paddingHorizontal: 0,\n width: theme.control.icon\n },\n label: { fontSize: theme.space.medium, fontWeight: \"700\" },\n large: {\n minHeight: theme.control.large,\n paddingHorizontal: theme.space.medium\n },\n leading: { marginRight: theme.space.small },\n leadingOnly: { marginRight: 0 },\n pressed: { opacity: 0.82 },\n regular: {\n minHeight: theme.control.regular,\n paddingHorizontal: theme.space.medium\n }\n });\n}\n","import type { ReactNode } from \"react\";\nimport {\n StyleSheet,\n type GestureResponderEvent,\n type StyleProp,\n type ViewStyle\n} from \"react-native\";\nimport { NativeButton, type ButtonSize, type ButtonVariant } from \"./button\";\n\nexport interface NativeIconButtonProps {\n accessibilityLabel: string;\n disabled?: boolean;\n icon: ReactNode;\n onPress(event: GestureResponderEvent): void;\n size?: Extract<ButtonSize, \"compact\" | \"icon\">;\n style?: StyleProp<ViewStyle>;\n testID?: string;\n variant?: ButtonVariant;\n}\n\nexport function NativeIconButton({\n accessibilityLabel,\n disabled = false,\n icon,\n onPress,\n size = \"icon\",\n style,\n testID,\n variant = \"ghost\"\n}: NativeIconButtonProps) {\n return (\n <NativeButton\n accessibilityLabel={accessibilityLabel}\n disabled={disabled}\n label=\"\"\n leading={icon}\n onPress={onPress}\n size={size}\n style={[styles.button, style]}\n testID={testID}\n variant={variant}\n />\n );\n}\n\nconst styles = StyleSheet.create({\n button: { paddingHorizontal: 0 }\n});\n","import type { ReactNode } from \"react\";\nimport {\n Pressable,\n StyleSheet,\n Text,\n View,\n type StyleProp,\n type ViewStyle\n} from \"react-native\";\nimport { type NativeTheme } from \"./tokens\";\nimport { useNativeTheme } from \"./theme-provider\";\n\nexport interface NativeListRowProps {\n accessibilityLabel?: string;\n description?: ReactNode;\n disabled?: boolean;\n leading?: ReactNode;\n onPress?(): void;\n selected?: boolean;\n style?: StyleProp<ViewStyle>;\n title: string;\n trailing?: ReactNode;\n}\n\nexport function NativeListRow({\n accessibilityLabel,\n description,\n disabled = false,\n leading,\n onPress,\n selected = false,\n style,\n title,\n trailing\n}: NativeListRowProps) {\n const theme = useNativeTheme();\n const styles = createStyles(theme);\n const interactive = onPress !== undefined;\n\n return (\n <Pressable\n accessibilityLabel={accessibilityLabel ?? title}\n accessibilityRole={interactive ? \"button\" : undefined}\n accessibilityState={{ disabled, selected }}\n disabled={!interactive || disabled}\n onPress={onPress}\n style={({ pressed }) => [\n styles.row,\n selected ? styles.selected : undefined,\n pressed && interactive && !disabled ? styles.pressed : undefined,\n disabled ? styles.disabled : undefined,\n style\n ]}\n >\n <View style={styles.content}>\n {selected ? <View style={styles.selectedIndicator} /> : null}\n {leading ? <View style={styles.leading}>{leading}</View> : null}\n <View style={styles.copy}>\n <Text\n numberOfLines={2}\n style={[styles.title, selected ? styles.titleSelected : undefined]}\n >\n {title}\n </Text>\n {typeof description === \"string\" ? (\n <Text numberOfLines={1} style={styles.description}>\n {description}\n </Text>\n ) : description ? (\n <View style={styles.descriptionSlot}>{description}</View>\n ) : null}\n </View>\n {trailing ? <View style={styles.trailing}>{trailing}</View> : null}\n </View>\n </Pressable>\n );\n}\n\nfunction createStyles(theme: NativeTheme) {\n return StyleSheet.create({\n content: {\n alignItems: \"center\",\n flex: 1,\n flexDirection: \"row\",\n minHeight: theme.control.row,\n paddingHorizontal: theme.space.small,\n position: \"relative\",\n width: \"100%\"\n },\n copy: { flex: 1, paddingVertical: theme.space.small },\n description: {\n color: theme.color.muted,\n fontSize: theme.space.small,\n marginTop: theme.space.small / 2\n },\n descriptionSlot: { marginTop: theme.space.small / 2 },\n disabled: { opacity: 0.45 },\n leading: { marginRight: theme.space.small },\n pressed: { opacity: 0.7 },\n row: {\n borderRadius: theme.radius.small,\n minHeight: theme.control.row,\n overflow: \"hidden\"\n },\n selected: { backgroundColor: theme.color.panelRaised },\n selectedIndicator: {\n backgroundColor: theme.color.accent,\n borderRadius: theme.radius.small / 2,\n bottom: theme.radius.small,\n left: 0,\n position: \"absolute\",\n top: theme.radius.small,\n width: theme.radius.small / 2\n },\n title: {\n color: theme.color.textSecondary,\n fontSize: theme.space.medium - 2,\n fontWeight: \"600\",\n lineHeight: theme.space.medium + theme.space.small - 1\n },\n titleSelected: { color: theme.color.text },\n trailing: { marginLeft: theme.space.small }\n });\n}\n","import type { ReactNode } from \"react\";\nimport {\n KeyboardAvoidingView,\n Modal,\n Platform,\n Pressable,\n StyleSheet\n} from \"react-native\";\nimport { useNativeTheme } from \"./theme-provider\";\n\nexport interface NativeSheetProps {\n children: ReactNode;\n closeAccessibilityLabel: string;\n height?: number | `${number}%`;\n onOpenChange(open: boolean): void;\n open: boolean;\n}\n\n/**\n * Controlled sheet backed by React Native's window-level Modal.\n *\n * Callers own whether the sheet is open and what product actions its content\n * performs.\n */\nexport function NativeSheet({\n children,\n closeAccessibilityLabel,\n height,\n onOpenChange,\n open\n}: NativeSheetProps) {\n const theme = useNativeTheme();\n const styles = createStyles(theme);\n const dismiss = () => onOpenChange(false);\n\n return (\n <Modal\n animationType=\"fade\"\n onRequestClose={dismiss}\n presentationStyle=\"overFullScreen\"\n statusBarTranslucent\n transparent\n visible={open}\n >\n <KeyboardAvoidingView\n accessible={false}\n behavior={Platform.OS === \"ios\" ? \"padding\" : \"height\"}\n keyboardVerticalOffset={0}\n onAccessibilityEscape={dismiss}\n style={styles.backdrop}\n >\n <Pressable\n accessibilityLabel={closeAccessibilityLabel}\n accessibilityRole=\"button\"\n accessible\n onPress={dismiss}\n style={StyleSheet.absoluteFill}\n testID=\"native-sheet-backdrop\"\n />\n <Pressable\n accessible={false}\n onPress={() => undefined}\n style={[styles.sheet, height === undefined ? null : { height }]}\n testID=\"native-sheet-panel\"\n >\n {children}\n </Pressable>\n </KeyboardAvoidingView>\n </Modal>\n );\n}\n\nfunction createStyles(theme: ReturnType<typeof useNativeTheme>) {\n return StyleSheet.create({\n backdrop: {\n backgroundColor: theme.color.scrim,\n flex: 1,\n justifyContent: \"flex-end\"\n },\n sheet: {\n backgroundColor: theme.color.panelRaised,\n borderTopLeftRadius: theme.radius.large,\n borderTopRightRadius: theme.radius.large,\n maxHeight: \"80%\",\n overflow: \"hidden\"\n }\n });\n}\n"],"mappings":"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","names":["jsx","styles","useState","ActivityIndicator","StyleSheet","Text","View","jsx","jsxs","styles","createStyles","useState","View","ActivityIndicator","Text","StyleSheet","StyleSheet","jsx","StyleSheet","Pressable","StyleSheet","Text","View","jsx","jsxs","styles","createStyles","Pressable","View","Text","StyleSheet","Pressable","StyleSheet","jsx","jsxs","styles","createStyles","Pressable","StyleSheet"]}
|
package/package.json
CHANGED
package/ui-system.md
CHANGED
|
@@ -69,6 +69,11 @@ defaults still use semantic tokens. Initial fallback content appears only when
|
|
|
69
69
|
both the delivered image and its original fallback are unavailable, never
|
|
70
70
|
while a valid image URL is still loading.
|
|
71
71
|
|
|
72
|
+
`NativeAvatar` is the React Native counterpart for the same identity-image
|
|
73
|
+
contract. It uses Native semantic tokens and finite control-backed sizes, keeps
|
|
74
|
+
the image decorative, shows loading feedback while a valid source is pending,
|
|
75
|
+
and falls back to the caller's stable label when the source is absent or fails.
|
|
76
|
+
|
|
72
77
|
## Current Package Role
|
|
73
78
|
|
|
74
79
|
`@tutti-os/ui-system` is the single source of truth for:
|