Skip to content

Commit cba5ec6

Browse files
crishpeenliterat
crishpeen
authored and
literat
committed
BREAKING CHANGE(web-twig): Rename RadioField component to Radio #DS-521
 ## Migration Guide Rename and use `Radio` component instead of `RadioField`. - `<RadioField …>` → `<Radio …>` Please refer back to this guide or reach out to our team if you encounter any issues during migration.
1 parent c24d9f6 commit cba5ec6

29 files changed

+125
-126
lines changed

‎packages/web-twig/src/Resources/components/Item/README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# Item
22

3-
To implement Item component with content of `RadioField` or `Checkbox`,
3+
To implement Item component with content of `Radio` or `Checkbox`,
44
you need to use directly these components with prop `isItem`.
55

66
See `web` package [Item documentation][item-documentation] for more info.

‎packages/web-twig/src/Resources/components/Item/stories/ItemDefault.twig

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -8,12 +8,12 @@
88
isItem
99
/>
1010

11-
<h2 class="docs-Heading">RadioField Item</h2>
11+
<h2 class="docs-Heading">Radio Item</h2>
1212

13-
<RadioField
14-
id="radiofieldItem"
13+
<Radio
14+
id="radioItem"
1515
label="Radio Item"
16-
name="radiofieldItem"
16+
name="radioItem"
1717
isItem
1818
/>
1919
</div>

‎packages/web-twig/src/Resources/components/Modal/stories/ModalBasic.twig

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -35,9 +35,9 @@
3535
</script>
3636
<form onchange="setFooterAlignment(event)" class="d-none d-tablet-block">
3737
<div>Footer alignment (from tablet up):</div>
38-
<RadioField id="footer_alignment_left" UNSAFE_className="mr-600" label="Left" value="left" name="footer_alignment" autocomplete="off" />
39-
<RadioField id="footer_alignment_center" UNSAFE_className="mr-600" label="Center" value="center" name="footer_alignment" autocomplete="off" />
40-
<RadioField id="footer_alignment_right" UNSAFE_className="mr-600" label="Right" value="right" name="footer_alignment" autocomplete="off" isChecked />
38+
<Radio id="footer_alignment_left" UNSAFE_className="mr-600" label="Left" value="left" name="footer_alignment" autocomplete="off" />
39+
<Radio id="footer_alignment_center" UNSAFE_className="mr-600" label="Center" value="center" name="footer_alignment" autocomplete="off" />
40+
<Radio id="footer_alignment_right" UNSAFE_className="mr-600" label="Right" value="right" name="footer_alignment" autocomplete="off" isChecked />
4141
</form>
4242
<form class="d-tablet-none">
4343
<Checkbox id="expand_on_mobile" label="Expand on mobile" value="right" onchange="toggleExpandOnMobile()" autocomplete="off" isChecked />

‎packages/web-twig/src/Resources/components/RadioField/README.md renamed to ‎packages/web-twig/src/Resources/components/Radio/README.md

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,21 @@
1-
# RadioField
1+
# Radio
22

3-
This is Twig implementation of the [RadioField] component.
3+
This is Twig implementation of the [Radio] component.
44

55
Basic example usage:
66

77
```html
8-
<RadioField id="radiofieldDefault" label="Label" name="radiofieldDefault" isChecked />
8+
<Radio id="radioDefault" label="Label" name="radioDefault" isChecked />
99
```
1010

1111
Advanced example usage:
1212

