extend(&)

[nexcode]

.header {
    &__links-item {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 28px;

        &--icon:extend(&) {
            width: 28px;
        }
    }
}

output:

.header__links-item {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 28px;
}
.header__links-item--icon {
  width: 28px;
}

I expected this:

.header__links-item--icon,
.header__links-item {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 28px;
}
.header__links-item--icon {
  width: 28px;
}

Is it possible to achieve such a result somehow?

[seven-phases-max]

No. Extend does not support anything but plain CSS selectors.
The best you can do now is something like:

.header {
    &__links-item {
        &, &--icon {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 28px;
        }

        &--icon {
            width: 28px;
        }
    }
}

[seven-phases-max]

Closing as (an edge case) duplicate of #1485.