flexbox mixins.less

.flex() {
    display: -webkit-box; 
    display: -moz-box; 
    display:-webkit-flex;
    display: -ms-flexbox;
    display:flex;
}

.flex-justify(@justifyStyle) {

    .ms-flex-justify(@justifyStyle);
    -webkit-justify-content: @justifyStyle;
    justify-content: @justifyStyle;
}

.flex-direction(@direction) {
  -ms-flex-direction:@direction;
 -webkit-flex-direction:@direction;
  flex-direction:@direction;
}

.flex-align-items(@alignStyle) {
    -ms-flex-align:@alignStyle;
    -webkit-align-items:@alignStyle;
     align-items: @alignStyle;   
}

.flex-align-self(@selfAlignStyle) {
  .ms-flex-align-self(@selfAlignStyle);
  -webkit-align-self:@selfAlignStyle;
  align-self: @selfAlignStyle;
}

.flex-order(@order) {
  -ms-flex-order:@order;
  -webkit-order:@order;
  order:@order; 
}

.flex-wrap(@wrap) {
  -ms-flex-wrap:@wrap;
  -webkit-flex-wrap:@wrap;
   flex-wrap:@wrap; 
}



/* These are the conditional mixins for the different syntax for IE10 Flexbox*/
.ms-flex-justify(@msJustify) when (@msJustify = space-between)  {
    -ms-flex-pack:justify;
}

.ms-flex-justify(@msJustify) when (@msJustify = space-around) {
    -ms-flex-pack:distribute;
}

.ms-flex-justify(@msJustify) when (@msJustify = flex-end) {
    -ms-flex-pack:end;
}

.ms-flex-justify(@msJustify) when (@msJustify = flex-start) {
    -ms-flex-pack:start;
}

.ms-flex-justify(@msJustify) when (@msJustify = center) {
    -ms-flex-pack:center;
}

.ms-flex-align-self(@msSelfAlign) when (@msSelfAlign = flex-end) {
    -ms-flex-item-align: end;
}

.ms-flex-align-self(@msSelfAlign) when (@msSelfAlign = flex-start) {
    -ms-flex-item-align: start;
}

.ms-flex-align-self(@msSelfAlign) when (@msSelfAlign = auto), (@msSelfAlign = center),(@msSelfAlign = baseline), (@msSelfAlign = stretch) {
    -ms-flex-item-align: @msSelfAlign;
}

Thank you!

Good work; maybe a little improvement in readability (and also with DRY in mind) would be wrapping all the conditional mixins of a specific vendor prefixed property into one mixing by using LESS' nesting
e.g.:

.ms-flex-justify(@msJustify) {
    & when (@msJustify = space-between) {
        -ms-flex-pack: justify;
    }
    & when (@msJustify = space-around) {
        -ms-flex-pack: distribute;
    }
    & when (@msJustify = flex-end) {
        -ms-flex-pack: end;
    }
    & when (@msJustify = flex-start) {
        -ms-flex-pack: start;
    }
    & when (@msJustify = center) {
        -ms-flex-pack: center;
    }
}

Actually, rather than packing them together like that with when guards, you should leverage the fact that Less supports pattern matching. The following will give you appropriate compile-time errors when a wrong value is supplied by a consumer:

.ms-flex-justify(@value) {
  ._(@value);
  ._(space-between) { -ms-flex-pack: justify;    }
  ._(space-around)  { -ms-flex-pack: distribute; }
  ._(flex-end)      { -ms-flex-pack: end;        }
  ._(flex-start)    { -ms-flex-pack: start;      }
  ._(center)        { -ms-flex-pack: center;     }
}