Skip to content

Commit f5faa39

Browse files
R-BowerR-Bower
authored
Merge pull request #261 from qualcomm/dev
add ai integration guides
2 parents 6c09ace + 37538d4 commit f5faa39

31 files changed

Lines changed: 765 additions & 34 deletions

File tree

‎packages/docs/angular-docs/qui-docs.config.ts‎

Lines changed: 11 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -16,13 +16,21 @@ const navConfig: NavConfig[] = [
1616
{
1717
id: "installation",
1818
},
19+
20+
{separator: true},
21+
{sectionTitle: "Integrations"},
1922
{
20-
id: "integrations",
21-
title: "Integrations & Configs",
23+
children: [{id: "mcp"}, {id: "marketplace"}, {id: "plugins"}],
24+
id: "claude-code",
2225
},
2326
{
24-
separator: true,
27+
children: [{id: "mcp"}, {id: "marketplace"}, {id: "plugins"}],
28+
id: "codex",
2529
},
30+
{id: "eslint"},
31+
{id: "tailwind"},
32+
33+
{separator: true},
2634
{sectionTitle: "Theming, Patterns, and Pitfalls"},
2735
{
2836
children: [

‎packages/docs/angular-docs/src/routes/claude-code+/marketplace.mdx‎

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
---
2+
title: Marketplace
3+
---
4+
5+
# {frontmatter.title}
6+
7+
The Qualcomm UI plugin marketplace lets Claude Code discover available Qualcomm
8+
UI plugins. Follow this guide to register it with your Claude Code installation.
9+
10+
## Prerequisites
11+
12+
- Claude Code is installed.
13+
- Your Claude Code environment can clone from GitHub during marketplace
14+
registration.
15+
16+
## Register the marketplace
17+
18+
In your shell, run the following command:
19+
20+
```shell
21+
claude plugin marketplace add qualcomm/qualcomm-ui \
22+
--sparse .claude-plugin \
23+
--sparse plugins
24+
```
25+
26+
Claude Code clones the repository and reads the marketplace manifest from
27+
`.claude-plugin/marketplace.json`. The marketplace registers as `qualcomm-ui`.
28+
29+
## Install plugins from the marketplace
30+
31+
1. In a claude session, open the plugin browser:
32+
33+
```shell
34+
/plugin
35+
```
36+
37+
2. Filter for `qui`.
38+
39+
3. Select the plugin you want to install.
40+
41+
4. Activate the plugin without restarting:
42+
43+
```shell
44+
/reload-plugins
45+
```
46+
47+
## Verify the marketplace
48+
49+
Open the plugin browser and go to the **Marketplaces** tab. The **Qualcomm UI**
50+
marketplace appears in the list with its source and status. The plugin list
51+
shows **qui-docs** and any other Qualcomm UI plugins.
52+
53+
## Update the marketplace
54+
55+
Refresh marketplace metadata when new plugins are added or existing plugin
56+
metadata changes:
57+
58+
```shell
59+
/plugin marketplace update qualcomm-ui
60+
```
61+
62+
Run `/reload-plugins` after installing or updating plugins so new skills,
63+
agents, hooks, and MCP servers load into the session.
64+
65+
## Troubleshoot registration issues
66+
67+
If the marketplace does not appear, confirm that `/plugin marketplace add`
68+
completed without an authentication or network error, then rerun the command.
69+
70+
If installed plugin skills are not available in a session, run
71+
`/reload-plugins`. If the skills still do not appear, start a new Claude Code
72+
session.

‎packages/docs/angular-docs/src/routes/claude-code+/mcp.mdx‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
---
2+
title: MCP
3+
---
4+
5+
# {frontmatter.title}
6+
7+
The QUI MCP server is a powerful utility that provides Claude Code with QUI component APIs, usage examples, and best practices.
8+
9+
Access is available for Qualcomm developers only. Head over to the [internal documentation](https://qui-ai.qualcomm.com/docs/mcp/setup) to get started.

‎packages/docs/angular-docs/src/routes/claude-code+/plugins+/qui-docs.mdx‎

Lines changed: 94 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,94 @@
1+
---
2+
title: QUI Docs
3+
---
4+
5+
# {frontmatter.title}
6+
7+
Install the QUI Documentation Authoring plugin when you want Claude Code to
8+
draft, revise, or review documentation pages. The plugin gives Claude Code two
9+
documentation-specific skills:
10+
11+
- **write-docs**: guidelines for writing MDX pages
12+
- **review-docs**: guidelines for reviewing MDX pages
13+
14+
## Prerequisites
15+
16+
- Enable the Qualcomm UI Claude Code [marketplace](/claude-code/marketplace).
17+
- Reload plugins after installing so the skills load into the session.
18+
19+
## Install the plugin
20+
21+
1. In Claude Code, open the plugin browser:
22+
23+
```shell
24+
/plugin
25+
```
26+
27+
2. Open the **Discover** tab and search for `qui`.
28+
29+
3. Install **qui-docs**.
30+
31+
4. Activate the plugin:
32+
33+
```shell
34+
/reload-plugins
35+
```
36+
37+
You can also install directly from the command line:
38+
39+
```shell
40+
/plugin install qui-docs@qualcomm-ui
41+
```
42+
43+
## Use the writing skill
44+
45+
Ask Claude Code to use the writing skill when creating or revising
46+
documentation:
47+
48+
```md
49+
Use the qui docs plugin to write a setup guide for this integration
50+
```
51+
52+
Claude Code should load `qui-docs:write-docs`, read the plugin's authoring
53+
principles and rules, determine the page type, write with reader value in the
54+
first paragraph, and update `qui-docs.config.ts` when navigation changes.
55+
56+
## Use the review skill
57+
58+
Ask Claude Code to use the review skill before submitting documentation
59+
changes:
60+
61+
```md
62+
Use the QUI Docs plugin to review the documentation changes in this branch
63+
```
64+
65+
Claude Code should load `qui-docs:review-docs`, list the files under review,
66+
check the Reviewer Rejection Gates, and report findings with file and line
67+
references. If there are no issues, Claude Code should still list any residual
68+
verification gaps.
69+
70+
## When to use the plugin
71+
72+
Use this plugin for changes to MDX route files, `qui-docs.config.ts`,
73+
navigation entries, examples, screenshots, documentation links, and docs assets
74+
in a QUI Docs site.
75+
76+
Do not use this plugin as the only validation for code snippets. The plugin
77+
checks the documentation rules, but code snippets and CLI examples still need
78+
to be run or compiled when feasible.
79+
80+
## Troubleshoot plugin usage
81+
82+
If Claude Code does not load a `qui-docs:*` skill, confirm that **qui-docs** is
83+
installed from the `/plugin` view, then run `/reload-plugins`.
84+
If the skills still do not appear, start a new Claude Code session.
85+
86+
Keep the plugin up to date by refreshing the marketplace:
87+
88+
```shell
89+
/plugin marketplace update qualcomm-ui
90+
```
91+
92+
If Claude Code writes a page without applying the QUI Docs rules, ask it to use
93+
the QUI Docs plugin explicitly and rerun the review skill before submitting the
94+
change.

‎packages/docs/angular-docs/src/routes/codex+/marketplace.mdx‎

Lines changed: 74 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,74 @@
1+
---
2+
title: Marketplace
3+
---
4+
5+
# {frontmatter.title}
6+
7+
The Qualcomm UI plugin marketplace lets Codex discover available Qualcomm UI plugins.
8+
Follow this guide to register it with your codex installation.
9+
10+
## Prerequisites
11+
12+
- Codex CLI is installed.
13+
- Your Codex environment can clone from GitHub during marketplace registration.
14+
15+
## Register the marketplace
16+
17+
Run this command from any directory:
18+
19+
```shell
20+
codex plugin marketplace add qualcomm/qualcomm-ui \
21+
--sparse .agents/plugins \
22+
--sparse plugins
23+
```
24+
25+
The command registers the Qualcomm UI marketplace as `qualcomm-ui`. The
26+
`--sparse` options limit the clone to `.agents/plugins` and `plugins`, which are
27+
the directories Codex needs to read marketplace metadata and install plugin
28+
content.
29+
30+
## Install plugins from the marketplace
31+
32+
1. In Codex, open the plugin browser:
33+
34+
```sh
35+
/plugins
36+
```
37+
38+
2. Find the Qualcomm UI marketplace.
39+
3. Choose the plugin you want to install.
40+
4. Start a new Codex thread so the plugin skills and tools are loaded for the
41+
session.
42+
43+
## Verify the marketplace
44+
45+
Open the plugin browser and confirm that the Qualcomm UI marketplace appears in
46+
the available marketplace list. The marketplace should include **QUI Documentation
47+
Authoring** and any other Qualcomm UI plugins published under `.agents/plugins`.
48+
49+
## Update the marketplace
50+
51+
Upgrade the marketplace when new plugins are added or existing plugin metadata
52+
changes:
53+
54+
```sh
55+
codex plugin marketplace upgrade qualcomm-ui
56+
```
57+
58+
Start a new Codex thread after installing or updating plugins.
59+
60+
## Troubleshoot registration issues
61+
62+
If the marketplace does not appear, confirm that the `codex plugin marketplace add`
63+
command completed without an authentication or network error. Run the command
64+
again after fixing the issues.
65+
66+
If plugin updates do not appear, upgrade the marketplace and reopen the plugin
67+
browser:
68+
69+
```sh
70+
codex plugin marketplace upgrade qualcomm-ui
71+
```
72+
73+
If installed plugin skills are not available in a thread, start a new Codex thread.
74+
Plugin capabilities are loaded when a session starts.

‎packages/docs/angular-docs/src/routes/codex+/mcp.mdx‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
---
2+
title: MCP
3+
---
4+
5+
# {frontmatter.title}
6+
7+
The QUI MCP server is a powerful utility that provides Codex with component APIs, usage examples, and best practices.
8+
9+
Access is available for Qualcomm developers only. Head over to the [internal documentation](https://qui-ai.qualcomm.com/docs/mcp/setup) to get started.

‎packages/docs/angular-docs/src/routes/codex+/plugins+/qui-docs.mdx‎

Lines changed: 78 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,78 @@
1+
---
2+
title: QUI Docs
3+
---
4+
5+
# {frontmatter.title}
6+
7+
Install the QUI Documentation Authoring plugin when you want Codex to draft,
8+
revise, or review documentation pages. The plugin gives Codex two
9+
documentation-specific skills:
10+
11+
- **write-docs**: guidelines for writing MDX pages
12+
- **review-docs**: guidelines for reviewing MDX pages
13+
14+
## Prerequisites
15+
16+
- Enable the Qualcomm UI Codex [marketplace](/codex/marketplace).
17+
- Reload plugins after installing so the skills load into the session.
18+
19+
## Install the plugin
20+
21+
1. In Codex, open the plugin browser:
22+
23+
```sh
24+
/plugins
25+
```
26+
27+
2. Search for `qui`.
28+
3. Install **qui-docs**.
29+
4. Start a new Codex thread.
30+
31+
## Use the writing skill
32+
33+
Ask Codex to use the writing skill when creating or revising documentation:
34+
35+
```md
36+
Use the qui docs plugin to write a setup guide for this integration
37+
```
38+
39+
Codex should load `qui-docs:write-docs`, read the plugin's authoring principles
40+
and rules, determine the page type, write with reader value in the first
41+
paragraph, and update `qui-docs.config.ts` when navigation changes.
42+
43+
## Use the review skill
44+
45+
Ask Codex to use the review skill before submitting documentation changes:
46+
47+
```md
48+
Use the qui docs plugin to review the documentation changes in this branch
49+
```
50+
51+
Codex should load `qui-docs:review-docs`, list the files under review, check the
52+
Reviewer Rejection Gates, and report findings with file and line references. If
53+
there are no issues, Codex should still list any residual verification gaps.
54+
55+
## When to use the plugin
56+
57+
Use this plugin for changes to MDX route files, `qui-docs.config.ts`, navigation
58+
entries, examples, screenshots, documentation links, and docs assets in a QUI
59+
Docs site.
60+
61+
Do not use this plugin as the only validation for code snippets. The plugin
62+
checks the documentation rules, but code snippets and CLI examples still need to
63+
be run or compiled when feasible.
64+
65+
## Troubleshoot plugin usage
66+
67+
If Codex does not load a `qui-docs:*` skill, confirm that **qui-docs** is
68+
installed from the `/plugins` view, then run `/reload-plugins`.
69+
If the skills still do not appear, start a new Codex session.
70+
71+
Keep the plugin up to date by running the upgrade command regularly:
72+
73+
```shell
74+
codex plugin marketplace upgrade qualcomm-ui
75+
```
76+
77+
If Codex writes a page without applying the QUI Docs rules, ask it to use the QUI
78+
Docs plugin explicitly and rerun the review skill before submitting the change.

0 commit comments

Comments
 (0)