chore: migrate repo to ts

.eslintrc.js

@@ -24,5 +24,6 @@ module.exports = {
     ],
     rules: {
         "header/header": [2, "line", [" Copyright (c) Microsoft Corporation.", " Licensed under the MIT License."], 2]
-    }
+    },
+    ignorePatterns: ["node_modules", "dist/"]
 };

.github/workflows/node.js.yml

@@ -15,7 +15,7 @@ jobs:
 
         strategy:
             matrix:
-                node-version: [14.x, 16.x, 18.x]
+                node-version: [16.x, 18.x]
                 # See supported Node.js release schedule at https://nodejs.org/en/about/releases/
 
         steps:

README.md

@@ -151,14 +151,14 @@ Any use of third-party trademarks or logos are subject to those third-party's po
 | [accordion-header-needs-labelling](docs/rules/accordion-header-needs-labelling.md)                                     | The accordion header is a button and it needs an accessibile name e.g. text content, aria-label, aria-labelledby.                                 | ✅  |    |    |
 | [accordion-item-needs-header-and-panel](docs/rules/accordion-item-needs-header-and-panel.md)                           | An AccordionItem needs exactly one header and one panel                                                                                           | ✅  |    |    |
 | [avatar-needs-name](docs/rules/avatar-needs-name.md)                                                                   | Accessibility: Avatar must have an accessible labelling: name, aria-label, aria-labelledby                                                        | ✅  |    |    |
-| [avoid-using-aria-describedby-for-primary-labelling](docs/rules/avoid-using-aria-describedby-for-primary-labelling.md) | aria-describedby provides additional context and is not meant for primary labeling.                                                               |    | ✅  |    |
+| [avoid-using-aria-describedby-for-primary-labelling](docs/rules/avoid-using-aria-describedby-for-primary-labelling.md) | aria-describedby provides additional context and is not meant for primary labeling.                                                               |    |    |    |
 | [badge-needs-accessible-name](docs/rules/badge-needs-accessible-name.md)                                               |                                                                                                                                                   |    |    | 🔧 |
 | [breadcrumb-needs-labelling](docs/rules/breadcrumb-needs-labelling.md)                                                 | All interactive elements must have an accessible name                                                                                             | ✅  |    |    |
 | [checkbox-needs-labelling](docs/rules/checkbox-needs-labelling.md)                                                     | Accessibility: Checkbox without label must have an accessible and visual label: aria-labelledby                                                   | ✅  |    |    |
 | [combobox-needs-labelling](docs/rules/combobox-needs-labelling.md)                                                     | All interactive elements must have an accessible name                                                                                             | ✅  |    |    |
 | [compound-button-needs-labelling](docs/rules/compound-button-needs-labelling.md)                                       | Accessibility: Compound buttons must have accessible labelling: title, aria-label, aria-labelledby, aria-describedby                              | ✅  |    |    |
-| [dialogbody-needs-title-content-and-actions](docs/rules/dialogbody-needs-title-content-and-actions.md)                 | A DialogBody should have a header(DialogTitle), content(DialogContent), and footer(DialogActions)                                                 | ✅  |    |    |
-| [dialogsurface-needs-aria](docs/rules/dialogsurface-needs-aria.md)                                                     | DialogueSurface need accessible labelling: aria-describedby on DialogueSurface and aria-label or aria-labelledby(if DialogueTitle is missing)     | ✅  |    |    |
+| [dialogbody-needs-title-content-and-actions](docs/rules/dialogbody-needs-title-content-and-actions.md)                 | A DialogBody should have a header(DialogTitle), content(DialogContent), and footer(DialogActions)                                                 |    |    |    |
+| [dialogsurface-needs-aria](docs/rules/dialogsurface-needs-aria.md)                                                     | DialogueSurface need accessible labelling: aria-describedby on DialogueSurface and aria-label or aria-labelledby(if DialogueTitle is missing)     |    |    |    |
 | [dropdown-needs-labelling](docs/rules/dropdown-needs-labelling.md)                                                     | Accessibility: Dropdown menu must have an id and it needs to be linked via htmlFor of a Label                                                     | ✅  |    |    |
 | [image-button-missing-aria](docs/rules/image-button-missing-aria.md)                                                   | Accessibility: Image buttons must have accessible labelling: title, aria-label, aria-labelledby, aria-describedby                                 | ✅  |    |    |
 | [image-link-missing-aria](docs/rules/image-link-missing-aria.md)                                                       | Accessibility: Image links must have an accessible name                                                                                           | ✅  |    | 🔧 |
@@ -171,7 +171,7 @@ Any use of third-party trademarks or logos are subject to those third-party's po
 | [radiogroup-missing-label](docs/rules/radiogroup-missing-label.md)                                                     | Accessibility: RadioGroup without label must have an accessible and visual label: aria-labelledby                                                 | ✅  |    |    |
 | [spin-button-needs-labelling](docs/rules/spin-button-needs-labelling.md)                                               | Accessibility: SpinButtons must have an accessible label                                                                                          | ✅  |    |    |
 | [spin-button-unrecommended-labelling](docs/rules/spin-button-unrecommended-labelling.md)                               | Accessibility: Unrecommended accessibility labelling - SpinButton                                                                                 | ✅  |    |    |
