Skip to content

Commit 5f33f9d

Browse files
authored
Merge pull request #521 from rackerlabs/free-friday-add-radio-sets
fix(radios): add missing demo page <hx-radio-set> elements
2 parents 30a95d8 + 0cb5ed1 commit 5f33f9d

File tree

6 files changed

+207
-175
lines changed

6 files changed

+207
-175
lines changed

docs/components/box/index.html

Lines changed: 15 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -189,19 +189,21 @@ <h2 id="scrolling-containers">Scrolling Containers</h2>
189189
<form class="beta-hxForm">
190190
<fieldset>
191191
<legend class="beta-hxFieldName">Scroll Direction</legend>
192-
<hx-radio-control v-for="(_direction, idx) in directions">
193-
<input
194-
:id="'radDirection' + idx"
195-
:value="_direction"
196-
name="direction"
197-
type="radio"
198-
v-model="direction"
199-
/>
200-
<label :for="'radDirection' + idx">
201-
<hx-radio></hx-radio>
202-
{% raw %}{{_direction}}{% endraw %}
203-
</label>
204-
</hx-radio-control>
192+
<hx-radio-set>
193+
<hx-radio-control v-for="(_direction, idx) in directions">
194+
<input
195+
:id="'radDirection' + idx"
196+
:value="_direction"
197+
name="direction"
198+
type="radio"
199+
v-model="direction"
200+
/>
201+
<label :for="'radDirection' + idx">
202+
<hx-radio></hx-radio>
203+
{% raw %}{{_direction}}{% endraw %}
204+
</label>
205+
</hx-radio-control>
206+
</hx-radio-set>
205207
</fieldset>
206208

207209
<fieldset>

docs/components/button/index.html

Lines changed: 64 additions & 56 deletions
Original file line numberDiff line numberDiff line change
@@ -44,38 +44,42 @@ <h2 id="basic-button">Basic Button</h2>
4444
<form class="beta-hxForm">
4545
<fieldset>
4646
<legend class="beta-hxFieldName">Variant</legend>
47-
<hx-radio-control v-for="(_variant, idx) in variants">
48-
<input
49-
:id="'radBasicVariant' + idx"
50-
:value="_variant"
51-
name="variant"
52-
type="radio"
53-
v-model="variant"
54-
/>
55-
<label :for="'radBasicVariant' + idx">
56-
<hx-radio></hx-radio>
57-
{% raw %}{{_variant.label}}{% endraw %}
58-
</label>
59-
<p v-if="_variant.default">(default)</p>
60-
</hx-radio-control>
47+
<hx-radio-set>
48+
<hx-radio-control v-for="(_variant, idx) in variants">
49+
<input
50+
:id="'radBasicVariant' + idx"
51+
:value="_variant"
52+
name="variant"
53+
type="radio"
54+
v-model="variant"
55+
/>
56+
<label :for="'radBasicVariant' + idx">
57+
<hx-radio></hx-radio>
58+
{% raw %}{{_variant.label}}{% endraw %}
59+
</label>
60+
<p v-if="_variant.default">(default)</p>
61+
</hx-radio-control>
62+
</hx-radio-set>
6163
</fieldset>
6264

6365
<fieldset>
6466
<legend class="beta-hxFieldName">Size</legend>
65-
<hx-radio-control v-for="(_size, idx) in sizes">
66-
<input
67-
:id="'radBasicSize' + idx"
68-
:value="_size"
69-
name="size"
70-
type="radio"
71-
v-model="size"
72-
/>
73-
<label :for="'radBasicSize' + idx">
74-
<hx-radio></hx-radio>
75-
{% raw %}{{_size.label}}{% endraw %}
76-
</label>
77-
<p v-if="_size.default">(default)</p>
78-
</hx-radio-control>
67+
<hx-radio-set>
68+
<hx-radio-control v-for="(_size, idx) in sizes">
69+
<input
70+
:id="'radBasicSize' + idx"
71+
:value="_size"
72+
name="size"
73+
type="radio"
74+
v-model="size"
75+
/>
76+
<label :for="'radBasicSize' + idx">
77+
<hx-radio></hx-radio>
78+
{% raw %}{{_size.label}}{% endraw %}
79+
</label>
80+
<p v-if="_size.default">(default)</p>
81+
</hx-radio-control>
82+
</hx-radio-set>
7983
</fieldset>
8084
</form>
8185
</header>
@@ -151,38 +155,42 @@ <h2 id="button-group">Button Group</h2>
151155
<form class="beta-hxForm">
152156
<fieldset>
153157
<legend class="beta-hxFieldName">Variant</legend>
154-
<hx-radio-control v-for="(_variant, idx) in variants">
155-
<input
156-
:id="'radGroupVariant' + idx"
157-
:value="_variant"
158-
name="variant"
159-
type="radio"
160-
v-model="variant"
161-
/>
162-
<label :for="'radGroupVariant' + idx">
163-
<hx-radio></hx-radio>
164-
{% raw %}{{_variant.label}}{% endraw %}
165-
</label>
166-
<p v-if="_variant.default">(default)</p>
167-
</hx-radio-control>
158+
<hx-radio-set>
159+
<hx-radio-control v-for="(_variant, idx) in variants">
160+
<input
161+
:id="'radGroupVariant' + idx"
162+
:value="_variant"
163+
name="variant"
164+
type="radio"
165+
v-model="variant"
166+
/>
167+
<label :for="'radGroupVariant' + idx">
168+
<hx-radio></hx-radio>
169+
{% raw %}{{_variant.label}}{% endraw %}
170+
</label>
171+
<p v-if="_variant.default">(default)</p>
172+
</hx-radio-control>
173+
</hx-radio-set>
168174
</fieldset>
169175

