Skip to content

Commit ddf3426

Browse files
committed
feat: finish eui-page-template
1 parent 4759a77 commit ddf3426

File tree

20 files changed

+1002
-697
lines changed

20 files changed

+1002
-697
lines changed

packages/core/addon/components/eui-page-body/index.hbs

Lines changed: 19 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -1,63 +1,46 @@
11
{{#let
2-
(arg-or-default @tagName "div")
32
(arg-or-default @restrictWidth false)
3+
(arg-or-default @tagName "div")
44
(arg-or-default @borderRadius "none")
55
(arg-or-default @paddingSize (if @panelled "l" "none"))
6-
as |tagName restrictWidth borderRadius paddingSize|
6+
as |restrictWidth tagName borderRadius paddingSize|
77
}}
88

9-
{{#let
10-
(if
11-
(eq restrictWidth true)
12-
(hash widthClassName="euiPageBody--restrictWidth-custom")
13-
(if
14-
(eq restrictWidth false)
15-
(hash
16-
widthClassName="euiPageBody--restrictWidth-default"
17-
widthStyle=restrictWidth
18-
)
19-
)
20-
)
21-
as |styling|
22-
}}
9+
{{#let (eui-page-restrict-width restrictWidth @style) as |styling|}}
2310
{{#if @panelled}}
2411
<EuiPanel
2512
class={{class-names
13+
(if (eq borderRadius "none") "euiPageBody--borderRadiusNone")
14+
(if
15+
styling.widthClassName
16+
(concat "euiPageBody--" styling.widthClassName)
17+
)
2618
componentName="EuiPageBody"
27-
borderRadiusSize=borderRadius
2819
paddingSize=@paddingSize
2920
}}
3021
@paddingSize={{paddingSize}}
3122
@borderRadius={{borderRadius}}
32-
{{!-- @paddingSize={{arg-or-default @paddingSize "none"}} --}}
33-
{{!-- @restrictWidth={{@restrictWidth}} --}}
23+
@color={{@color}}
24+
@hasBorder={{@hasBorder}}
25+
@hasShadow={{@hasShadow}}
26+
{{style styling.newStyle}}
3427
...attributes
35-
{{style
36-
(if styling.widthStyle (inline-styles max-width=styling.widthStyle))
37-
}}
3828
>
39-
{{!-- <div
40-
class={{class-names
41-
componentName="EuiPageBody"
42-
borderRadiusSize=borderRadius
43-
paddingSize=paddingSize
44-
}}
45-
> --}}
4629
{{yield}}
47-
{{! </div> }}
4830
</EuiPanel>
4931
{{else}}
5032
{{#let (element tagName) as |Tag|}}
5133
<Tag
5234
class={{class-names
35+
(if (eq borderRadius "none") "euiPageBody--borderRadiusNone")
36+
(if
37+
styling.widthClassName
38+
(concat "euiPageBody--" styling.widthClassName)
39+
)
5340
componentName="EuiPageBody"
54-
borderRadiusSize=borderRadius
55-
paddingSize=paddingSize
56-
}}
57-
style={{if
58-
styling.widthStyle
59-
(inline-styles max-width=styling.widthStyle)
41+
paddingSize=@paddingSize
6042
}}
43+
{{style styling.newStyle}}
6144
...attributes
6245
>
6346
{{yield}}
Lines changed: 16 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,16 @@
1-
<div
2-
class={{class-names
3-
(if
4-
@restrictWidth
5-
"euiPage--restrictWidth-custom"
6-
"euiPage--restrictWidth-default"
7-
)
8-
componentName="EuiPageContentBody"
9-
paddingSize=@paddingSize
10-
}}
11-
{{style (inline-styles width=@restrictWidth)}}
12-
...attributes
13-
>
14-
{{yield}}
15-
</div>
1+
{{#let
2+
(eui-page-restrict-width (arg-or-default @restrictWidth false) @style)
3+
as |styling|
4+
}}
5+
<div
6+
class={{class-names
7+
(concat "euiPage--" styling.widthClassName)
8+
componentName="EuiPageContentBody"
9+
paddingSize=@paddingSize
10+
}}
11+
{{style styling.newStyle}}
12+
...attributes
13+
>
14+
{{yield}}
15+
</div>
16+
{{/let}}

packages/core/addon/components/eui-page-content-header/index.hbs

Lines changed: 1 addition & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -2,20 +2,8 @@
22
class={{class-names
33
"euiPageContentHeader"
44
(if @responsive "euiPageContentHeader--responsive")
5-
(if
6-
@restrictWidth
7-
"euiPanel--restrictWidth-custom"
8-
"euiPanel--restrictWidth-default"
9-
)
105
}}
11-
{{style (inline-styles width=@restrictWidth)}}
126
...attributes
137
>
14-
{{yield
15-
(hash
16-
Section=(component
17-
"eui-page-content-header-section"
18-
)
19-
)
20-
}}
8+
{{yield}}
219
</div>
Lines changed: 20 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,20 @@
1-
<EuiPanel
2-
class={{class-names
3-
componentName="EuiPageContent"
4-
verticalPosition=@verticalPosition
5-
horizontalPosition=@horizontalPosition
6-
borderRadius=@borderRadius
7-
}}
8-
@hasShadow={{@hasShadow}}
9-
@hasBorder={{@hasBorder}}
10-
@paddingSize={{arg-or-default @paddingSize "l"}}
11-
@borderRadius={{@borderRadius}}
12-
@color={{@color}}
13-
@grow={{@grow}}
14-
...attributes
15-
>
16-
{{yield}}
17-
</EuiPanel>
1+
{{#let (arg-or-default @role "main") as |role|}}
2+
<EuiPanel
3+
role={{if (eq role null) undefined role}}
4+
class={{class-names
5+
(if (eq @borderRadius "none") "euiPageContent--borderRadiusNone")
6+
componentName="EuiPageContent"
7+
verticalPosition=@verticalPosition
8+
horizontalPosition=@horizontalPosition
9+
}}
10+
@hasShadow={{@hasShadow}}
11+
@hasBorder={{@hasBorder}}
12+
@paddingSize={{arg-or-default @paddingSize "l"}}
13+
@borderRadius={{@borderRadius}}
14+
@color={{@color}}
15+
@grow={{@grow}}
16+
...attributes
17+
>
18+
{{yield}}
19+
</EuiPanel>
20+
{{/let}}

packages/core/addon/components/eui-page-header-content/index.hbs

Lines changed: 34 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,16 @@
22
(arg-or-default @responsive true)
33
(arg-or-default @alignItems "top")
44
(use-state false)
5-
(and (arg-or-default @isDescriptionProvided true) (has-block "description"))
5+
(and (arg-or-default @hasDescriptionBlock true) (has-block "description"))
66
(and
7-
(arg-or-default @isRightSideItemsProvided true) (has-block "rightSideItems")
7+
(arg-or-default @hasRightSideItemsBlock true) (has-block "rightSideItems")
88
)
99
(or
10-
(and (arg-or-default @isPageTitleProvided true) (has-block "pageTitle"))
10+
(and (arg-or-default @hasPageTitleBlock true) (has-block "pageTitle"))
1111
@pageTitle
1212
)
13-
(and (arg-or-default @isDefaultProvided true) (has-block "default"))
14-
as |responsive alignItems isResponsiveBreakpoint hasDescription hasRightSideItems hasPageTitle hasDefault|
13+
(and (arg-or-default @hasDefaultBlock true) (has-block "default"))
14+
as |responsive alignItems isResponsiveBreakpoint hasDescriptionBlock hasRightSideItemsBlock hasPageTitleBlock hasDefaultBlock|
1515
}}
1616
<div
1717
class={{class-names
@@ -37,11 +37,11 @@
3737
<EuiFlexGroup
3838
class="euiPageHeaderContent__top"
3939
@responsive={{not (not responsive)}}
40-
@alignItems={{if hasPageTitle "flexStart" "baseline"}}
40+
@alignItems={{if hasPageTitleBlock "flexStart" "baseline"}}
4141
@gutterSize="l"
4242
>
4343
{{#if (and isResponsiveBreakpoint.value (eq responsive "reverse"))}}
44-
{{#if hasRightSideItems}}
44+
{{#if hasRightSideItemsBlock}}
4545
<EuiFlexItem @grow={{false}}>
4646
<EuiFlexGroup
4747
@wrap={{true}}
@@ -59,7 +59,7 @@
5959
</EuiFlexItem>
6060
{{/if}}
6161
<EuiFlexItem>
62-
{{#if (and (not hasPageTitle) @tabs)}}
62+
{{#if (and (not hasPageTitleBlock) @tabs)}}
6363
<EuiTabs @size="xl" @display="condensed" @bottomBorder={{false}}>
6464
{{#each @tabs as |tab|}}
6565
<EuiTab
@@ -72,7 +72,7 @@
7272
{{/each}}
7373
</EuiTabs>
7474
{{/if}}
75-
{{#if hasPageTitle}}
75+
{{#if hasPageTitleBlock}}
7676
<EuiTitle
7777
class={{@pageTitleProps.className}}
7878
@size="l"
@@ -95,10 +95,10 @@
9595
</EuiTitle>
9696
{{/if}}
9797

98-
{{#if (and hasPageTitle @tabs)}}
99-
<EuiSpacer />
100-
{{/if}}
101-
{{#if hasDescription}}
98+
{{#if hasDescriptionBlock}}
99+
{{#if (or hasPageTitleBlock @tabs)}}
100+
<EuiSpacer />
101+
{{/if}}
102102
<EuiText @grow={{false}}>
103103
{{@description}}
104104
{{yield to="description"}}
@@ -107,19 +107,19 @@
107107
</EuiFlexItem>
108108
{{else}}
109109
<EuiFlexItem>
110-
{{#if (and (not hasPageTitle) @tabs)}}
110+
{{#if (and (not hasPageTitleBlock) @tabs)}}
111111
<EuiTabs @size="xl" @display="condensed" @bottomBorder={{false}}>
112112
{{#each @tabs as |tab|}}
113113
<EuiTab
114114
@isSelected={{tab.isSelected}}
115-
@onClick={{optional tab.onClick}}
115+
{{on "click" (optional tab.onClick)}}
116116
>
117117
{{tab.label}}
118118
</EuiTab>
119119
{{/each}}
120120
</EuiTabs>
121121
{{/if}}
122-
{{#if hasPageTitle}}
122+
{{#if hasPageTitleBlock}}
123123
<EuiTitle
124124
class={{@pageTitleProps.className}}
125125
@size="l"
@@ -142,17 +142,17 @@
142142
</EuiTitle>
143143
{{/if}}
144144

145-
{{#if (or hasPageTitle @tabs)}}
146-
<EuiSpacer />
147-
{{/if}}
148-
{{#if hasDescription}}
145+
{{#if hasDescriptionBlock}}
146+
{{#if (or hasPageTitleBlock @tabs)}}
147+
<EuiSpacer />
148+
{{/if}}
149149
<EuiText @grow={{false}}>
150150
{{@description}}
151151
{{yield to="description"}}
152152
</EuiText>
153153
{{/if}}
154154
</EuiFlexItem>
155-
{{#if hasRightSideItems}}
155+
{{#if hasRightSideItemsBlock}}
156156
<EuiFlexItem @grow={{false}}>
157157
<EuiFlexGroup
158158
@wrap={{true}}
@@ -171,16 +171,16 @@
171171
{{/if}}
172172
{{/if}}
173173
</EuiFlexGroup>
174-
{{#if (or hasDefault (and hasPageTitle @tabs))}}
174+
{{#if (or hasDefaultBlock (and hasPageTitleBlock @tabs))}}
175175
<div class="euiPageHeaderContent__bottom">
176176
<EuiSpacer />
177177
{{yield to="default"}}
178-
{{#if hasPageTitle}}
178+
{{#if hasPageTitleBlock}}
179179
<EuiTabs @size="l" @display="condensed" @bottomBorder={{false}}>
180180
{{#each @tabs as |tab|}}
181181
<EuiTab
182182
@isSelected={{tab.isSelected}}
183-
@onClick={{optional tab.onClick}}
183+
{{on "click" (optional tab.onClick)}}
184184
>
185185
{{tab.label}}
186186
</EuiTab>
@@ -197,7 +197,7 @@
197197
@gutterSize="l"
198198
>
199199
<EuiFlexItem>
200-
{{#if (and (not hasPageTitle) @tabs)}}
200+
{{#if (and (not hasPageTitleBlock) @tabs)}}
201201
<EuiTabs @size="xl" @display="condensed" @bottomBorder={{false}}>
202202
{{#each @tabs as |tab|}}
203203
<EuiTab
@@ -210,7 +210,7 @@
210210
{{/each}}
211211
</EuiTabs>
212212
{{/if}}
213-
{{#if hasPageTitle}}
213+
{{#if hasPageTitleBlock}}
214214
<EuiTitle
215215
class={{@pageTitleProps.className}}
216216
@size="l"
@@ -233,25 +233,25 @@
233233
</EuiTitle>
234234
{{/if}}
235235

236-
{{#if (and hasPageTitle @tabs)}}
237-
<EuiSpacer />
238-
{{/if}}
239-
{{#if hasDescription}}
236+
{{#if hasDescriptionBlock}}
237+
{{#if (or hasPageTitleBlock @tabs)}}
238+
<EuiSpacer />
239+
{{/if}}
240240
<EuiText @grow={{false}}>
241241
{{@description}}
242242
{{yield to="description"}}
243243
</EuiText>
244244
{{/if}}
245-
{{#if (or hasDefault (and hasPageTitle @tabs))}}
245+
{{#if (or hasDefaultBlock (and hasPageTitleBlock @tabs))}}
246246
<div class="euiPageHeaderContent__bottom">
247247
<EuiSpacer />
248248
{{yield to="default"}}
249-
{{#if hasPageTitle}}
249+
{{#if hasPageTitleBlock}}
250250
<EuiTabs @size="l" @display="condensed" @bottomBorder={{false}}>
251251
{{#each @tabs as |tab|}}
252252
<EuiTab
253253
@isSelected={{tab.isSelected}}
254-
@onClick={{optional tab.onClick}}
254+
{{on "click" (optional tab.onClick)}}
255255
>
256256
{{tab.label}}
257257
</EuiTab>
@@ -261,7 +261,7 @@
261261
</div>
262262
{{/if}}
263263
</EuiFlexItem>
264-
{{#if hasRightSideItems}}
264+
{{#if hasRightSideItemsBlock}}
265265
<EuiFlexItem @grow={{false}}>
266266
<EuiFlexGroup
267267
@wrap={{true}}

0 commit comments

Comments
 (0)