add ux turbo
This commit is contained in:
parent
220e140f6e
commit
437809e6fc
@ -1,3 +1,4 @@
|
|||||||
|
import './bootstrap.js';
|
||||||
/*
|
/*
|
||||||
* Welcome to your app's main JavaScript file!
|
* Welcome to your app's main JavaScript file!
|
||||||
*
|
*
|
||||||
|
5
assets/bootstrap.js
vendored
Normal file
5
assets/bootstrap.js
vendored
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
import { startStimulusApp } from '@symfony/stimulus-bundle';
|
||||||
|
|
||||||
|
const app = startStimulusApp();
|
||||||
|
// register any custom, 3rd party controllers here
|
||||||
|
// app.register('some_controller_name', SomeImportedController);
|
15
assets/controllers.json
Normal file
15
assets/controllers.json
Normal file
@ -0,0 +1,15 @@
|
|||||||
|
{
|
||||||
|
"controllers": {
|
||||||
|
"@symfony/ux-turbo": {
|
||||||
|
"turbo-core": {
|
||||||
|
"enabled": true,
|
||||||
|
"fetch": "eager"
|
||||||
|
},
|
||||||
|
"mercure-turbo-stream": {
|
||||||
|
"enabled": false,
|
||||||
|
"fetch": "eager"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"entrypoints": []
|
||||||
|
}
|
79
assets/controllers/csrf_protection_controller.js
Normal file
79
assets/controllers/csrf_protection_controller.js
Normal file
@ -0,0 +1,79 @@
|
|||||||
|
const nameCheck = /^[-_a-zA-Z0-9]{4,22}$/;
|
||||||
|
const tokenCheck = /^[-_\/+a-zA-Z0-9]{24,}$/;
|
||||||
|
|
||||||
|
// Generate and double-submit a CSRF token in a form field and a cookie, as defined by Symfony's SameOriginCsrfTokenManager
|
||||||
|
document.addEventListener('submit', function (event) {
|
||||||
|
generateCsrfToken(event.target);
|
||||||
|
}, true);
|
||||||
|
|
||||||
|
// When @hotwired/turbo handles form submissions, send the CSRF token in a header in addition to a cookie
|
||||||
|
// The `framework.csrf_protection.check_header` config option needs to be enabled for the header to be checked
|
||||||
|
document.addEventListener('turbo:submit-start', function (event) {
|
||||||
|
const h = generateCsrfHeaders(event.detail.formSubmission.formElement);
|
||||||
|
Object.keys(h).map(function (k) {
|
||||||
|
event.detail.formSubmission.fetchRequest.headers[k] = h[k];
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// When @hotwired/turbo handles form submissions, remove the CSRF cookie once a form has been submitted
|
||||||
|
document.addEventListener('turbo:submit-end', function (event) {
|
||||||
|
removeCsrfToken(event.detail.formSubmission.formElement);
|
||||||
|
});
|
||||||
|
|
||||||
|
export function generateCsrfToken (formElement) {
|
||||||
|
const csrfField = formElement.querySelector('input[data-controller="csrf-protection"], input[name="_csrf_token"]');
|
||||||
|
|
||||||
|
if (!csrfField) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
let csrfCookie = csrfField.getAttribute('data-csrf-protection-cookie-value');
|
||||||
|
let csrfToken = csrfField.value;
|
||||||
|
|
||||||
|
if (!csrfCookie && nameCheck.test(csrfToken)) {
|
||||||
|
csrfField.setAttribute('data-csrf-protection-cookie-value', csrfCookie = csrfToken);
|
||||||
|
csrfField.defaultValue = csrfToken = btoa(String.fromCharCode.apply(null, (window.crypto || window.msCrypto).getRandomValues(new Uint8Array(18))));
|
||||||
|
csrfField.dispatchEvent(new Event('change', { bubbles: true }));
|
||||||
|
}
|
||||||
|
|
||||||
|
if (csrfCookie && tokenCheck.test(csrfToken)) {
|
||||||
|
const cookie = csrfCookie + '_' + csrfToken + '=' + csrfCookie + '; path=/; samesite=strict';
|
||||||
|
document.cookie = window.location.protocol === 'https:' ? '__Host-' + cookie + '; secure' : cookie;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export function generateCsrfHeaders (formElement) {
|
||||||
|
const headers = {};
|
||||||
|
const csrfField = formElement.querySelector('input[data-controller="csrf-protection"], input[name="_csrf_token"]');
|
||||||
|
|
||||||
|
if (!csrfField) {
|
||||||
|
return headers;
|
||||||
|
}
|
||||||
|
|
||||||
|
const csrfCookie = csrfField.getAttribute('data-csrf-protection-cookie-value');
|
||||||
|
|
||||||
|
if (tokenCheck.test(csrfField.value) && nameCheck.test(csrfCookie)) {
|
||||||
|
headers[csrfCookie] = csrfField.value;
|
||||||
|
}
|
||||||
|
|
||||||
|
return headers;
|
||||||
|
}
|
||||||
|
|
||||||
|
export function removeCsrfToken (formElement) {
|
||||||
|
const csrfField = formElement.querySelector('input[data-controller="csrf-protection"], input[name="_csrf_token"]');
|
||||||
|
|
||||||
|
if (!csrfField) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const csrfCookie = csrfField.getAttribute('data-csrf-protection-cookie-value');
|
||||||
|
|
||||||
|
if (tokenCheck.test(csrfField.value) && nameCheck.test(csrfCookie)) {
|
||||||
|
const cookie = csrfCookie + '_' + csrfField.value + '=0; path=/; samesite=strict; max-age=0';
|
||||||
|
|
||||||
|
document.cookie = window.location.protocol === 'https:' ? '__Host-' + cookie + '; secure' : cookie;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* stimulusFetch: 'lazy' */
|
||||||
|
export default 'csrf-protection-controller';
|
16
assets/controllers/hello_controller.js
Normal file
16
assets/controllers/hello_controller.js
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
import { Controller } from '@hotwired/stimulus';
|
||||||
|
|
||||||
|
/*
|
||||||
|
* This is an example Stimulus controller!
|
||||||
|
*
|
||||||
|
* Any element with a data-controller="hello" attribute will cause
|
||||||
|
* this controller to be executed. The name "hello" comes from the filename:
|
||||||
|
* hello_controller.js -> "hello"
|
||||||
|
*
|
||||||
|
* Delete this file or adapt it for your use!
|
||||||
|
*/
|
||||||
|
export default class extends Controller {
|
||||||
|
connect() {
|
||||||
|
this.element.textContent = 'Hello Stimulus! Edit me in assets/controllers/hello_controller.js';
|
||||||
|
}
|
||||||
|
}
|
@ -23,6 +23,7 @@
|
|||||||
"symfony/mailer": "7.2.*",
|
"symfony/mailer": "7.2.*",
|
||||||
"symfony/runtime": "7.2.*",
|
"symfony/runtime": "7.2.*",
|
||||||
"symfony/twig-bundle": "7.2.*",
|
"symfony/twig-bundle": "7.2.*",
|
||||||
|
"symfony/ux-turbo": "^2.22",
|
||||||
"symfony/yaml": "7.2.*",
|
"symfony/yaml": "7.2.*",
|
||||||
"symfonycasts/tailwind-bundle": "^0.7.1",
|
"symfonycasts/tailwind-bundle": "^0.7.1",
|
||||||
"twig/extra-bundle": "^2.12|^3.0",
|
"twig/extra-bundle": "^2.12|^3.0",
|
||||||
|
169
composer.lock
generated
169
composer.lock
generated
@ -4,7 +4,7 @@
|
|||||||
"Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
|
"Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
|
||||||
"This file is @generated automatically"
|
"This file is @generated automatically"
|
||||||
],
|
],
|
||||||
"content-hash": "97653f1b2caa753611355a9321263682",
|
"content-hash": "7bf03fa2d3a15763608c71cc0c5ad00c",
|
||||||
"packages": [
|
"packages": [
|
||||||
{
|
{
|
||||||
"name": "composer/semver",
|
"name": "composer/semver",
|
||||||
@ -4943,6 +4943,75 @@
|
|||||||
],
|
],
|
||||||
"time": "2024-09-25T14:20:29+00:00"
|
"time": "2024-09-25T14:20:29+00:00"
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
"name": "symfony/stimulus-bundle",
|
||||||
|
"version": "v2.22.1",
|
||||||
|
"source": {
|
||||||
|
"type": "git",
|
||||||
|
"url": "https://github.com/symfony/stimulus-bundle.git",
|
||||||
|
"reference": "e13034d428354023c82a1db108d40fdf6cec2d36"
|
||||||
|
},
|
||||||
|
"dist": {
|
||||||
|
"type": "zip",
|
||||||
|
"url": "https://api.github.com/repos/symfony/stimulus-bundle/zipball/e13034d428354023c82a1db108d40fdf6cec2d36",
|
||||||
|
"reference": "e13034d428354023c82a1db108d40fdf6cec2d36",
|
||||||
|
"shasum": ""
|
||||||
|
},
|
||||||
|
"require": {
|
||||||
|
"php": ">=8.1",
|
||||||
|
"symfony/config": "^5.4|^6.0|^7.0",
|
||||||
|
"symfony/dependency-injection": "^5.4|^6.0|^7.0",
|
||||||
|
"symfony/deprecation-contracts": "^2.0|^3.0",
|
||||||
|
"symfony/finder": "^5.4|^6.0|^7.0",
|
||||||
|
"symfony/http-kernel": "^5.4|^6.0|^7.0",
|
||||||
|
"twig/twig": "^2.15.3|^3.8"
|
||||||
|
},
|
||||||
|
"require-dev": {
|
||||||
|
"symfony/asset-mapper": "^6.3|^7.0",
|
||||||
|
"symfony/framework-bundle": "^5.4|^6.0|^7.0",
|
||||||
|
"symfony/phpunit-bridge": "^5.4|^6.0|^7.0",
|
||||||
|
"symfony/twig-bundle": "^5.4|^6.0|^7.0",
|
||||||
|
"zenstruck/browser": "^1.4"
|
||||||
|
},
|
||||||
|
"type": "symfony-bundle",
|
||||||
|
"autoload": {
|
||||||
|
"psr-4": {
|
||||||
|
"Symfony\\UX\\StimulusBundle\\": "src"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"notification-url": "https://packagist.org/downloads/",
|
||||||
|
"license": [
|
||||||
|
"MIT"
|
||||||
|
],
|
||||||
|
"authors": [
|
||||||
|
{
|
||||||
|
"name": "Symfony Community",
|
||||||
|
"homepage": "https://symfony.com/contributors"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"description": "Integration with your Symfony app & Stimulus!",
|
||||||
|
"keywords": [
|
||||||
|
"symfony-ux"
|
||||||
|
],
|
||||||
|
"support": {
|
||||||
|
"source": "https://github.com/symfony/stimulus-bundle/tree/v2.22.1"
|
||||||
|
},
|
||||||
|
"funding": [
|
||||||
|
{
|
||||||
|
"url": "https://symfony.com/sponsor",
|
||||||
|
"type": "custom"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"url": "https://github.com/fabpot",
|
||||||
|
"type": "github"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"url": "https://tidelift.com/funding/github/packagist/symfony/symfony",
|
||||||
|
"type": "tidelift"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"time": "2024-12-06T14:30:33+00:00"
|
||||||
|
},
|
||||||
{
|
{
|
||||||
"name": "symfony/stopwatch",
|
"name": "symfony/stopwatch",
|
||||||
"version": "v7.2.2",
|
"version": "v7.2.2",
|
||||||
@ -5439,6 +5508,104 @@
|
|||||||
],
|
],
|
||||||
"time": "2024-12-20T13:38:37+00:00"
|
"time": "2024-12-20T13:38:37+00:00"
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
"name": "symfony/ux-turbo",
|
||||||
|
"version": "v2.22.1",
|
||||||
|
"source": {
|
||||||
|
"type": "git",
|
||||||
|
"url": "https://github.com/symfony/ux-turbo.git",
|
||||||
|
"reference": "97718ea4bca26f0db843c3c0de338d6900c5a002"
|
||||||
|
},
|
||||||
|
"dist": {
|
||||||
|
"type": "zip",
|
||||||
|
"url": "https://api.github.com/repos/symfony/ux-turbo/zipball/97718ea4bca26f0db843c3c0de338d6900c5a002",
|
||||||
|
"reference": "97718ea4bca26f0db843c3c0de338d6900c5a002",
|
||||||
|
"shasum": ""
|
||||||
|
},
|
||||||
|
"require": {
|
||||||
|
"php": ">=8.1",
|
||||||
|
"symfony/stimulus-bundle": "^2.9.1"
|
||||||
|
},
|
||||||
|
"conflict": {
|
||||||
|
"symfony/flex": "<1.13"
|
||||||
|
},
|
||||||
|
"require-dev": {
|
||||||
|
"dbrekelmans/bdi": "dev-main",
|
||||||
|
"doctrine/doctrine-bundle": "^2.4.3",
|
||||||
|
"doctrine/orm": "^2.8 | 3.0",
|
||||||
|
"phpstan/phpstan": "^1.10",
|
||||||
|
"symfony/asset-mapper": "^6.4|^7.0",
|
||||||
|
"symfony/debug-bundle": "^5.4|^6.0|^7.0",
|
||||||
|
"symfony/expression-language": "^5.4|^6.0|^7.0",
|
||||||
|
"symfony/form": "^5.4|^6.0|^7.0",
|
||||||
|
"symfony/framework-bundle": "^6.4|^7.0",
|
||||||
|
"symfony/mercure-bundle": "^0.3.7",
|
||||||
|
"symfony/messenger": "^5.4|^6.0|^7.0",
|
||||||
|
"symfony/panther": "^2.1",
|
||||||
|
"symfony/phpunit-bridge": "^5.4|^6.0|^7.0",
|
||||||
|
"symfony/process": "^5.4|6.3.*|^7.0",
|
||||||
|
"symfony/property-access": "^5.4|^6.0|^7.0",
|
||||||
|
"symfony/security-core": "^5.4|^6.0|^7.0",
|
||||||
|
"symfony/stopwatch": "^5.4|^6.0|^7.0",
|
||||||
|
"symfony/twig-bundle": "^6.4|^7.0",
|
||||||
|
"symfony/ux-twig-component": "^2.21",
|
||||||
|
"symfony/web-profiler-bundle": "^5.4|^6.0|^7.0"
|
||||||
|
},
|
||||||
|
"type": "symfony-bundle",
|
||||||
|
"extra": {
|
||||||
|
"thanks": {
|
||||||
|
"url": "https://github.com/symfony/ux",
|
||||||
|
"name": "symfony/ux"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"autoload": {
|
||||||
|
"psr-4": {
|
||||||
|
"Symfony\\UX\\Turbo\\": "src/"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"notification-url": "https://packagist.org/downloads/",
|
||||||
|
"license": [
|
||||||
|
"MIT"
|
||||||
|
],
|
||||||
|
"authors": [
|
||||||
|
{
|
||||||
|
"name": "Kévin Dunglas",
|
||||||
|
"email": "kevin@dunglas.fr"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Symfony Community",
|
||||||
|
"homepage": "https://symfony.com/contributors"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"description": "Hotwire Turbo integration for Symfony",
|
||||||
|
"homepage": "https://symfony.com",
|
||||||
|
"keywords": [
|
||||||
|
"hotwire",
|
||||||
|
"javascript",
|
||||||
|
"mercure",
|
||||||
|
"symfony-ux",
|
||||||
|
"turbo",
|
||||||
|
"turbo-stream"
|
||||||
|
],
|
||||||
|
"support": {
|
||||||
|
"source": "https://github.com/symfony/ux-turbo/tree/v2.22.1"
|
||||||
|
},
|
||||||
|
"funding": [
|
||||||
|
{
|
||||||
|
"url": "https://symfony.com/sponsor",
|
||||||
|
"type": "custom"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"url": "https://github.com/fabpot",
|
||||||
|
"type": "github"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"url": "https://tidelift.com/funding/github/packagist/symfony/symfony",
|
||||||
|
"type": "tidelift"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"time": "2024-12-05T14:25:02+00:00"
|
||||||
|
},
|
||||||
{
|
{
|
||||||
"name": "symfony/var-dumper",
|
"name": "symfony/var-dumper",
|
||||||
"version": "v7.2.0",
|
"version": "v7.2.0",
|
||||||
|
@ -11,4 +11,6 @@ return [
|
|||||||
Flasher\Noty\Symfony\FlasherNotySymfonyBundle::class => ['all' => true],
|
Flasher\Noty\Symfony\FlasherNotySymfonyBundle::class => ['all' => true],
|
||||||
Doctrine\Bundle\DoctrineBundle\DoctrineBundle::class => ['all' => true],
|
Doctrine\Bundle\DoctrineBundle\DoctrineBundle::class => ['all' => true],
|
||||||
Doctrine\Bundle\MigrationsBundle\DoctrineMigrationsBundle::class => ['all' => true],
|
Doctrine\Bundle\MigrationsBundle\DoctrineMigrationsBundle::class => ['all' => true],
|
||||||
|
Symfony\UX\StimulusBundle\StimulusBundle::class => ['all' => true],
|
||||||
|
Symfony\UX\Turbo\TurboBundle::class => ['all' => true],
|
||||||
];
|
];
|
||||||
|
@ -16,4 +16,13 @@ return [
|
|||||||
'path' => './assets/app.js',
|
'path' => './assets/app.js',
|
||||||
'entrypoint' => true,
|
'entrypoint' => true,
|
||||||
],
|
],
|
||||||
|
'@hotwired/stimulus' => [
|
||||||
|
'version' => '3.2.2',
|
||||||
|
],
|
||||||
|
'@symfony/stimulus-bundle' => [
|
||||||
|
'path' => './vendor/symfony/stimulus-bundle/assets/dist/loader.js',
|
||||||
|
],
|
||||||
|
'@hotwired/turbo' => [
|
||||||
|
'version' => '7.3.0',
|
||||||
|
],
|
||||||
];
|
];
|
||||||
|
24
symfony.lock
24
symfony.lock
@ -137,6 +137,21 @@
|
|||||||
"config/routes.yaml"
|
"config/routes.yaml"
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
|
"symfony/stimulus-bundle": {
|
||||||
|
"version": "2.22",
|
||||||
|
"recipe": {
|
||||||
|
"repo": "github.com/symfony/recipes",
|
||||||
|
"branch": "main",
|
||||||
|
"version": "2.20",
|
||||||
|
"ref": "3acc494b566816514a6873a89023a35440b6386d"
|
||||||
|
},
|
||||||
|
"files": [
|
||||||
|
"assets/bootstrap.js",
|
||||||
|
"assets/controllers.json",
|
||||||
|
"assets/controllers/csrf_protection_controller.js",
|
||||||
|
"assets/controllers/hello_controller.js"
|
||||||
|
]
|
||||||
|
},
|
||||||
"symfony/twig-bundle": {
|
"symfony/twig-bundle": {
|
||||||
"version": "7.2",
|
"version": "7.2",
|
||||||
"recipe": {
|
"recipe": {
|
||||||
@ -150,6 +165,15 @@
|
|||||||
"templates/base.html.twig"
|
"templates/base.html.twig"
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
|
"symfony/ux-turbo": {
|
||||||
|
"version": "2.22",
|
||||||
|
"recipe": {
|
||||||
|
"repo": "github.com/symfony/recipes",
|
||||||
|
"branch": "main",
|
||||||
|
"version": "2.20",
|
||||||
|
"ref": "c85ff94da66841d7ff087c19cbcd97a2df744ef9"
|
||||||
|
}
|
||||||
|
},
|
||||||
"symfony/web-profiler-bundle": {
|
"symfony/web-profiler-bundle": {
|
||||||
"version": "7.2",
|
"version": "7.2",
|
||||||
"recipe": {
|
"recipe": {
|
||||||
|
@ -13,7 +13,7 @@
|
|||||||
{% block importmap %}{{ importmap('app') }}{% endblock %}
|
{% block importmap %}{{ importmap('app') }}{% endblock %}
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body data-turbo="true">
|
||||||
{% block body %}{% endblock %}
|
{% block body %}{% endblock %}
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user