Merge pull request #243 from qualcomm/dev

swagger-enum-update

Author: R-Bower

eslint.config.js

@@ -1,4 +1,5 @@
 import {defineConfig} from "eslint/config"
+import {join} from "node:path"
 import tseslint from "typescript-eslint"
 
 import quiEslintAngular from "@qualcomm-ui/eslint-config-angular"
@@ -233,5 +234,14 @@ export default defineConfig(
   {
     extends: [quiEslintMdx.configs.recommended],
     files: ["{packages,scripts}/**/*.{md,mdx}", "*.md"],
+    ignores: ["**/CHANGELOG.md", "**/__tests__/**"],
+    languageOptions: {
+      parserOptions: {
+        remarkConfigPath: join(
+          import.meta.dirname,
+          "node_modules/@qualcomm-ui/eslint-config-mdx/.remarkrc",
+        ),
+      },
+    },
   },
 )

packages/configs/eslint-config-mdx/.remarkrc

@@ -0,0 +1,19 @@
+{
+  "plugins": [
+    "remark-frontmatter",
+    "remark-lint-fenced-code-flag",
+    "remark-lint-final-newline",
+    "remark-lint-heading-increment",
+    "remark-lint-list-item-content-indent",
+    ["remark-lint-list-item-indent", "one"],
+    ["remark-lint-maximum-heading-length", { "size": 80 }],
+    "remark-lint-no-consecutive-blank-lines",
+    "remark-lint-no-duplicate-headings-in-section",
+    ["remark-lint-no-heading-punctuation", ",.:;"],
+    ["remark-lint-unordered-list-marker-style", "-"]
+  ],
+  "settings": {
+    "bullet": "-",
+    "rule": "-"
+  }
+}

packages/configs/eslint-config-mdx/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @qualcomm-ui/eslint-config-mdx Changelog
 
+## 2.0.0
+
+Apr 21st, 2026
+
+### BREAKING CHANGES
+
+- [mdx-remark]: enable mdx/remark lint plugins ([abd4e31](https://github.com/qualcomm/qualcomm-ui/commit/abd4e31))
+
 ## 1.1.1
 
 Apr 19th, 2026

packages/configs/eslint-config-mdx/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@qualcomm-ui/eslint-config-mdx",
-  "version": "1.1.1",
+  "version": "2.0.0",
   "description": "QUI ESLint config for consistent MDX code",
   "author": "Ryan Bower",
   "license": "BSD-3-Clause-Clear",
@@ -13,31 +13,54 @@
   "files": [
     "index.d.ts",
     "index.js",
-    "recommended.js"
+    "recommended.js",
+    ".remarkrc"
   ],
-  "main": "index.js",
-  "module": "index.js",
-  "types": "index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./index.d.ts",
+      "import": "./index.js",
+      "default": "./index.js"
+    },
+    "./remarkrc": {
+      "types": "./remarkrc.d.ts",
+      "import": "./remarkrc.js",
+      "default": "./remarkrc.js"
+    }
+  },
   "scripts": {
     "prepublishOnly": "qui-cli pre-publish",
     "postpublish": "qui-cli post-publish"
   },
