mixin definitions inside mixin definitions

[jamesfoster]

Allow a mixin.Definition inside a mixin.Definition:

.apples(@width: 100px) {
  .bananas() {
    width: @width;
  }
}

.apples(50px);

#test {
  .bananas();
}

calling .apples() effectively "unlocks" the inner mixins.

This is great for encapsulating mixins/variables for libraries.

[SomMeri]

Less.js 1.3.3 already has this feature, unit test is inside scope.less test file starting at line 53. I also tested fruits example from this issue and it compiles into:

#test {
  width: 50px;
}

I tried also to import mixin into a namespace and that case works too:

.apples(@width: 100px) { .bananas() { width: @width; } }

#namespace {
  .apples(700px);
}

#test {
  #namespace > .bananas();
}

The only possible problem with this feature is that it is not really declarative, e.g. unlocking must be done before using the imported mixin. This will throw syntax error:

.apples(@width: 100px) {
  .bananas() {
     width: @width;
  }
}

#test {
  .bananas(); // syntax error
}

.apples(50px);

If the last point was intentional, then this can probably be closed.