Docs / Utilities

classNames & SenseClassNamesPipe

Utility and pipe for composing conditional CSS class strings from strings, arrays, and object maps in @artificialsenselabs/ui.

Live demo: run nx serve showcase and open /components/class-names (port 4202).

Overview

Category: Utility. Import: import { classNames, SenseClassNamesPipe } from '@artificialsenselabs/ui';

<span [class]="base | senseClassNames: { 'is-active': active() }">Status</span>

Behavior

  • Falsy values (null, undefined, false) are skipped.
  • Object keys are included when their value is truthy.
  • Arrays are flattened recursively.