Define layerStyles for ease of use downstream

[hobbescodes]

Description

Task link: https://trello.com/c/O45eOzvK/325-define-layerstyles-for-aniref-preset

Added layerStyles to ANIREF preset. This allows layerStyle prop for panda components to be accessible downstream and allows for quick default (or override) styling. Also updated the Button component recipe (added border width to base) to have consistent sizing across all variants. Updated Banner recipe to use custom gradientAccent layer style for defined gradient variant.

Test Steps

1. Verify that styles look good for Button recipe updates (check hover states, disabled states, etc to make sure that they are consistent with what is expected).
2. Verify that styles are rendered appropriately for Banner when gradient variant is used.
3. Verify that layerStyle prop can be used and that the appropriate styles are applied.

Note

For third test step, apply layerStyle="subtleGradient" to any Flex container or whatever and verify that appropriate styles are rendered.

Warning

We may need to inspect downstream Buttons to verify that the added borderWidth in the recipes does not throw anything off in terms of layout and spacing. At the end of the day I believe that this change was appropriate so that each variant has consistent sizing.

[changeset-bot]

🦋 Changeset detected

Latest commit: ce22d2f

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@animareflection/ui	Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[github-actions]

Deploy preview for ui-storybook ready!

✅ Preview
https://ui-storybook-hlyb01lmf-animareflection.vercel.app

Built with commit ce22d2f.
This pull request is being automatically deployed with vercel-action