Skip to content

Commit acb91fc

Browse files
committed
feat(docs): Update to v-close-popup
1 parent dd20335 commit acb91fc

Some content is hidden

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

43 files changed

+225
-136
lines changed

docs/src/assets/menu.js

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -461,14 +461,17 @@ const layout = [
461461

462462
const directives = [
463463
{
464-
name: 'Close Dialog',
465-
path: 'close-dialog',
464+
name: 'Close Popup',
465+
path: 'close-popup',
466466
badge: 'new'
467467
},
468+
{
469+
name: 'Close Dialog',
470+
path: 'close-dialog'
471+
},
468472
{
469473
name: 'Close Menu',
470-
path: 'close-menu',
471-
badge: 'new'
474+
path: 'close-menu'
472475
},
473476
{
474477
name: 'Go Back (Handling Back Button)',

docs/src/components/page-parts/theming/ThemeBuilder.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -95,7 +95,7 @@
9595
q-separator
9696

9797
q-card-actions(align="right")
98-
q-btn(color="primary", flat, label="Close", v-close-dialog)
98+
q-btn(color="primary", flat, label="Close", v-close-popup)
9999
</template>
100100

101101
<script>

docs/src/examples/CloseDialog/Basic.vue

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -13,10 +13,10 @@
1313
<q-toggle v-model="cancelEnabled" label="Cancel button enabled" />
1414
</q-card-section>
1515

16-
<!-- Notice v-close-dialog -->
16+
<!-- Notice v-close-popup -->
1717
<q-card-actions align="right">
18-
<q-btn flat label="Cancel" color="primary" v-close-dialog="cancelEnabled" :disable="!cancelEnabled" />
19-
<q-btn flat label="Turn on Wifi" color="primary" v-close-dialog />
18+
<q-btn flat label="Cancel" color="primary" v-close-popup="cancelEnabled" :disable="!cancelEnabled" />
19+
<q-btn flat label="Turn on Wifi" color="primary" v-close-popup />
2020
</q-card-actions>
2121
</q-card>
2222
</q-dialog>

docs/src/examples/CloseMenu/Basic.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@
1414
<q-item
1515
v-for="n in 5"
1616
:key="n"
17-
v-close-menu="n > 1 || firstItemEnabled"
17+
v-close-popup="n > 1 || firstItemEnabled"
1818
:clickable="n > 1 || firstItemEnabled"
1919
@click="onClick(n)"
2020
>
Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
<template>
2+
<div class="q-pa-md">
3+
<q-btn label="Open Dialog" color="primary" @click="dialog = true" />
4+
5+
<q-dialog v-model="dialog" persistent>
6+
<q-card>
7+
<q-card-section class="row items-center">
8+
<q-avatar icon="signal_wifi_off" color="primary" text-color="white" />
9+
<span class="q-ml-sm">You are currently not connected to any network.</span>
10+
</q-card-section>
11+
12+
<q-card-section class="row items-center">
13+
<q-toggle v-model="cancelEnabled" label="Cancel button enabled" />
14+
</q-card-section>
15+
16+
<!-- Notice v-close-popup -->
17+
<q-card-actions align="right">
18+
<q-btn flat label="Cancel" color="primary" v-close-popup="cancelEnabled" :disable="!cancelEnabled" />
19+
<q-btn flat label="Turn on Wifi" color="primary" v-close-popup />
20+
</q-card-actions>
21+
</q-card>
22+
</q-dialog>
23+
</div>
24+
</template>
25+
26+
<script>
27+
export default {
28+
data () {
29+
return {
30+
dialog: false,
31+
cancelEnabled: false
32+
}
33+
}
34+
}
35+
</script>
Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
<template>
2+
<div class="q-pa-md">
3+
<q-btn label="Open Menu" color="primary">
4+
<q-menu>
5+
<q-list>
6+
<q-item tag="label">
7+
<q-item-section avatar>
8+
<q-checkbox v-model="firstItemEnabled" />
9+
</q-item-section>
10+
<q-item-section>
11+
<q-item-label>First Item Enabled</q-item-label>
12+
</q-item-section>
13+
</q-item>
14+
<q-item
15+
v-for="n in 5"
16+
:key="n"
17+
v-close-popup="n > 1 || firstItemEnabled"
18+
:clickable="n > 1 || firstItemEnabled"
19+
@click="onClick(n)"
20+
>
21+
<q-item-section>Menu Item {{n}}</q-item-section>
22+
</q-item>
23+
</q-list>
24+
</q-menu>
25+
</q-btn>
26+
</div>
27+
</template>
28+
29+
<script>
30+
export default {
31+
data () {
32+
return {
33+
firstItemEnabled: false
34+
}
35+
},
36+
37+
methods: {
38+
onClick (index) {
39+
if (index > 1 || this.firstItemEnabled) {
40+
this.$q.notify({
41+
message: `Clicked on menu item #${index} and closed QMenu`,
42+
color: 'primary'
43+
})
44+
}
45+
}
46+
}
47+
}
48+
</script>

docs/src/examples/QBar/Dialog.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@
1111

1212
<q-space />
1313

14-
<q-btn dense flat icon="close" v-close-dialog>
14+
<q-btn dense flat icon="close" v-close-popup>
1515
<q-tooltip>Close</q-tooltip>
1616
</q-btn>
1717
</q-bar>
@@ -34,7 +34,7 @@
3434

3535
<q-space />
3636

37-
<q-btn dense flat icon="close" v-close-dialog>
37+
<q-btn dense flat icon="close" v-close-popup>
3838
<q-tooltip content-class="bg-white text-primary">Close</q-tooltip>
3939
</q-btn>
4040
</q-bar>

docs/src/examples/QBar/Header.vue

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -18,10 +18,10 @@
1818
File
1919
<q-menu>
2020
<q-list dense style="min-width: 100px">
21-
<q-item clickable v-close-menu>
21+
<q-item clickable v-close-popup>
2222
<q-item-section>Open...</q-item-section>
2323
</q-item>
24-
<q-item clickable v-close-menu>
24+
<q-item clickable v-close-popup>
2525
<q-item-section>New</q-item-section>
2626
</q-item>
2727

@@ -64,7 +64,7 @@
6464

6565
<q-separator />
6666

67-
<q-item clickable v-close-menu>
67+
<q-item clickable v-close-popup>
6868
<q-item-section>Quit</q-item-section>
6969
</q-item>
7070
</q-list>

docs/src/examples/QBar/Menu.vue

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,10 @@
55
File
66
<q-menu>
77
<q-list dense style="min-width: 100px">
8-
<q-item clickable v-close-menu>
8+
<q-item clickable v-close-popup>
99
<q-item-section>Open...</q-item-section>
1010
</q-item>
11-
<q-item clickable v-close-menu>
11+
<q-item clickable v-close-popup>
1212
<q-item-section>New</q-item-section>
1313
</q-item>
1414

@@ -51,7 +51,7 @@
5151

5252
<q-separator />
5353

54-
<q-item clickable v-close-menu>
54+
<q-item clickable v-close-popup>
5555
<q-item-section>Quit</q-item-section>
5656
</q-item>
5757
</q-list>

docs/src/examples/QBtnDropdown/Basic.vue

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,19 +2,19 @@
22
<div class="q-pa-md">
33
<q-btn-dropdown color="primary" label="Dropdown Button">
44
<q-list>
5-
<q-item clickable v-close-menu>
5+
<q-item clickable v-close-popup>
66
<q-item-section>
77
<q-item-label>Photos</q-item-label>
88
</q-item-section>
99
</q-item>
1010

11-
<q-item clickable v-close-menu>
11+
<q-item clickable v-close-popup>
1212
<q-item-section>
1313
<q-item-label>Videos</q-item-label>
1414
</q-item-section>
1515
</q-item>
1616

17-
<q-item clickable v-close-menu>
17+
<q-item clickable v-close-popup>
1818
<q-item-section>
1919
<q-item-label>Articles</q-item-label>
2020
</q-item-section>

0 commit comments

Comments
 (0)