feat(core): add A11yDescriptions component

Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com>
2022-12-20 00:38:56 +01:00
parent b0e09f7661
commit f64e298508
3 changed files with 23 additions and 0 deletions
@@ -0,0 +1,16 @@
+<script lang="ts" setup>
+const { id, disableKeyboardA11y } = useVueFlow()
+</script>
+
+<template>
+  <template v-if="!disableKeyboardA11y">
+    <div :id="`${ARIA_NODE_DESC_KEY}-${id}`" style="display: none">
+      Press enter or space to select a node. You can then use the arrow keys to move the node around, press delete to remove it
+      and press escape to cancel.
+    </div>
+
+    <div :id="`${ARIA_EDGE_DESC_KEY}-${id}`" style="display: none">
+      Press enter or space to select an edge. You can then press delete to remove it or press escape to cancel.
+    </div>
+  </template>
+</template>