Skip to content

Commit 1a2ed0e

Browse files
budiadionobudiadiono
committed
[menu-dropdown] added dropdown icon prop
1 parent ec28299 commit 1a2ed0e

File tree

6 files changed

+94
-53
lines changed

6 files changed

+94
-53
lines changed

‎demo/src/demo/menu/dropdown/index.html‎

Lines changed: 44 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,42 +1,49 @@
1-
<div>
2-
<ui-h4>Dropdown Menu</ui-h4>
3-
<ui-menu-vertical>
4-
<ui-menu-item>Foo</ui-menu-item>
5-
<ui-menu-item>Bar</ui-menu-item>
6-
<ui-menu-dropdown label="Sub Menu">
7-
<ui-menu-item @click="clicked">Home</ui-menu-item>
8-
<ui-menu-item>Messages</ui-menu-item>
9-
<ui-menu-item>Friends</ui-menu-item>
10-
</ui-menu-dropdown>
11-
</ui-menu-vertical>
1+
<div>
2+
<ui-h4>Dropdown Menu</ui-h4>
3+
<ui-menu-vertical>
4+
<ui-menu-item>Foo</ui-menu-item>
5+
<ui-menu-item>Bar</ui-menu-item>
6+
<ui-menu-dropdown label="Sub Menu">
7+
<ui-menu-item @click="clicked">Home</ui-menu-item>
8+
<ui-menu-item>Messages</ui-menu-item>
9+
<ui-menu-item>Friends</ui-menu-item>
10+
</ui-menu-dropdown>
11+
</ui-menu-vertical>
1212

13-
<ui-h4>Dropdown Menu On Hover</ui-h4>
14-
<ui-menu-vertical>
15-
<ui-menu-item>Foo</ui-menu-item>
16-
<ui-menu-item>Bar</ui-menu-item>
17-
<ui-menu-dropdown label="Sub Menu" :hover="true">
18-
<ui-menu-item @click="clicked">Home</ui-menu-item>
19-
<ui-menu-item>Messages</ui-menu-item>
20-
<ui-menu-item>Friends</ui-menu-item>
21-
</ui-menu-dropdown>
22-
</ui-menu-vertical>
13+
<ui-h4>Dropdown Menu On Hover</ui-h4>
14+
<ui-menu-vertical>
15+
<ui-menu-item>Foo</ui-menu-item>
16+
<ui-menu-item>Bar</ui-menu-item>
17+
<ui-menu-dropdown label="Sub Menu" :hover="true">
18+
<ui-menu-item @click="clicked">Home</ui-menu-item>
19+
<ui-menu-item>Messages</ui-menu-item>
20+
<ui-menu-item>Friends</ui-menu-item>
21+
</ui-menu-dropdown>
22+
</ui-menu-vertical>
2323

24-
<ui-h4>Styles</ui-h4>
25-
<ui-menu-horizontal class="secondary pointing">
26-
<ui-menu-item>Editorials</ui-menu-item>
27-
<ui-menu-item>Reviews</ui-menu-item>
28-
<ui-menu-item>Upcoming Events</ui-menu-item>
29-
</ui-menu-horizontal>
24+
<ui-h4>Dropdown Icon</ui-h4>
25+
<ui-menu-dropdown :hover="true" icon="wrench" class="top left icon button">
26+
<ui-menu-item @click="clicked">Home</ui-menu-item>
27+
<ui-menu-item>Messages</ui-menu-item>
28+
<ui-menu-item>Friends</ui-menu-item>
29+
</ui-menu-dropdown>
3030

31-
<ui-menu-vertical class="pointing">
32-
<ui-menu-item>Editorials</ui-menu-item>
33-
<ui-menu-item>Reviews</ui-menu-item>
34-
<ui-menu-item>Upcoming Events</ui-menu-item>
35-
</ui-menu-vertical>
31+
<ui-h4>Styles</ui-h4>
32+
<ui-menu-horizontal class="secondary pointing">
33+
<ui-menu-item>Editorials</ui-menu-item>
34+
<ui-menu-item>Reviews</ui-menu-item>
35+
<ui-menu-item>Upcoming Events</ui-menu-item>
36+
</ui-menu-horizontal>
3637

37-
<ui-menu-vertical class="secondary pointing">
38-
<ui-menu-item>Editorials</ui-menu-item>
39-
<ui-menu-item>Reviews</ui-menu-item>
40-
<ui-menu-item>Upcoming Events</ui-menu-item>
41-
</ui-menu-vertical>
38+
<ui-menu-vertical class="pointing">
39+
<ui-menu-item>Editorials</ui-menu-item>
40+
<ui-menu-item>Reviews</ui-menu-item>
41+
<ui-menu-item>Upcoming Events</ui-menu-item>
42+
</ui-menu-vertical>
43+
44+
<ui-menu-vertical class="secondary pointing">
45+
<ui-menu-item>Editorials</ui-menu-item>
46+
<ui-menu-item>Reviews</ui-menu-item>
47+
<ui-menu-item>Upcoming Events</ui-menu-item>
48+
</ui-menu-vertical>
4249
</div>

