// from https://gist.github.com/rattrayalex/dacbf5838571a47f22d0ae1f8b960268 // Input and output should match (for 2-space indent formatting). // TypeScript is here: prettier/tests/format/typescript/conditional-types/new-ternary-spec.ts // EXAMPLES // mostly taken from https://github.com/prettier/prettier/issues/9561 const message = i % 3 === 0 && i % 5 === 0 ? "fizzbuzz" : i % 3 === 0 ? "fizz" : i % 5 === 0 ? "buzz" : String(i); const paymentMessageShort = state == "success" ? "Payment completed successfully" : state == "processing" ? "Payment processing" : state == "invalid_cvc" ? "There was an issue with your CVC number" : state == "invalid_expiry" ? "Expiry must be sometime in the past." : "There was an issue with the payment. Please contact support."; const paymentMessageWithABreak = state == "success" ? "Payment completed successfully" : state == "processing" ? "Payment processing" : state == "invalid_cvc" ? "There was an issue with your CVC number, and you need to take a prompt action on it." : state == "invalid_expiry" ? "Expiry must be sometime in the past." : "There was an issue with the payment. Please contact support."; const typeofExample = definition.encode ? definition.encode( typeof row[field] !== "undefined" ? row[field] : typeof definition.default !== "undefined" ? definition.default : null, ) : typeof row[field] !== "undefined" ? row[field] : typeof definition.default !== "undefined" ? definition.default : null; // (the following is semantically equivalent to the above, but written in a more-confusing style – it'd be hard to grok no matter the formatting) const typeofExampleFlipped = definition.encode ? definition.encode( typeof row[field] === "undefined" ? typeof definition.default === "undefined" ? null : definition.default : row[field], ) : typeof row[field] === "undefined" ? typeof definition.default === "undefined" ? null : definition.default : row[field]; // JSX Examples: const typicalLongConsequentWithNullAlternate = (
{children && !isEmptyChildren(children) ? : null}
); const reactRouterExampleJSX = (
{children && !isEmptyChildren(children) ? children : props.match ? component ? React.createElement(component, props) : render ? render(props) : null : null}
); const reactRouterExampleNonJSX = children && !isEmptyChildren(children) ? children : props.match ? component ? React.createElement(component, props) : render ? render(props) : null : null; inJSXExpressionContainer.withLongConditionals.example = (
{isACat() && (someReallyLongCondition || moreInThisLongCondition) ? someReallyLargeExpression.toMakeMeowNoise().willCauseParens() : someReallyLongCondition || moreInThisLongCondition ? bark() : someReallyLargeExpression.toMakeMeowNoise().willCauseParens()}
); inJSXExpressionContainer.withLoops.orBooleans.example = (
{items ? items.map((item) => item.display ? : , ) : null} {showTheStuff && (foo ? : )}
); inJSXExpressionContainer.withNullConditional = (
{isACat() ? null : } {isACat() && (someReallyLongCondition || moreInThisLongCondition) ? null : ( )} {( isACat() && (someReallyLongCondition || moreInThisLongCondition || evenMoreInThisExtraLongConditional) ) ? null : }
);