Skip to content

Commit 6e173f8

Browse files
betocantu93betocantu93
authored
Eui form (#54)
* eui-form * updates * PoC * PoC * number * number * simplify * text and number fields * number, text and password * textarea and fixes * select a fixes * checkbox * radio, checkbox and switch * fmt * checkbox-group * eui form control layout delimited * fixes to eui-form-control-layout * delete no l onger used * rm fiel picker from mappings * rm * ts fixes * fix eui card and eui card select * lint * yield the inputId if provided as arg * update docs * fix * bump
1 parent 2127ef7 commit 6e173f8

File tree

101 files changed

+2027
-109
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

101 files changed

+2027
-109
lines changed

‎CHANGELOG.md‎

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,11 +4,55 @@
44

55
### 0.0.51
66

7+
🚀 Enhancements
8+
9+
Components
10+
11+
- `<EuiCheckbox>`
12+
- `<EuiCheckboxGroup>`
13+
- `<EuiFieldNumber>`
14+
- `<EuiFieldPassword>`
15+
- `<EuiFieldText>`
16+
- `<EuiFormControlLayoutClearButton>`
17+
- `<EuiFormControlLayoutClearCustomIcon>`
18+
- `<EuiFormControlLayoutDelimited>`
19+
- `<EuiFormControlLayoutIcons>`
20+
- `<EuiFormControlLayout>`
21+
- `<EuiFormErrorText>`
22+
- `<EuiFormFielset>`
23+
- `<EuiFormHelpText>`
24+
- `<EuiFormLegend>`
25+
- `<EuiFormRow>`
26+
- `<EuiForm>`
27+
- `<EuiRadioGroup>`
28+
- `<EuiRadio>`
29+
- `<EuiSelect>`
30+
- `<EuiSwitch>`
31+
- `<EuiTextArea>`
32+
- `<EuiTextArea>`
33+
34+
Helpers
35+
36+
- `{{nullish}}`
37+
- `{{starts-with}}`
38+
39+
Modifiers
40+
41+
- `{{invalidate-indeterminate}}`
42+
- `{{screen-reader-only}}`
43+
- `{{validatable-control}}`
44+
745
🐛 Bug / Fixes
846

47+
- `<EuiText>` `@grow` defaults to true
48+
- `<EuiCard>` selectable bugfixes
949
- Prevent inline style of maxWidth as undefined on modal
1050
- Fix EuiCollapsibleNavGroup title styling
1151

52+
🏠 Internal
53+
54+
- Refactor `class-names` helper for more clarity and perceived performance(?)
55+
1256
### 0.0.50
1357

1458
🚀 Enhancements

‎addon/components/eui-card/eui-card-select/index.hbs‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,6 @@
1616
role="switch"
1717
aria-checked={{@isSelected}}
1818
...attributes
19-
{{on "click" (unless @isDisabled @onClick)}}
2019
>
2120
{{#if hasBlock}}
2221
{{yield}}

‎addon/components/eui-card/index.hbs‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
{{#let (if (or @href @onClick) (unique-id)) (if @selectable (unique-id)) as |titleId selectableId|}}
1+
{{#let (if (or @href @onClick) (unique-id)) (if @selectable (unique-id)) (optional @onClick) as |titleId selectableId onClick|}}
22
<div
33
class={{class-names
44
"euiCard--shadow"
@@ -8,7 +8,7 @@
88
(if hasBlock "euiCard--hasChildren")
99
(if @icon "euiCard--hasIcon")
1010
(if @betaBadgeLabel "euiCard--hasBetaBadge")
11-
(if (or @onClick @href (and @selectable (not @selectable.isDisabled))) "euiCard--isClickable")
11+
(if (or onClick @href (and @selectable (not @selectable.isDisabled))) "euiCard--isClickable")
1212
(if @selectable "euiCard--isSelectable")
1313
(if (and @selectable @selectable.isSelected) "euiCard-isSelected")
1414
componentName="EuiCard"
@@ -53,13 +53,13 @@
5353
>
5454
{{@title}}
5555
</a>
56-
{{else if (or @isDisabled @onClick)}}
56+
{{else if (or @isDisabled onClick)}}
5757
<button
5858
type="button"
5959
class="euiCard__titleButton"
6060
disabled={{@isDisabled}}
6161
id={{titleId}}
62-
{{on "click" @onClick}}
62+
{{on "click" onClick}}
6363
>
6464
{{@title}}
6565
</button>
@@ -88,8 +88,7 @@
8888
{{/if}}
8989
{{#if @selectable}}
9090
<EuiCard::EuiCardSelect
91-
type={{@selectable.type}}
92-
@onClick={{@selectable.onClick}}
91+
@type={{@selectable.type}}
9392
@buttonId={{selectableId}}
9493
@isSelected={{@selectable.isSelected}}
9594
@isDisabled={{@selectable.isDisabled}}
@@ -99,6 +98,7 @@
9998
@href={{@selectable.href}}
10099
@iconSide={{@selectable.iconSide}}
101100
@flush={{@selectable.flush}}
101+
{{on "click" (optional @selectable.onClick)}}
102102
/>
103103
{{/if}}
104104
</div>

‎addon/components/eui-checkbox-group/index.hbs‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
{{#if @legend}}
2+
<EuiFormFieldset @legend={{@legend}} @compressed={{@compressed}}>
3+
{{#each @options key="id" as |option|}}
4+
<EuiCheckbox
5+
class={{concat "euiCheckboxGroup__item" option.className}}
6+
@checked={{get @idToSelectedMap option.id}}
7+
@disabled={{or @disabled option.disabled}}
8+
@compressed={{@compressed}}
9+
@label={{option.label}}
10+
{{on "change" (fn @onChange option.id)}}
11+
/>
12+
{{/each}}
13+
</EuiFormFieldset>
14+
{{else}}
15+
<div ...attributes>
16+
{{#each @options key="id" as |option|}}
17+
<EuiCheckbox
18+
class={{concat "euiCheckboxGroup__item" option.className}}
19+
@checked={{get @idToSelectedMap option.id}}
20+
@disabled={{or @disabled option.disabled}}
21+
@compressed={{@compressed}}
22+
@label={{option.label}}
23+
{{on "change" (fn @onChange option.id)}}
24+
/>
25+
{{/each}}
26+
</div>
27+
{{/if}}

‎addon/components/eui-checkbox/index.hbs‎

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
{{#let (has-block "label") (arg-or-default @id (unique-id)) as |hasLabelBlock id|}}
2+
{{#let
3+
(class-names
4+
(if @icon "euiCheckbox--withIcon")
5+
(if (and (not hasLabelBlock) (not @label)) "euiCheckbox--noLabel")
6+
(if @compressed "euiCheckbox--compressed")
7+
"euiCheckbox"
8+
) as |classes|
9+
}}
10+
<div class={{classes}}>
11+
<input
12+
class="euiCheckbox__input"
13+
type="checkbox"
14+
id={{id}}
15+
checked={{@checked}}
16+
...attributes
17+
{{invalidate-indeterminate @indeterminate @checked}}
18+
/>
19+
<div class="euiCheckbox__square"></div>
20+
{{#if (or hasLabelBlock @label)}}
21+
{{#if hasLabelBlock}}
22+
<label class="euiCheckbox__label" for={{id}}>
23+
{{yield to="label"}}
24+
</label>
25+
{{else}}
26+
<label class="euiCheckbox__label" for={{id}}>
27+
{{@label}}
28+
</label>
29+
{{/if}}
30+
{{/if}}
31+
</div>
32+
{{/let}}
33+
{{/let}}

‎addon/components/eui-field-number/index.hbs‎

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
{{#let
2+
(has-block "prepend")
3+
(has-block "append")
4+
(arg-or-default @id (unique-id)) as |hasPrepend hasAppend inputId|
5+
}}
6+
{{#let
7+
(class-names
8+
(if @icon "euiFieldNumber--withIcon")
9+
(if @fullWidth "euiFieldNumber--fullWidth")
10+
(if @compressed "euiFieldNumber--compressed")
11+
(if (or hasPrepend hasAppend) "euiFieldNumber--inGroup")
12+
(if @isLoading "euiFieldNumber--isLoading")
13+
"euiFieldNumber"
14+
) as |classes|
15+
}}
16+
{{#if @controlOnly}}
17+
<input
18+
id={{@id}}
19+
class={{classes}}
20+
value={{@value}}
21+
type="number"
22+
...attributes
23+
{{validatable-control @isInvalid}}
24+
/>
25+
{{else}}
26+
<EuiFormControlLayout
27+
@icon={{@icon}}
28+
@clear={{@clear}}
29+
@fullWidth={{@fullWidth}}
30+
@isLoading={{@isLoading}}
31+
@compressed={{@compressed}}
32+
@readOnly={{@readOnly}}
33+
@useGroup={{or hasPrepend hasAppend}}
34+
>
35+
<:prepend as |prependClasses|>
36+
{{yield prependClasses inputId to="prepend"}}
37+
</:prepend>
38+
<:field>
39+
<input
40+
id={{inputId}}
41+
class={{classes}}
42+
type="number"
43+
...attributes
44+
{{validatable-control @isInvalid}}
45+
/>
46+
</:field>
47+
<:append as |appendClasses|>
48+
{{yield appendClasses inputId to="append"}}
49+
</:append>
50+
</EuiFormControlLayout>
51+
{{/if}}
52+
{{/let}}
53+
{{/let}}

‎addon/components/eui-field-password/index.hbs‎

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
{{#let
2+
(arg-or-default @type "dual")
3+
(has-block "prepend")
4+
(has-block "append")
5+
(arg-or-default @id (unique-id))
6+
as |type hasPrepend hasAppend inputId|
7+
}}
8+
{{#let (use-state (if (eq type "dual") "password" type)) as |inputTypeState|}}
9+
{{#let
10+
(class-names
11+
(if @fullWidth "euiFieldPassword--fullWidth")
12+
(if @compressed "euiFieldPassword--compressed")
13+
(if (or hasPrepend hasAppend) "euiFieldPassword--inGroup")
14+
(if @isLoading "euiFieldPassword--isLoading")
15+
"euiFieldPassword"
16+
) as |classes|
17+
}}
18+
{{#let (eq inputTypeState.value "text") as |isVisible|}}
19+
<EuiFormControlLayout
20+
@icon="lock"
21+
@clear={{@clear}}
22+
@fullWidth={{@fullWidth}}
23+
@isLoading={{@isLoading}}
24+
@compressed={{@compressed}}
25+
@readOnly={{@readOnly}}
26+
@useGroup={{or hasPrepend (or hasAppend (eq type "dual"))}}
27+
>
28+
<:prepend as |prependClasses|>
29+
{{yield prependClasses inputId to="prepend"}}
30+
</:prepend>
31+
<:field>
32+
<input
33+
id={{inputId}}
34+
class={{classes}}
35+
disabled={{@isDisabled}}
36+
type={{inputTypeState.value}}
37+
...attributes
38+
{{validatable-control @isInvalid}}
39+
/>
40+
</:field>
41+
<:append as |appendClasses|>
42+
{{yield appendClasses inputId to="append"}}
43+
{{#if (eq type "dual")}}
44+
<EuiButtonIcon
45+
@iconType={{if isVisible "eyeClosed" "eye"}}
46+
{{on "click" (fn inputTypeState.setState (if isVisible "password" "text"))}}
47+
/>
48+
{{/if}}
49+
</:append>
50+
</EuiFormControlLayout>
51+
{{/let}}
52+
{{/let}}
53+
{{/let}}
54+
{{/let}}

‎addon/components/eui-field-search/index.hbs‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
{{#let (has-block "prepend") (has-block "append") (arg-or-default @id (unique-id)) as |hasPrepend hasAppend inputId|}}
2+
{{#let
3+
(class-names
4+
(if @fullWidth "euiFieldSearch--fullWidth")
5+
(if @compressed "euiFieldSearch--compressed")
6+
(if (or hasPrepend hasAppend) "euiFieldSearch--inGroup")
7+
(if @isLoading "euiFieldSearch--isLoading")
8+
(if (and @isClearable @value) "euiFieldSearch--isClearable")
9+
"euiFieldSearch"
10+
) as |classes|
11+
}}
12+
<EuiFormControlLayout
13+
@icon="search"
14+
@fullWidth={{@fullWidth}}
15+
@isLoading={{@isLoading}}
16+
@clear={{@clear}}
17+
@compressed={{@compressed}}
18+
@useGroup={{or hasPrepend hasAppend}}
19+
>
20+
<:prepend as |prependClasses|>
21+
{{yield prependClasses inputId to="prepend"}}
22+
</:prepend>
23+
<:field>
24+
<input
25+
id={{inputId}}
26+
class={{classes}}
27+
type="text"
28+
...attributes
29+
{{validatable-control @isInvalid}}
30+
/>
31+
</:field>
32+
<:append as |appendClasses|>
33+
{{yield appendClasses inputId to="append"}}
34+
</:append>
35+
</EuiFormControlLayout>
36+
{{/let}}
37+
{{/let}}

‎addon/components/eui-field-text/index.hbs‎

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
{{#let
2+
(has-block "prepend")
3+
(has-block "append")
4+
(arg-or-default @id (unique-id)) as |hasPrepend hasAppend inputId|
5+
}}
6+
{{#let
7+
(class-names
8+
(if @icon "euiFieldText--withIcon")
9+
(if @fullWidth "euiFieldText--fullWidth")
10+
(if @compressed "euiFieldText--compressed")
11+
(if (or hasPrepend hasAppend) "euiFieldText--inGroup")
12+
(if @isLoading "euiFieldText--isLoading")
13+
"euiFieldText"
14+
) as |classes|
15+
}}
16+
{{#if @controlOnly}}
17+
<input
18+
id={{inputId}}
19+
class={{classes}}
20+
type="text"
21+
...attributes
22+
{{validatable-control @isInvalid}}
23+
/>
24+
{{else}}
25+
<EuiFormControlLayout
26+
@icon={{@icon}}
27+
@clear={{@clear}}
28+
@fullWidth={{@fullWidth}}
29+
@isLoading={{@isLoading}}
30+
@compressed={{@compressed}}
31+
@readOnly={{@readOnly}}
32+
@useGroup={{or hasPrepend hasAppend}}
33+
>
34+
<:prepend as |prependClasses|>
35+
{{yield prependClasses inputId to="prepend"}}
36+
</:prepend>
37+
<:field>
38+
<input
39+
id={{inputId}}
40+
value={{@value}}
41+
class={{classes}}
42+
type="text"
43+
...attributes
44+
{{validatable-control @isInvalid}}
45+
/>
46+
</:field>
47+
<:append as |appendClasses|>
48+
{{yield appendClasses inputId to="append"}}
49+
</:append>
50+
</EuiFormControlLayout>
51+
{{/if}}
52+
{{/let}}
53+
{{/let}}

‎addon/components/eui-form-control-layout-clear-button/index.hbs‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
<button
2+
class={{class-names "euiFormControlLayoutClearButton" size=@size}}
3+
type="button"
4+
aria-label={{@label}}
5+
...attributes
6+
>
7+
<EuiIcon class="euiFormControlLayoutClearButton__icon" @type="cross" />
8+
</button>

0 commit comments

Comments
 (0)