-| [spinner-needs-labelling](docs/rules/spinner-needs-labelling.md)                                                       | Accessibility: Spinner must have either aria-label or label, aria-live and aria-busy attributes                                                   | ✅  |    |    |
+| [spinner-needs-labelling](docs/rules/spinner-needs-labelling.md)                                                       | Accessibility: Spinner must have either aria-label or label, aria-live and aria-busy attributes                                                   |    |    |    |
 | [switch-needs-labelling](docs/rules/switch-needs-labelling.md)                                                         | Accessibility: Switch must have an accessible label                                                                                               | ✅  |    |    |
 | [text-area-missing-label](docs/rules/text-area-missing-label.md)                                                       | Accessibility: Textarea must have an accessible name                                                                                              | ✅  |    |    |
 | [toolbar-missing-aria](docs/rules/toolbar-missing-aria.md)                                                             | Accessibility: Toolbars need accessible labelling: aria-label or aria-labelledby                                                                  | ✅  |    |    |

dist/lib/applicableComponents/buttonBasedComponents.d.ts

@@ -0,0 +1,2 @@
+export const applicableComponents: string[];
+//# sourceMappingURL=buttonBasedComponents.d.ts.map

dist/lib/applicableComponents/buttonBasedComponents.js

@@ -0,0 +1,7 @@
+"use strict";
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT License.
+const applicableComponents = ["Button", "ToggleButton", "CompoundButton"];
+module.exports = {
+    applicableComponents
+};

dist/lib/applicableComponents/inputBasedComponents.d.ts

@@ -0,0 +1,2 @@
+export const applicableComponents: string[];
+//# sourceMappingURL=inputBasedComponents.d.ts.map

dist/lib/applicableComponents/inputBasedComponents.js

@@ -0,0 +1,7 @@
+"use strict";
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT License.
+const applicableComponents = ["Input", "Slider", "DatePicker", "TextArea", "TextField", "TimePicker"];
+module.exports = {
+    applicableComponents
+};

dist/lib/index.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=index.d.ts.map

lib/index.js → dist/lib/index.js

@@ -1,16 +1,18 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License.
-
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const prefer_aria_over_title_attribute_1 = __importDefault(require("./rules/prefer-aria-over-title-attribute"));
 console.log("Loading my-eslint-plugin");
 //------------------------------------------------------------------------------
 // Requirements
 //------------------------------------------------------------------------------
-
 //------------------------------------------------------------------------------
 // Plugin Definition
 //------------------------------------------------------------------------------
-
 // import all rules in lib/rules
 module.exports = {
     rules: {
@@ -36,7 +38,7 @@ module.exports = {
         "avatar-needs-name": require("./rules/avatar-needs-name"),
         "radio-button-missing-label": require("./rules/radio-button-missing-label"),
         "radiogroup-missing-label": require("./rules/radiogroup-missing-label"),
-        "prefer-aria-over-title-attribute": require("./rules/prefer-aria-over-title-attribute"),
+        "prefer-aria-over-title-attribute": prefer_aria_over_title_attribute_1.default,
         "avoid-using-aria-describedby-for-primary-labelling": require("./rules/avoid-using-aria-describedby-for-primary-labelling"),
         "dialogbody-needs-title-content-and-actions": require("./rules/dialogbody-needs-title-content-and-actions"),
         "dialogsurface-needs-aria": require("./rules/dialogsurface-needs-aria"),
@@ -68,17 +70,12 @@ module.exports = {
                 "@microsoft/fluentui-jsx-a11y/avatar-needs-name": "error",
                 "@microsoft/fluentui-jsx-a11y/radio-button-missing-label": "error",
                 "@microsoft/fluentui-jsx-a11y/radiogroup-missing-label": "error",
-                "@microsoft/fluentui-jsx-a11y/prefer-aria-over-title-attribute": "warn",
-                "@microsoft/fluentui-jsx-a11y/avoid-using-aria-describedby-for-primary-labelling": "warn",
-                "@microsoft/fluentui-jsx-a11y/dialogbody-needs-title-content-and-actions": "error",
-                "@microsoft/fluentui-jsx-a11y/dialogsurface-needs-aria": "error",
-                "@microsoft/fluentui-jsx-a11y/spinner-needs-labelling": "error"
+                "@microsoft/fluentui-jsx-a11y/prefer-aria-over-title-attribute": "warn"
             }
         }
     }
 };
-
 // import processors
 module.exports.processors = {
-    // add your processors here
+// add your processors here
 };

dist/lib/rules/accordion-header-needs-labelling.d.ts

@@ -0,0 +1,3 @@
+declare const _exports: import("eslint").Rule.RuleModule;
+export = _exports;
+//# sourceMappingURL=accordion-header-needs-labelling.d.ts.map