170176
<fieldset>
171177
<legend class="beta-hxFieldName">Size</legend>
172-
<hx-radio-control v-for="(_size, idx) in sizes">
173-
<input
174-
:id="'radGroupSize' + idx"
175-
:value="_size"
176-
name="size"
177-
type="radio"
178-
v-model="size"
179-
/>
180-
<label :for="'radGroupSize' + idx">
181-
<hx-radio></hx-radio>
182-
{% raw %}{{_size.label}}{% endraw %}
183-
</label>
184-
<p v-if="_size.default">(default)</p>
185-
</hx-radio-control>
178+
<hx-radio-set>
179+
<hx-radio-control v-for="(_size, idx) in sizes">
180+
<input
181+
:id="'radGroupSize' + idx"
182+
:value="_size"
183+
name="size"
184+
type="radio"
185+
v-model="size"
186+
/>
187+
<label :for="'radGroupSize' + idx">
188+
<hx-radio></hx-radio>
189+
{% raw %}{{_size.label}}{% endraw %}
190+
</label>
191+
<p v-if="_size.default">(default)</p>
192+
</hx-radio-control>
193+
</hx-radio-set>
186194
</fieldset>
187195
</form>
188196
</header>

docs/components/file/index.html

Lines changed: 72 additions & 66 deletions
Original file line numberDiff line numberDiff line change
@@ -106,37 +106,41 @@ <h2 id="file-input">File Input</h2>
106106

107107
<fieldset>
108108
<legend class="beta-hxFieldName">Button Variant</legend>
109-
<hx-radio-control v-for="(_variant, idx) in variants">
110-
<input
111-
:id="'radSelectorVariant' + idx"
112-
:value="_variant"
113-
name="variant"
114-
type="radio"
115-
v-model="variant"
116-
/>
117-
<label :for="'radSelectorVariant' + idx">
118-
<hx-radio></hx-radio>
119-
{% raw %}{{_variant.label}}{% endraw %}
120-
</label>
121-
<p v-if="_variant.default">(default)</p>
122-
</hx-radio-control>
109+
<hx-radio-set>
110+
<hx-radio-control v-for="(_variant, idx) in variants">
111+
<input
112+
:id="'radSelectorVariant' + idx"
113+
:value="_variant"
114+
name="variant"
115+
type="radio"
116+
v-model="variant"
117+
/>
118+
<label :for="'radSelectorVariant' + idx">
119+
<hx-radio></hx-radio>
120+
{% raw %}{{_variant.label}}{% endraw %}
121+
</label>
122+
<p v-if="_variant.default">(default)</p>
123+
</hx-radio-control>
124+
</hx-radio-set>
123125
</fieldset>
124126

