# unicorn/no-nested-ternary

> Disallow deeply nested ternaries, and require parentheses around a ternary in a ternary

In `a ? b : c ? d : e`, it's hard to see which `:` belongs to which `?`. This rule allows one ternary inside another if the inner one is in parentheses. A third level is always reported.

`--fix` adds the parentheses. It doesn't rewrite a third level.

{/* Generated by src/codegen/lint-rule-docs.ts. Do not edit this section. */}

## Configure

Off by default. To turn it on:

```toml bunfig.toml
[lint.rules]
"unicorn/no-nested-ternary" = "error" # or "warn"
```

{/* End of the generated section. */}

## Examples

Reported:

{/* bad */}
```js
const size = width > 1200 ? "large" : width > 600 ? "medium" : "small";
```

{/* bad */}
```js
const size = width > 1200 ? "large" : (width > 600 ? "medium" : (width > 300 ? "small" : "tiny"));
```

Not reported:

{/* good */}
```js
const size = width > 1200 ? "large" : (width > 600 ? "medium" : "small");
```

For more than two levels, use `if` statements:

{/* good */}
```js
function sizeOf(width) {
  if (width > 1200) return "large";
  if (width > 600) return "medium";
  return width > 300 ? "small" : "tiny";
}
```