@baystream/ui-utils

Small utility helpers shared across Baystream UI packages.

Install

npm install @baystream/ui-utils

Exports

• cx

Why this package exists

This package keeps tiny non-React helpers in one place. Right now it exports a small class name composer used by shared components.

cx

Joins class name parts into one string and removes falsy values.

Accepted values:

• string
• false
• null
• undefined

Example: conditional class names

import { cx } from '@baystream/ui-utils'

const className = cx(
  'button',
  'button--primary',
  isActive && 'button--active',
  isDisabled && 'button--disabled',
)

If isActive is true and isDisabled is false, the result will be:

'button button--primary button--active'

Example: React component usage

import { cx } from '@baystream/ui-utils'

type BadgeProps = {
  selected?: boolean
  muted?: boolean
}

export function Badge({ selected = false, muted = false }: BadgeProps) {
  return (
    <span
      className={cx(
        'badge',
        selected && 'badge--selected',
        muted && 'badge--muted',
      )}
    >
      Status
    </span>
  )
}

Notes

• In the Baystream UI monorepo, the library-testing app is normally linked to local packages/* via workspaces; you can switch it to published @baystream/* for consumer-style smoke tests — see the repository root README.