125127
<fieldset>
126128
<legend class="beta-hxFieldName">Icon</legend>
127-
<hx-radio-control v-for="(_icon, idx) in icons">
128-
<input
129-
:id="'radSelectorIcon' + idx"
130-
:value="_icon"
131-
name="icon"
132-
type="radio"
133-
v-model="icon"
134-
/>
135-
<label :for="'radSelectorIcon' + idx">
136-
<hx-radio></hx-radio>
137-
{% raw %}{{_icon}}{% endraw %}
138-
</label>
139-
</hx-radio-control>
129+
<hx-radio-set>
130+
<hx-radio-control v-for="(_icon, idx) in icons">
131+
<input
132+
:id="'radSelectorIcon' + idx"
133+
:value="_icon"
134+
name="icon"
135+
type="radio"
136+
v-model="icon"
137+
/>
138+
<label :for="'radSelectorIcon' + idx">
139+
<hx-radio></hx-radio>
140+
{% raw %}{{_icon}}{% endraw %}
141+
</label>
142+
</hx-radio-control>
143+
</hx-radio-set>
140144
</fieldset>
141145

142146
<fieldset>
@@ -236,47 +240,49 @@ <h2 id="file-tile">File Tile</h2>
236240

237241
<fieldset>
238242
<legend class="beta-hxFieldName">State</legend>
239-
<hx-radio-control>
240-
<input
241-
id="radTileDownloadable"
242-
name="file-state"
243-
type="radio"
244-
v-model="state"
245-
value="downloadable"
246-
/>
247-
<label for="radTileDownloadable">
248-
<hx-radio></hx-radio>
249-
Downloadable
250-
</label>
251-
</hx-radio-control>
243+
<hx-radio-set>
244+
<hx-radio-control>
245+
<input
246+
id="radTileDownloadable"
247+
name="file-state"
248+
type="radio"
249+
v-model="state"
250+
value="downloadable"
251+
/>
252+
<label for="radTileDownloadable">
253+
<hx-radio></hx-radio>
254+
Downloadable
255+
</label>
256+
</hx-radio-control>
252257

253-
<hx-radio-control>
254-
<input
255-
id="radTileLoading"
256-
name="file-state"
257-
type="radio"
258-
v-model="state"
259-
value="loading"
260-
/>
261-
<label for="radTileLoading">
262-
<hx-radio></hx-radio>
263-
Loading
264-
</label>
265-
</hx-radio-control>
258+
<hx-radio-control>
259+
<input
260+
id="radTileLoading"
261+
name="file-state"
262+
type="radio"
263+
v-model="state"
264+
value="loading"
265+
/>
266+
<label for="radTileLoading">
267+
<hx-radio></hx-radio>
268+
Loading
269+
</label>
270+
</hx-radio-control>
266271

267-
<hx-radio-control>
268-
<input
269-
id="radTileInvalid"
270-
name="file-state"
271-
type="radio"
272-
v-model="state"
273-
value="invalid"
274-
/>
275-
<label for="radTileInvalid">
276-
<hx-radio></hx-radio>
277-
Invalid
278-
</label>
279-
</hx-radio-control>
272+
<hx-radio-control>
273+
<input
274+
id="radTileInvalid"
275+
name="file-state"
276+
type="radio"
277+
v-model="state"
278+
value="invalid"
279+
/>
280+
<label for="radTileInvalid">
281+
<hx-radio></hx-radio>
282+
Invalid
283+
</label>
284+
</hx-radio-control>
285+
</hx-radio-set>
280286
</fieldset>
281287

282288
<template v-if="isDownloadable">

docs/components/modal/index.html

Lines changed: 16 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -27,20 +27,22 @@ <h2 id="basic-modal">Basic Modal</h2>
2727
<form class="beta-hxForm">
2828
<fieldset>
2929
<legend class="beta-hxFieldName">Size</legend>
30-
<hx-radio-control v-for="(_size, idx) in sizes">
31-
<input
32-
:id="'radSize' + idx"
33-
:value="_size"
34-
name="size"
35-
type="radio"
36-
v-model="size"
37-
/>
38-
<label :for="'radSize' + idx">
39-
<hx-radio></hx-radio>
40-
{% raw %}{{_size.label}}{% endraw %}
41-
</label>
42-
<p v-if="_size.default">(default)</p>
43-
</hx-radio-control>
30+
<hx-radio-set>
31+
<hx-radio-control v-for="(_size, idx) in sizes">
32+
<input
33+
:id="'radSize' + idx"
34+
:value="_size"
35+
name="size"
36+
type="radio"
37+
v-model="size"
38+
/>
39+
<label :for="'radSize' + idx">
40+
<hx-radio></hx-radio>
41+
{% raw %}{{_size.label}}{% endraw %}
42+
</label>
43+
<p v-if="_size.default">(default)</p>
44+
</hx-radio-control>
45+
</hx-radio-set>
4446
</fieldset>
4547

4648
<fieldset>

0 commit comments

Comments
 (0)