export D3Element from mermaidAPI; use in accessibility

docs/config/setup/modules/mermaidAPI.md

@@ -12,6 +12,16 @@
 
 Renames and re-exports [mermaidAPI](mermaidAPI.md#mermaidapi)
 
+## Type Aliases
+
+### D3Element
+
+Ƭ **D3Element**: `any`
+
+#### Defined in
+
+[mermaidAPI.ts:73](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L73)
+
 ## Variables
 
 ### mermaidAPI

packages/mermaid/src/accessibility.spec.ts

@@ -1,5 +1,6 @@
 import { MockedD3 } from './tests/MockedD3';
 import { setA11yDiagramInfo, addSVGa11yTitleDescription } from './accessibility';
+import { D3Element } from './mermaidAPI';
 
 describe('accessibility', () => {
   const fauxSvgNode = new MockedD3();
@@ -37,7 +38,7 @@ describe('accessibility', () => {
       // Convenience functions to DRY up the spec
 
       function expectAriaLabelledByIsTitleId(
-        svgD3Node: any,
+        svgD3Node: D3Element,
         title: string | null | undefined,
         desc: string | null | undefined,
         givenId: string
@@ -49,7 +50,7 @@ describe('accessibility', () => {
       }
 
       function expectAriaDescribedByIsDescId(
-        svgD3Node: any,
+        svgD3Node: D3Element,
         title: string | null | undefined,
         desc: string | null | undefined,
         givenId: string
@@ -61,7 +62,7 @@ describe('accessibility', () => {
       }
 
       function a11yTitleTagInserted(
-        svgD3Node: any,
+        svgD3Node: D3Element,
         title: string | null | undefined,
         desc: string | null | undefined,
         givenId: string,
@@ -71,7 +72,7 @@ describe('accessibility', () => {
       }
 
       function a11yDescTagInserted(
-        svgD3Node: any,
+        svgD3Node: D3Element,
         title: string | null | undefined,
         desc: string | null | undefined,
         givenId: string,
@@ -81,7 +82,7 @@ describe('accessibility', () => {
       }
 
       function a11yTagInserted(
-        svgD3Node: any,
+        svgD3Node: D3Element,
         title: string | null | undefined,
         desc: string | null | undefined,
         givenId: string,

packages/mermaid/src/accessibility.ts

@@ -2,11 +2,9 @@
  * Accessibility (a11y) functions, types, helpers
  *
  */
+import { D3Element } from './mermaidAPI';
 
-import { isEmpty, compact } from 'lodash';
-
-// This is just a convenience alias to make it clear the type is a d3 object. (It's easier to make it 'any' instead of the complete typing set in d3)
-type D3object = any;
+import { isEmpty } from 'lodash';
 
 /**
  * Add aria-roledescription to the svg element to the diagramType
@@ -14,7 +12,7 @@ type D3object = any;
  * @param svg - d3 object that contains the SVG HTML element
  * @param diagramType - diagram name for to the aria-roledescription
  */
-export function setA11yDiagramInfo(svg: D3object, diagramType: string | null | undefined) {
+export function setA11yDiagramInfo(svg: D3Element, diagramType: string | null | undefined) {
   if (!isEmpty(diagramType)) {
     svg.attr('aria-roledescription', diagramType);
   }
@@ -31,7 +29,7 @@ export function setA11yDiagramInfo(svg: D3object, diagramType: string | null | u
  * @param baseId - id used to construct the a11y title and description id
  */
 export function addSVGa11yTitleDescription(
-  svg: D3object,
+  svg: D3Element,
   a11yTitle: string | null | undefined,
   a11yDesc: string | null | undefined,
   baseId: string

packages/mermaid/src/mermaidAPI.ts

@@ -70,7 +70,7 @@ interface DiagramStyleClassDef {
 
 // This makes it clear that we're working with a d3 selected element of some kind, even though it's hard to specify the exact type.
 // @ts-ignore Could replicate the type definition in d3. This also makes it possible to use the untyped info from the js diagram files.
-type D3Element = any;
+export type D3Element = any;
 
 // ----------------------------------------------------------------------------