Support applying more than 1 composition token on a layer

[six7]

We should support applying more than 1 composition token on a layer.

Currently, we specify composition tokens on the composition key of a layer's pluginData.

To support multiple tokens to be applied, we should apply them as an array:

- composition: button.base
+ composition: [button.base, button.sm]

As users apply tokens, we would append the last applied one at the end.

We'd need to provide users a way to understand what order things have been applied on, I would suggest we show that in Inspect when viewing in debug mode (we might need to do better than that in the future but it should give us a quicker start).

Adding additional context from the M2 issue:

Composing composition tokens

Here’s what I’d like to see for composition tokens: If we could compose composition tokens, we could create base shapes or colour sets that could be reused across components. Similarly to how inheritance works with CSS, I would expect that if two composition tokens has conflicting values, the last one wins. But if you want to override a value, the order doesn’t matter because a property that you create directly on a composition token such as fontWeight for <Button> in the following example, has higher specificity than a value from another composition token that you pull in.

classDiagram
    note for colorset_primary "Colour “molecule” consisting of \n colours for bg, text, border, (icon)"
    Button *-- spacing_insetSquish_md : Composition
    Tab *-- spacing_insetSquish_md : Composition
    Button *-- typography_sm : Composition
    Tab *-- typography_md : Composition
    Button *-- colorset_primary : Composition
    Tab *-- colorset_primary_inverse : Composition
    
    
    class spacing_insetSquish_md {
        verticalSpace_sm  
        horisontalSpace_md
    }
    
    class typography_md {
        fontSize_md
        lineHeight_md
        fontWeight_400
    }
    
    class typography_sm {
        fontSize_sm
        lineHeight_sm
        fontWeight_400
    }
    
    class Button {
        fontWeight_500
        action()
    }
    
    class Tab {
        navigation()
    }
    
    class colorset_primary {
        bgColor_blue700
        textColor_neutral100
        borderColor_blue900
    }
    
    class colorset_primary_inverse {
        bgColor_blue100
        textColor_blue900
        borderColor_blue700
    }
        

[UdayHyma]

Added to Featurebase Roadmap : 🪙 ➕ Support multiple tokens per layer of the same type

[UdayHyma]

Migrated to Featurebase

[SamIam4Hyma]

@six7 feel free to close this one if its not planned for immediate releases as I've captured it in Featurebase. If it is planned, please add the release label so we can track it.