A flexible and powerful TypeScript utility for conditional rendering and logic, inspired by functional programming patterns. condSwitch allows you to write clean, declarative, and expressive conditional logic, especially in scenarios where traditional if/else or switch statements can be verbose or cumbersome.
- π Features
- π¦ Installation
- π‘ Usage
- π€ API
- β¨ Use Cases
- π Best Practices
- πΊοΈ Roadmap
- π€ Contributing
- π License
- Declarative Style: Write more readable and maintainable code.
- Lazy Evaluation: Conditions and values can be functions, delaying their execution until needed, which can be a performance boost.
- Type-Safe: Written in TypeScript to ensure type safety.
- Flexible: Supports both object and array-based condition-value pairs.
- Default Value: Provides a fallback default value.
npm install condition-switch
# or
yarn add condition-switch
# or
pnpm add condition-switchcondSwitch takes an array of condition-value pairs and a default value. It returns the value of the first condition that evaluates to true.
import condSwitch from 'condition-switch'
const result = condSwitch(
[
{ condition: false, value: 'Not this one' },
{ condition: true, value: 'This is it!' }
],
'Default value'
)
console.log(result) // "This is it!"import condSwitch from 'condition-switch'
const result = condSwitch(
[
[false, 'Not this one'],
[true, 'This is it!']
],
'Default value'
)
console.log(result) // "This is it!"For performance-critical sections, you can use functions for conditions and values. This ensures that they are only executed when necessary.
import condSwitch from 'condition-switch'
const expensiveCalculation = () => {
console.log('Performing expensive calculation...')
return 42
}
const result = condSwitch(
[
[() => false, 'Not this one'],
[() => true, expensiveCalculation]
],
'Default value'
)
console.log(result)
// "Performing expensive calculation..."
// 42conditionWithValues(ConditionWithValue<T>[]): An array of condition-value pairs.ConditionWithValue<T>can be:{ condition: unknown, value: T | (() => T) }[unknown, T | (() => T)]
defaultValue(DefaultT | (() => DefaultT)): The value to return if no conditions are met. Can also be a function for lazy evaluation.
Condition(unknown): Any value that can be evaluated for truthiness.Value<T>(T | (() => T)): A value or a function that returns a value.
import condSwitch from 'condition-switch'
const MyComponent = ({ isLoading, isError, data }) => {
return (
<div>
{condSwitch(
[
{ condition: isLoading, value: () => <LoadingSpinner /> },
{ condition: isError, value: () => <ErrorMessage /> },
{ condition: data, value: () => <Content data={data} /> }
],
() => (
<NoDataMessage />
)
)}
</div>
)
}import condSwitch from 'condition-switch'
const getGreeting = (hour) => {
return condSwitch(
[
[hour < 12, 'Good morning'],
[hour < 18, 'Good afternoon']
],
'Good evening'
)
}
console.log(getGreeting(10)) // "Good morning"- Use functions for expensive operations: For values that are computationally expensive to generate, use a function to delay the execution until the condition is met.
- Keep conditions simple: For readability, it's best to keep the conditions as simple as possible. If you have complex logic, consider extracting it into a separate function.
- Use the object format for clarity: When you have many conditions, using the
{ condition, value }format can make your code more self-documenting.
- Add support for more complex conditions (e.g., pattern matching).
- Explore optimizations for performance.
- Add more examples and use cases to the documentation.
Contributions, issues, and feature requests are welcome! Feel free to check the issues page.
This project is MIT licensed.