@bubbasfw/ui 0.0.0-stage → 0.2.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.
@@ -0,0 +1,376 @@
1
+ import * as react from 'react';
2
+ import { ReactNode, SyntheticEvent } from 'react';
3
+ import * as react_native from 'react-native';
4
+ import { PressableProps, TextProps as TextProps$1, Text as Text$1, ViewProps, View, ImageSourcePropType, TextInputProps, TextInput, GestureResponderEvent } from 'react-native';
5
+ import * as react_jsx_runtime from 'react/jsx-runtime';
6
+ import { tokens } from './tokens.js';
7
+ export { BubbaTokens } from './tokens.js';
8
+
9
+ type ButtonVariant = 'primary' | 'secondary' | 'outline' | 'ghost';
10
+ type ButtonSize = 'sm' | 'md' | 'lg';
11
+ interface ButtonProps extends Omit<PressableProps, 'children' | 'className'> {
12
+ /** Text content, or inline React Native Text content. */
13
+ children: ReactNode;
14
+ variant?: ButtonVariant;
15
+ size?: ButtonSize;
16
+ loading?: boolean;
17
+ loadingLabel?: string;
18
+ className?: string;
19
+ textClassName?: string;
20
+ }
21
+ /** One native Pressable and Text implementation on iOS, Android, and web. */
22
+ declare const Button: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<react_native.View>>;
23
+
24
+ type TextTone = 'default' | 'muted' | 'info' | 'success' | 'warning' | 'error';
25
+ type TextVariant = 'body' | 'lead' | 'small' | 'label' | 'caption' | 'code';
26
+ interface TextProps extends TextProps$1 {
27
+ tone?: TextTone;
28
+ variant?: TextVariant;
29
+ className?: string;
30
+ }
31
+ declare const Text: react.ForwardRefExoticComponent<TextProps & react.RefAttributes<Text$1>>;
32
+ interface HeadingProps extends TextProps$1 {
33
+ level?: 1 | 2 | 3 | 4 | 5 | 6;
34
+ className?: string;
35
+ }
36
+ declare const Heading: react.ForwardRefExoticComponent<HeadingProps & react.RefAttributes<Text$1>>;
37
+
38
+ declare const gaps: {
39
+ 0: string;
40
+ 1: string;
41
+ 2: string;
42
+ 3: string;
43
+ 4: string;
44
+ 6: string;
45
+ 8: string;
46
+ 12: string;
47
+ 16: string;
48
+ };
49
+ declare const alignments: {
50
+ start: string;
51
+ center: string;
52
+ end: string;
53
+ stretch: string;
54
+ };
55
+ declare const justifications: {
56
+ start: string;
57
+ center: string;
58
+ end: string;
59
+ between: string;
60
+ };
61
+ interface StackProps extends ViewProps {
62
+ gap?: keyof typeof gaps;
63
+ align?: keyof typeof alignments;
64
+ justify?: keyof typeof justifications;
65
+ className?: string;
66
+ }
67
+ declare const Stack: react.ForwardRefExoticComponent<StackProps & react.RefAttributes<View>>;
68
+ interface InlineProps extends StackProps {
69
+ wrap?: boolean;
70
+ }
71
+ declare const Inline: react.ForwardRefExoticComponent<InlineProps & react.RefAttributes<View>>;
72
+ interface ContainerProps extends ViewProps {
73
+ reading?: boolean;
74
+ className?: string;
75
+ }
76
+ declare const Container: react.ForwardRefExoticComponent<ContainerProps & react.RefAttributes<View>>;
77
+ interface CardProps extends ViewProps {
78
+ className?: string;
79
+ padding?: keyof typeof gaps;
80
+ }
81
+ declare const Card: react.ForwardRefExoticComponent<CardProps & react.RefAttributes<View>>;
82
+ interface DividerProps extends ViewProps {
83
+ orientation?: 'horizontal' | 'vertical';
84
+ className?: string;
85
+ }
86
+ declare function Divider({ orientation, className, ...props }: DividerProps): react_jsx_runtime.JSX.Element;
87
+
88
+ interface IconButtonProps extends Omit<PressableProps, 'children' | 'accessibilityLabel'> {
89
+ accessibilityLabel: string;
90
+ children: ReactNode;
91
+ variant?: 'primary' | 'outline' | 'ghost';
92
+ className?: string;
93
+ }
94
+ declare const IconButton: react.ForwardRefExoticComponent<IconButtonProps & react.RefAttributes<react_native.View>>;
95
+ interface LinkProps extends Omit<PressableProps, 'children'> {
96
+ href: string;
97
+ children: ReactNode;
98
+ external?: boolean;
99
+ className?: string;
100
+ textClassName?: string;
101
+ /** Called when the operating system cannot open a native URL. */
102
+ onOpenError?: (error: unknown) => void;
103
+ }
104
+ declare const Link: react.ForwardRefExoticComponent<LinkProps & react.RefAttributes<react_native.View>>;
105
+
106
+ type StatusTone = 'neutral' | 'info' | 'success' | 'warning' | 'error';
107
+ interface BadgeProps extends ViewProps {
108
+ children: ReactNode;
109
+ tone?: StatusTone;
110
+ className?: string;
111
+ textClassName?: string;
112
+ }
113
+ declare function Badge({ children, tone, className, textClassName, ...props }: BadgeProps): react_jsx_runtime.JSX.Element;
114
+ interface AvatarProps extends ViewProps {
115
+ source?: ImageSourcePropType;
116
+ name: string;
117
+ size?: 'sm' | 'md' | 'lg';
118
+ className?: string;
119
+ }
120
+ declare function Avatar({ source, name, size, className, ...props }: AvatarProps): react_jsx_runtime.JSX.Element;
121
+ interface EmptyStateProps extends ViewProps {
122
+ title: string;
123
+ description?: string;
124
+ children?: ReactNode;
125
+ className?: string;
126
+ }
127
+ declare function EmptyState({ title, description, children, className, ...props }: EmptyStateProps): react_jsx_runtime.JSX.Element;
128
+ interface ListItemProps extends Omit<ViewProps, 'children'> {
129
+ title: string;
130
+ description?: string;
131
+ leading?: ReactNode;
132
+ trailing?: ReactNode;
133
+ className?: string;
134
+ onPress?: PressableProps['onPress'];
135
+ disabled?: boolean;
136
+ }
137
+ declare const ListItem: react.ForwardRefExoticComponent<ListItemProps & react.RefAttributes<View>>;
138
+
139
+ interface AccordionItem {
140
+ value: string;
141
+ title: string;
142
+ content: ReactNode;
143
+ disabled?: boolean;
144
+ }
145
+ interface AccordionProps extends ViewProps {
146
+ items: AccordionItem[];
147
+ value?: string;
148
+ defaultValue?: string;
149
+ onValueChange?: (value: string) => void;
150
+ className?: string;
151
+ }
152
+ /** Single-open disclosure. An empty value collapses every section. */
153
+ declare function Accordion({ items, value, defaultValue, onValueChange, className, ...props }: AccordionProps): react_jsx_runtime.JSX.Element;
154
+
155
+ interface DialogProps extends Omit<ViewProps, 'children'> {
156
+ open?: boolean;
157
+ defaultOpen?: boolean;
158
+ onOpenChange?: (open: boolean) => void;
159
+ title: string;
160
+ description?: string;
161
+ children: ReactNode;
162
+ closeLabel?: string;
163
+ dismissOnBackdropPress?: boolean;
164
+ className?: string;
165
+ contentClassName?: string;
166
+ }
167
+ /** Controlled or initially open modal dialog; supplies no hidden trigger. */
168
+ declare function Dialog(props: DialogProps): react_jsx_runtime.JSX.Element;
169
+ type SheetProps = DialogProps;
170
+ /** Bottom-aligned, scrollable modal sheet with the same dismissal contract. */
171
+ declare function Sheet(props: SheetProps): react_jsx_runtime.JSX.Element;
172
+
173
+ interface AlertProps extends ViewProps {
174
+ title: string;
175
+ description?: string;
176
+ children?: ReactNode;
177
+ tone?: StatusTone;
178
+ announce?: 'off' | 'polite' | 'assertive';
179
+ className?: string;
180
+ }
181
+ declare function Alert({ title, description, children, tone, announce, className, ...props }: AlertProps): react_jsx_runtime.JSX.Element;
182
+ interface ToastProps extends Omit<AlertProps, 'announce'> {
183
+ open?: boolean;
184
+ defaultOpen?: boolean;
185
+ onOpenChange?: (open: boolean) => void;
186
+ /** Zero keeps the notification until explicitly dismissed. */
187
+ duration?: number;
188
+ dismissLabel?: string;
189
+ }
190
+ /** Nonmodal inline notification. The consumer chooses its location. */
191
+ declare function Toast({ open, defaultOpen, onOpenChange, duration, dismissLabel, className, children, ...props }: ToastProps): react_jsx_runtime.JSX.Element | null;
192
+ interface SpinnerProps extends ViewProps {
193
+ label?: string;
194
+ size?: 'small' | 'large';
195
+ className?: string;
196
+ }
197
+ declare function Spinner({ label, size, className, ...props }: SpinnerProps): react_jsx_runtime.JSX.Element;
198
+ interface ProgressProps extends ViewProps {
199
+ value: number;
200
+ max?: number;
201
+ label: string;
202
+ className?: string;
203
+ indicatorClassName?: string;
204
+ }
205
+ declare function Progress({ value, max, label, className, indicatorClassName, ...props }: ProgressProps): react_jsx_runtime.JSX.Element;
206
+ interface SkeletonProps extends ViewProps {
207
+ className?: string;
208
+ }
209
+ /** Static placeholder; avoids forcing motion on either platform. */
210
+ declare function Skeleton({ className, ...props }: SkeletonProps): react_jsx_runtime.JSX.Element;
211
+
212
+ interface BreadcrumbItem {
213
+ label: string;
214
+ href?: string;
215
+ }
216
+ interface BreadcrumbsProps extends ViewProps {
217
+ items: BreadcrumbItem[];
218
+ label?: string;
219
+ className?: string;
220
+ }
221
+ declare function Breadcrumbs({ items, label, className, ...props }: BreadcrumbsProps): react_jsx_runtime.JSX.Element;
222
+ interface PaginationProps extends ViewProps {
223
+ page: number;
224
+ count: number;
225
+ onPageChange: (page: number) => void;
226
+ label?: string;
227
+ className?: string;
228
+ }
229
+ declare function Pagination({ page, count, onPageChange, label, className, ...props }: PaginationProps): react_jsx_runtime.JSX.Element;
230
+
231
+ type Appearance = 'light' | 'dark' | 'system';
232
+ type ResolvedAppearance = 'light' | 'dark';
233
+ type ThemeColor = Exclude<keyof typeof tokens.themes.light, `shadow-${string}`>;
234
+ type ThemeColors = {
235
+ [Key in ThemeColor]: string;
236
+ };
237
+ declare function themeVariables(appearance: ResolvedAppearance): Record<string, string>;
238
+ interface ThemeProviderProps extends ViewProps {
239
+ children: ReactNode;
240
+ appearance?: Appearance;
241
+ className?: string;
242
+ }
243
+ /** Scoped variables support nested themes without changing global appearance. */
244
+ declare function ThemeProvider({ appearance, children, className, style, ...props }: ThemeProviderProps): react_jsx_runtime.JSX.Element;
245
+ declare function useTheme(): {
246
+ appearance: Appearance;
247
+ resolvedAppearance: ResolvedAppearance;
248
+ colors: ThemeColors;
249
+ variables: Record<string, string>;
250
+ };
251
+
252
+ interface FormFieldProps extends ViewProps {
253
+ label: string;
254
+ hint?: string;
255
+ error?: string;
256
+ required?: boolean;
257
+ disabled?: boolean;
258
+ /** Opt into announcing errors that change during interaction. */
259
+ announceError?: boolean;
260
+ children: ReactNode;
261
+ className?: string;
262
+ labelClassName?: string;
263
+ }
264
+ /** Associates a visible label, hint, and error with the enclosed form control. */
265
+ declare const FormField: react.ForwardRefExoticComponent<FormFieldProps & react.RefAttributes<View>>;
266
+
267
+ interface InputProps extends TextInputProps {
268
+ disabled?: boolean;
269
+ invalid?: boolean;
270
+ required?: boolean;
271
+ className?: string;
272
+ }
273
+ /** Native TextInput with field association and matching light/dark paint. */
274
+ declare const Input: react.ForwardRefExoticComponent<InputProps & react.RefAttributes<TextInput>>;
275
+ interface TextareaProps extends InputProps {
276
+ }
277
+ /** A multiline Input; numberOfLines and style/minHeight remain native props. */
278
+ declare const Textarea: react.ForwardRefExoticComponent<TextareaProps & react.RefAttributes<TextInput>>;
279
+
280
+ /** RNW's Enter activation forwards a raw DOM keyup, without React event methods. */
281
+ interface ChoiceDOMKeyboardEvent {
282
+ readonly key: string;
283
+ readonly code: string;
284
+ readonly repeat: boolean;
285
+ readonly type: string;
286
+ readonly defaultPrevented: boolean;
287
+ readonly target: unknown;
288
+ readonly currentTarget: unknown;
289
+ preventDefault(): void;
290
+ stopPropagation(): void;
291
+ }
292
+ type ChoicePressEvent = GestureResponderEvent | SyntheticEvent<unknown, unknown> | ChoiceDOMKeyboardEvent;
293
+ interface ChoiceProps extends Omit<PressableProps, 'children' | 'onPress'> {
294
+ checked?: boolean;
295
+ defaultChecked?: boolean;
296
+ onCheckedChange?: (checked: boolean) => void;
297
+ /** Web supplies React keyboard events for Space and raw DOM keyup for Enter. */
298
+ onPress?: ((event: ChoicePressEvent) => void) | null;
299
+ label?: string;
300
+ description?: string;
301
+ invalid?: boolean;
302
+ required?: boolean;
303
+ className?: string;
304
+ textClassName?: string;
305
+ }
306
+ interface CheckboxProps extends ChoiceProps {
307
+ /** A mixed checkbox becomes checked on its next activation. */
308
+ indeterminate?: boolean;
309
+ }
310
+ interface SwitchProps extends ChoiceProps {
311
+ }
312
+ declare const Checkbox: react.ForwardRefExoticComponent<CheckboxProps & react.RefAttributes<View>>;
313
+ declare const Switch: react.ForwardRefExoticComponent<SwitchProps & react.RefAttributes<View>>;
314
+
315
+ interface RadioOption {
316
+ value: string;
317
+ label: string;
318
+ description?: string;
319
+ disabled?: boolean;
320
+ }
321
+ interface RadioGroupProps extends Omit<ViewProps, 'children'> {
322
+ options: readonly RadioOption[];
323
+ value?: string;
324
+ defaultValue?: string;
325
+ onValueChange?: (value: string) => void;
326
+ label?: string;
327
+ disabled?: boolean;
328
+ required?: boolean;
329
+ invalid?: boolean;
330
+ orientation?: 'horizontal' | 'vertical';
331
+ className?: string;
332
+ optionClassName?: string;
333
+ textClassName?: string;
334
+ }
335
+ /** Single selection with roving web focus and native radio accessibility. */
336
+ declare const RadioGroup: react.ForwardRefExoticComponent<RadioGroupProps & react.RefAttributes<View>>;
337
+
338
+ type SelectOption = RadioOption;
339
+ interface SelectProps extends Omit<PressableProps, 'children'> {
340
+ options: readonly SelectOption[];
341
+ value?: string;
342
+ defaultValue?: string;
343
+ onValueChange?: (value: string) => void;
344
+ label?: string;
345
+ placeholder?: string;
346
+ required?: boolean;
347
+ invalid?: boolean;
348
+ className?: string;
349
+ textClassName?: string;
350
+ }
351
+ /** A labelled button opens a single-choice dialog on web and native. */
352
+ declare const Select: react.ForwardRefExoticComponent<SelectProps & react.RefAttributes<View>>;
353
+
354
+ interface TabItem {
355
+ value: string;
356
+ label: string;
357
+ content: ReactNode;
358
+ disabled?: boolean;
359
+ }
360
+ interface TabsProps extends Omit<ViewProps, 'children'> {
361
+ items: readonly TabItem[];
362
+ value?: string;
363
+ defaultValue?: string;
364
+ onValueChange?: (value: string) => void;
365
+ label?: string;
366
+ orientation?: 'horizontal' | 'vertical';
367
+ className?: string;
368
+ tabListClassName?: string;
369
+ tabClassName?: string;
370
+ textClassName?: string;
371
+ panelClassName?: string;
372
+ }
373
+ /** Automatically activates tabs with arrow keys; inactive panels are unmounted. */
374
+ declare const Tabs: react.ForwardRefExoticComponent<TabsProps & react.RefAttributes<View>>;
375
+
376
+ export { Accordion, type AccordionItem, type AccordionProps, Alert, type AlertProps, type Appearance, Avatar, type AvatarProps, Badge, type BadgeProps, type BreadcrumbItem, Breadcrumbs, type BreadcrumbsProps, Button, type ButtonProps, type ButtonSize, type ButtonVariant, Card, type CardProps, Checkbox, type CheckboxProps, type ChoiceDOMKeyboardEvent, type ChoicePressEvent, type ChoiceProps, Container, type ContainerProps, Dialog, type DialogProps, Divider, type DividerProps, EmptyState, type EmptyStateProps, FormField, type FormFieldProps, Heading, type HeadingProps, IconButton, type IconButtonProps, Inline, type InlineProps, Input, type InputProps, Link, type LinkProps, ListItem, type ListItemProps, Pagination, type PaginationProps, Progress, type ProgressProps, RadioGroup, type RadioGroupProps, type RadioOption, type ResolvedAppearance, Select, type SelectOption, type SelectProps, Sheet, type SheetProps, Skeleton, type SkeletonProps, Spinner, type SpinnerProps, Stack, type StackProps, type StatusTone, Switch, type SwitchProps, type TabItem, Tabs, type TabsProps, Text, type TextProps, type TextTone, type TextVariant, Textarea, type TextareaProps, type ThemeColor, type ThemeColors, ThemeProvider, type ThemeProviderProps, Toast, type ToastProps, themeVariables, tokens, useTheme };