Add alpine-ts example

[niLPotential]

📝 Description

Add an example project using Zag as an Alpine.js plugin

⛳️ Current behavior (updates)

none

🚀 New behavior

This PR adds an example vite project simillar to the vanilla-ts example, with modifications around Alpine.js.

The src/lib/ directory exports the normalizeProps function and an AlpineMachine class.
AlpineMachine consumes the component machine and user props and returns a service.

The src/plugin.ts file exports an createZagPlugin function, which returns an Alpine.js plugin function corresponding to the given Zag component. It saves the connected api as data, initializes the machine, and reevaluates the api and re-binds the props on effect. Then one can use Zag component in html with x-component-name:part directives, and $componentName magic.

The pages/ directory contains examples in practice, with real time props manipulation like the website.

💣 Is this a breaking change (Yes/No):

No

📝 Additional Information

Although I believe this implementation to work, there are some concerns.
Mainly that this might not be the most optimal way to extend Alpine.js.
My understanding of their inner apis is lacking, so there could be an improved version.
Also, I tried some manual testing, but bugs may still happen, especially in components not listed in the example.
I would not consider this stable or be ready as an official package.
Nonetheless, a half-baked example is better than none, so hopefully this is helpful.

[changeset-bot]

⚠️ No Changeset found

Latest commit: e5c7c28

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

Click here to learn what changesets are, and how to add one.

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

💥 An error occurred when fetching the changed packages and changesets in this PR

Some errors occurred when validating the changesets config:
The package "alpine-ts" depends on the ignored package "@zag-js/shared", but "alpine-ts" is not being ignored. Please add "alpine-ts" to the `ignore` option.

[vercel]

@niLPotential is attempting to deploy a commit to the Chakra UI Team on Vercel.

A member of the Team first needs to authorize it.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Preview	Updated (UTC)
zag-nextjs	Canceled		Oct 6, 2025 1:22pm
zag-solid	Ready	Preview	Oct 6, 2025 1:22pm
zag-svelte	Canceled		Oct 6, 2025 1:22pm
zag-vue	Canceled		Oct 6, 2025 1:22pm