@veritree/ui 0.18.1 → 0.19.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/package.json +1 -1
  2. package/src/components/Dialog/VTDialog.vue +1 -1
  3. package/src/components/Drawer/VTDrawer.vue +1 -1
  4. package/src/components/DropdownMenu/VTDropdownMenuContent.vue +7 -6
  5. package/src/components/DropdownMenu/VTDropdownMenuTrigger.vue +19 -0
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@veritree/ui",
3
- "version": "0.18.1",
3
+ "version": "0.19.0",
4
4
  "description": "veritree ui library",
5
5
  "type": "module",
6
6
  "main": "index.js",
package/src/components/Dialog/VTDialog.vue CHANGED
@@ -133,7 +133,7 @@ export default {
133
133
  * @param {object} event
134
134
  */
135
135
  onClick(ev) {
136
- if (!ev || ev.target.id !== this.overlay.id) return;
136
+ if (!ev || ev.target.id !== this.overlay?.id) return;
137
137
  this.hide();
138
138
  },
139
139
  },
package/src/components/Drawer/VTDrawer.vue CHANGED
@@ -121,7 +121,7 @@ export default {
121
121
  * @param {object} event
122
122
  */
123
123
  onClick(ev) {
124
- if (!ev || ev.target.id !== this.overlay.id) return;
124
+ if (!ev || ev.target.id !== this.overlay?.id) return;
125
125
  this.hide();
126
126
  },
127
127
  },
package/src/components/DropdownMenu/VTDropdownMenuContent.vue CHANGED
@@ -27,12 +27,12 @@
27
27
  </template>
28
28
 
29
29
  <script>
30
- import { genId } from "../../utils/ids";
30
+ import { genId } from '../../utils/ids';
31
31
 
32
32
  export default {
33
- name: "VTDropdownMenuContent",
33
+ name: 'VTDropdownMenuContent',
34
34
 
35
- inject: ["api"],
35
+ inject: ['api'],
36
36
 
37
37
  data() {
38
38
  return {
@@ -67,7 +67,7 @@ export default {
67
67
  });
68
68
 
69
69
  // TODO: Create a directive or mixin for this
70
- document.addEventListener("click", (e) => {
70
+ document.addEventListener('click', (e) => {
71
71
  e.stopPropagation();
72
72
  if (this.visible && !this.$el.contains(e.target)) this.trigger.onClick();
73
73
  });
@@ -75,17 +75,18 @@ export default {
75
75
 
76
76
  destroyed() {
77
77
  // TODO: Create a directive or mixin for this
78
- document.removeEventListener("click", this.trigger.onClick());
78
+ document.removeEventListener('click', this.trigger.onClick());
79
79
  },
80
80
 
81
81
  methods: {
82
82
  show() {
83
83
  this.visible = true;
84
+ this.$emit('shown');
84
85
  },
85
86
 
86
87
  hide() {
87
88
  this.visible = false;
88
- this.$emit("hidden");
89
+ this.$emit('hidden');
89
90
  this.api().unregisterItems();
90
91
  },
91
92
  },
package/src/components/DropdownMenu/VTDropdownMenuTrigger.vue CHANGED
@@ -112,6 +112,13 @@ export default {
112
112
  this.expanded = !this.expanded;
113
113
  },
114
114
 
115
+ /**
116
+ * Sets aria expanded attribute/state to false
117
+ */
118
+ hideExpanded() {
119
+ this.expanded = false;
120
+ },
121
+
115
122
  /**
116
123
  * Toggles aria popup/controls attribute/state
117
124
  */
@@ -146,6 +153,18 @@ export default {
146
153
  });
147
154
  },
148
155
 
156
+ /**
157
+ * 1. Set aria expanded attribute/state to false
158
+ * 2. Close the menu
159
+ */
160
+ hide() {
161
+ this.hideExpanded();
162
+
163
+ this.$nextTick(() => {
164
+ this.content.hide();
165
+ });
166
+ },
167
+
149
168
  /**
150
169
  * On key arrow down, do the following:
151
170
  *