Grouping properties by separator

[tenorok]

Hello, thank you for helpful project!

Is it possible to break a solid list of properties by groups?

Let's Consider the example, for this config:

{
    "plugins": [
        "stylelint-order"
    ],
    "rules": {
        "order/properties-order": [
            ["position", "top", "right", "bottom", "left"],
            ["margin", "display", "width", "height", "padding"]
        ],
        "order/groups-separator": "\n"
    }
}

It's will be the result with empty line between two groups:

.foo {
    position: absolute;
    top: 0;
    bottom: 0;

    display: block;
    padding: 10px;
}

Do we have appropriate option in config now?

[jeddy3]

Yes, see the "group objects" part of the docs:

{
    "plugins": [
        "stylelint-order"
    ],
    "rules": {
        "order/properties-order": [
            {
        "emptyLineBefore": "always",
        "properties": ["position", "top", "right", "bottom", "left"],
        }, {
        "emptyLineBefore": "always",
        "properties": ["margin", "display", "width", "height", "padding"],
        } 
        ]
    }
}

[tenorok]

Oh, I somehow missed this place in the docs. Thank you for fast answer!

[graphan]

I tried something like this and it does not work:

'order/properties-order': [
      [
        {
          properties: [array of strings],
        },
        {
          emptyLineBefore: 'always',
          properties: [array of strings],
        },
      ],
      { unspecified: 'bottomAlphabetical' },
    ],

[graphan]

In my case solution was to set "declaration-empty-line-before": null as well.