Skip to main content

Variable: Styler

const Styler: object

Defined in: utils/style.ts:127

Styler utility object providing style creation and management functions.

Type Declaration​

create()​

create: <T>(style) => T

Creates a styled styles object with enhanced sizing support.

Type Parameters​

T​

T extends StyledNamedStyles<T> | StyledNamedStyles<any>

Parameters​

style​

T & StyledNamedStyles<T>

The styles object to create

Returns​

T

The created styles object with enhanced sizing capabilities

Example​

const styles = Styler.create({
  container: {
    padding: 'sizing.md',
    backgroundColor: 'theme.colors.background'
  }
});

init()​

init: (style?) => StyleContextType

Initializes a complete style configuration by merging custom settings with defaults.

Parameters​

style?​

DeepPartial<StyleContextType>

Optional partial style configuration to merge with defaults

Returns​

StyleContextType

Complete style configuration with all required properties

Example​

const styleConfig = Styler.init({
  themeConfig: {
    variant: 'dark',
    light: { colors: { primary: '#007AFF' } }
  }
});

flatten()​

flatten: <T>(style?) => SizableStyleProps<T> extends U[] ? U : SizableStyleProps<T> | Omit<SizableStyleProps<T> extends U[] ? U : SizableStyleProps<T> & object & Record<"zIndex", unknown>, "zIndex">

Flattens a style prop into a single style object.

Type Parameters​

T​

T extends object

Parameters​

style?​

StyleProp<SizableStyleProps<T>>

The style prop to flatten

Returns​

SizableStyleProps<T> extends U[] ? U : SizableStyleProps<T> | Omit<SizableStyleProps<T> extends U[] ? U : SizableStyleProps<T> & object & Record<"zIndex", unknown>, "zIndex">

Flattened style object

Example​

const flattenedStyle = Styler.flatten([
  { padding: 10 },
  { margin: 5 },
  { backgroundColor: 'red' }
]);