astahmer / pandabox

a toolbox for Panda CSS
https://pandabox.vercel.app/
53 stars 4 forks source link

@pandabox/prettier-plugin: `all: unset` sorting #61

Closed Faithfinder closed 3 weeks ago

Faithfinder commented 1 month ago

all: unset gets sorted below a bunch of stuff (I'm guessing falls into "Other" category?). IMO this should always be at the top of the list. I think that should be the default behaviour, though I'm willing to set it up, just couldn't understand how - maybe an example is in order?

astahmer commented 1 month ago

hey, the sorting is based on your panda config utilities, they each have a group which is only useful for the prettier plugin. you can extend your utilities to add/update a given group. see the docs

so you could either do something like this in your panda.config.ts:

import { defineConfig } from "@pandacss/dev";

export const config = defineConfig({
  // ...
  utilities: {
    extend: {
      all: {
        group: "System"
      }
    }
  },
});

System being the 1st group in the order

or you could use the pandaFirstProps: ["all"] option of the prettier plugin to force it without touching your panda.config