Plumeriaprops
API reference for the props
The props() returns style object as hashed classes together while filtering out falsy values like undefined, false, or null. It is useful when conditionally combining styles.
Example
import * as css from '@plumeria/core';
const styles = css.create({
one: {
display: 'flex',
justifyContent: 'space-between',
},
two: {
fontSize: '14px',
color: '#606060',
},
});<div className={css.props(styles.one, styles.two)}>
{/* ... */}
</div>Usage Patterns
Conditional styles
Only truthy values are preserved.
const isActive = true;
const className = css.props(
styles.one,
isActive && styles.two
);With ternary
const className = css.props(
isDark ? styles.dark : styles.light,
isHovered && styles.hovered
);Return value
Returns a single hashes string of space-separated styleObject, ignoring falsy inputs:
css.props(styles.one, false, undefined, styles.two);See Also
Good to know
props, like all APIs, have no runtime. They are controlled at build time by plugins, so functions themselves are replaced by hashes.