8000 [TwigBridge] Apply some changes to support Bootstrap4-stable by nicolas-grekas · Pull Request #26167 · symfony/symfony · GitHub
[go: up one dir, main page]
Skip to content

[TwigBridge] Apply some changes to support Bootstrap4-stable #26167

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Feb 15, 2018
Merged

[TwigBridge] Apply some changes to support Bootstrap4-stable #26167

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
cf4e956
[TwigBridge] Apply some changes to support Bootstrap4-stable
Jan 8, 2018
14e2282
Fixed broken tests
Nyholm Feb 13, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
106 changes: 60 additions & 46 deletions src/Symfony/Bridge/Twig/Resources/views/Form/bootstrap_4_layout.html.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,11 +3,25 @@
{# Widgets #}

{% block money_widget -%}
{% if not valid %}
{% set group_class = ' form-control is-invalid' %}
{% set valid = true %}
{% endif %}
{{- parent() -}}
{%- set prepend = not (money_pattern starts with '{{') -%}
{%- set append = not (money_pattern ends with '}}') -%}
{%- if prepend or append -%}
<div class="input-group{{ group_class|default('') }}">
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

is group_class defined here ?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Not in this block no. The abstract form has the same code: https://github.com/symfony/symfony/blob/v4.0.4/src/Symfony/Bridge/Twig/Resources/views/Form/bootstrap_base_layout.html.twig#L14

I guess it was just copied and added some modifications.

{%- if prepend -%}
<div class="input-group-prepend">
<span class="input-group-text">{{ money_pattern|replace({ '{{ widget }}':''}) }}</span>
</div>
{%- endif -%}
{{- block('form_widget_simple') -}}
{%- if append -%}
<div class="input-group-append">
<span class="input-group-text">{{ money_pattern|replace({ '{{ widget }}':''}) }}</span>
</div>
{%- endif -%}
</div>
{%- else -%}
{{- block('form_widget_simple') -}}
{%- endif -%}
{%- endblock money_widget %}

{% block datetime_widget -%}
Expand Down Expand Up @@ -39,7 +53,6 @@
{% set attr = attr|merge({class: (attr.class|default('') ~ ' form-control is-invalid')|trim}) -%}
{% set valid = true %}
{%- endif -%}

{%- if widget == 'single_text' -%}
{{- block('form_widget_simple') -}}
{%- else -%}
Expand Down Expand Up @@ -80,7 +93,9 @@
<div class="input-group{{ not valid ? ' form-control is-invalid' }}">
{% set valid = true %}
{{- block('form_widget_simple') -}}
<span class="input-group-addon">%</span>
<div class="input-group-append">
<span class="input-group-text">%</span>
</div>
</div>
{%- endblock percent_widget %}

Expand All @@ -93,7 +108,7 @@

{%- block widget_attributes -%}
{%- if not valid %}
{% set attr = attr|merge({class: (attr.class|default('') ~ ' form-control is-invalid')|trim}) %}
{% set attr = attr|merge({class: (attr.class|default('') ~ ' is-invalid')|trim}) %}
{% endif -%}
{{ parent() }}
{%- endblock widget_attributes -%}
Expand All @@ -105,55 +120,44 @@

{% block checkbox_widget -%}
{%- set parent_label_class = parent_label_class|default(label_attr.class|default('')) -%}
{%- set attr = attr|merge({class: (attr.class|default('') ~ ' form-check-input')|trim}) -%}
{% if 'checkbox-inline' in parent_label_class %}
{{- form_label(form, null, { widget: parent() }) -}}
{% elseif 'form-check-inline' in parent_label_class %}
<div class="form-check{{ not valid ? ' form-control is-invalid' }} form-check-inline">
{%- if 'checkbox-custom' in parent_label_class -%}
{%- set attr = attr|merge({class: (attr.class|default('') ~ ' custom-control-input')|trim}) -%}
<div class="custom-control custom-checkbox{{ 'checkbox-inline' in parent_label_class ? ' custom-control-inline' }}">
{{- form_label(form, null, { widget: parent() }) -}}
</div>
{% else -%}
<div class="form-check{{ not valid ? ' form-control is-invalid' }}">
{%- else -%}
{%- set attr = attr|merge({class: (attr.class|default('') ~ ' form-check-input')|trim}) -%}
<div class="form-check{{ 'checkbox-inline' in parent_label_class ? ' form-check-inline' }}">
{{- form_label(form, null, { widget: parent() }) -}}
</div>
{%- endif -%}
{%- endblock checkbox_widget %}

{% block radio_widget -%}
{%- set parent_label_class = parent_label_class|default(label_attr.class|default('')) -%}
{%- set attr = attr|merge({class: (attr.class|default('') ~ ' form-check-input')|trim}) -%}
{%- if 'radio-inline' in parent_label_class -%}
{{- form_label(form, null, { widget: parent() }) -}}
{%- if 'radio-custom' in parent_label_class -%}
{%- set attr = attr|merge({class: (attr.class|default('') ~ ' custom-control-input')|trim}) -%}
<div class="custom-control custom-radio{{ 'radio-inline' in parent_label_class ? ' custom-control-inline' }}">
{{- form_label(form, null, { widget: parent() }) -}}
</div>
{%- else -%}
<div class="form-check{{ not valid ? ' form-control is-invalid' }}">
{%- set attr = attr|merge({class: (attr.class|default('') ~ ' form-check-input')|trim}) -%}
<div class="form-check{{ 'radio-inline' in parent_label_class ? ' form-check-inline' }}">
{{- form_label(form, null, { widget: parent() }) -}}
</div>
{%- endif -%}
{%- endblock radio_widget %}

{% block choice_widget_expanded -%}
{% if '-inline' in label_attr.class|default('') -%}
<div {{ block('widget_container_attributes') }}>
{%- for child in form %}
{{- form_widget(child, {
parent_label_class: label_attr.class|default(''),
translation_domain: choice_translation_domain,
valid: valid,
}) -}}
{% endfor -%}
{%- else -%}
{%- if not valid -%}
{%- set attr = attr|merge({class: (attr.class|default('') ~ ' form-control is-invalid')|trim}) %}
{%- endif -%}
<div {{ block('widget_container_attributes') }}>
{%- for child in form %}
{{- form_widget(child, {
parent_label_class: label_attr.class|default(''),
translation_domain: choice_translation_domain,
valid: true,
}) -}}
{% endfor -%}
</div>
{%- endif %}
</div>
{%- endblock choice_widget_expanded %}

{# Labels #}
Expand All @@ -162,7 +166,7 @@
{% if label is not same as(false) -%}
{%- if compound is defined and compound -%}
{%- set element = 'legend' -%}
{%- set label_attr = label_attr|merge({class: (label_attr.class|default('') ~ ' col-form-legend')|trim}) -%}
{%- set label_attr = label_attr|merge({class: (label_attr.class|default('') ~ ' col-form-label')|trim}) -%}
{%- else -%}
{%- set label_attr = label_attr|merge({for: id, class: (label_attr.class|default('') ~ ' form-control-label')|trim}) -%}
{%- endif -%}
Expand All @@ -179,19 +183,26 @@
{% set label = name|humanize %}
{%- endif -%}
{%- endif -%}
<{{ element|default('label') }}{% if label_attr %}{% with { attr: label_attr } %}{{ block('attributes') }}{% endwith %}{% endif %}>{{ translation_domain is same as(false) ? label : label|trans({}, translation_domain) }}{% block form_label_errors %}{{- form_errors(form) -}}{% endblock form_label_errors %}</{{ element|default('label') }}>
<{{ element|default('label') }}{% if label_attr %}{% with { attr: label_attr } %}{{ block('attributes') }}{% endwith %}{% endif %}>{{ translation_domain is same as(false) ? label : label|trans({}, translation_domain) }}{{- form_errors(form) -}}</{{ element|default('label') }}>
{%- endif -%}
{%- endblock form_label %}

{% block checkbox_radio_label -%}
{#- Do not display the label if widget is not defined in order to prevent double label rendering -#}
{%- if widget is defined -%}
{%- set label_attr = label_attr|merge({class: (label_attr.class|default('') ~ ' form-check-label')|trim}) -%}
{%- if parent_label_class is defined and ('checkbox-custom' in parent_label_class or 'radio-custom' in parent_label_class) -%}
{%- set label_attr = label_attr|merge({class: (label_attr.class|default('') ~ ' custom-control-label')|trim}) -%}
{%- else %}
{%- set label_attr = label_attr|merge({class: (label_attr.class|default('') ~ ' form-check-label')|trim}) -%}
{%- endif %}
{%- if not compound -%}
{% set label_attr = label_attr|merge({'for': id}) %}
{%- endif -%}
{%- if required -%}
{%- set label_attr = label_attr|merge({class: (label_attr.class|default('') ~ ' required')|trim}) -%}
{%- endif -%}
{%- if parent_label_class is defined -%}
{%- set label_attr = label_attr|merge({class: (label_attr.class|default('') ~ ' ' ~ parent_label_class)|trim}) -%}
{%- set label_attr = label_attr|merge({class: (label_attr.class|default('') ~ ' ' ~ parent_label_class)|replace({'checkbox-inline': '', 'radio-inline': '', 'checkbox-custom': '', 'radio-custom': ''})|trim}) -%}
{%- endif -%}
{%- if label is not same as(false) and label is empty -%}
{%- if label_format is not empty -%}
Expand All @@ -203,8 +214,11 @@
{%- set label = name|humanize -%}
{%- endif -%}
{%- endif -%}

{{ widget|raw }}
<label{% for attrname, attrvalue in label_attr %} {{ attrname }}="{{ attrvalue }}"{% endfor %}>
{{- widget|raw }} {{ label is not same as(false) ? (translation_domain is same as(false) ? label : label|trans({}, translation_domain)) -}}
{{- label is not same as(false) ? (translation_domain is same as(false) ? label : label|trans({}, translation_domain)) -}}
{{- form_errors(form) -}}
</label>
{%- endif -%}
{%- endblock checkbox_radio_label %}
Expand All @@ -225,12 +239,12 @@

{% block form_errors -%}
{%- if errors|length > 0 -%}
<div class="{% if form is not rootform %}invalid-feedback{% else %}alert alert-danger{% endif %}">
<ul class="list-unstyled mb-0">
{%- for error in errors -%}
<li>{{ error.message }}</li>
{%- endfor -%}
</ul>
</div>
<div class="{% if form is not rootform %}invalid-feedback d-block{% else %}alert alert-danger{% endif %}">
<ul class="list-unstyled mb-0">
{%- for error in errors -%}
<li>{{ error.message }}</li>
{%- endfor -%}
</ul>
</div>
{%- endif %}
{%- endblock form_errors %}
2 changes: 1 addition & 1 deletion src/Symfony/Bridge/Twig/Resources/views/Form/bootstrap_base_layout.html.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -147,7 +147,7 @@

{% block choice_label -%}
{# remove the checkbox-inline and radio-inline class, it's only useful for embed labels #}
{%- set label_attr = label_attr|merge({class: label_attr.class|default('')|replace({'checkbox-inline': '', 'radio-inline': ''})|trim}) -%}
{%- set label_attr = label_attr|merge({class: label_attr.class|default('')|replace({'checkbox-inline': '', 'radio-inline': '', 'checkbox-custom': '', 'radio-custom': ''})|trim}) -%}
{{- block('form_label') -}}
{% endblock choice_label %}

Expand Down
4 changes: 2 additions & 2 deletions src/Symfony/Bridge/Twig/composer.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@
"symfony/asset": "~2.8|~3.0|~4.0",
"symfony/dependency-injection": "~2.8|~3.0|~4.0",
"symfony/finder": "~2.8|~3.0|~4.0",
"symfony/form": "~3.4|~4.0",
"symfony/form": "^3.4.5|^4.0.5",
"symfony/http-foundation": "^3.3.11|~4.0",
"symfony/http-kernel": "~3.2|~4.0",
"symfony/polyfill-intl-icu": "~1.0",
Expand All @@ -41,7 +41,7 @@
"symfony/workflow": "~3.3|~4.0"
},
"conflict": {
"symfony/form": "<3.4",
"symfony/form": "<3.4.5",
"symfony/console": "<3.4"
},
"suggest": {
Expand Down
4 changes: 2 additions & 2 deletions src/Symfony/Component/Form/Tests/AbstractBootstrap4HorizontalLayoutTest.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@ public function testLabelOnForm()

$this->assertMatchesXpath($html,
'/legend
[@class="col-form-label col-sm-2 col-form-legend required"]
[@class="col-form-label col-sm-2 col-form-label required"]
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Here is the col-form-label added twice. Do we bother?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

it would be better if we could avoid, to make the HTML cleaner. But it should not break anything.

[.="[trans]Name[/trans]"]
'
);
Expand Down Expand Up @@ -144,7 +144,7 @@ public function testLegendOnExpandedType()

$this->assertMatchesXpath($html,
'/legend
[@class="col-sm-2 col-form-legend required"]
[@class="col-sm-2 col-form-label required"]
[.="[trans]Custom label[/trans]"]
'
);
Expand Down
Loading
0