@tastic/hud 0.5.0 → 0.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +18 -7
- package/dist/index.d.ts +18 -7
- package/dist/index.js +161 -126
- package/dist/index.mjs +146 -112
- package/package.json +4 -4
- package/src/BaseSettingsDialog.tsx +12 -12
- package/src/ContentGutter.tsx +55 -0
- package/src/InlineColorPicker.tsx +21 -11
- package/src/SectionedDropdown.tsx +14 -2
- package/src/index.ts +1 -0
package/dist/index.d.mts
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
2
|
import { ReactNode, RefObject } from 'react';
|
|
3
|
+
import { StyleProp, ViewStyle, View } from 'react-native';
|
|
3
4
|
import { SeedColor } from '@rific/auto-paper';
|
|
4
|
-
import { View, StyleProp, ViewStyle } from 'react-native';
|
|
5
5
|
|
|
6
6
|
declare const LOCKED_BADGE_COLOR = "rgba(128,128,128,0.3)";
|
|
7
|
-
interface Props$
|
|
7
|
+
interface Props$c {
|
|
8
8
|
icon: string;
|
|
9
9
|
title: string;
|
|
10
10
|
description: string;
|
|
@@ -17,7 +17,7 @@ interface Props$b {
|
|
|
17
17
|
fgMuted?: string;
|
|
18
18
|
sectionBg?: string;
|
|
19
19
|
}
|
|
20
|
-
declare function AchievementRow({ icon, title, description, badgeColor, unlockedLabel, checkColor, progress, deviceMarker, fg: fgOverride, fgMuted: fgMutedOverride, sectionBg: sectionBgOverride }: Props$
|
|
20
|
+
declare function AchievementRow({ icon, title, description, badgeColor, unlockedLabel, checkColor, progress, deviceMarker, fg: fgOverride, fgMuted: fgMutedOverride, sectionBg: sectionBgOverride }: Props$c): react.JSX.Element;
|
|
21
21
|
|
|
22
22
|
interface BaseSettingsDialogProps {
|
|
23
23
|
visible: boolean;
|
|
@@ -38,7 +38,7 @@ interface BaseSettingsDialogProps {
|
|
|
38
38
|
declare function BaseSettingsDialog({ visible, onDismiss, rotation, version, lockOrientation, onLockOrientationChange, deferBottomEdgeGestures, onDeferBottomEdgeGestures, hideSound, hideHaptics, hideAppearance, hideUpdateCheck, onUpdateError, children }: BaseSettingsDialogProps): react.JSX.Element;
|
|
39
39
|
|
|
40
40
|
type MD3TextVariant = 'displayLarge' | 'displayMedium' | 'displaySmall' | 'headlineLarge' | 'headlineMedium' | 'headlineSmall' | 'titleLarge' | 'titleMedium' | 'titleSmall' | 'labelLarge' | 'labelMedium' | 'labelSmall' | 'bodyLarge' | 'bodyMedium' | 'bodySmall';
|
|
41
|
-
interface Props$
|
|
41
|
+
interface Props$b {
|
|
42
42
|
rotation?: number;
|
|
43
43
|
title?: string;
|
|
44
44
|
titleVariant?: MD3TextVariant;
|
|
@@ -59,7 +59,16 @@ interface Props$a {
|
|
|
59
59
|
accentColor?: string;
|
|
60
60
|
children: ReactNode;
|
|
61
61
|
}
|
|
62
|
-
declare function BaseStatsScreen({ rotation, title, titleVariant, onBack, insets, onReset, resetLabel, resetConfirmTitle, resetConfirmBody, fg: fgOverride, bg: bgOverride, cardBg: cardBgOverride, accentColor: accentColorOverride, children }: Props$
|
|
62
|
+
declare function BaseStatsScreen({ rotation, title, titleVariant, onBack, insets, onReset, resetLabel, resetConfirmTitle, resetConfirmBody, fg: fgOverride, bg: bgOverride, cardBg: cardBgOverride, accentColor: accentColorOverride, children }: Props$b): react.JSX.Element;
|
|
63
|
+
|
|
64
|
+
interface Props$a {
|
|
65
|
+
maxContentWidth?: number;
|
|
66
|
+
leftGutter?: ReactNode;
|
|
67
|
+
rightGutter?: ReactNode;
|
|
68
|
+
style?: StyleProp<ViewStyle>;
|
|
69
|
+
children: ReactNode;
|
|
70
|
+
}
|
|
71
|
+
declare function ContentGutter({ maxContentWidth, leftGutter, rightGutter, style, children }: Props$a): react.JSX.Element;
|
|
63
72
|
|
|
64
73
|
interface Props$9 {
|
|
65
74
|
onBack: () => void;
|
|
@@ -87,6 +96,7 @@ interface Props$8 {
|
|
|
87
96
|
host: PopoverHost;
|
|
88
97
|
value: string;
|
|
89
98
|
onChange: (hex: string) => void;
|
|
99
|
+
previewValue?: (hex: string) => string;
|
|
90
100
|
swatches?: SeedColor[];
|
|
91
101
|
takenValue?: string;
|
|
92
102
|
allowSwapTaken?: boolean;
|
|
@@ -99,7 +109,7 @@ interface Props$8 {
|
|
|
99
109
|
columns?: number;
|
|
100
110
|
size?: number;
|
|
101
111
|
}
|
|
102
|
-
declare function InlineColorPicker({ id, host, value, onChange, swatches, takenValue, allowSwapTaken, dark, align: alignOverride, icon, tag, labelFontFamily, autoDismiss, columns, size }: Props$8): react.JSX.Element;
|
|
112
|
+
declare function InlineColorPicker({ id, host, value, onChange, previewValue, swatches, takenValue, allowSwapTaken, dark, align: alignOverride, icon, tag, labelFontFamily, autoDismiss, columns, size }: Props$8): react.JSX.Element;
|
|
103
113
|
|
|
104
114
|
type PopoverAlign = 'left' | 'right' | 'center';
|
|
105
115
|
type PopoverVerticalAlign = 'below' | 'above';
|
|
@@ -181,6 +191,7 @@ interface SingleSelectSection<T extends string | number> {
|
|
|
181
191
|
options: MenuOption<T>[];
|
|
182
192
|
value: T;
|
|
183
193
|
onChange: (value: T) => void;
|
|
194
|
+
takenValue?: T;
|
|
184
195
|
}
|
|
185
196
|
interface MultiSelectSection<T extends string | number> {
|
|
186
197
|
kind: 'multi';
|
|
@@ -251,4 +262,4 @@ interface TriggerGaugeProps {
|
|
|
251
262
|
|
|
252
263
|
declare function TriggerGaugeHost(props: TriggerGaugeProps): react.JSX.Element;
|
|
253
264
|
|
|
254
|
-
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 };
|
|
265
|
+
export { AchievementRow, BaseSettingsDialog, type BaseSettingsDialogProps, BaseStatsScreen, ContentGutter, 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
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
2
|
import { ReactNode, RefObject } from 'react';
|
|
3
|
+
import { StyleProp, ViewStyle, View } from 'react-native';
|
|
3
4
|
import { SeedColor } from '@rific/auto-paper';
|
|
4
|
-
import { View, StyleProp, ViewStyle } from 'react-native';
|
|
5
5
|
|
|
6
6
|
declare const LOCKED_BADGE_COLOR = "rgba(128,128,128,0.3)";
|
|
7
|
-
interface Props$
|
|
7
|
+
interface Props$c {
|
|
8
8
|
icon: string;
|
|
9
9
|
title: string;
|
|
10
10
|
description: string;
|
|
@@ -17,7 +17,7 @@ interface Props$b {
|
|
|
17
17
|
fgMuted?: string;
|
|
18
18
|
sectionBg?: string;
|
|
19
19
|
}
|
|
20
|
-
declare function AchievementRow({ icon, title, description, badgeColor, unlockedLabel, checkColor, progress, deviceMarker, fg: fgOverride, fgMuted: fgMutedOverride, sectionBg: sectionBgOverride }: Props$
|
|
20
|
+
declare function AchievementRow({ icon, title, description, badgeColor, unlockedLabel, checkColor, progress, deviceMarker, fg: fgOverride, fgMuted: fgMutedOverride, sectionBg: sectionBgOverride }: Props$c): react.JSX.Element;
|
|
21
21
|
|
|
22
22
|
interface BaseSettingsDialogProps {
|
|
23
23
|
visible: boolean;
|
|
@@ -38,7 +38,7 @@ interface BaseSettingsDialogProps {
|
|
|
38
38
|
declare function BaseSettingsDialog({ visible, onDismiss, rotation, version, lockOrientation, onLockOrientationChange, deferBottomEdgeGestures, onDeferBottomEdgeGestures, hideSound, hideHaptics, hideAppearance, hideUpdateCheck, onUpdateError, children }: BaseSettingsDialogProps): react.JSX.Element;
|
|
39
39
|
|
|
40
40
|
type MD3TextVariant = 'displayLarge' | 'displayMedium' | 'displaySmall' | 'headlineLarge' | 'headlineMedium' | 'headlineSmall' | 'titleLarge' | 'titleMedium' | 'titleSmall' | 'labelLarge' | 'labelMedium' | 'labelSmall' | 'bodyLarge' | 'bodyMedium' | 'bodySmall';
|
|
41
|
-
interface Props$
|
|
41
|
+
interface Props$b {
|
|
42
42
|
rotation?: number;
|
|
43
43
|
title?: string;
|
|
44
44
|
titleVariant?: MD3TextVariant;
|
|
@@ -59,7 +59,16 @@ interface Props$a {
|
|
|
59
59
|
accentColor?: string;
|
|
60
60
|
children: ReactNode;
|
|
61
61
|
}
|
|
62
|
-
declare function BaseStatsScreen({ rotation, title, titleVariant, onBack, insets, onReset, resetLabel, resetConfirmTitle, resetConfirmBody, fg: fgOverride, bg: bgOverride, cardBg: cardBgOverride, accentColor: accentColorOverride, children }: Props$
|
|
62
|
+
declare function BaseStatsScreen({ rotation, title, titleVariant, onBack, insets, onReset, resetLabel, resetConfirmTitle, resetConfirmBody, fg: fgOverride, bg: bgOverride, cardBg: cardBgOverride, accentColor: accentColorOverride, children }: Props$b): react.JSX.Element;
|
|
63
|
+
|
|
64
|
+
interface Props$a {
|
|
65
|
+
maxContentWidth?: number;
|
|
66
|
+
leftGutter?: ReactNode;
|
|
67
|
+
rightGutter?: ReactNode;
|
|
68
|
+
style?: StyleProp<ViewStyle>;
|
|
69
|
+
children: ReactNode;
|
|
70
|
+
}
|
|
71
|
+
declare function ContentGutter({ maxContentWidth, leftGutter, rightGutter, style, children }: Props$a): react.JSX.Element;
|
|
63
72
|
|
|
64
73
|
interface Props$9 {
|
|
65
74
|
onBack: () => void;
|
|
@@ -87,6 +96,7 @@ interface Props$8 {
|
|
|
87
96
|
host: PopoverHost;
|
|
88
97
|
value: string;
|
|
89
98
|
onChange: (hex: string) => void;
|
|
99
|
+
previewValue?: (hex: string) => string;
|
|
90
100
|
swatches?: SeedColor[];
|
|
91
101
|
takenValue?: string;
|
|
92
102
|
allowSwapTaken?: boolean;
|
|
@@ -99,7 +109,7 @@ interface Props$8 {
|
|
|
99
109
|
columns?: number;
|
|
100
110
|
size?: number;
|
|
101
111
|
}
|
|
102
|
-
declare function InlineColorPicker({ id, host, value, onChange, swatches, takenValue, allowSwapTaken, dark, align: alignOverride, icon, tag, labelFontFamily, autoDismiss, columns, size }: Props$8): react.JSX.Element;
|
|
112
|
+
declare function InlineColorPicker({ id, host, value, onChange, previewValue, swatches, takenValue, allowSwapTaken, dark, align: alignOverride, icon, tag, labelFontFamily, autoDismiss, columns, size }: Props$8): react.JSX.Element;
|
|
103
113
|
|
|
104
114
|
type PopoverAlign = 'left' | 'right' | 'center';
|
|
105
115
|
type PopoverVerticalAlign = 'below' | 'above';
|
|
@@ -181,6 +191,7 @@ interface SingleSelectSection<T extends string | number> {
|
|
|
181
191
|
options: MenuOption<T>[];
|
|
182
192
|
value: T;
|
|
183
193
|
onChange: (value: T) => void;
|
|
194
|
+
takenValue?: T;
|
|
184
195
|
}
|
|
185
196
|
interface MultiSelectSection<T extends string | number> {
|
|
186
197
|
kind: 'multi';
|
|
@@ -251,4 +262,4 @@ interface TriggerGaugeProps {
|
|
|
251
262
|
|
|
252
263
|
declare function TriggerGaugeHost(props: TriggerGaugeProps): react.JSX.Element;
|
|
253
264
|
|
|
254
|
-
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 };
|
|
265
|
+
export { AchievementRow, BaseSettingsDialog, type BaseSettingsDialogProps, BaseStatsScreen, ContentGutter, 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 };
|