dist/lib/rules/accordion-header-needs-labelling.js

@@ -0,0 +1,65 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT License.
+"use strict";
+const { hasNonEmptyProp } = require("../util/hasNonEmptyProp");
+const { hasToolTipParent } = require("../util/hasTooltipParent");
+const { hasTextContentChild } = require("../util/hasTextContentChild");
+const { hasAssociatedLabelViaAriaLabelledBy } = require("../util/labelUtils");
+var hasProp = require("jsx-ast-utils").hasProp;
+var elementType = require("jsx-ast-utils").elementType;
+//------------------------------------------------------------------------------
+// Rule Definition
+//------------------------------------------------------------------------------
+/** @type {import('eslint').Rule.RuleModule} */
+module.exports = {
+    meta: {
+        messages: {
+            missingAriaLabel: "Accessibility: the accordion header must have an accessible name"
+        },
+        type: "problem", // `problem`, `suggestion`, or `layout`
+        docs: {
+            description: "The accordion header is a button and it needs an accessibile name e.g. text content, aria-label, aria-labelledby.",
+            recommended: false,
+            url: null // URL to the documentation page for this rule
+        },
+        fixable: null, // Or `code` or `whitespace`
+        schema: [] // Add a schema if the rule has options
+    },
+    // create (function) returns an object with methods that ESLint calls to “visit” nodes while traversing the abstract syntax tree
+    create(context) {
+        return {
+            // visitor functions for different types of nodes
+            JSXElement(node) {
+                const openingElement = node.openingElement;
+                // if it is not a AccordionHeader, return
+                if (elementType(openingElement) !== "AccordionHeader") {
+                    return;
+                }
+                // if it has text content, return
+                if (hasTextContentChild(node)) {
+                    return;
+                }
+                // if it is not an icon button, return
+                if (!hasProp(openingElement.attributes, "icon") && !hasProp(openingElement.attributes, "expandIcon")) {
+                    return;
+                }
+                // if it has a tooltip parent, return
+                if (hasToolTipParent(context)) {
+                    return;
+                }
+                // the button has an associated label
+                if (hasAssociatedLabelViaAriaLabelledBy(openingElement, context)) {
+                    return;
+                }
+                const hasAccessibleLabelling = hasNonEmptyProp(openingElement.attributes, "title") || hasNonEmptyProp(openingElement.attributes, "aria-label");
+                // if it has no accessible name, report error
+                if (!hasAccessibleLabelling) {
+                    context.report({
+                        node,
+                        messageId: `missingAriaLabel`
+                    });
+                }
+            }
+        };
+    }
+};

dist/lib/rules/accordion-item-needs-header-and-panel.d.ts

@@ -0,0 +1,3 @@
+declare const _exports: import("eslint").Rule.RuleModule;
+export = _exports;
+//# sourceMappingURL=accordion-item-needs-header-and-panel.d.ts.map

dist/lib/rules/accordion-item-needs-header-and-panel.js

@@ -0,0 +1,40 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT License.
+"use strict";
+//------------------------------------------------------------------------------
+// Rule Definition
+//------------------------------------------------------------------------------
+/** @type {import('eslint').Rule.RuleModule} */
+module.exports = {
+    meta: {
+        messages: {
+            accordionItemOneHeaderOnePanel: "ensure AccordionItem has exactly one header and one panel"
+        },
+        type: "problem", // `problem`, `suggestion`, or `layout`
+        docs: {
+            description: "An AccordionItem needs exactly one header and one panel",
+            recommended: true,
+            url: "https://www.w3.org/WAI/ARIA/apg/patterns/accordion/" // URL to the documentation page for this rule
+        },
+        fixable: null, // Or `code` or `whitespace`
+        schema: [] // Add a schema if the rule has options
+    },
+    create(context) {
+        return {
+            JSXOpeningElement(node) {
+                if (node.name.name !== "AccordionItem") {
+                    return;
+                }
+                const children = node.parent.children.filter(child => child.type === "JSXElement");
+                const hasOneHeader = children.filter(child => child.openingElement.name.name === "AccordionHeader").length === 1;
+                const hasOnePanel = children.filter(child => child.openingElement.name.name === "AccordionPanel").length === 1;
+                if (!hasOneHeader || !hasOnePanel || children.length !== 2) {
+                    context.report({
+                        node,
+                        messageId: "accordionItemOneHeaderOnePanel"
+                    });
+                }
+            }
+        };
+    }
+};

dist/lib/rules/avatar-needs-name.d.ts

@@ -0,0 +1,16 @@
+export namespace meta {
+    namespace messages {
+        let missingAriaLabel: string;
+    }
+    let type: string;
+    namespace docs {
+        let description: string;
+        let recommended: boolean;
+        let url: string;
+    }
+    let schema: never[];
+}
+export function create(context: any): {
+    JSXOpeningElement(node: any): void;
+};
+//# sourceMappingURL=avatar-needs-name.d.ts.map