Skip to content

Commit 4e22539

Browse files
betocantu93betocantu93
authored
Merge pull request #147 from prysmex/pv_eui_context_menu_item
add eui context menu item, drop legacy themes
2 parents 9811d7a + 8d728ce commit 4e22539

File tree

10 files changed

+219
-135
lines changed

10 files changed

+219
-135
lines changed

‎packages/core/addon/components/eui-context-menu-item/index.hbs‎

Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
{{#let
2+
(class-names
3+
"euiContextMenuItem"
4+
componentName="EuiContextMenuItem"
5+
disabled=@disabled
6+
layoutAlign=(arg-or-default @layoutAlign "center")
7+
size=@size
8+
)
9+
as |classes|}}
10+
{{#if (and @href (not @disabled))}}
11+
<a
12+
class={{classes}}
13+
href={{@href}}
14+
target={{@target}}
15+
{{did-insert this.registerLink}}
16+
...attributes
17+
/>
18+
19+
{{else}}
20+
<button
21+
class={{classes}}
22+
disabled={{@disabled}}
23+
type="button"
24+
{{did-insert this.registerLink}}
25+
...attributes
26+
/>
27+
{{/if}}
28+
{{/let}}
29+
30+
31+
{{!-- shared code that will be rendered inside the button or anchor --}}
32+
{{#if this.link}}
33+
{{#in-element this.link}}
34+
<span
35+
class={{class-names
36+
'euiContextMenu__itemLayout'
37+
componentName="EuiContextMenuItem"
38+
layoutAlign=(arg-or-default @layoutAlign "center")
39+
}}
40+
>
41+
{{#if @isLoading}}
42+
{{!-- spinner is not part of eui spec --}}
43+
<EuiLoadingSpinner class="euiContextMenu__icon"/>
44+
{{else}}
45+
<EuiIcon
46+
@iconClasses={{concat "euiContextMenu__icon " @iconClasses}}
47+
@type={{@icon}}
48+
@size="m"
49+
@color="inherit"
50+
/>
51+
{{/if}}
52+
<span class="euiContextMenuItem__text">
53+
{{yield}}
54+
</span>
55+
{{#if @hasPanel}}
56+
<EuiIcon @type="arrowRight" @size="m" class="euiContextMenu__arrow"/>
57+
{{/if}}
58+
</span>
59+
{{/in-element}}
60+
{{/if}}

‎packages/core/addon/components/eui-context-menu-item/index.ts‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
import Component from '@glimmer/component';
2+
import { action } from '@ember/object';
3+
import { tracked } from '@glimmer/tracking';
4+
5+
export default class EuiContextMenuItemComponent extends Component {
6+
@tracked link: HTMLAnchorElement | HTMLButtonElement | null = null;
7+
8+
@action
9+
registerLink(e: HTMLAnchorElement | HTMLButtonElement) {
10+
this.link = e;
11+
}
12+
}

‎packages/core/addon/components/eui-context-menu-panel/index.hbs‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
{{!-- ToDo not yet implemented, only created to avoid creating divs with euiContextMenuPanel class --}}
2+
3+
<div class="euiContextMenuPanel" tabindex="-1">
4+
{{yield}}
5+
</div>

‎packages/core/addon/utils/css-mappings/eui-context-menu-item.ts‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
export const baseClass = '';
2+
3+
const disabledMapping = {
4+
true: 'euiContextMenuItem-isDisabled'
5+
};
6+
7+
const layoutAlignMapping = {
8+
primary: `${baseClass}--primary`,
9+
accent: `${baseClass}--accent`,
10+
text: `${baseClass}--text`
11+
};
12+
13+
const sizeMapping = {
14+
s: 'euiContextMenuItem--small'
15+
};
16+
17+
const mapping: ComponentMapping = {
18+
base: baseClass,
19+
properties: {
20+
disabled: disabledMapping,
21+
layoutAlign: layoutAlignMapping,
22+
size: sizeMapping,
23+
}
24+
};
25+
26+
export default mapping;

‎packages/core/addon/utils/css-mappings/index.ts‎

Lines changed: 98 additions & 96 deletions
Original file line numberDiff line numberDiff line change
@@ -1,137 +1,139 @@
11
import EuiAccordion from './eui-accordion';
2-
import EuiIcon from './eui-icon';
3-
import EuiModal from './eui-modal';
4-
import EuiLoadingSpinner from './eui-loading-spinner';
5-
import EuiImage from './eui-image';
6-
import EuiSpacer from './eui-spacer';
7-
import EuiTabs from './eui-tabs';
8-
import EuiTitle from './eui-title';
9-
import EuiTextAlign from './eui-text-align';
10-
import EuiTextColor from './eui-text-color';
11-
import EuiText from './eui-text';
12-
import EuiPanel from './eui-panel';
13-
import EuiPageContent from './eui-page-content';
142
import EuiAvatar from './eui-avatar';
15-
import EuiCallOut from './eui-call-out';
16-
import EuiFlexGroup from './eui-flex-group';
17-
import EuiFlexItem from './eui-flex-item';
18-
import EuiFlexGrid from './eui-flex-grid';
19-
import EuiNotificationBadge from './eui-notification-badge';
20-
import EuiBadgeGroup from './eui-badge-group';
213
import EuiBadge from './eui-badge';
22-
import EuiCard from './eui-card';
4+
import EuiBadgeGroup from './eui-badge-group';
5+
import EuiBetaBadge from './eui-beta-badge';
6+
import EuiBottomBar from './eui-bottom-bar';
7+
import EuiButton from './eui-button';
238
import EuiButtonEmpty from './eui-button-empty';
9+
import EuiButtonIcon from './eui-button-icon';
10+
import EuiCallOut from './eui-call-out';
11+
import EuiCard from './eui-card';
2412
import EuiCardSelect from './eui-card-select';
13+
import EuiCodeBlock from './eui-code-block';
14+
import EuiCollapsibleNavGroup from './eui-collapsible-nav-group';
15+
import EuiCommentEvent from './eui-comment-event';
16+
import EuiCommentTimelineIcon from './eui-comment-timeline-icon';
17+
import EuiContextMenuItem from './eui-context-menu-item';
18+
import EuiDescribedFormGroup from './eui-described-form-group';
19+
import EuiDescriptionList from './eui-description-list';
20+
import EuiEmptyPrompt from './eui-empty-prompt';
21+
import EuiFilePicker from './eui-file-picker';
22+
import EuiFlexGrid from './eui-flex-grid';
23+
import EuiFlexGroup from './eui-flex-group';
24+
import EuiFlexItem from './eui-flex-item';
25+
import EuiFlyout from './eui-flyout';
26+
import EuiFormRow from './eui-form-row';
27+
import EuiGlobalToastList from './eui-global-toast-list';
28+
import EuiHeader from './eui-header';
29+
import EuiHeaderLinks from './eui-header-links';
2530
import EuiHeaderSection from './eui-header-section';
2631
import EuiHeaderSectionItem from './eui-header-section-item';
27-
import EuiHeader from './eui-header';
2832
import EuiHealth from './eui-health';
29-
import EuiButtonIcon from './eui-button-icon';
30-
import EuiButton from './eui-button';
3133
import EuiHorizontalRule from './eui-horizontal-rule';
32-
import EuiCommentTimelineIcon from './eui-comment-timeline-icon';
33-
import EuiCommentEvent from './eui-comment-event';
34-
import EuiFlyout from './eui-flyout';
35-
import EuiCollapsibleNavGroup from './eui-collapsible-nav-group';
36-
import EuiStepNumber from './eui-step-number';
37-
import EuiProgress from './eui-progress';
38-
import EuiProgressData from './eui-progress-data';
39-
import EuiFormRow from './eui-form-row';
40-
import EuiDescribedFormGroup from './eui-described-form-group';
34+
import EuiIcon from './eui-icon';
35+
import EuiImage from './eui-image';
36+
import EuiLink from './eui-link';
4137
import EuiListGroup from './eui-list-group';
4238
import EuiListGroupItem from './eui-list-group-item';
43-
import EuiTextArea from './eui-text-area';
44-
import EuiFilePicker from './eui-file-picker';
45-
import EuiBottomBar from './eui-bottom-bar';
39+
import EuiLoadingSpinner from './eui-loading-spinner';
40+
import EuiModal from './eui-modal';
41+
import EuiNotificationBadge from './eui-notification-badge';
4642
import EuiPage from './eui-page';
43+
import EuiPageBody from './eui-page-body';
44+
import EuiPageContent from './eui-page-content';
45+
import EuiPageContentBody from './eui-page-content-body';
46+
import EuiPageHeader from './eui-page-header';
47+
import EuiPageSideBar from './eui-page-side-bar';
48+
import EuiPanel from './eui-panel';
4749
import EuiPopover from './eui-popover';
48-
import EuiPopoverTitle from './eui-popover-title';
4950
import EuiPopoverFooter from './eui-popover-footer';
51+
import EuiPopoverTitle from './eui-popover-title';
52+
import EuiProgress from './eui-progress';
53+
import EuiProgressData from './eui-progress-data';
5054
import EuiRangeHighlight from './eui-range-highlight';
5155
import EuiRangeInput from './eui-range-input';
5256
import EuiRangeLevels from './eui-range-levels';
53-
import EuiToolTip from './eui-tool-tip';
54-
import EuiToast from './eui-toast';
55-
import EuiGlobalToastList from './eui-global-toast-list';
56-
import EuiCodeBlock from './eui-code-block';
57+
import EuiSpacer from './eui-spacer';
5758
import EuiStat from './eui-stat';
58-
import EuiHeaderLinks from './eui-header-links';
59-
import EuiLink from './eui-link';
60-
import EuiBetaBadge from './eui-beta-badge';
61-
import EuiDescriptionList from './eui-description-list';
62-
import EuiPageSideBar from './eui-page-side-bar';
63-
import EuiPageBody from './eui-page-body';
64-
import EuiPageHeader from './eui-page-header';
65-
import EuiPageContentBody from './eui-page-content-body';
66-
import EuiEmptyPrompt from './eui-empty-prompt';
59+
import EuiStepNumber from './eui-step-number';
60+
import EuiTabs from './eui-tabs';
61+
import EuiText from './eui-text';
62+
import EuiTextAlign from './eui-text-align';
63+
import EuiTextArea from './eui-text-area';
64+
import EuiTextColor from './eui-text-color';
65+
import EuiTitle from './eui-title';
66+
import EuiToast from './eui-toast';
67+
import EuiToolTip from './eui-tool-tip';
6768

6869
const mapping: Mapping = {
69-
EuiDescriptionList,
70-
EuiBetaBadge,
71-
EuiLink,
72-
EuiStat,
73-
EuiCodeBlock,
7470
EuiAccordion,
75-
EuiIcon,
76-
EuiModal,
77-
EuiImage,
78-
EuiLoadingSpinner,
79-
EuiSpacer,
80-
EuiTabs,
81-
EuiTitle,
82-
EuiTextAlign,
83-
EuiTextColor,
84-
EuiText,
85-
EuiPanel,
86-
EuiPageContent,
8771
EuiAvatar,
88-
EuiCallOut,
89-
EuiFlexGroup,
90-
EuiFlexItem,
91-
EuiFlexGrid,
92-
EuiNotificationBadge,
93-
EuiBadgeGroup,
9472
EuiBadge,
95-
EuiCard,
73+
EuiBadgeGroup,
74+
EuiBetaBadge,
75+
EuiBottomBar,
76+
EuiButton,
9677
EuiButtonEmpty,
78+
EuiButtonIcon,
79+
EuiCallOut,
80+
EuiCard,
9781
EuiCardSelect,
82+
EuiCodeBlock,
83+
EuiCollapsibleNavGroup,
84+
EuiCommentEvent,
85+
EuiCommentTimelineIcon,
86+
EuiContextMenuItem,
87+
EuiDescribedFormGroup,
88+
EuiDescriptionList,
89+
EuiEmptyPrompt,
90+
EuiFilePicker,
91+
EuiFlexGrid,
92+
EuiFlexGroup,
93+
EuiFlexItem,
94+
EuiFlyout,
95+
EuiFormRow,
96+
EuiGlobalToastList,
97+
EuiHeader,
98+
EuiHeaderLinks,
9899
EuiHeaderSection,
99100
EuiHeaderSectionItem,
100-
EuiHeader,
101101
EuiHealth,
102-
EuiButton,
103-
EuiButtonIcon,
104102
EuiHorizontalRule,
105-
EuiCommentTimelineIcon,
106-
EuiCommentEvent,
107-
EuiFlyout,
108-
EuiCollapsibleNavGroup,
109-
EuiStepNumber,
110-
EuiProgress,
111-
EuiProgressData,
112-
EuiFormRow,
113-
EuiDescribedFormGroup,
103+
EuiIcon,
104+
EuiImage,
105+
EuiLink,
114106
EuiListGroup,
115107
EuiListGroupItem,
116-
EuiTextArea,
117-
EuiFilePicker,
118-
EuiBottomBar,
108+
EuiLoadingSpinner,
109+
EuiModal,
110+
EuiNotificationBadge,
119111
EuiPage,
112+
EuiPageBody,
113+
EuiPageContent,
114+
EuiPageContentBody,
115+
EuiPageHeader,
116+
EuiPageSideBar,
117+
EuiPanel,
120118
EuiPopover,
121-
EuiPopoverTitle,
122119
EuiPopoverFooter,
120+
EuiPopoverTitle,
121+
EuiProgress,
122+
EuiProgressData,
123123
EuiRangeHighlight,
124124
EuiRangeInput,
125125
EuiRangeLevels,
126-
EuiToolTip,
126+
EuiSpacer,
127+
EuiStat,
128+
EuiStepNumber,
129+
EuiTabs,
130+
EuiText,
131+
EuiTextAlign,
132+
EuiTextArea,
133+
EuiTextColor,
134+
EuiTitle,
127135
EuiToast,
128-
EuiGlobalToastList,
129-
EuiHeaderLinks,
130-
EuiPageSideBar,
131-
EuiPageBody,
132-
EuiPageHeader,
133-
EuiPageContentBody,
134-
EuiEmptyPrompt
136+
EuiToolTip,
135137
};
136138

137139
export default mapping;

‎packages/core/app/components/eui-context-menu-item/index.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export { default } from '@ember-eui/core/components/eui-context-menu-item';

‎packages/core/app/components/eui-context-menu-panel/index.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export { default } from '@ember-eui/core/components/eui-context-menu-panel';

‎packages/core/docs/display/notification-event/demo/demo2.md‎

Lines changed: 3 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -35,18 +35,11 @@ order: 2
3535
@accordionHideText='hide'
3636
>
3737
<:contextMenu>
38-
<!-- ToDo Missing EuiContextMenu component -->
39-
<button
40-
class="euiContextMenuItem"
41-
type="button"
38+
<EuiContextMenuItem
4239
{{on 'click' this.onRead}}
4340
>
44-
<span class="euiContextMenu__itemLayout">
45-
<span class="euiContextMenuItem__text">
46-
Mark as {{if this.isRead 'unread' 'read'}}
47-
</span>
48-
</span>
49-
</button>
41+
Mark as {{if this.isRead 'unread' 'read'}}
42+
</EuiContextMenuItem>
5043
</:contextMenu>
5144
5245
<:primaryAction>

‎site/app/services/theme-manager.ts‎

Lines changed: 2 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -11,21 +11,13 @@ export default class ThemeManager extends Service {
1111
@tracked currentTheme?: ThemeShape;
1212

1313
themes: ThemeShape[] = [
14-
{
15-
name: 'Amsterdam Light',
16-
key: 'amsterdam_light'
17-
},
18-
{
19-
name: 'Amsterdam Dark',
20-
key: 'amsterdam_dark'
21-
},
2214
{
2315
name: 'Light',
24-
key: 'light'
16+
key: 'amsterdam_light'
2517
},
2618
{
2719
name: 'Dark',
28-
key: 'dark'
20+
key: 'amsterdam_dark'
2921
}
3022
];
3123

0 commit comments

Comments
 (0)