1313
```html
14-
<RadioField
15-
id="radiofieldAdvanced"
14+
<Radio
15+
id="radioAdvanced"
1616
label="some label"
1717
isChecked
18-
name="radiofieldAdvanced"
18+
name="radioAdvanced"
1919
validationState="danger"
2020
helperText="Helper text"
2121
autocomplete="off"
@@ -25,10 +25,10 @@ Advanced example usage:
2525
Without lexer:
2626

2727
```twig
28-
{% embed "@spirit/radioField.twig" with { props: {
29-
id: "radiofieldEmbed",
28+
{% embed "@spirit/radio.twig" with { props: {
29+
id: "radioEmbed",
3030
label: "some label",
31-
name: "radiofieldEmbed",
31+
name: "radioEmbed",
3232
isChecked: "true",
3333
validationState: "danger",
3434
helperText: "Helper text",
@@ -59,7 +59,7 @@ further extend component's descriptiveness and accessibility. Also, UNSAFE styli
5959
see the [Escape hatches][escape-hatches] section in README to learn how and when to use them.
6060
These attributes will be passed to the topmost HTML element of the component.
6161

62-
[radiofield]: https://github.com/lmc-eu/spirit-design-system/tree/main/packages/web/src/scss/components/RadioField
62+
[radio]: https://github.com/lmc-eu/spirit-design-system/tree/main/packages/web/src/scss/components/Radio
6363
[item]: https://github.com/lmc-eu/spirit-design-system/blob/main/packages/web-twig/src/Resources/components/Item/README.md
6464
[dictionary-validation]: https://github.com/lmc-eu/spirit-design-system/blob/main/docs/DICTIONARIES.md#validation
6565
[autocomplete-attr]: https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete

‎packages/web-twig/src/Resources/components/RadioField/RadioField.stories.twig renamed to ‎packages/web-twig/src/Resources/components/Radio/Radio.stories.twig

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -6,47 +6,47 @@
66
<h2 class="docs-Heading">Default</h2>
77

88
<div class="docs-FormFieldGrid">
9-
{% include '@components/RadioField/stories/RadioFieldDefault.twig' %}
9+
{% include '@components/Radio/stories/RadioDefault.twig' %}
1010
</div>
1111
</section>
1212

1313
<section class="docs-Section">
1414
<h2 class="docs-Heading">Hidden Label</h2>
1515

1616
<div class="docs-FormFieldGrid">
17-
{% include '@components/RadioField/stories/RadioFieldHiddenLabel.twig' %}
17+
{% include '@components/Radio/stories/RadioHiddenLabel.twig' %}
1818
</div>
1919
</section>
2020

2121
<section class="docs-Section">
2222
<h2 class="docs-Heading">Helper Text</h2>
2323

2424
<div class="docs-FormFieldGrid">
25-
{% include '@components/RadioField/stories/RadioFieldHelperText.twig' %}
25+
{% include '@components/Radio/stories/RadioHelperText.twig' %}
2626
</div>
2727
</section>
2828

2929
<section class="docs-Section">
3030
<h2 class="docs-Heading">Disabled</h2>
3131

3232
<div class="docs-FormFieldGrid">
33-
{% include '@components/RadioField/stories/RadioFieldDisabled.twig' %}
33+
{% include '@components/Radio/stories/RadioDisabled.twig' %}
3434
</div>
3535
</section>
3636

3737
<section class="docs-Section">
3838
<h2 class="docs-Heading">Validation State</h2>
3939

4040
<div class="docs-FormFieldGrid">
41-
{% include '@components/RadioField/stories/RadioFieldValidation.twig' %}
41+
{% include '@components/Radio/stories/RadioValidation.twig' %}
4242
</div>
4343
</section>
4444

4545
<section class="docs-Section">
4646
<h2 class="docs-Heading">Item</h2>
4747

4848
<div class="docs-FormFieldGrid">
49-
{% include '@components/RadioField/stories/RadioFieldItem.twig' %}
49+
{% include '@components/Radio/stories/RadioItem.twig' %}
5050
</div>
5151
</section>
5252

‎packages/web-twig/src/Resources/components/RadioField/RadioField.twig renamed to ‎packages/web-twig/src/Resources/components/Radio/Radio.twig

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -15,15 +15,15 @@
1515
{%- set _validationState = props.validationState | default(null) -%}
1616

1717
{# Class names #}
18-
{%- set _rootClassName = _spiritClassPrefix ~ 'RadioField' -%}
19-
{%- set _inputClassName = _spiritClassPrefix ~ 'RadioField__input' -%}
20-
{%- set _labelClassName = _spiritClassPrefix ~ 'RadioField__label' -%}
21-
{%- set _labelHiddenClassName = _isLabelHidden ? _spiritClassPrefix ~ 'RadioField__label--hidden' : null -%}
22-
{%- set _rootDisabledClassName = _isDisabled ? _spiritClassPrefix ~ 'RadioField--disabled' : null -%}
23-
{%- set _rootItemClassName = _isItem ? _spiritClassPrefix ~ 'RadioField--item' : null -%}
24-
{%- set _textClassName = _spiritClassPrefix ~ 'RadioField__text' -%}
25-
{%- set _helperTextClassName = _spiritClassPrefix ~ 'RadioField__helperText' -%}
26-
{%- set _rootValidationStateClassName = _validationState ? _spiritClassPrefix ~ 'RadioField--' ~ _validationState : null -%}
18+
{%- set _rootClassName = _spiritClassPrefix ~ 'Radio' -%}
19+
{%- set _inputClassName = _spiritClassPrefix ~ 'Radio__input' -%}
20+
{%- set _labelClassName = _spiritClassPrefix ~ 'Radio__label' -%}
21+
{%- set _labelHiddenClassName = _isLabelHidden ? _spiritClassPrefix ~ 'Radio__label--hidden' : null -%}
22+
{%- set _rootDisabledClassName = _isDisabled ? _spiritClassPrefix ~ 'Radio--disabled' : null -%}
23+
{%- set _rootItemClassName = _isItem ? _spiritClassPrefix ~ 'Radio--item' : null -%}
24+
{%- set _textClassName = _spiritClassPrefix ~ 'Radio__text' -%}
25+
{%- set _helperTextClassName = _spiritClassPrefix ~ 'Radio__helperText' -%}
26+
{%- set _rootValidationStateClassName = _validationState ? _spiritClassPrefix ~ 'Radio--' ~ _validationState : null -%}
2727

2828
{# Attributes #}
2929
{%- set _checkedAttr = _isChecked ? 'checked' : null -%}

‎packages/web-twig/src/Resources/components/Radio/stories/RadioDefault.twig

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<Radio
2+
id="radioDefault"
3+
label="Radio Label"
4+
name="radioDefault"
5+
/>
6+
<Radio
7+
id="radioDefaultChecked"
8+
isChecked
9+
label="Radio Label"
10+
name="radioDefault"
11+
/>

‎packages/web-twig/src/Resources/components/Radio/stories/RadioDisabled.twig

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
<Radio
2+
id="radioDisabled"
3+
isDisabled
4+
label="Radio Label"
5+
name="radioDisabled"
6+
/>
7+
8+
<Radio
9+
helperText="Helper text"
10+
id="radioDisabledHelperText"
11+
isChecked
12+
isDisabled
13+
label="Radio Label"
14+
name="radioDisabledHelperText"
15+
/>

‎packages/web-twig/src/Resources/components/Radio/stories/RadioHelperText.twig

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
<Radio
2+
helperText="Helper text"
3+
id="radioHelperText"
4+
label="Radio Label"
5+
name="radioHelperText"
6+
/>

‎packages/web-twig/src/Resources/components/Radio/stories/RadioHiddenLabel.twig

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
<Radio
2+
id="radioHiddenLabel"
3+
label="Radio Label"
4+
name="radioHiddenLabel"
5+
isLabelHidden
6+
/>

0 commit comments

Comments
 (0)