Package Exports

@roots/ink-use-style

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@roots/ink-use-style) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

MIT License

@roots/ink-use-style

Overview

Theme hook for React Ink.

Installation

yarn add @roots/use-ink-style

Usage

import React from 'react'
import {Box, Text} from 'ink'
import {useStyle} from '@roots/use-ink-style'

const component = () => {
  const {col, ctx, colors} = useStyle()

  return (
    <Box width={col(3)}>
      <Text>3/12 column</Text>
    </Box>

    <Box width={ctx([col(12), col(6), col(3)])}>
      <Text>Sm: 12/12 column</Text>
      <Text>Md: 6/12 column</Text>
      <Text>Lg: 3/12 column</Text>
    </Box>

    <Text color={colors.primary}>
      Colorful.
    </Text>
  )
}

Contributing

Contributions are welcome from everyone.

We have contributing guidelines to help you get started.

Bud sponsors

Help support our open-source development efforts by becoming a patron.

Community

Keep track of development and community news.

Participate on the Roots Discourse
Follow @rootswp on Twitter
Read and subscribe to the Roots Blog
Subscribe to the Roots Newsletter
Listen to the Roots Radio podcast