DesignHelpers

The design module's non-component exports (hooks, functions, constants), which the generator does not type.

type DesignHelpers = { … }

Members

brightenColor(color: string, amount: number) => string

Returns color brightened by amount.

createStylesCreateStyles

Discord's theme-aware style factory; see CreateStyles.

darkenColor(color: string, amount: number) => string

Returns color darkened by amount.

dismissAlert(key: string) => void

Closes the alert opened under key.

dismissAlertsDiscordFunction<void>

Closes every open alert.

getContrastingColor(color: string) => string

Returns a colour that contrasts with color, for content drawn on it.

hideContextMenuDiscordFunction<void>

Closes the open context menu, such as after a plugin's menu item runs.

openAlertDiscordFunction<void>

Opens an alert as openAlert(key, element); pass the same key to dismissAlert to close it.

setColorOpacity(color: string, opacity: number) => string

Returns color with its opacity set to opacity.

showConfirmModalDiscordFunction

Shows a confirm modal from { title, content, confirmText, cancelText, onConfirm }.

Shows an action sheet from { key, header: { title }, options: [{ label, icon, onPress }] }.

TextStyleSheetRecord<TextVariant, TextStyle>

The text style Discord uses for each typography variant.

ThemeContextFlagsEnumLike<typeof THEME_FLAG_KEYS>

Discord's theme flag enum: gradient themes, reduced or increased contrast, and reduced saturation.

TransitionStatesEnumLike<typeof TRANSITION_STATE_KEYS>

Discord's transition state enum; see TransitionState.

useNavigation<T = any>() => Navigation<T>

Hook that returns the navigation of the screen the calling component renders in.

useSegmentedControlState(options: SegmentedControlStateOptions) => SegmentedControlState

Hook that builds the state a SegmentedControl and its SegmentedControlPages share.

useToken(token: SemanticColorToken) => string

Hook that resolves a semantic colour token, such as Theme.colors.TEXT_DEFAULT, to a colour for the current theme.

WCAGContrastRatiosRecord<"NonText" | "Text" | "HighContrastText", number>

The minimum WCAG contrast ratios Discord applies to non-text, text and high-contrast text.