Is there an analogue of LESS's .classname& in SASS?

Question

Sass

In LESS, I could write in a mixin that is applied to a .timeline-item (which has a .timeline parent)

.timeline-item-variant(@top-offset, @arrow-width) {
  // other styles

  .timeline-single-column& > .timeline-event {
    .timeline-item-right-side-position(@arrow-width);
  }
}

it transformed into

.timeline-single-column.timeline .timeline-item > .timeline-event {
  float: right !important;
}
.timeline-single-column.timeline .timeline-item > .timeline-event:before,
.timeline-single-column.timeline .timeline-item > .timeline-event:after {
  right: auto !important;
  border-left-width: 0 !important;
}
.timeline-single-column.timeline .timeline-item > .timeline-event:before {
  left: -15px !important;
  border-right-width: 15px !important;
}
.timeline-single-column.timeline .timeline-item > .timeline-event:after {
  left: -14px !important;
  border-right-width: 14px !important;
}

In SASS, a similar record is not transformed, and the ampersand remains in the final css markup

=timeline-item-variant($top-offset, $arrow-width)
  .timeline-single-column& > .timeline-event
    +timeline-item-right-side-position($arrow-width)

.timeline-single-column& > .timeline-event {
  float: right !important;
}

.timeline-single-column& > .timeline-event:before, .timeline-single-column& > .timeline-event:after {
  right: auto !important;
  border-left-width: 0 !important;
}

.timeline-single-column& > .timeline-event:before {
  left: -18px !important;
  border-right-width: 18px !important;
}

.timeline-single-column& > .timeline-event:after {
  left: -17px !important;
  border-right-width: 17px !important;
}

How to fix it?

Answer 1

=timeline-item-variant($top-offset, $arrow-width)
  @at-root .timeline-single-column#{&} > .timeline-event
    +timeline-item-right-side-position($arrow-width)