PHPackages                             carbon/alpine - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility & Helpers](/categories/utility)
4. /
5. carbon/alpine

ActiveNeos-carbon[Utility & Helpers](/categories/utility)

carbon/alpine
=============

Include AlpineJS into Neos

0.4.4(1mo ago)06.2k↑147.6%1JavaScriptCI passing

Since Nov 14Pushed 6d ago1 watchersCompare

[ Source](https://github.com/CarbonPackages/Carbon.Alpine)[ Packagist](https://packagist.org/packages/carbon/alpine)[ RSS](/packages/carbon-alpine/feed)WikiDiscussions main Synced 1w ago

READMEChangelog (10)Dependencies (5)Versions (67)Used By (1)

Carbon Alpine
=============

[](#carbon-alpine)

A Neos CMS package for integrating Alpine.js and a curated set of Alpine plugins, UI components, and custom extensions through the Carbon asset pipeline.

This package bundles the Alpine runtime, optional feature modules, and plugin-specific scripts in a configurable way so you can include only the pieces you need on a page.

Features
--------

[](#features)

- Alpine.js core integration for Neos
- Optional plugin loading for AJAX, anchor, clipboard, collapse, focus, intersect, mask, morph, persist, resize, and sort
- Optional UI components such as combobox, dialog, disclosure, listbox, menu, popover, radio, switch, and tabs
- Custom extension helpers for anchors, counters, fetch, focus, tooltip, tash, and typewriter
- Configurable page-level inclusion via Neos settings
- Support for both classic script bundles and ES module bundles
- Build pipeline powered by esbuild

Requirements
------------

[](#requirements)

- Neos CMS
- Carbon.IncludeAssets
- Node.js and pnpm for local development/building of frontend assets

Installation
------------

[](#installation)

Install the package with Composer:

```
composer require carbon/alpine
```

If you want to enable automatic inclusion of the Alpine scripts across all pages, add the following to your Neos configuration:

```
Neos:
  Neos:
    fusion:
      autoInclude:
        Carbon.Alpine: true
```

Configuration
-------------

[](#configuration)

The default settings are defined in [Configuration/Settings.Alpine.yaml](Configuration/Settings.Alpine.yaml).

```
Carbon:
  Alpine:
    includeOnPage: true
    useModules: true

    Main: true
    Files:
      Plugins:
        Ajax: false
        Anchor: false
        Clipboard: false
        Collapse: false
        Focus: false
        Intersect: false
        Mask: false
        Morph: false
        Persist: false
        Resize: false
        Sort: false
      UI:
        Combobox: false
        Dialog: false
        Disclosure: false
        ListBox: false
        Menu: false
        Popover: false
        Radio: false
        Switch: false
        Tabs: false
      Custom:
        Anchor: false
        Counter: false
        Fetch: false
        Focus: false
        Tash: false
        Tooltip: false
        TypeWriter: false
```

### Settings explained

[](#settings-explained)

- `includeOnPage`: includes the Alpine asset collection on the page automatically
- `useModules`: renders the files as ES modules (`.mjs`) instead of classic script files (`.js`)
- `Main`: includes the main Alpine bundle
- `Files`: enables or disables individual plugin, UI, and custom asset files

Usage
-----

[](#usage)

Once enabled, the package injects the generated script assets into the page through the Fusion integration. You can then use Alpine directives in your templates, for example:

```

  Toggle
  Content

```

The package is designed to work well with Carbon-based Neos frontends and keeps the asset loading flexible and explicit.

Project Structure
-----------------

[](#project-structure)

```
Resources/
  Private/
    Assets/        # Source assets for bundling
    Bundled/       # Built plugin/module bundles
    Fusion/        # Fusion prototypes used for script inclusion
    Source/        # TypeScript/JS source files
  Public/
    Modules/       # ESM output
    Scripts/       # Classic script output
Configuration/
  Settings.Alpine.yaml

```

Development
-----------

[](#development)

Install dependencies:

```
pnpm install
```

Build the package:

```
pnpm build
```

Run the watch mode during development:

```
pnpm watch
```

The build pipeline is configured in [build.mjs](build.mjs) and generates both script and module bundles for the public resources.

License
-------

[](#license)

This package is distributed under the project license defined by the package configuration.

Maintainer
----------

[](#maintainer)

This package is part of the Carbon package ecosystem for Neos CMS.

###  Health Score

48

—

FairBetter than 94% of packages

Maintenance95

Actively maintained with recent releases

Popularity23

Limited adoption so far

Community11

Small or concentrated contributor base

Maturity52

Maturing project, gaining track record

 Bus Factor1

Top contributor holds 96.6% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~22 days

Total

61

Last Release

48d ago

### Community

Maintainers

![](https://www.gravatar.com/avatar/5fec51ac160a110a31a72a54ac29e276a447d8306205a052d35491ac9cf0589b?d=identicon)[jonnitto](/maintainers/jonnitto)

---

Top Contributors

[![jonnitto](https://avatars.githubusercontent.com/u/4510166?v=4)](https://github.com/jonnitto "jonnitto (142 commits)")[![dependabot[bot]](https://avatars.githubusercontent.com/in/29110?v=4)](https://github.com/dependabot[bot] "dependabot[bot] (5 commits)")

---

Tags

alpinejsneos

### Embed Badge

![Health badge](/badges/carbon-alpine/health.svg)

```
[![Health](https://phpackages.com/badges/carbon-alpine/health.svg)](https://phpackages.com/packages/carbon-alpine)
```

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)