Docs ambiguity: can textStyles be defined without extends?

[JoshuaKGoldberg]

Subject

textStyles

Description

Right now, the guide in https://panda-css.com/docs/theming/text-styles suggests creating a separate text-styles.ts file and using theme.extends.textStyles in panda.config.ts. That seems unclear to me on a few points:

• Is there a reason a separate text-styles.ts file is being recommended rather than doing it inline in panda.config.ts?
• If we can do it in panda.config.ts, would directly setting it in the config be ok?

  export default defineConfig({
    theme: {
      textStyles: defineTextStyles({
        // ...
      }),
    },
  });

• If directly setting it in the config is ok, can we bypass defineTextStyles?

  export default defineConfig({
    theme: {
      textStyles: {
        // ...
      }),
    },
  });

  https://stackblitz.com/edit/vitejs-vite-cq5rda?file=src%2FApp.tsx,panda.config.ts&terminal=dev seems to indicate we can?

Whatever the answers to all these questions, requesting they be placed in the docs please. 🙂

[astahmer]

quickly answering in the meantime:

can textStyles be defined without extends

yes, the extend keyword just means that you want to deep merge your config with the presets (both built-ins & customs), if you're omitting it that means you'll erase everything else but your own config

Is there a reason a separate text-styles.ts file is being recommended rather than doing it inline in panda.config.ts

no, do as you wish

If we can do it in panda.config.ts, would directly setting it in the config be ok

yes

If directly setting it in the config is ok, can we bypass defineTextStyles

yes, those functions from @pandacss/dev are just type helpers, they don't do anything at runtime