Project @pistonite/celeraCopy item path

Type Aliases§

ColorScheme

Value for the color-scheme CSS property

LoadLanguageFn

Type alias for a function that loads language files

ResizeLayoutProps

See ResizeLayoutOwnProps

TranslatorFn

i18next translator function

Variables§

celeraLogger

The logger. Can be used to modify log levels for Celera

GALE_BUILTIN_STYLES

Built-in styles for gale

i18next

The i18next instance

Functions§

addDarkSubscriber

Add a subscriber to dark mode changes and return a function to remove the subscriber

addDisplayModeSubscriber

Subscribe to display mode changes

addLocaleSubscriber

Add a subscriber to be notified when the locale changes. Returns a function to remove the subscriber

clearPersistedDarkPerference

Clears the persisted dark mode preference

clearPersistedLocalePreference

Clear the locale preference previously presisted to localStorage

convertToSupportedLocale

Convert a locale/language to a supported locale/language

convertToSupportedLocaleIn

See convertToSupportedLocale

convertToSupportedLocaleOrDefault

Convert a locale/language to a supported locale/language, or return the default locale if not found.

gale

Tailwind-like style engine, but uses griffel

getDefaultLocale

Get the default locale when initialized

getDisplayMode

Get the current display mode

getLocale

Get the current selected locale

getLocalizedLanguageName

Get the localized name of a language using Intl.DisplayNames.

getPreferredLocale

Use browser API to guess user's preferred locale

getSupportedLocales

Get the array of supported locales passed to init

initDark

Initialize the dark mode global state

initDisplayMode

Initialize display mode detection for the app.

initLocale

Initialize locale system in Pure and connect it with I18next

injectStyle

Inject a css string into a style tag identified by the id

isDark

Gets the current value of dark mode

isMobile

Check if the current UserAgent is a mobile device

prefersDarkMode

Returns if dark mode is prefered in the browser environment

setDark

Set the value of dark mode

setLocale

Set the selected locale

translate

The i18next.t translation function

useDark

React hook to get the current dark mode state

useDisplayMode

Hook to get the display mode

useLocale

React hook to get the current locale

useSwappedWheelScrollDirection

React hoook to make it so that by default, mouse wheel scrolls horizontally, and Shift + mouse wheel scrolls vertically

useTranslation

React hook to get translation function for a namespace

Classes§

DarkToggle

React component to toggle the dark mode. See DarkToggleProps

GitHubLink

React component. Button with GitHub icon that links to the GitHub repository. See GitHubLinkProps

InlineLink

React component. A link wrapper that applies inline style and prevent the lint to be split up across multiple lines. See Fluent UI Docs

LanguagePicker

React component for a language picker button or menu

MenuSwitch

React component. A menu item with a label adn a switch. See MenuSwitchProps

ResizeLayout

React component. A flex-box layout of 2 children, with a draggable divider between them. See ResizeLayoutOwnProps

ThemeProvider

React component to provide Fluent UI theme to the app

Interfaces§

DarkOptions

Option for initializing dark mode. See initDark

DarkToggleProps

React component to toggle the dark mode

DisplayModeOptions

Options for display mode detection. See initDisplayMode

GitHubLinkProps

React component. Button with GitHub icon that links to the GitHub repository.

LocaleOptions

Option for initializing locale with i18next integration

MenuSwitchProps

React component. A menu item with a label and a switch

ResizeLayoutOwnProps

React component. A flex-box layout of 2 children, with a draggable divider between them.