@tastic/hud 0.6.0 → 0.7.0

package/dist/index.d.mts

@@ -61,6 +61,20 @@ interface Props$b {
 }
 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;
 
+interface ConfirmDialogProps {
+    visible: boolean;
+    title: string;
+    message: string;
+    confirmLabel: string;
+    cancelLabel: string;
+    onConfirm: () => void;
+    onCancel: () => void;
+    rotation?: number;
+    icon?: string;
+    destructive?: boolean;
+}
+declare function ConfirmDialog({ visible, title, message, confirmLabel, cancelLabel, onConfirm, onCancel, rotation, icon, destructive }: ConfirmDialogProps): react.JSX.Element | null;
+
 interface Props$a {
     maxContentWidth?: number;
     leftGutter?: ReactNode;
@@ -70,7 +84,74 @@ interface Props$a {
 }
 declare function ContentGutter({ maxContentWidth, leftGutter, rightGutter, style, children }: Props$a): react.JSX.Element;
 
+interface PopoverHost {
+    openId: string | null;
+    toggle: (id: string) => void;
+    close: () => void;
+}
+declare function usePopoverHost(): PopoverHost;
+
+interface MenuOption<T extends string | number> {
+    value: T;
+    label: string;
+    description?: string;
+    icon?: string;
+    iconSize?: number;
+}
+interface SingleSelectSection<T extends string | number> {
+    kind: 'single';
+    id: string;
+    options: MenuOption<T>[];
+    value: T;
+    onChange: (value: T) => void;
+    takenValue?: T;
+}
+interface MultiSelectSection<T extends string | number> {
+    kind: 'multi';
+    id: string;
+    options: MenuOption<T>[];
+    value: T[];
+    onChange: (value: T[]) => void;
+    allClear?: boolean;
+}
+type MenuSection = SingleSelectSection<any> | MultiSelectSection<any>;
 interface Props$9 {
+    id: string;
+    host: PopoverHost;
+    icon: string;
+    accessibilityLabel: string;
+    sections: MenuSection[];
+    accentColor: string;
+    mutedColor: string;
+    onAccentColor?: string;
+    dark: boolean;
+    align?: 'left' | 'right' | 'center';
+    autoDismiss?: boolean;
+    labelFontFamily?: string;
+    allClearLabels?: {
+        all: string;
+        clear: string;
+    };
+}
+declare function SectionedDropdown({ id, host, icon, accessibilityLabel, sections, accentColor, mutedColor, onAccentColor, dark, align: alignOverride, autoDismiss, labelFontFamily, allClearLabels }: Props$9): react.JSX.Element;
+
+interface ControlSchemePickerProps<T extends string | number> {
+    id: string;
+    host: PopoverHost;
+    value: T;
+    onChange: (value: T) => void;
+    options: MenuOption<T>[];
+    takenValue?: T;
+    accentColor: string;
+    mutedColor: string;
+    onAccentColor?: string;
+    dark: boolean;
+    align?: 'left' | 'right' | 'center';
+    labelFontFamily?: string;
+}
+declare function ControlSchemePicker<T extends string | number>({ id, host, value, onChange, options, takenValue, accentColor, mutedColor, onAccentColor, dark, align, labelFontFamily }: ControlSchemePickerProps<T>): react.JSX.Element | null;
+
+interface Props$8 {
     onBack: () => void;
     onSettings: () => void;
     fg: string;
@@ -79,19 +160,26 @@ interface Props$9 {
         left: number;
         right: number;
     };
+    backIcon?: string;
+    backLabel?: string;
 }
-declare function CornerActionButtons({ onBack, onSettings, fg, insets }: Props$9): react.JSX.Element;
+declare function CornerActionButtons({ onBack, onSettings, fg, insets, backIcon, backLabel }: Props$8): react.JSX.Element;
 
-declare const MONO_FONT: string;
-
-interface PopoverHost {
-    openId: string | null;
-    toggle: (id: string) => void;
-    close: () => void;
+type OrientationMode = 'faceToFace' | 'sideBySide';
+interface CornerStatusBadgeSeat {
+    icon?: string;
 }
-declare function usePopoverHost(): PopoverHost;
+interface CornerStatusBadgesProps {
+    orientationMode: OrientationMode;
+    p1OnRight: boolean;
+    p1?: CornerStatusBadgeSeat;
+    p2?: CornerStatusBadgeSeat;
+}
+declare function CornerStatusBadges({ orientationMode, p1OnRight, p1, p2 }: CornerStatusBadgesProps): react.JSX.Element;
 
-interface Props$8 {
+declare const MONO_FONT: string;
+
+interface Props$7 {
     id: string;
     host: PopoverHost;
     value: string;
@@ -109,7 +197,7 @@ interface Props$8 {
     columns?: number;
     size?: number;
 }
-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;
+declare function InlineColorPicker({ id, host, value, onChange, previewValue, swatches, takenValue, allowSwapTaken, dark, align: alignOverride, icon, tag, labelFontFamily, autoDismiss, columns, size }: Props$7): react.JSX.Element;
 
 type PopoverAlign = 'left' | 'right' | 'center';
 type PopoverVerticalAlign = 'below' | 'above';
@@ -135,7 +223,7 @@ interface AlignResult {
     measured: boolean;
     triggerRef: RefObject<View | null>;
 }
-interface Props$7<T extends string> {
+interface Props$6<T extends string> {
     id: string;
     host: PopoverHost;
     options: LabeledDropdownOption<T>[];
@@ -146,11 +234,11 @@ interface Props$7<T extends string> {
     align?: 'left' | 'right' | 'center';
     alignOverride?: AlignResult;
 }
-declare function LabeledDropdown<T extends string>({ id, host, options, value, onChange, color, dark, align: forcedAlign, alignOverride }: Props$7<T>): react.JSX.Element;
+declare function LabeledDropdown<T extends string>({ id, host, options, value, onChange, color, dark, align: forcedAlign, alignOverride }: Props$6<T>): react.JSX.Element;
 
 declare function loadSkiaWeb(): Promise<void>;
 
-interface Props$6 {
+interface Props$5 {
     visible: boolean;
     children: ReactNode;
     align?: 'left' | 'right' | 'center';
@@ -160,67 +248,23 @@ interface Props$6 {
     caretBorderWidth?: number;
     triggerSize?: number;
 }
-declare function PopoverBody({ visible, children, align, verticalAlign, caretColor, caretBorderColor, caretBorderWidth, triggerSize }: Props$6): react.JSX.Element | null;
+declare function PopoverBody({ visible, children, align, verticalAlign, caretColor, caretBorderColor, caretBorderWidth, triggerSize }: Props$5): react.JSX.Element | null;
 
-interface Props$5 {
+interface Props$4 {
     active: boolean;
     onPress: () => void;
     style?: StyleProp<ViewStyle>;
 }
-declare function PressAwayOverlay({ active, onPress, style }: Props$5): react.JSX.Element | null;
+declare function PressAwayOverlay({ active, onPress, style }: Props$4): react.JSX.Element | null;
 
-interface Props$4 {
+interface Props$3 {
     color: string;
     ready: boolean;
     onToggleReady: () => void;
     style?: StyleProp<ViewStyle>;
     labelFontFamily?: string;
 }
-declare function ReadyButton({ color, ready, onToggleReady, style, labelFontFamily }: Props$4): react.JSX.Element;
-
-interface MenuOption<T extends string | number> {
-    value: T;
-    label: string;
-    description?: string;
-    icon?: string;
-    iconSize?: number;
-}
-interface SingleSelectSection<T extends string | number> {
-    kind: 'single';
-    id: string;
-    options: MenuOption<T>[];
-    value: T;
-    onChange: (value: T) => void;
-    takenValue?: T;
-}
-interface MultiSelectSection<T extends string | number> {
-    kind: 'multi';
-    id: string;
-    options: MenuOption<T>[];
-    value: T[];
-    onChange: (value: T[]) => void;
-    allClear?: boolean;
-}
-type MenuSection = SingleSelectSection<any> | MultiSelectSection<any>;
-interface Props$3 {
-    id: string;
-    host: PopoverHost;
-    icon: string;
-    accessibilityLabel: string;
-    sections: MenuSection[];
-    accentColor: string;
-    mutedColor: string;
-    onAccentColor?: string;
-    dark: boolean;
-    align?: 'left' | 'right' | 'center';
-    autoDismiss?: boolean;
-    labelFontFamily?: string;
-    allClearLabels?: {
-        all: string;
-        clear: string;
-    };
-}
-declare function SectionedDropdown({ id, host, icon, accessibilityLabel, sections, accentColor, mutedColor, onAccentColor, dark, align: alignOverride, autoDismiss, labelFontFamily, allClearLabels }: Props$3): react.JSX.Element;
+declare function ReadyButton({ color, ready, onToggleReady, style, labelFontFamily }: Props$3): react.JSX.Element;
 
 interface Props$2 {
     onBack: () => void;
@@ -262,4 +306,4 @@ interface TriggerGaugeProps {
 
 declare function TriggerGaugeHost(props: TriggerGaugeProps): react.JSX.Element;
 
-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 };
+export { AchievementRow, BaseSettingsDialog, type BaseSettingsDialogProps, BaseStatsScreen, ConfirmDialog, type ConfirmDialogProps, ContentGutter, ControlSchemePicker, type ControlSchemePickerProps, CornerActionButtons, type CornerStatusBadgeSeat, CornerStatusBadges, type CornerStatusBadgesProps, InlineColorPicker, LABELED_DROPDOWN_POPOVER_WIDTH, LOCKED_BADGE_COLOR, LabeledDropdown, type LabeledDropdownOption, MONO_FONT, type MenuOption, type MenuSection, type MultiSelectSection, type OrientationMode, 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

@@ -61,6 +61,20 @@ interface Props$b {
 }
 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;
 
+interface ConfirmDialogProps {
+    visible: boolean;
+    title: string;
+    message: string;
+    confirmLabel: string;
+    cancelLabel: string;
+    onConfirm: () => void;
+    onCancel: () => void;
+    rotation?: number;
+    icon?: string;
+    destructive?: boolean;
+}
+declare function ConfirmDialog({ visible, title, message, confirmLabel, cancelLabel, onConfirm, onCancel, rotation, icon, destructive }: ConfirmDialogProps): react.JSX.Element | null;
+
 interface Props$a {
     maxContentWidth?: number;
     leftGutter?: ReactNode;
@@ -70,7 +84,74 @@ interface Props$a {
 }
 declare function ContentGutter({ maxContentWidth, leftGutter, rightGutter, style, children }: Props$a): react.JSX.Element;
 
+interface PopoverHost {
+    openId: string | null;
+    toggle: (id: string) => void;
+    close: () => void;
+}
+declare function usePopoverHost(): PopoverHost;
+
+interface MenuOption<T extends string | number> {
+    value: T;
+    label: string;
+    description?: string;
+    icon?: string;
+    iconSize?: number;
+}
+interface SingleSelectSection<T extends string | number> {
+    kind: 'single';
+    id: string;
+    options: MenuOption<T>[];
+    value: T;
+    onChange: (value: T) => void;
+    takenValue?: T;
+}
+interface MultiSelectSection<T extends string | number> {
+    kind: 'multi';
+    id: string;
+    options: MenuOption<T>[];
+    value: T[];
+    onChange: (value: T[]) => void;
+    allClear?: boolean;
+}
+type MenuSection = SingleSelectSection<any> | MultiSelectSection<any>;
 interface Props$9 {
+    id: string;
+    host: PopoverHost;
+    icon: string;
+    accessibilityLabel: string;
+    sections: MenuSection[];
+    accentColor: string;
+    mutedColor: string;
+    onAccentColor?: string;
+    dark: boolean;
+    align?: 'left' | 'right' | 'center';
+    autoDismiss?: boolean;
+    labelFontFamily?: string;
+    allClearLabels?: {
+        all: string;
+        clear: string;
+    };
+}
+declare function SectionedDropdown({ id, host, icon, accessibilityLabel, sections, accentColor, mutedColor, onAccentColor, dark, align: alignOverride, autoDismiss, labelFontFamily, allClearLabels }: Props$9): react.JSX.Element;
+
+interface ControlSchemePickerProps<T extends string | number> {
+    id: string;
+    host: PopoverHost;
+    value: T;
+    onChange: (value: T) => void;
+    options: MenuOption<T>[];
+    takenValue?: T;
+    accentColor: string;
+    mutedColor: string;
+    onAccentColor?: string;
+    dark: boolean;
+    align?: 'left' | 'right' | 'center';
+    labelFontFamily?: string;
+}
+declare function ControlSchemePicker<T extends string | number>({ id, host, value, onChange, options, takenValue, accentColor, mutedColor, onAccentColor, dark, align, labelFontFamily }: ControlSchemePickerProps<T>): react.JSX.Element | null;
+
+interface Props$8 {
     onBack: () => void;
     onSettings: () => void;
     fg: string;
@@ -79,19 +160,26 @@ interface Props$9 {
         left: number;
         right: number;
     };
+    backIcon?: string;
+    backLabel?: string;
 }
-declare function CornerActionButtons({ onBack, onSettings, fg, insets }: Props$9): react.JSX.Element;
+declare function CornerActionButtons({ onBack, onSettings, fg, insets, backIcon, backLabel }: Props$8): react.JSX.Element;
 
-declare const MONO_FONT: string;
-
-interface PopoverHost {
-    openId: string | null;
-    toggle: (id: string) => void;
-    close: () => void;
+type OrientationMode = 'faceToFace' | 'sideBySide';
+interface CornerStatusBadgeSeat {
+    icon?: string;
 }
-declare function usePopoverHost(): PopoverHost;
+interface CornerStatusBadgesProps {
+    orientationMode: OrientationMode;
+    p1OnRight: boolean;
+    p1?: CornerStatusBadgeSeat;
+    p2?: CornerStatusBadgeSeat;
+}
+declare function CornerStatusBadges({ orientationMode, p1OnRight, p1, p2 }: CornerStatusBadgesProps): react.JSX.Element;
 
-interface Props$8 {
+declare const MONO_FONT: string;
+
+interface Props$7 {
     id: string;
     host: PopoverHost;
     value: string;
@@ -109,7 +197,7 @@ interface Props$8 {
     columns?: number;
     size?: number;
 }
-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;
+declare function InlineColorPicker({ id, host, value, onChange, previewValue, swatches, takenValue, allowSwapTaken, dark, align: alignOverride, icon, tag, labelFontFamily, autoDismiss, columns, size }: Props$7): react.JSX.Element;
 
 type PopoverAlign = 'left' | 'right' | 'center';
 type PopoverVerticalAlign = 'below' | 'above';
@@ -135,7 +223,7 @@ interface AlignResult {
     measured: boolean;
     triggerRef: RefObject<View | null>;
 }
-interface Props$7<T extends string> {
+interface Props$6<T extends string> {
     id: string;
     host: PopoverHost;
     options: LabeledDropdownOption<T>[];
@@ -146,11 +234,11 @@ interface Props$7<T extends string> {
     align?: 'left' | 'right' | 'center';
     alignOverride?: AlignResult;
 }
-declare function LabeledDropdown<T extends string>({ id, host, options, value, onChange, color, dark, align: forcedAlign, alignOverride }: Props$7<T>): react.JSX.Element;
+declare function LabeledDropdown<T extends string>({ id, host, options, value, onChange, color, dark, align: forcedAlign, alignOverride }: Props$6<T>): react.JSX.Element;
 
 declare function loadSkiaWeb(): Promise<void>;
 
-interface Props$6 {
+interface Props$5 {
     visible: boolean;
     children: ReactNode;
     align?: 'left' | 'right' | 'center';
@@ -160,67 +248,23 @@ interface Props$6 {
     caretBorderWidth?: number;
     triggerSize?: number;
 }
-declare function PopoverBody({ visible, children, align, verticalAlign, caretColor, caretBorderColor, caretBorderWidth, triggerSize }: Props$6): react.JSX.Element | null;
+declare function PopoverBody({ visible, children, align, verticalAlign, caretColor, caretBorderColor, caretBorderWidth, triggerSize }: Props$5): react.JSX.Element | null;
 
-interface Props$5 {
+interface Props$4 {
     active: boolean;
     onPress: () => void;
     style?: StyleProp<ViewStyle>;
 }
-declare function PressAwayOverlay({ active, onPress, style }: Props$5): react.JSX.Element | null;
+declare function PressAwayOverlay({ active, onPress, style }: Props$4): react.JSX.Element | null;
 
-interface Props$4 {
+interface Props$3 {
     color: string;
     ready: boolean;
     onToggleReady: () => void;
     style?: StyleProp<ViewStyle>;
     labelFontFamily?: string;
 }
-declare function ReadyButton({ color, ready, onToggleReady, style, labelFontFamily }: Props$4): react.JSX.Element;
-
-interface MenuOption<T extends string | number> {
-    value: T;
-    label: string;
-    description?: string;
-    icon?: string;
-    iconSize?: number;
-}
-interface SingleSelectSection<T extends string | number> {
-    kind: 'single';
-    id: string;
-    options: MenuOption<T>[];
-    value: T;
-    onChange: (value: T) => void;
-    takenValue?: T;
-}
-interface MultiSelectSection<T extends string | number> {
-    kind: 'multi';
-    id: string;
-    options: MenuOption<T>[];
-    value: T[];
-    onChange: (value: T[]) => void;
-    allClear?: boolean;
-}
-type MenuSection = SingleSelectSection<any> | MultiSelectSection<any>;
-interface Props$3 {
-    id: string;
-    host: PopoverHost;
-    icon: string;
-    accessibilityLabel: string;
-    sections: MenuSection[];
-    accentColor: string;
-    mutedColor: string;
-    onAccentColor?: string;
-    dark: boolean;
-    align?: 'left' | 'right' | 'center';
-    autoDismiss?: boolean;
-    labelFontFamily?: string;
-    allClearLabels?: {
-        all: string;
-        clear: string;
-    };
-}
-declare function SectionedDropdown({ id, host, icon, accessibilityLabel, sections, accentColor, mutedColor, onAccentColor, dark, align: alignOverride, autoDismiss, labelFontFamily, allClearLabels }: Props$3): react.JSX.Element;
+declare function ReadyButton({ color, ready, onToggleReady, style, labelFontFamily }: Props$3): react.JSX.Element;
 
 interface Props$2 {
     onBack: () => void;
@@ -262,4 +306,4 @@ interface TriggerGaugeProps {
 
 declare function TriggerGaugeHost(props: TriggerGaugeProps): react.JSX.Element;
 
-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 };
+export { AchievementRow, BaseSettingsDialog, type BaseSettingsDialogProps, BaseStatsScreen, ConfirmDialog, type ConfirmDialogProps, ContentGutter, ControlSchemePicker, type ControlSchemePickerProps, CornerActionButtons, type CornerStatusBadgeSeat, CornerStatusBadges, type CornerStatusBadgesProps, InlineColorPicker, LABELED_DROPDOWN_POPOVER_WIDTH, LOCKED_BADGE_COLOR, LabeledDropdown, type LabeledDropdownOption, MONO_FONT, type MenuOption, type MenuSection, type MultiSelectSection, type OrientationMode, type PopoverAlign, PopoverBody, type PopoverHost, type PopoverVerticalAlign, PressAwayOverlay, ReadyButton, SectionedDropdown, SharedActionBand, type SingleSelectSection, StatRow, StatSection, TriggerGaugeHost, type TriggerGaugeProps, getLabeledDropdownContentHeight, loadSkiaWeb, useAutoAlign, usePopoverHost };