+  "dependencies": {
+    "remark-frontmatter": "^5.0.0",
+    "remark-lint-fenced-code-flag": "^4.2.0",
+    "remark-lint-final-newline": "^3.0.1",
+    "remark-lint-heading-increment": "^4.0.1",
+    "remark-lint-list-item-content-indent": "^4.0.1",
+    "remark-lint-list-item-indent": "^4.0.1",
+    "remark-lint-maximum-heading-length": "^4.1.1",
+    "remark-lint-no-consecutive-blank-lines": "^5.0.1",
+    "remark-lint-no-duplicate-headings-in-section": "^4.0.1",
+    "remark-lint-no-heading-punctuation": "^4.0.1",
+    "remark-lint-unordered-list-marker-style": "^4.0.1"
+  },
   "devDependencies": {
     "@eslint/core": "^1.0.0",
     "@qualcomm-ui/cli": "catalog:",
-    "eslint-mdx": "^3.4.1",
-    "eslint-plugin-mdx": "^3.4.1",
-    "eslint-plugin-prettier": "^5.5.5",
-    "eslint-plugin-react": "^7.37.5"
+    "eslint-mdx": "^3.7.0",
+    "eslint-plugin-mdx": "^3.7.0",
+    "eslint-plugin-react": "^7.37.5",
+    "unified": "^11.0.5"
   },
   "peerDependencies": {
     "eslint": ">=9.37.0",
-    "eslint-mdx": ">=3.4.1",
-    "eslint-plugin-mdx": ">=3.4.1",
-    "eslint-plugin-prettier": ">=5.5.5",
+    "eslint-mdx": ">=3.7.0",
+    "eslint-plugin-mdx": ">=3.7.0",
     "eslint-plugin-react": ">=7.37.5",
-    "typescript": ">=5.0.0",
-    "typescript-eslint": ">=8.31.1"
+    "typescript": ">=5.9.3",
+    "typescript-eslint": ">=8.31.1",
+    "unified": ">=11"
   },
   "keywords": [
     "eslint",

packages/configs/eslint-config-mdx/recommended.js

@@ -3,19 +3,17 @@
 
 import {defineConfig} from "eslint/config"
 import * as mdx from "eslint-plugin-mdx"
-import prettierPlugin from "eslint-plugin-prettier"
 import reactPlugin from "eslint-plugin-react"
 
 export default defineConfig({
   ...mdx.flat,
   plugins: {
     ...mdx.flat.plugins,
-    prettier: prettierPlugin,
     react: reactPlugin,
   },
   rules: {
     ...mdx.flat.rules,
+    "mdx/remark": "error",
     "no-unused-expressions": "off",
-    "prettier/prettier": "error",
   },
 })

packages/docs/angular-docs/src/routes/components+/password-input+/_password-input.mdx

@@ -169,77 +169,59 @@ The [disabled](./#disabled), [invalid](./#invalid), and [required](./#required)
 
 The `<q-password-input>` component extends the [q-password-input-root](./#q-password-input-root) directive with the following properties:
 
-<TypeDocProps
-  name="PasswordInputComponent"
-  omitFrom="PasswordInputRootDirective"
-/>
+<TypeDocProps name="PasswordInputComponent" omitFrom="PasswordInputRootDirective" />
 
 ## Composite API
 
 ### q-password-input-root
 
 <TypeDocProps name="PasswordInputRootDirective" />
 
-<TypeDocAngularAttributes
-  name={["PasswordInputRootBindings", "QdsInputRootBindings"]}
-/>
+<TypeDocAngularAttributes name={["PasswordInputRootBindings", "QdsInputRootBindings"]} />
 
 ### q-password-input-input-group
 
 <TypeDocProps name="PasswordInputInputGroupDirective" />
 
-<TypeDocAngularAttributes
-  name={["PasswordInputInputGroupBindings", "QdsInputGroupBindings"]}
-/>
+<TypeDocAngularAttributes name={["PasswordInputInputGroupBindings", "QdsInputGroupBindings"]} />
 
 ### q-password-input-label
 
 <TypeDocProps name="PasswordInputLabelDirective" />
 
-<TypeDocAngularAttributes
-  name={["PasswordInputLabelBindings", "QdsInputLabelBindings"]}
-/>
+<TypeDocAngularAttributes name={["PasswordInputLabelBindings", "QdsInputLabelBindings"]} />
 
 ### q-password-input-hint
 
 <TypeDocProps name="PasswordInputHintDirective" />
 
-<TypeDocAngularAttributes
-  name={["PasswordInputHintBindings", "QdsInputHintBindings"]}
-/>
+<TypeDocAngularAttributes name={["PasswordInputHintBindings", "QdsInputHintBindings"]} />
 
 ### q-password-input-clear-trigger
 
 <TypeDocProps name="PasswordInputClearTriggerDirective" />
 
-<TypeDocAngularAttributes
-  name={["PasswordInputClearTriggerBindings", "QdsInputClearTriggerBindings"]}
-/>
+<TypeDocAngularAttributes name={["PasswordInputClearTriggerBindings", "QdsInputClearTriggerBindings"]} />
 
 ### q-password-input-input
 
 <TypeDocProps name="PasswordInputInputDirective" />
 
-<TypeDocAngularAttributes
-  name={["PasswordInputInputBindings", "QdsInputInputBindings"]}
-/>
+<TypeDocAngularAttributes name={["PasswordInputInputBindings", "QdsInputInputBindings"]} />
 
 ### q-password-input-error-text
 
 <TypeDocProps name="PasswordInputErrorTextDirective" />
 
-<TypeDocAngularAttributes
-  name={["PasswordInputErrorTextBindings", "QdsInputErrorTextBindings"]}
-/>
+<TypeDocAngularAttributes name={["PasswordInputErrorTextBindings", "QdsInputErrorTextBindings"]} />
 
 ### q-password-input-error-indicator
 
 <TypeDocProps name="PasswordInputErrorIndicatorDirective" />
 
 <TypeDocAngularAttributes
   name={[
-    "PasswordInputErrorIndicatorBindings",
-    "QdsInputErrorIndicatorBindings",
-  ]}
+  "PasswordInputErrorIndicatorBindings",
+  "QdsInputErrorIndicatorBindings",
+]}
 />
-```

packages/docs/angular-docs/src/routes/theming+/colors+/_colors.mdx

@@ -9,37 +9,37 @@ import {themeColors} from "@qualcomm-ui/tailwind-plugin/theme"
 
 Note that the classes on this page are only available if you've installed and configured the [@qualcomm-ui/tailwind-plugin](/integrations/tailwind) package.
 
-### Text
+## Text
 
 Text colors are used for typography throughout your application. They automatically adapt when switching between light and dark modes to maintain proper contrast ratios.
 
 <ColorTable data={themeColors.text} />
 
-### Icon
+## Icon
 
 Icon colors ensure proper visual hierarchy and accessibility for icons. Like text colors, they automatically adjust for light and dark modes.
 
 <ColorTable data={themeColors.icon} />
 
-### Background
+## Background
 
 Background colors include brand, neutral, and support colors. They are commonly used as colors for your app's surfaces, cards, and UI elements.
 
 <ColorTable data={themeColors.background} />
 
-### Surface
+## Surface
 
 Surface colors are used for primary application surfaces like pages, modals, and overlays.
 
 <ColorTable data={themeColors.surface} />
 
-### Border
+## Border
 
 Border colors bring clarity to layouts by grouping and dividing content. They are used to divide text or components such as table rows, action button groups, and components within a panel.
 
 <ColorTable data={themeColors.border} />
 
-### Category
+## Category
 
 Category colors provide a palette for data visualization and content categorization. Each category has three variants: subtle, medium, and strong.
 

packages/docs/angular-table-docs/src/routes/feature-guides+/row-expansion.mdx

@@ -249,7 +249,7 @@ By default, expanded rows are paginated with the rest of the table and may span
 
 ::: spoiler Show visualization
 
-```
+```txt
 paginateExpandedRows: true          paginateExpandedRows: false
 ┌─────────────────┐                 ┌─────────────────┐
 │ Page 1 (size:5) │                 │ Page 1 (size:5) │

packages/docs/qui-docs/src/routes/guide+/typedoc.mdx

@@ -166,7 +166,7 @@ If you're specifying entryPoints in the typedoc config, you will also need to ac
 
 Types from external modules aren't compiled by default. To include external types, you'll need to do two things:
 
-##### 1. Modify your tsconfig to include the path to the external module's compiled types.
+##### 1. Modify your tsconfig to include the module's compiled types
 
 ```json
 // tsconfig.typedoc.json
@@ -178,7 +178,7 @@ Types from external modules aren't compiled by default. To include external type
 }
 ```
 
-##### 2. Enable external module parsing in the typedoc configuration:
+##### 2. Enable external module parsing in the typedoc configuration
 
 ```ts
 // qui-typedoc.config.ts