‎dist/vue-typed-ui.js‎

Lines changed: 15 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2424,7 +2424,17 @@ var _MenuDropdownBase = function (_Vue) {
24242424

24252425
function _MenuDropdownBase() {
24262426
classCallCheck(this, _MenuDropdownBase);
2427-
return possibleConstructorReturn(this, (_MenuDropdownBase.__proto__ || Object.getPrototypeOf(_MenuDropdownBase)).apply(this, arguments));
2427+
2428+
/**
2429+
* Dropdown icon
2430+
*
2431+
* @default 'dropdown'
2432+
* @type {string}
2433+
*/
2434+
var _this = possibleConstructorReturn(this, (_MenuDropdownBase.__proto__ || Object.getPrototypeOf(_MenuDropdownBase)).apply(this, arguments));
2435+
2436+
_this.icon = 'dropdown';
2437+
return _this;
24282438
}
24292439

24302440
return _MenuDropdownBase;
@@ -2436,6 +2446,9 @@ __decorate([vueTyped.Prop({
24362446
__decorate([vueTyped.Prop({
24372447
type: Boolean
24382448
})], _MenuDropdownBase.prototype, "hover", void 0);
2449+
__decorate([vueTyped.Prop({
2450+
type: String
2451+
})], _MenuDropdownBase.prototype, "icon", void 0);
24392452

24402453
var MenuDropdown = function (_MenuDropdownBase2) {
24412454
inherits(MenuDropdown, _MenuDropdownBase2);
@@ -2463,7 +2476,7 @@ var MenuDropdown = function (_MenuDropdownBase2) {
24632476
return MenuDropdown;
24642477
}(_MenuDropdownBase);
24652478
MenuDropdown = __decorate([vueTyped.Component({
2466-
template: '<div class="ui dropdown item">\n {{label}}\n <i class="dropdown icon"></i>\n <div class="menu">\n\t\t\t<slot></slot>\n </div>\n </div>'
2479+
template: '<div class="ui dropdown item">\n {{label}}\n <i :class="icon + \' icon\'"></i>\n <div class="menu">\n\t\t\t<slot></slot>\n </div>\n </div>'
24672480
})], MenuDropdown);
24682481

24692482
var _HeaderBase = function (_Vue) {

‎doc/api.json‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -711,6 +711,11 @@
711711
"type": "boolean",
712712
"description": "Trigger dropdown on hover."
713713
},
714+
"icon": {
715+
"type": "string",
716+
"description": "Dropdown icon",
717+
"default": "'dropdown'"
718+
},
714719
"label": {
715720
"type": "string",
716721
"description": "Dropdown title/label."

‎src/components/menus/menu-dropdown/_base.ts‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -28,4 +28,15 @@ export abstract class _MenuDropdownBase extends Vue {
2828
})
2929
hover: boolean
3030

31+
/**
32+
* Dropdown icon
33+
*
34+
* @default 'dropdown'
35+
* @type {string}
36+
*/
37+
@Prop({
38+
type: String
39+
})
40+
icon: string = 'dropdown'
41+
3142
}

‎src/components/menus/menu-dropdown/index.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import { _MenuDropdownBase } from './_base';
77
@Component({
88
template: `<div class="ui dropdown item">
99
{{label}}
10-
<i class="dropdown icon"></i>
10+
<i :class="icon + ' icon'"></i>
1111
<div class="menu">
1212
<slot></slot>
1313
</div>

‎src/components/menus/menu-dropdown/schema/props.json‎

Lines changed: 18 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,20 @@
11
{
2-
"base": {
3-
"Vue": "vue"
4-
},
5-
"props": {
6-
"label": {
7-
"type": "string",
8-
"description": "Dropdown title/label."
9-
},
10-
"hover": {
11-
"type": "boolean",
12-
"description": "Trigger dropdown on hover."
13-
}
14-
}
2+
"base": {
3+
"Vue": "vue"
4+
},
5+
"props": {
6+
"label": {
7+
"type": "string",
8+
"description": "Dropdown title/label."
9+
},
10+
"hover": {
11+
"type": "boolean",
12+
"description": "Trigger dropdown on hover."
13+
},
14+
"icon": {
15+
"type": "string",
16+
"description": "Dropdown icon",
17+
"default": "'dropdown'"
18+
}
19+
}
1520
}

0 commit comments

Comments
 (0)