@openeuropa/bcl-form-input 0.1.3 → 0.1.202411051450
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/form-input.html.twig +101 -71
- package/package.json +2 -2
package/form-input.html.twig
CHANGED
|
@@ -1,65 +1,73 @@
|
|
|
1
|
-
{% spaceless %}
|
|
1
|
+
{% apply spaceless %}
|
|
2
2
|
|
|
3
3
|
{#
|
|
4
4
|
Parameters:
|
|
5
|
-
-
|
|
6
|
-
-
|
|
7
|
-
-
|
|
8
|
-
-
|
|
9
|
-
-
|
|
10
|
-
-
|
|
11
|
-
-
|
|
12
|
-
-
|
|
13
|
-
-
|
|
14
|
-
-
|
|
15
|
-
-
|
|
16
|
-
-
|
|
17
|
-
-
|
|
18
|
-
-
|
|
19
|
-
-
|
|
20
|
-
-
|
|
21
|
-
-
|
|
22
|
-
-
|
|
23
|
-
-
|
|
5
|
+
- id (string) (default: '')
|
|
6
|
+
- input_type (string) (default: 'text')
|
|
7
|
+
- label (string) (default: '')
|
|
8
|
+
- required (boolean) (default: false)
|
|
9
|
+
- checked (boolean) (default: false)
|
|
10
|
+
- hidden_label (boolean) (default: false)
|
|
11
|
+
- disabled (boolean) (default: false)
|
|
12
|
+
- readonly (boolean) (default: false)
|
|
13
|
+
- invalid (boolean) (default: false)
|
|
14
|
+
- valid (boolean) (default: false)
|
|
15
|
+
- invalid_feedback (string) (default: '')
|
|
16
|
+
- valid_feedback (string) (default: '')
|
|
17
|
+
- floating (boolean) (default: false)
|
|
18
|
+
- helper_text (string) (default: '')
|
|
19
|
+
- helper_text_id (string) (default: '')
|
|
20
|
+
- placeholder (string) (default: '')
|
|
21
|
+
- horizontal (boolean) (default: false)
|
|
22
|
+
- horizontal_class (string) (default: col-sm-10)
|
|
23
|
+
- horizontal_label_class (string) (default: col-sm-2)
|
|
24
|
+
- switch (boolean) (default: false)
|
|
25
|
+
- toggle (boolean) (default: false)
|
|
26
|
+
- toggle_variant (string) (default: 'primary')
|
|
27
|
+
- remove_wrapper (boolean) (default: false)
|
|
28
|
+
- attributes (drupal attrs)
|
|
24
29
|
#}
|
|
25
30
|
|
|
26
31
|
{% set _id = id|default('') %}
|
|
27
|
-
{% set
|
|
28
|
-
{% set _size = size|default('') %}
|
|
32
|
+
{% set _input_type = input_type|default('text') %}
|
|
29
33
|
{% set _label = label|default('') %}
|
|
30
|
-
{% set _required = required
|
|
31
|
-
{% set _checked = checked
|
|
32
|
-
{% set _hidden_label = hidden_label
|
|
33
|
-
{% set _disabled = disabled
|
|
34
|
-
{% set _readonly = readonly
|
|
35
|
-
{% set _invalid = invalid
|
|
36
|
-
{% set
|
|
34
|
+
{% set _required = required ?? false %}
|
|
35
|
+
{% set _checked = checked ?? false %}
|
|
36
|
+
{% set _hidden_label = hidden_label ?? false %}
|
|
37
|
+
{% set _disabled = disabled ?? false %}
|
|
38
|
+
{% set _readonly = readonly ?? false %}
|
|
39
|
+
{% set _invalid = invalid ?? false %}
|
|
40
|
+
{% set _valid = valid ?? false %}
|
|
41
|
+
{% set _invalid_feedback = invalid_feedback|default('') %}
|
|
42
|
+
{% set _valid_feedback = valid_feedback|default('') %}
|
|
43
|
+
{% set _floating = floating ?? false %}
|
|
37
44
|
{% set _helper_text = helper_text|default('') %}
|
|
38
45
|
{% set _helper_text_id = helper_text_id|default('') %}
|
|
39
46
|
{% set _placeholder = placeholder|default('') %}
|
|
40
|
-
{% set _horizontal = horizontal
|
|
47
|
+
{% set _horizontal = horizontal ?? false %}
|
|
41
48
|
{% set _horizontal_class = horizontal_class|default('col-sm-10') %}
|
|
42
49
|
{% set _horizontal_label_class = horizontal_label_class|default('col-sm-2') %}
|
|
43
|
-
{% set _switch = switch
|
|
44
|
-
{% set _toggle = toggle
|
|
50
|
+
{% set _switch = switch ?? false %}
|
|
51
|
+
{% set _toggle = toggle ?? false %}
|
|
45
52
|
{% set _toggle_variant = toggle_variant|default('primary') %}
|
|
46
|
-
{% set _remove_wrapper = remove_wrapper
|
|
53
|
+
{% set _remove_wrapper = remove_wrapper ?? false %}
|
|
54
|
+
|
|
47
55
|
{% set _label_block = false %}
|
|
48
56
|
{% set _label_class = 'form-label' %}
|
|
49
|
-
{% set
|
|
57
|
+
{% set _classes = ['form-control'] %}
|
|
50
58
|
|
|
51
|
-
{% if
|
|
52
|
-
{% set
|
|
53
|
-
{% endif %}
|
|
54
|
-
{% if type == 'range' %}
|
|
55
|
-
{% set _class = 'form-range' %}
|
|
59
|
+
{% if input_type == 'range' %}
|
|
60
|
+
{% set _classes = ['form-range'] %}
|
|
56
61
|
{% endif %}
|
|
57
|
-
{% if
|
|
58
|
-
{% set
|
|
62
|
+
{% if _input_type == 'checkbox' or _input_type == 'radio' %}
|
|
63
|
+
{% set _classes = ['form-check-input'] %}
|
|
59
64
|
{% set _label_class = 'form-check-label' %}
|
|
60
65
|
{% endif %}
|
|
61
66
|
{% if _invalid is not empty %}
|
|
62
|
-
{% set
|
|
67
|
+
{% set _classes = _classes|merge(['is-invalid']) %}
|
|
68
|
+
{% endif %}
|
|
69
|
+
{% if _valid is not empty %}
|
|
70
|
+
{% set _classes = _classes|merge(['is-valid']) %}
|
|
63
71
|
{% endif %}
|
|
64
72
|
{% if _horizontal %}
|
|
65
73
|
{% set _label_class = 'col-form-label ' ~ _horizontal_label_class %}
|
|
@@ -69,7 +77,41 @@
|
|
|
69
77
|
{% endif %}
|
|
70
78
|
{% if _toggle %}
|
|
71
79
|
{% set _label_class = _label_class ~ ' btn btn-' ~ _toggle_variant %}
|
|
72
|
-
{% set
|
|
80
|
+
{% set _classes = _classes|merge(['btn-check']) %}
|
|
81
|
+
{% endif %}
|
|
82
|
+
|
|
83
|
+
{% if attributes is empty %}
|
|
84
|
+
{% set attributes = create_attribute() %}
|
|
85
|
+
{% endif %}
|
|
86
|
+
|
|
87
|
+
{% set attributes = attributes.addClass(_classes).setAttribute('type', _input_type) %}
|
|
88
|
+
|
|
89
|
+
{% if _id %}
|
|
90
|
+
{% set attributes = attributes.setAttribute('id', _id) %}
|
|
91
|
+
{% endif %}
|
|
92
|
+
|
|
93
|
+
{% if _required %}
|
|
94
|
+
{% set attributes = attributes.setAttribute('required', true) %}
|
|
95
|
+
{% endif %}
|
|
96
|
+
|
|
97
|
+
{% if _disabled %}
|
|
98
|
+
{% set attributes = attributes.setAttribute('disabled', true) %}
|
|
99
|
+
{% endif %}
|
|
100
|
+
|
|
101
|
+
{% if _readonly %}
|
|
102
|
+
{% set attributes = attributes.setAttribute('readonly', true) %}
|
|
103
|
+
{% endif %}
|
|
104
|
+
|
|
105
|
+
{% if _checked %}
|
|
106
|
+
{% set attributes = attributes.setAttribute('checked', true) %}
|
|
107
|
+
{% endif %}
|
|
108
|
+
|
|
109
|
+
{% if _placeholder is not empty %}
|
|
110
|
+
{% set attributes = attributes.setAttribute('placeholder', _placeholder) %}
|
|
111
|
+
{% endif %}
|
|
112
|
+
|
|
113
|
+
{% if _helper_text_id is not empty %}
|
|
114
|
+
{% set attributes = attributes.setAttribute('aria-describedby', _helper_text_id) %}
|
|
73
115
|
{% endif %}
|
|
74
116
|
|
|
75
117
|
{% if _label is not empty %}
|
|
@@ -85,12 +127,12 @@
|
|
|
85
127
|
{% endset %}
|
|
86
128
|
{% endif %}
|
|
87
129
|
|
|
88
|
-
{% if (_floating or _horizontal or
|
|
130
|
+
{% if (_floating or _horizontal or _input_type == 'checkbox' or _input_type == 'radio') and
|
|
89
131
|
not _toggle and
|
|
90
132
|
not _remove_wrapper
|
|
91
133
|
%}
|
|
92
134
|
{% set _wrapper_class = _floating ? 'form-floating' : '' %}
|
|
93
|
-
{% if (
|
|
135
|
+
{% if (_input_type == 'checkbox' or _input_type == 'radio') %}
|
|
94
136
|
{% set _wrapper_class = 'form-check' %}
|
|
95
137
|
{% if _switch %}
|
|
96
138
|
{% set _wrapper_class = _wrapper_class ~ ' form-switch' %}
|
|
@@ -100,43 +142,31 @@
|
|
|
100
142
|
<div class="{{ _wrapper_class }}">
|
|
101
143
|
{% endif %}
|
|
102
144
|
{% endif %}
|
|
103
|
-
{% if _label_block and _floating == false and
|
|
145
|
+
{% if _label_block and _floating == false and _input_type != 'checkbox' and _input_type != 'radio' %}
|
|
104
146
|
{{ _label_block|raw }}
|
|
105
147
|
{% endif %}
|
|
106
148
|
{% if _horizontal and floating == false %}
|
|
107
149
|
<div class="{{ _horizontal_class }}">
|
|
108
150
|
{% endif %}
|
|
109
151
|
<input
|
|
110
|
-
|
|
111
|
-
class="{{ _class }}"
|
|
112
|
-
{% if _id %}
|
|
113
|
-
id="{{ _id }}"
|
|
114
|
-
{% endif %}
|
|
115
|
-
{% if _required %}
|
|
116
|
-
required
|
|
117
|
-
{% endif %}
|
|
118
|
-
{% if _disabled %}
|
|
119
|
-
disabled
|
|
120
|
-
{% endif %}
|
|
121
|
-
{% if _readonly %}
|
|
122
|
-
readonly
|
|
123
|
-
{% endif %}
|
|
124
|
-
{% if _checked %}
|
|
125
|
-
checked
|
|
126
|
-
{% endif %}
|
|
127
|
-
{% if _placeholder is not empty %}
|
|
128
|
-
placeholder="{{ _placeholder }}"
|
|
129
|
-
{% endif %}
|
|
130
|
-
{% if _helper_text_id is not empty %}
|
|
131
|
-
aria-describedby="{{ _helper_text_id }}"
|
|
132
|
-
{% endif %}
|
|
152
|
+
{{ attributes }}
|
|
133
153
|
>
|
|
134
154
|
{% if _horizontal and floating == false %}
|
|
135
155
|
</div>
|
|
136
156
|
{% endif %}
|
|
137
|
-
{% if _label_block and (_floating or
|
|
157
|
+
{% if _label_block and (_floating or _input_type == 'checkbox' or _input_type == 'radio') %}
|
|
138
158
|
{{ _label_block|raw }}
|
|
139
159
|
{% endif %}
|
|
160
|
+
{% if _invalid_feedback is not empty %}
|
|
161
|
+
<div class="invalid-feedback">
|
|
162
|
+
{{- _invalid_feedback -}}
|
|
163
|
+
</div>
|
|
164
|
+
{% endif %}
|
|
165
|
+
{% if _valid_feedback is not empty %}
|
|
166
|
+
<div class="valid-feedback">
|
|
167
|
+
{{- _valid_feedback -}}
|
|
168
|
+
</div>
|
|
169
|
+
{% endif %}
|
|
140
170
|
{% if _helper_text is not empty %}
|
|
141
171
|
<div
|
|
142
172
|
class="form-text"
|
|
@@ -150,4 +180,4 @@
|
|
|
150
180
|
</div>
|
|
151
181
|
{% endif %}
|
|
152
182
|
|
|
153
|
-
{%
|
|
183
|
+
{% endapply %}
|
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"name": "@openeuropa/bcl-form-input",
|
|
3
3
|
"author": "European Commission",
|
|
4
4
|
"license": "EUPL-1.2",
|
|
5
|
-
"version": "0.1.
|
|
5
|
+
"version": "0.1.202411051450",
|
|
6
6
|
"publishConfig": {
|
|
7
7
|
"access": "public"
|
|
8
8
|
},
|
|
@@ -21,5 +21,5 @@
|
|
|
21
21
|
"design-system",
|
|
22
22
|
"twig"
|
|
23
23
|
],
|
|
24
|
-
"gitHead": "
|
|
24
|
+
"gitHead": "d553864c2d2214729cf74aa765606f2c447bb456"
|
|
25
25
|
}
|