Skip to content

Commit 4004d74

Browse files
committed
input
1 parent a944b20 commit 4004d74

File tree

8 files changed

+180
-109
lines changed

8 files changed

+180
-109
lines changed

src/bundle/Resources/views/themes/standard/design_system/components/accordion.html.twig

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,13 @@
11
{% set initially_expanded = initially_expanded|default(false) %}
22

3-
{% set classes = html_classes('ids-accordion', {
4-
'ids-accordion--is-expanded': initially_expanded
5-
}) %}
3+
{% set classes =
4+
html_classes(
5+
'ids-accordion',
6+
{
7+
'ids-accordion--is-expanded': initially_expanded
8+
}
9+
)
10+
%}
611

712
<div class="{{ classes }}">
813
<div class="ids-accordion__header">

src/bundle/Resources/views/themes/standard/design_system/components/button.html.twig

Lines changed: 33 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -6,32 +6,43 @@
66
{% set attr = attr|default({}) %}
77
{% set classes = attr.class|default('') %}
88

9-
{% set button_classes = html_cva(
10-
base: 'ids-btn',
11-
variants: {
12-
type: {
13-
'primary': 'ids-btn--primary',
14-
'secondary': 'ids-btn--secondary',
15-
'tertiary': 'ids-btn--tertiary',
16-
'black-secondary': 'ids-btn--black-secondary',
17-
'black-tertiary': 'ids-btn--black-tertiary',
18-
},
19-
size: {
20-
'large': 'ids-btn--large',
21-
'small': 'ids-btn--small',
22-
'extra-small': 'ids-btn--extra-small',
23-
},
24-
disabled: {
25-
true: 'ids-btn--disabled',
26-
},
27-
}
28-
) %}
9+
{# prettier-ignore-start #}
10+
{% set button_classes =
11+
html_cva(
12+
base: 'ids-btn',
13+
variants: {
14+
type: {
15+
primary: 'ids-btn--primary',
16+
secondary: 'ids-btn--secondary',
17+
tertiary: 'ids-btn--tertiary',
18+
'black-secondary': 'ids-btn--black-secondary',
19+
'black-tertiary': 'ids-btn--black-tertiary'
20+
},
21+
size: {
22+
large: 'ids-btn--large',
23+
small: 'ids-btn--small',
24+
'extra-small': 'ids-btn--extra-small'
25+
},
26+
disabled: {
27+
'true': 'ids-btn--disabled'
28+
}
29+
}
30+
)
31+
%}
32+
{# prettier-ignore-end #}
2933

3034
{% set attr =
3135
attr|merge({
32-
class: button_classes.apply({ type, size, disabled }, classes),
36+
class: button_classes.apply(
37+
{
38+
type,
39+
size,
40+
disabled
41+
},
42+
classes
43+
),
3344
disabled,
34-
type: 'button',
45+
type: 'button'
3546
})
3647
%}
3748

src/bundle/Resources/views/themes/standard/design_system/components/expander.html.twig

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,16 @@
44
{% set expand_label = expand_label|default('') %}
55

66
{% set label = is_expanded ? collapse_label : expand_label %}
7-
{% set classes = html_classes('ids-expander', 'ids-expander--has-label', {
8-
'ids-expander--has-icon': has_icon,
9-
'ids-expander--is-expanded': is_expanded
10-
}) %}
7+
{% set classes =
8+
html_classes(
9+
'ids-expander',
10+
'ids-expander--has-label',
11+
{
12+
'ids-expander--has-icon': has_icon,
13+
'ids-expander--is-expanded': is_expanded
14+
}
15+
)
16+
%}
1117

1218
{% include ids_get('button') with {
1319
type: 'black-tertiary',

src/bundle/Resources/views/themes/standard/design_system/components/form_label.html.twig

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

src/bundle/Resources/views/themes/standard/design_system/components/helper_text.html.twig

Lines changed: 31 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,50 +1,54 @@
1-
{% import ids_get('design-system/macros/html') as html %}
1+
{% import ids_get('macros/html') as html %}
22

3-
{% set size = size|default('medium') %}
43
{% set type = type|default('default') %}
54
{% set title = title|default('') %}
65
{% set attr = attr|default({}) %}
6+
{% set classes = attr.class|default('') %}
77

88
{% set ICONS_TYPE_MAP = {
99
default: 'info-circle',
10-
error: 'alert-error',
11-
info: 'message-bubble-info',
12-
success: 'check-circle',
13-
warning: 'alert-warning',
14-
} %}
15-
{% set ICONS_SIZE_MAP = {
16-
medium: 'small',
17-
small: 'tiny-small',
10+
error: 'alert-error'
1811
} %}
1912

20-
{% set classes =
21-
ids_create_css_class(
22-
{
23-
'ids-helper-text': true,
24-
('ids-helper-text--' ~ size): true,
25-
('ids-helper-text--' ~ type): true,
26-
},
27-
attr
13+
{% set helper_text_classes =
14+
html_cva(
15+
base: 'ids-helper-text',
16+
variants: {
17+
type: {
18+
default: 'ids-helper-text--default',
19+
error: 'ids-helper-text--error'
20+
}
21+
}
2822
)
2923
%}
3024
{% set attr =
3125
attr|merge({
32-
class: classes,
33-
title: title,
26+
class: helper_text_classes.apply(
27+
{
28+
type
29+
},
30+
classes
31+
),
32+
title: title
3433
})
3534
%}
3635

3736
<div {{ html.attributes(attr) }}>
3837
{% block icon_wrapper %}
3938
<div class="ids-helper-text__icon-wrapper">
4039
{% block icon_content %}
41-
{{ include(ids_get('design-system/components/icon') , {
42-
attr: {
43-
class: 'ids-icon ids-helper-text__icon',
44-
},
45-
name: ICONS_TYPE_MAP[type],
46-
size: ICONS_SIZE_MAP[size],
47-
}) }}
40+
{{
41+
include(
42+
ids_get('icon'),
43+
{
44+
attr: {
45+
class: 'ids-icon ids-helper-text__icon'
46+
},
47+
name: ICONS_TYPE_MAP[type],
48+
size: 'small'
49+
}
50+
)
51+
}}
4852
{% endblock %}
4953
</div>
5054
{% endblock %}

src/bundle/Resources/views/themes/standard/design_system/components/icon.html.twig

Lines changed: 22 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -10,25 +10,32 @@
1010
{% set link_href = ibexa_icon_path(name) %}
1111
{% endif %}
1212

13-
{% set icon_classes = html_cva(
14-
base: 'ids-icon',
15-
variants: {
16-
size: {
17-
'tiny': 'ids-icon--tiny',
18-
'tiny-small': 'ids-icon--tiny-small',
19-
'small': 'ids-icon--small',
20-
'small-medium': 'ids-icon--small-medium',
21-
'medium': 'ids-icon--medium',
22-
'medium-large': 'ids-icon--medium-large',
23-
'large': 'ids-icon--large',
24-
'extra-large': 'ids-icon--extra-large',
13+
{% set icon_classes =
14+
html_cva(
15+
base: 'ids-icon',
16+
variants: {
17+
size: {
18+
tiny: 'ids-icon--tiny',
19+
'tiny-small': 'ids-icon--tiny-small',
20+
small: 'ids-icon--small',
21+
'small-medium': 'ids-icon--small-medium',
22+
medium: 'ids-icon--medium',
23+
'medium-large': 'ids-icon--medium-large',
24+
large: 'ids-icon--large',
25+
'extra-large': 'ids-icon--extra-large'
26+
}
2527
}
26-
}
27-
) %}
28+
)
29+
%}
2830

2931
{% set attr =
3032
attr|merge({
31-
class: icon_classes.apply({ size }, classes),
33+
class: icon_classes.apply(
34+
{
35+
size
36+
},
37+
classes
38+
)
3239
})
3340
%}
3441

Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
{% import ids_get('macros/html') as html %}
2+
3+
{% set disabled = disabled|default(false) %}
4+
{% set error = error|default(false) %}
5+
{% set placeholder = placeholder|default('') %}
6+
{% set readonly = readonly|default(false) %}
7+
{% set required = required|default(false) %}
8+
{% set size = size|default('medium') %}
9+
{% set title = title|default('') %}
10+
{% set type = type|default('text') %}
11+
{% set value = value|default('') %}
12+
{% set attr = attr|default({}) %}
13+
{% set classes = attr.class|default('') %}
14+
15+
{# prettier-ignore-start #}
16+
{% set input_classes =
17+
html_cva(
18+
base: 'ids-input',
19+
variants: {
20+
type: {
21+
text: 'ids-input--text',
22+
password: 'ids-input--password',
23+
email: 'ids-input--email',
24+
number: 'ids-input--number',
25+
tel: 'ids-input--tel',
26+
search: 'ids-input--search',
27+
url: 'ids-input--url'
28+
},
29+
size: {
30+
medium: 'ids-input--medium',
31+
small: 'ids-input--small'
32+
},
33+
disabled: {
34+
'true': 'ids-input--disabled'
35+
},
36+
error: {
37+
'true': 'ids-input--error'
38+
},
39+
required: {
40+
'true': 'ids-input--required'
41+
}
42+
}
43+
)
44+
%}
45+
{# prettier-ignore-end #}
46+
47+
{% set attr =
48+
attr|merge({
49+
class: input_classes.apply(
50+
{
51+
type,
52+
size,
53+
disabled,
54+
error,
55+
required
56+
},
57+
classes
58+
),
59+
disabled,
60+
placeholder,
61+
readonly,
62+
title,
63+
type,
64+
value
65+
})
66+
%}
67+
68+
<input {{ html.attributes(attr) }} />
Lines changed: 8 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,26 @@
1-
{% import ids_get('design-system/macros/html') as html %}
1+
{% import ids_get('macros/html') as html %}
22

33
{% set error = error|default(false) %}
44
{% set required = required|default(false) %}
55
{% set title = title|default('') %}
66
{% set attr = attr|default({}) %}
77

88
{% set classes =
9-
ids_create_css_class(
9+
html_classes(
10+
'ids-label',
11+
attr.classes|default(''),
1012
{
11-
'ids-label': true,
1213
'ids-label--error': error,
13-
'ids-label--required': required,
14-
},
15-
attr
14+
'ids-label--required': required
15+
}
1616
)
1717
%}
1818
{% set attr =
1919
attr|merge({
2020
class: classes,
2121
'html-for': html_for,
22-
title: title,
22+
title: title
2323
})
2424
%}
2525

26-
<label {{ html.attributes(attr) }}>
27-
{{ content|raw }}
28-
</label>
26+
<label {{ html.attributes(attr) }}>{{ content|raw }}</label>

0 commit comments

Comments
 (0)