Search by

uams-web / aether-alpine-csp-forms

joshdaughertybpmore

CSP-safe Alpine form JavaScript driver for Statamic public forms, with a $showField magic that forwards to Statamic's field-conditions evaluator.

Package info

github.com/UAMS-Web/aether-alpine-csp-forms

Language:JavaScript

Type:statamic-addon

pkg:composer/uams-web/aether-alpine-csp-forms

Statistics

Installs: 2 688

Dependents: 0

Suggesters: 0

Stars: 0

Open Issues: 2

v0.3.0 2026-11-01 16:00 UTC

This package is auto-updated.

Last update: 2026-11-02 18:45:58 UTC


README

A Statamic add-on that gives public forms a JavaScript driver safe under a Content Security Policy without 'unsafe-eval'. It registers the alpine_csp form JS driver, and ships the $showField Alpine magic the driver's output calls, which forwards to Statamic's own field-conditions evaluator.

Statamic's stock alpine driver emits attribute expressions that the @alpinejs/csp build refuses to evaluate, so every conditional field on a public form fails to render. alpine_csp re-renders the two expressions that matter, and the add-on's front-end script supplies the $showField Alpine magic they call. If Statamic ships a CSP-safe driver of its own, removing this add-on returns the site to the stock driver.

Releases are 0.x pre-releases until 1.0.0: a minor release can carry a breaking change, and its release notes call it out first with the action to take.

Requirements

PHP 8.4 or later and Statamic 6.35.1 or later. The host loads Alpine itself, using the @alpinejs/csp build, and loads Statamic's front-end helpers.js, which defines the field-conditions evaluator the magic forwards to. Statamic 6.35.1 is the first release whose evaluator works without 'unsafe-eval'.

Installation

composer require uams-web/aether-alpine-csp-forms

The add-on's service provider is discovered by Statamic and registers the driver under the handle alpine_csp. Statamic publishes the front-end script to public/vendor/aether-alpine-csp-forms/frontend/alpine-csp.js after the install; php artisan vendor:publish --tag=aether-alpine-csp-forms --force republishes it.

Usage

Select the driver on the form tag. The scoped form is unchanged:

{{ form:create js="alpine_csp" }}
{{ form:create js="alpine_csp:intake" }}

Load Statamic's helpers.js, then the front-end script, before the host's own Alpine bundle starts. As classic deferred scripts they run in document order:

<script defer src="/vendor/statamic/frontend/js/helpers.js"></script>
<script defer src="/vendor/aether-alpine-csp-forms/frontend/alpine-csp.js"></script>
<script defer src="/build/site.js"></script>

Statamic publishes helpers.js to public/vendor/statamic/frontend/js/helpers.js. Without it, $showField shows every conditional field and logs one console error naming the missing script.

The script registers the $showField magic when Alpine dispatches alpine:init, so the host has to set window.Alpine before it calls Alpine.start(). A host that bundles the script instead can import registerShowFieldMagic from resources/js/alpine-csp.js and call it with its Alpine instance.

Upgrading from statamic-alpine-csp-forms

The package was renamed from uams-web/statamic-alpine-csp-forms to uams-web/aether-alpine-csp-forms, and Composer does not redirect a package name. The alpine_csp driver handle, the $showField magic and the form tags are unchanged. A site changes four things:

  1. Run composer remove uams-web/statamic-alpine-csp-forms and composer require uams-web/aether-alpine-csp-forms.
  2. Run php artisan vendor:publish --tag=aether-alpine-csp-forms --force, then delete public/vendor/statamic-alpine-csp-forms/. The script now publishes to public/vendor/aether-alpine-csp-forms/frontend/alpine-csp.js.
  3. Change the layout's script tag from /vendor/statamic-alpine-csp-forms/frontend/alpine-csp.js to /vendor/aether-alpine-csp-forms/frontend/alpine-csp.js.
  4. Where a site published the add-on's configuration, rename config/statamic-alpine-csp-forms.php to config/aether-alpine-csp-forms.php (the file holds no settings today).

The PHP namespace changed from UAMSWeb\AlpineCspForms to UAMSWeb\Aether\Forms\AlpineCsp; a site that references the add-on's classes updates those references.

Development

Developing against a host application is covered in the development guide, and the Packagist and Marketplace steps in the submission checklist. npm run build writes both the Control Panel build and the front-end script to resources/dist, which is committed.

License

MIT. See LICENSE.