feat(percy): support builder for options and adding types

[pikax]

Description

Add percy and puppeteer types, convert options to also have a builder where we can decide what options we want to use depending on the variant we are checking, add a new beforeSnapshot in case we want to make any change to the page.

It would be nice if the attributes for Story and Variants could be provided, it would be cool to add some identifier to them or to group them in a way.

<template>
  <Story my-data-group="controls">
</template>

myDataGroup could be provided in the payload when using for options.

Additional context

---

What is the purpose of this pull request?

• Bug fix
• New Feature
• Documentation update
• Other

Before submitting the PR, please make sure you do the following

• If it's a new feature, provide a convincing reason to add it. Ideally, you should open a suggestion issue first and have it approved before working on it.
• Read the Contributing Guidelines.
• Read the Pull Request Guidelines and follow the Commit Convention.
• Check that there isn't already a PR that solves the problem the same way to avoid creating a duplicate.
• Provide a description in this PR that addresses what the PR is solving, or reference the issue that it solves (e.g. fixes #123).
• Ideally, include relevant tests that fail without this PR but pass with it.

I think #373 might be able to be closed, there's already that functionality, I think with beforeSnapshot we have more flexibility to wait for things to be ready.

[stackblitz]

Run & review this pull request in StackBlitz Codeflow.

[codesandbox]

Review or Edit in CodeSandbox

Open the branch in Web Editor • VS Code • Insiders

Open Preview

[netlify]

✅ Deploy Preview for histoire-site ready!

Name	Link
🔨 Latest commit	bfe1d28
🔍 Latest deploy log	https://app.netlify.com/sites/histoire-site/deploys/65d7c88c3a041a00088e565f
😎 Deploy Preview	https://deploy-preview-690--histoire-site.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[netlify]

✅ Deploy Preview for histoire-examples-svelte3 ready!

Name	Link
🔨 Latest commit	bfe1d28
🔍 Latest deploy log	https://app.netlify.com/sites/histoire-examples-svelte3/deploys/65d7c88c0a5fff00082e625b
😎 Deploy Preview	https://deploy-preview-690--histoire-examples-svelte3.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[netlify]

✅ Deploy Preview for histoire-examples-vue3 ready!

Name	Link
🔨 Latest commit	bfe1d28
🔍 Latest deploy log	https://app.netlify.com/sites/histoire-examples-vue3/deploys/65d7c88c07d88800082c8a8f
😎 Deploy Preview	https://deploy-preview-690--histoire-examples-vue3.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[netlify]

✅ Deploy Preview for histoire-controls ready!

Name	Link
🔨 Latest commit	bfe1d28
🔍 Latest deploy log	https://app.netlify.com/sites/histoire-controls/deploys/65d7c88c3a041a00088e565d
😎 Deploy Preview	https://deploy-preview-690--histoire-controls.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.