@tastic/hud 0.3.0 → 0.4.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.
Files changed (10) hide show
  1. package/dist/index.d.mts +60 -17
  2. package/dist/index.d.ts +60 -17
  3. package/dist/index.js +408 -180
  4. package/dist/index.mjs +362 -139
  5. package/package.json +1 -1
  6. package/src/AchievementRow.tsx +124 -0
  7. package/src/BaseStatsScreen.tsx +158 -0
  8. package/src/StatRow.tsx +44 -0
  9. package/src/StatSection.tsx +40 -0
  10. package/src/index.ts +4 -0
package/dist/index.d.mts CHANGED
@@ -3,6 +3,19 @@ import { ReactNode, RefObject } from 'react';
3
3
  import { SeedColor } from '@rific/auto-paper';
4
4
  import { View, StyleProp, ViewStyle } from 'react-native';
5
5
 
6
+ declare const LOCKED_BADGE_COLOR = "rgba(128,128,128,0.3)";
7
+ interface Props$b {
8
+ icon: string;
9
+ title: string;
10
+ description: string;
11
+ badgeColor: string;
12
+ unlockedLabel?: string;
13
+ checkColor?: string;
14
+ progress?: number;
15
+ deviceMarker?: boolean;
16
+ }
17
+ declare function AchievementRow({ icon, title, description, badgeColor, unlockedLabel, checkColor, progress, deviceMarker }: Props$b): react.JSX.Element;
18
+
6
19
  interface BaseSettingsDialogProps {
7
20
  visible: boolean;
8
21
  onDismiss: () => void;
@@ -21,7 +34,25 @@ interface BaseSettingsDialogProps {
21
34
  }
22
35
  declare function BaseSettingsDialog({ visible, onDismiss, rotation, version, lockOrientation, onLockOrientationChange, deferBottomEdgeGestures, onDeferBottomEdgeGestures, hideSound, hideHaptics, hideAppearance, hideUpdateCheck, onUpdateError, children }: BaseSettingsDialogProps): react.JSX.Element;
23
36
 
24
- interface Props$7 {
37
+ interface Props$a {
38
+ rotation?: number;
39
+ title?: string;
40
+ onBack: () => void;
41
+ insets: {
42
+ top: number;
43
+ left: number;
44
+ bottom: number;
45
+ right: number;
46
+ };
47
+ onReset?: () => void;
48
+ resetLabel?: string;
49
+ resetConfirmTitle?: string;
50
+ resetConfirmBody?: string;
51
+ children: ReactNode;
52
+ }
53
+ declare function BaseStatsScreen({ rotation, title, onBack, insets, onReset, resetLabel, resetConfirmTitle, resetConfirmBody, children }: Props$a): react.JSX.Element;
54
+
55
+ interface Props$9 {
25
56
  onBack: () => void;
26
57
  onSettings: () => void;
27
58
  fg: string;
@@ -31,7 +62,7 @@ interface Props$7 {
31
62
  right: number;
32
63
  };
33
64
  }
34
- declare function CornerActionButtons({ onBack, onSettings, fg, insets }: Props$7): react.JSX.Element;
65
+ declare function CornerActionButtons({ onBack, onSettings, fg, insets }: Props$9): react.JSX.Element;
35
66
 
36
67
  declare const MONO_FONT: string;
37
68
 
@@ -42,7 +73,7 @@ interface PopoverHost {
42
73
  }
43
74
  declare function usePopoverHost(): PopoverHost;
44
75
 
45
- interface Props$6 {
76
+ interface Props$8 {
46
77
  id: string;
47
78
  host: PopoverHost;
48
79
  value: string;
@@ -59,7 +90,7 @@ interface Props$6 {
59
90
  columns?: number;
60
91
  size?: number;
61
92
  }
62
- declare function InlineColorPicker({ id, host, value, onChange, swatches, takenValue, allowSwapTaken, dark, align: alignOverride, icon, tag, labelFontFamily, autoDismiss, columns, size }: Props$6): react.JSX.Element;
93
+ declare function InlineColorPicker({ id, host, value, onChange, swatches, takenValue, allowSwapTaken, dark, align: alignOverride, icon, tag, labelFontFamily, autoDismiss, columns, size }: Props$8): react.JSX.Element;
63
94
 
64
95
  type PopoverAlign = 'left' | 'right' | 'center';
65
96
  type PopoverVerticalAlign = 'below' | 'above';
@@ -85,7 +116,7 @@ interface AlignResult {
85
116
  measured: boolean;
86
117
  triggerRef: RefObject<View | null>;
87
118
  }
88
- interface Props$5<T extends string> {
119
+ interface Props$7<T extends string> {
89
120
  id: string;
90
121
  host: PopoverHost;
91
122
  options: LabeledDropdownOption<T>[];
@@ -96,11 +127,11 @@ interface Props$5<T extends string> {
96
127
  align?: 'left' | 'right' | 'center';
97
128
  alignOverride?: AlignResult;
98
129
  }
99
- declare function LabeledDropdown<T extends string>({ id, host, options, value, onChange, color, dark, align: forcedAlign, alignOverride }: Props$5<T>): react.JSX.Element;
130
+ declare function LabeledDropdown<T extends string>({ id, host, options, value, onChange, color, dark, align: forcedAlign, alignOverride }: Props$7<T>): react.JSX.Element;
100
131
 
101
132
  declare function loadSkiaWeb(): Promise<void>;
102
133
 
103
- interface Props$4 {
134
+ interface Props$6 {
104
135
  visible: boolean;
105
136
  children: ReactNode;
106
137
  align?: 'left' | 'right' | 'center';
@@ -110,23 +141,23 @@ interface Props$4 {
110
141
  caretBorderWidth?: number;
111
142
  triggerSize?: number;
112
143
  }
113
- declare function PopoverBody({ visible, children, align, verticalAlign, caretColor, caretBorderColor, caretBorderWidth, triggerSize }: Props$4): react.JSX.Element | null;
144
+ declare function PopoverBody({ visible, children, align, verticalAlign, caretColor, caretBorderColor, caretBorderWidth, triggerSize }: Props$6): react.JSX.Element | null;
114
145
 
115
- interface Props$3 {
146
+ interface Props$5 {
116
147
  active: boolean;
117
148
  onPress: () => void;
118
149
  style?: StyleProp<ViewStyle>;
119
150
  }
120
- declare function PressAwayOverlay({ active, onPress, style }: Props$3): react.JSX.Element | null;
151
+ declare function PressAwayOverlay({ active, onPress, style }: Props$5): react.JSX.Element | null;
121
152
 
122
- interface Props$2 {
153
+ interface Props$4 {
123
154
  color: string;
124
155
  ready: boolean;
125
156
  onToggleReady: () => void;
126
157
  style?: StyleProp<ViewStyle>;
127
158
  labelFontFamily?: string;
128
159
  }
129
- declare function ReadyButton({ color, ready, onToggleReady, style, labelFontFamily }: Props$2): react.JSX.Element;
160
+ declare function ReadyButton({ color, ready, onToggleReady, style, labelFontFamily }: Props$4): react.JSX.Element;
130
161
 
131
162
  interface MenuOption<T extends string | number> {
132
163
  value: T;
@@ -151,7 +182,7 @@ interface MultiSelectSection<T extends string | number> {
151
182
  allClear?: boolean;
152
183
  }
153
184
  type MenuSection = SingleSelectSection<any> | MultiSelectSection<any>;
154
- interface Props$1 {
185
+ interface Props$3 {
155
186
  id: string;
156
187
  host: PopoverHost;
157
188
  icon: string;
@@ -169,9 +200,9 @@ interface Props$1 {
169
200
  clear: string;
170
201
  };
171
202
  }
172
- declare function SectionedDropdown({ id, host, icon, accessibilityLabel, sections, accentColor, mutedColor, onAccentColor, dark, align: alignOverride, autoDismiss, labelFontFamily, allClearLabels }: Props$1): react.JSX.Element;
203
+ declare function SectionedDropdown({ id, host, icon, accessibilityLabel, sections, accentColor, mutedColor, onAccentColor, dark, align: alignOverride, autoDismiss, labelFontFamily, allClearLabels }: Props$3): react.JSX.Element;
173
204
 
174
- interface Props {
205
+ interface Props$2 {
175
206
  onBack: () => void;
176
207
  onSettings: () => void;
177
208
  onRandomize?: () => void;
@@ -180,7 +211,19 @@ interface Props {
180
211
  popoverOpen: boolean;
181
212
  children: ReactNode;
182
213
  }
183
- declare function SharedActionBand({ onBack, onSettings, onRandomize, onReset, fg, popoverOpen, children }: Props): react.JSX.Element;
214
+ declare function SharedActionBand({ onBack, onSettings, onRandomize, onReset, fg, popoverOpen, children }: Props$2): react.JSX.Element;
215
+
216
+ interface Props$1 {
217
+ label: string;
218
+ value: string;
219
+ }
220
+ declare function StatRow({ label, value }: Props$1): react.JSX.Element;
221
+
222
+ interface Props {
223
+ label: string;
224
+ children: ReactNode;
225
+ }
226
+ declare function StatSection({ label, children }: Props): react.JSX.Element;
184
227
 
185
228
  interface TriggerGaugeProps {
186
229
  segments: number;
@@ -195,4 +238,4 @@ interface TriggerGaugeProps {
195
238
 
196
239
  declare function TriggerGaugeHost(props: TriggerGaugeProps): react.JSX.Element;
197
240
 
198
- export { BaseSettingsDialog, type BaseSettingsDialogProps, CornerActionButtons, InlineColorPicker, LABELED_DROPDOWN_POPOVER_WIDTH, LabeledDropdown, type LabeledDropdownOption, MONO_FONT, type MenuOption, type MenuSection, type MultiSelectSection, type PopoverAlign, PopoverBody, type PopoverHost, type PopoverVerticalAlign, PressAwayOverlay, ReadyButton, SectionedDropdown, SharedActionBand, type SingleSelectSection, TriggerGaugeHost, type TriggerGaugeProps, getLabeledDropdownContentHeight, loadSkiaWeb, useAutoAlign, usePopoverHost };
241
+ export { AchievementRow, BaseSettingsDialog, type BaseSettingsDialogProps, BaseStatsScreen, CornerActionButtons, InlineColorPicker, LABELED_DROPDOWN_POPOVER_WIDTH, LOCKED_BADGE_COLOR, LabeledDropdown, type LabeledDropdownOption, MONO_FONT, type MenuOption, type MenuSection, type MultiSelectSection, type PopoverAlign, PopoverBody, type PopoverHost, type PopoverVerticalAlign, PressAwayOverlay, ReadyButton, SectionedDropdown, SharedActionBand, type SingleSelectSection, StatRow, StatSection, TriggerGaugeHost, type TriggerGaugeProps, getLabeledDropdownContentHeight, loadSkiaWeb, useAutoAlign, usePopoverHost };
package/dist/index.d.ts CHANGED
@@ -3,6 +3,19 @@ import { ReactNode, RefObject } from 'react';
3
3
  import { SeedColor } from '@rific/auto-paper';
4
4
  import { View, StyleProp, ViewStyle } from 'react-native';
5
5
 
6
+ declare const LOCKED_BADGE_COLOR = "rgba(128,128,128,0.3)";
7
+ interface Props$b {
8
+ icon: string;
9
+ title: string;
10
+ description: string;
11
+ badgeColor: string;
12
+ unlockedLabel?: string;
13
+ checkColor?: string;
14
+ progress?: number;
15
+ deviceMarker?: boolean;
16
+ }
17
+ declare function AchievementRow({ icon, title, description, badgeColor, unlockedLabel, checkColor, progress, deviceMarker }: Props$b): react.JSX.Element;
18
+
6
19
  interface BaseSettingsDialogProps {
7
20
  visible: boolean;
8
21
  onDismiss: () => void;
@@ -21,7 +34,25 @@ interface BaseSettingsDialogProps {
21
34
  }
22
35
  declare function BaseSettingsDialog({ visible, onDismiss, rotation, version, lockOrientation, onLockOrientationChange, deferBottomEdgeGestures, onDeferBottomEdgeGestures, hideSound, hideHaptics, hideAppearance, hideUpdateCheck, onUpdateError, children }: BaseSettingsDialogProps): react.JSX.Element;
23
36
 
24
- interface Props$7 {
37
+ interface Props$a {
38
+ rotation?: number;
39
+ title?: string;
40
+ onBack: () => void;
41
+ insets: {
42
+ top: number;
43
+ left: number;
44
+ bottom: number;
45
+ right: number;
46
+ };
47
+ onReset?: () => void;
48
+ resetLabel?: string;
49
+ resetConfirmTitle?: string;
50
+ resetConfirmBody?: string;
51
+ children: ReactNode;
52
+ }
53
+ declare function BaseStatsScreen({ rotation, title, onBack, insets, onReset, resetLabel, resetConfirmTitle, resetConfirmBody, children }: Props$a): react.JSX.Element;
54
+
55
+ interface Props$9 {
25
56
  onBack: () => void;
26
57
  onSettings: () => void;
27
58
  fg: string;
@@ -31,7 +62,7 @@ interface Props$7 {
31
62
  right: number;
32
63
  };
33
64
  }
34
- declare function CornerActionButtons({ onBack, onSettings, fg, insets }: Props$7): react.JSX.Element;
65
+ declare function CornerActionButtons({ onBack, onSettings, fg, insets }: Props$9): react.JSX.Element;
35
66
 
36
67
  declare const MONO_FONT: string;
37
68
 
@@ -42,7 +73,7 @@ interface PopoverHost {
42
73
  }
43
74
  declare function usePopoverHost(): PopoverHost;
44
75
 
45
- interface Props$6 {
76
+ interface Props$8 {
46
77
  id: string;
47
78
  host: PopoverHost;
48
79
  value: string;
@@ -59,7 +90,7 @@ interface Props$6 {
59
90
  columns?: number;
60
91
  size?: number;
61
92
  }
62
- declare function InlineColorPicker({ id, host, value, onChange, swatches, takenValue, allowSwapTaken, dark, align: alignOverride, icon, tag, labelFontFamily, autoDismiss, columns, size }: Props$6): react.JSX.Element;
93
+ declare function InlineColorPicker({ id, host, value, onChange, swatches, takenValue, allowSwapTaken, dark, align: alignOverride, icon, tag, labelFontFamily, autoDismiss, columns, size }: Props$8): react.JSX.Element;
63
94
 
64
95
  type PopoverAlign = 'left' | 'right' | 'center';
65
96
  type PopoverVerticalAlign = 'below' | 'above';
@@ -85,7 +116,7 @@ interface AlignResult {
85
116
  measured: boolean;
86
117
  triggerRef: RefObject<View | null>;
87
118
  }
88
- interface Props$5<T extends string> {
119
+ interface Props$7<T extends string> {
89
120
  id: string;
90
121
  host: PopoverHost;
91
122
  options: LabeledDropdownOption<T>[];
@@ -96,11 +127,11 @@ interface Props$5<T extends string> {
96
127
  align?: 'left' | 'right' | 'center';
97
128
  alignOverride?: AlignResult;
98
129
  }
99
- declare function LabeledDropdown<T extends string>({ id, host, options, value, onChange, color, dark, align: forcedAlign, alignOverride }: Props$5<T>): react.JSX.Element;
130
+ declare function LabeledDropdown<T extends string>({ id, host, options, value, onChange, color, dark, align: forcedAlign, alignOverride }: Props$7<T>): react.JSX.Element;
100
131
 
101
132
  declare function loadSkiaWeb(): Promise<void>;
102
133
 
103
- interface Props$4 {
134
+ interface Props$6 {
104
135
  visible: boolean;
105
136
  children: ReactNode;
106
137
  align?: 'left' | 'right' | 'center';
@@ -110,23 +141,23 @@ interface Props$4 {
110
141
  caretBorderWidth?: number;
111
142
  triggerSize?: number;
112
143
  }
113
- declare function PopoverBody({ visible, children, align, verticalAlign, caretColor, caretBorderColor, caretBorderWidth, triggerSize }: Props$4): react.JSX.Element | null;
144
+ declare function PopoverBody({ visible, children, align, verticalAlign, caretColor, caretBorderColor, caretBorderWidth, triggerSize }: Props$6): react.JSX.Element | null;
114
145
 
115
- interface Props$3 {
146
+ interface Props$5 {
116
147
  active: boolean;
117
148
  onPress: () => void;
118
149
  style?: StyleProp<ViewStyle>;
119
150
  }
120
- declare function PressAwayOverlay({ active, onPress, style }: Props$3): react.JSX.Element | null;
151
+ declare function PressAwayOverlay({ active, onPress, style }: Props$5): react.JSX.Element | null;
121
152
 
122
- interface Props$2 {
153
+ interface Props$4 {
123
154
  color: string;
124
155
  ready: boolean;
125
156
  onToggleReady: () => void;
126
157
  style?: StyleProp<ViewStyle>;
127
158
  labelFontFamily?: string;
128
159
  }
129
- declare function ReadyButton({ color, ready, onToggleReady, style, labelFontFamily }: Props$2): react.JSX.Element;
160
+ declare function ReadyButton({ color, ready, onToggleReady, style, labelFontFamily }: Props$4): react.JSX.Element;
130
161
 
131
162
  interface MenuOption<T extends string | number> {
132
163
  value: T;
@@ -151,7 +182,7 @@ interface MultiSelectSection<T extends string | number> {
151
182
  allClear?: boolean;
152
183
  }
153
184
  type MenuSection = SingleSelectSection<any> | MultiSelectSection<any>;
154
- interface Props$1 {
185
+ interface Props$3 {
155
186
  id: string;
156
187
  host: PopoverHost;
157
188
  icon: string;
@@ -169,9 +200,9 @@ interface Props$1 {
169
200
  clear: string;
170
201
  };
171
202
  }
172
- declare function SectionedDropdown({ id, host, icon, accessibilityLabel, sections, accentColor, mutedColor, onAccentColor, dark, align: alignOverride, autoDismiss, labelFontFamily, allClearLabels }: Props$1): react.JSX.Element;
203
+ declare function SectionedDropdown({ id, host, icon, accessibilityLabel, sections, accentColor, mutedColor, onAccentColor, dark, align: alignOverride, autoDismiss, labelFontFamily, allClearLabels }: Props$3): react.JSX.Element;
173
204
 
174
- interface Props {
205
+ interface Props$2 {
175
206
  onBack: () => void;
176
207
  onSettings: () => void;
177
208
  onRandomize?: () => void;
@@ -180,7 +211,19 @@ interface Props {
180
211
  popoverOpen: boolean;
181
212
  children: ReactNode;
182
213
  }
183
- declare function SharedActionBand({ onBack, onSettings, onRandomize, onReset, fg, popoverOpen, children }: Props): react.JSX.Element;
214
+ declare function SharedActionBand({ onBack, onSettings, onRandomize, onReset, fg, popoverOpen, children }: Props$2): react.JSX.Element;
215
+
216
+ interface Props$1 {
217
+ label: string;
218
+ value: string;
219
+ }
220
+ declare function StatRow({ label, value }: Props$1): react.JSX.Element;
221
+
222
+ interface Props {
223
+ label: string;
224
+ children: ReactNode;
225
+ }
226
+ declare function StatSection({ label, children }: Props): react.JSX.Element;
184
227
 
185
228
  interface TriggerGaugeProps {
186
229
  segments: number;
@@ -195,4 +238,4 @@ interface TriggerGaugeProps {
195
238
 
196
239
  declare function TriggerGaugeHost(props: TriggerGaugeProps): react.JSX.Element;
197
240
 
198
- export { BaseSettingsDialog, type BaseSettingsDialogProps, CornerActionButtons, InlineColorPicker, LABELED_DROPDOWN_POPOVER_WIDTH, LabeledDropdown, type LabeledDropdownOption, MONO_FONT, type MenuOption, type MenuSection, type MultiSelectSection, type PopoverAlign, PopoverBody, type PopoverHost, type PopoverVerticalAlign, PressAwayOverlay, ReadyButton, SectionedDropdown, SharedActionBand, type SingleSelectSection, TriggerGaugeHost, type TriggerGaugeProps, getLabeledDropdownContentHeight, loadSkiaWeb, useAutoAlign, usePopoverHost };
241
+ export { AchievementRow, BaseSettingsDialog, type BaseSettingsDialogProps, BaseStatsScreen, CornerActionButtons, InlineColorPicker, LABELED_DROPDOWN_POPOVER_WIDTH, LOCKED_BADGE_COLOR, LabeledDropdown, type LabeledDropdownOption, MONO_FONT, type MenuOption, type MenuSection, type MultiSelectSection, type PopoverAlign, PopoverBody, type PopoverHost, type PopoverVerticalAlign, PressAwayOverlay, ReadyButton, SectionedDropdown, SharedActionBand, type SingleSelectSection, StatRow, StatSection, TriggerGaugeHost, type TriggerGaugeProps, getLabeledDropdownContentHeight, loadSkiaWeb, useAutoAlign, usePopoverHost };