ix
ix copied to clipboard
docs: publish component documentation as package
๐ What is the new behavior?
Generate single markdowns combine with examples to support code assistants like GitHub Copilot to understand ix.
- Generate readme markdown files for each component
- Generate meta file inside html-test-app to detect components used inside examples
๐ Checklist
A pull request can only be merged if all of these conditions are met (where applicable):
- [ ] ๐ฆฎ Accessibility (a11y) features were implemented
- [ ] ๐บ๏ธ Internationalization (i18n) - no hard coded strings
- [ ] ๐ฒ Responsiveness - components handle viewport changes and content overflow gracefully
- [ ] ๐ Add or update a Storybook story
- [ ] ๐ Documentation was reviewed/updated siemens/ix-docs
- [ ] ๐งช Unit tests were added/updated and pass (
pnpm test) - [ ] ๐ธ Visual regression tests were added/updated and pass (Guide)
- [ ] ๐ง Static code analysis passes (
pnpm lint) - [x] ๐๏ธ Successful compilation (
pnpm build, changes pushed)
๐จโ๐ป Help & support
๐ฆ Changeset detected
Latest commit: 0ad33f08a7956a218ad16157b683c008206655f2
The changes in this PR will be included in the next version bump.
This PR includes changesets to release 1 package
| Name | Type |
|---|---|
| @siemens/ix-docs | Patch |
Not sure what this means? Click here to learn what changesets are.
Click here if you're a maintainer who wants to add another changeset to this PR
Summary of Changes
Hello @danielleroux, I'm Gemini Code Assist[^1]! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!
This pull request significantly improves the documentation infrastructure by automating the generation of component README files. The new system combines existing component documentation with live code examples from HTML, React, Vue, and Angular test applications. This enhancement aims to provide more accurate and comprehensive documentation, particularly beneficial for AI-powered code assistants like GitHub Copilot, by offering a unified view of each component's functionality and usage across different frameworks. Additionally, it includes a mechanism to track component usage within examples, which underpins the example collection process.
Highlights
- Automated Component README Generation: Introduced a new build step to automatically generate comprehensive README files for each component, including properties, dependencies, and code examples from various frameworks (HTML, React, Vue, Angular).
- Component Usage Detection: Implemented a Vite plugin to detect and map component usage within example files, generating
component-usage.jsonandcomponent-usage-by-component.jsonfiles. This meta-information is crucial for the README generation process. - Enhanced Documentation Structure: The generated READMEs now include detailed dependency graphs (Mermaid syntax) and categorized code examples (HTML, React, Vue, Angular, Angular Standalone) to provide a richer understanding of each component.
- Build Process Integration: Integrated the new documentation generation logic into the main build script (
packages/documentation/scripts/build.ts) and the Stencil configuration, ensuring that component READMEs are always up-to-date with the latest examples and component metadata.
Using Gemini Code Assist
The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.
Invoking Gemini
You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.
| Feature | Command | Description |
|---|---|---|
| Code Review | /gemini review |
Performs a code review for the current pull request in its current state. |
| Pull Request Summary | /gemini summary |
Provides a summary of the current pull request in its current state. |
| Comment | @gemini-code-assist | Responds in comments when explicitly tagged, both in pull request comments and review comments. |
| Help | /gemini help |
Displays a list of available commands. |
Customization
To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.
Limitations & Feedback
Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with :thumbsup: and :thumbsdown: on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.
You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.
[^1]: Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution.
/release:pr
A new release has been made for this PR. You can install it with:
Core library:
npm i @siemens/[email protected]
Angular:
npm i @siemens/[email protected]
React:
npm i @siemens/[email protected]
Vue:
npm i @siemens/[email protected]
/release:pr
A new release has been made for this PR. You can install it with:
Core library:
npm i @siemens/[email protected]
Angular:
npm i @siemens/[email protected]
React:
npm i @siemens/[email protected]
Vue:
npm i @siemens/[email protected]
Quality Gate passed
Issues
9 New issues
2 Accepted issues
Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code