packages/docs/react-docs/src/routes/patterns+/project-structure.mdx

@@ -32,7 +32,7 @@ A layer is a top-level directory and the first level of application decompositio
 
 These layers help organize the codebase and promote modular, maintainable, and scalable architecture.
 
-##### Risk of Change
+#### Risk of Change
 
 - **Higher layers**: Changes here impact the entire system. They require thorough testing and validation.
 - **Lower layers**: Changes can ripple upward. Modifying a lower layer may affect multiple higher layers. Therefore, altering lower layers involves more risk.
@@ -43,12 +43,12 @@ In summary, **higher layers** bear more responsibility and knowledge, while **lo
 
 **Slices** represent a way to organize code within a **layer**. They group together files that implement specific functionality related to the business logic.
 
-##### Purpose and Scope
+#### Purpose and Scope
 
 - **Functionality**: Slices focus on a particular aspect of the application's functionality. For example, you might have slices for user authentication, data processing, or reporting.
 - **Project Context**: The impact of slices depends on the specific project. Some projects may have many slices, while others might have only a few.
 
-##### Implementation
+#### Implementation
 
 - **Folder Structure**: Slices are typically organized as folders or directories. Each slice contains related files, such as controllers, models, and views.
 - **Module Isolation**: By grouping related files together, slices promote modularity and maintainability. Changes within a slice should have no impact on other slices in the same layer.
@@ -63,7 +63,7 @@ In summary, **higher layers** bear more responsibility and knowledge, while **lo
 - `ui/` – ui components, responsible for displaying data.
 - `index.ts` – barrel file. This is the public entrypoint for the slice. Any code within the slice that is intended to be used by higher layers must be exported here.
 
-##### Characteristics
+#### Characteristics
 
 - **Independent Units**: Each segment is responsible for a distinct part of the module's technical implementation.
 - **Focused Scope**: Segments handle specific tasks, such as data processing (model), data display (ui), or communication with external services (api).
@@ -100,7 +100,7 @@ Example: City and Product are entities, whereas SearchByCity and BuyProduct are
 
 Let's consider a few examples:
 
-##### 1. Social Network Application
+#### 1. Social Network Application
 
 In a social network application, the features could be `SendComment`, `LikePost`, and `JoinGroup`. The `SendComment` feature might involve operations like creating a new comment, updating a comment, or deleting a comment. Similarly, the `LikePost` feature might involve operations like liking a post, unliking a post, etc.
 
@@ -122,7 +122,7 @@ Each slice in this layer contains some or all of the following:
 
 Let's consider a few examples:
 
-##### 1. Social Network Application
+#### 1. Social Network Application
 
 In a social network application, the entities could be `User`, `Post`, and `Group`. The `User` entity might contain functionality like creating a new user, updating user information, or deleting a user. Similarly, the `Post` entity might include functionality related to creating, updating, or deleting a post.