Due to ESLint rules I am trying to break lines of a html tag with attributes (and ternary) but I can't get it working. Does anyone know how to do it? What is the correct way to break these lines?

Edit: With mouse over it says "Expected indentation of 16 space characters but found 14.eslintreact/jsx-indent-props" , but when I put on correct identation , it says "Expected indentation of 14 spaces but found 16.eslintindent".

        {
          cardTrunfo
            ? <div
              className="card__super"
              data-type="card"
              data-color="black"
              data-code="0001"
            >
              Card Name
            </div>
            : ''
        }