Skip to content

Commit 914ec7d

Browse files
committed
Fixing live demos
1 parent 4c30382 commit 914ec7d

13 files changed

+34
-139
lines changed

ux.symfony.com/assets/styles/_terminal.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,7 @@
6363
background-color: $n-600;
6464
}
6565
/* copy button inside the code block itself */
66-
.terminal-code .terminal-body .btn-copy {
66+
.terminal-code .terminal-body .code-buttons {
6767
position: absolute;
6868
top: .5em;
6969
right: .5em;

ux.symfony.com/src/Controller/TurboController.php

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@ public function turbo(PackageRepository $packageRepository, ChatRepository $chat
4747
);
4848
}
4949

50-
return $this->renderForm('turbo/turbo.html.twig', [
50+
return $this->render('turbo/turbo.html.twig', [
5151
'form' => $form,
5252
'name' => $name,
5353
'animal' => $animal,

ux.symfony.com/templates/components/TabbedCodeBlocks.html.twig

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
1-
<div {{ attributes }}>
1+
<div {{ attributes.defaults({
2+
class: 'position-relative'
3+
}) }}>
24
<div class="terminal-code">
35
<ul class="nav nav-tabs">
46
{# set this in the child template #}

ux.symfony.com/templates/liveDemoTabsBase.html.twig

Lines changed: 0 additions & 19 deletions
This file was deleted.

ux.symfony.com/templates/live_component_demo/auto_validating_form.html.twig

Lines changed: 2 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,11 @@
11
{% extends 'liveDemoBase.html.twig' %}
22

33
{% block code_block_left %}
4-
{% component CodeBlock with { filename: 'src/Twig/RegistrationForm.php', height: '400px' } %}
5-
{% block content %}
6-
{{- source('@src/Twig/RegistrationForm.php')|cleanup_php_file -}}
7-
{% endblock %}
8-
{% endcomponent %}
4+
<twig:CodeBlock filename="src/Twig/RegistrationForm.php" height="400px" />
95
{% endblock %}
106

117
{% block code_block_right %}
12-
{% component CodeBlock with { filename: 'templates/components/RegistrationForm.html.twig', height: '400px' } %}
13-
{% block content %}
14-
{{- source('components/RegistrationForm.html.twig') -}}
15-
{% endblock %}
16-
{% endcomponent %}
8+
<twig:CodeBlock filename="templates/components/RegistrationForm.html.twig" height="400px" />
179
{% endblock %}
1810

1911
{% block demo_content %}

ux.symfony.com/templates/live_component_demo/chartjs.html.twig

Lines changed: 2 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,11 @@
11
{% extends 'liveDemoBase.html.twig' %}
22

33
{% block code_block_left %}
4-
{% component CodeBlock with { filename: 'src/Twig/DinoChart.php', height: '400px' } %}
5-
{% block content %}
6-
{{- source('@src/Twig/DinoChart.php')|cleanup_php_file -}}
7-
{% endblock %}
8-
{% endcomponent %}
4+
<twig:CodeBlock filename="src/Twig/DinoChart.php" height="400px" />
95
{% endblock %}
106

117
{% block code_block_right %}
12-
{% component CodeBlock with { filename: 'templates/components/DinoChart.html.twig', height: '400px' } %}
13-
{% block content %}
14-
{{- source('components/DinoChart.html.twig') -}}
15-
{% endblock %}
16-
{% endcomponent %}
8+
<twig:CodeBlock filename="templates/components/DinoChart.html.twig" height="400px" />
179
{% endblock %}
1810

1911
{% block demo_content %}

ux.symfony.com/templates/live_component_demo/dependent_form_fields.html.twig

Lines changed: 7 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,33 +1,11 @@
1-
{% extends 'liveDemoTabsBase.html.twig' %}
1+
{% extends 'liveDemoBase.html.twig' %}
22

3-
{% set navItems = [
4-
{ id: 'demo_component', label: 'src/Twig/MealPlanner.php' },
5-
{ id: 'demo_template', label: 'templates/components/MealPlanner.html.twig' },
6-
{ id: 'demo_form', label: 'src/Form/MealPlannerForm.php' },
7-
] %}
8-
9-
{% block demo_code_tabs %}
10-
<div class="tab-pane show active" id="demo_component">
11-
{% component CodeBlock with { language: 'php', height: '300px' } %}
12-
{% block content %}
13-
{{- source('@src/Twig/MealPlanner.php')|cleanup_php_file -}}
14-
{% endblock %}
15-
{% endcomponent %}
16-
</div>
17-
<div class="tab-pane" id="demo_template">
18-
{% component CodeBlock with { language: 'twig', height: '300px' } %}
19-
{% block content %}
20-
{{- source('components/MealPlanner.html.twig') -}}
21-
{% endblock %}
22-
{% endcomponent %}
23-
</div>
24-
<div class="tab-pane" id="demo_form">
25-
{% component CodeBlock with { language: 'php', height: '300px' } %}
26-
{% block content %}
27-
{{- source('@src/Form/MealPlannerForm.php')|cleanup_php_file -}}
28-
{% endblock %}
29-
{% endcomponent %}
30-
</div>
3+
{% block code_block_full %}
4+
<twig:TabbedCodeBlocks :files="[
5+
'src/Twig/MealPlanner.php',
6+
'templates/components/MealPlanner.html.twig',
7+
'src/Form/MealPlannerForm.php',
8+
]" />
319
{% endblock %}
3210

3311
{% block demo_content %}

ux.symfony.com/templates/live_component_demo/form_collection_type.html.twig

Lines changed: 2 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,11 @@
11
{% extends 'liveDemoBase.html.twig' %}
22

33
{% block code_block_left %}
4-
{% component CodeBlock with { filename: 'src/Twig/TodoListForm.php', height: '400px' } %}
5-
{% block content %}
6-
{{- source('@src/Twig/TodoListForm.php')|cleanup_php_file -}}
7-
{% endblock %}
8-
{% endcomponent %}
4+
<twig:CodeBlock filename="src/Twig/TodoListForm.php" height="400px" />
95
{% endblock %}
106

117
{% block code_block_right %}
12-
{% component CodeBlock with { filename: 'templates/components/TodoListForm.html.twig', height: '400px' } %}
13-
{% block content %}
14-
{{- source('components/TodoListForm.html.twig') -}}
15-
{% endblock %}
16-
{% endcomponent %}
8+
<twig:CodeBlock filename="templates/components/TodoListForm.html.twig" height="400px" />
179
{% endblock %}
1810

1911
{% block demo_content %}

ux.symfony.com/templates/live_component_demo/inline_edit.html.twig

Lines changed: 2 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,11 @@
11
{% extends 'liveDemoBase.html.twig' %}
22

33
{% block code_block_left %}
4-
{% component CodeBlock with { filename: 'src/Twig/InlineEditFood.php', height: '400px' } %}
5-
{% block content %}
6-
{{- source('@src/Twig/InlineEditFood.php')|cleanup_php_file -}}
7-
{% endblock %}
8-
{% endcomponent %}
4+
<twig:CodeBlock filename="src/Twig/InlineEditFood.php" height="400px" />
95
{% endblock %}
106

117
{% block code_block_right %}
12-
{% component CodeBlock with { filename: 'templates/components/InlineEditFood.html.twig', height: '400px' } %}
13-
{% block content %}
14-
{{- source('components/InlineEditFood.html.twig') -}}
15-
{% endblock %}
16-
{% endcomponent %}
8+
<twig:CodeBlock filename="templates/components/InlineEditFood.html.twig" height="400px" />
179
{% endblock %}
1810

1911
{% block demo_content %}

ux.symfony.com/templates/live_component_demo/invoice.html.twig

Lines changed: 8 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,41 +1,12 @@
1-
{% extends 'liveDemoTabsBase.html.twig' %}
1+
{% extends 'liveDemoBase.html.twig' %}
22

3-
{% set navItems = [
4-
{ id: 'demo_component_invoice', label: 'InvoiceCreator.php' },
5-
{ id: 'demo_invoice_template', label: 'InvoiceCreator.html.twig' },
6-
{ id: 'demo_component_invoice_item', label: 'InvoiceCreatorLineItem.php' },
7-
{ id: 'demo_invoice_item_template', label: 'InvoiceCreatorLineItem.html.twig' },
8-
] %}
9-
10-
{% block demo_code_tabs %}
11-
<div class="tab-pane show active" id="demo_component_invoice">
12-
{% component CodeBlock with { language: 'php', height: '600px' } %}
13-
{% block content %}
14-
{{- source('@src/Twig/InvoiceCreator.php')|cleanup_php_file -}}
15-
{% endblock %}
16-
{% endcomponent %}
17-
</div>
18-
<div class="tab-pane" id="demo_invoice_template">
19-
{% component CodeBlock with { language: 'twig', height: '600px' } %}
20-
{% block content %}
21-
{{- source('components/InvoiceCreator.html.twig') -}}
22-
{% endblock %}
23-
{% endcomponent %}
24-
</div>
25-
<div class="tab-pane" id="demo_component_invoice_item">
26-
{% component CodeBlock with { language: 'php', height: '600px' } %}
27-
{% block content %}
28-
{{- source('@src/Twig/InvoiceCreatorLineItem.php')|cleanup_php_file -}}
29-
{% endblock %}
30-
{% endcomponent %}
31-
</div>
32-
<div class="tab-pane" id="demo_invoice_item_template">
33-
{% component CodeBlock with { language: 'twig', height: '600px' } %}
34-
{% block content %}
35-
{{- source('components/InvoiceCreatorLineItem.html.twig') -}}
36-
{% endblock %}
37-
{% endcomponent %}
38-
</div>
3+
{% block code_block_full %}
4+
<twig:TabbedCodeBlocks :files="[
5+
'src/Twig/InvoiceCreator.php',
6+
'templates/components/InvoiceCreator.html.twig',
7+
'src/Twig/InvoiceCreatorLineItem.php',
8+
'templates/components/InvoiceCreatorLineItem.html.twig',
9+
]" />
3910
{% endblock %}
4011

4112
{% block demo_content %}

ux.symfony.com/templates/live_component_demo/voting.html.twig

Lines changed: 2 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,11 @@
11
{% extends 'liveDemoBase.html.twig' %}
22

33
{% block code_block_left %}
4-
{% component CodeBlock with { filename: 'src/Twig/FoodVote.php', height: '400px' } %}
5-
{% block content %}
6-
{{- source('@src/Twig/FoodVote.php')|cleanup_php_file -}}
7-
{% endblock %}
8-
{% endcomponent %}
4+
<twig:CodeBlock filename="src/Twig/FoodVote.php" height="400px" />
95
{% endblock %}
106

117
{% block code_block_right %}
12-
{% component CodeBlock with { filename: 'templates/components/FoodVote.html.twig', height: '400px' } %}
13-
{% block content %}
14-
{{- source('components/FoodVote.html.twig') -}}
15-
{% endblock %}
16-
{% endcomponent %}
8+
<twig:CodeBlock filename="templates/components/FoodVote.html.twig" height="400px" />
179
{% endblock %}
1810

1911
{% block demo_content %}

ux.symfony.com/templates/partials/code-block-buttons.html.twig

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
source: source,
33
})|stimulus_controller('tooltips') }}
44
data-ux-clipboard-success-content="Copied!"
5+
class="code-buttons"
56
>
67
<a
78
href="{{ link }}"

ux.symfony.com/tests/Functional/LiveComponentDemosTest.php

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,10 @@ class LiveComponentDemosTest extends KernelTestCase
1616
*/
1717
public function testDemoPagesAllLoad(LiveDemo $liveDemo): void
1818
{
19+
$router = self::bootKernel()->getContainer()->get('router');
20+
$url = $router->generate($liveDemo->getRoute());
1921
$this->browser()
20-
->visit('/live-component/demos/'.$liveDemo->getIdentifier())
22+
->visit($url)
2123
->assertSuccessful()
2224
->assertSeeIn('h1', $liveDemo->getName())
2325
;

0 commit comments

Comments
 (0)