feat(lib): Add AI Button#3529
Open
louismaximepiton wants to merge 5 commits intoouds/mainfrom
Open
Conversation
louismaximepiton
added
⚛️ component
📖 documentation
github-project-automation
Bot
moved this to In Progress / Draft
in 🟣 [Orange-Boosted-Bootstrap] PRs Board
✅ Deploy Preview for boosted ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
boosted-bot
moved this from In Progress / Draft
to Need Dev Review
in 🟣 [Orange-Boosted-Bootstrap] PRs Board
There was a problem hiding this comment.
Pull request overview
Adds “AI button” support by introducing new sparkles icons in the docs sprite(s), adding documentation examples, and defining theme tokens/CSS needed to style the component.
Changes:
- Added
sparkles-default/sparkles-coloredsymbols to the docs SVG sprites (sosh/orange/orange-compact). - Added an “AI button” section and metadata to the Buttons documentation page.
- Introduced AI-button border color tokens (per theme) and CSS for AI button styling.
Reviewed changes
Copilot reviewed 6 out of 9 changed files in this pull request and generated 5 comments.
Show a summary per file
| File | Description |
|---|---|
| site/static/sosh/docs/[version]/assets/img/ouds-web-sprite.svg | Adds sparkles symbols for the sosh docs sprite. |
| site/static/orange/docs/[version]/assets/img/ouds-web-sprite.svg | Adds sparkles symbols (including a multi-color variant) for the orange docs sprite. |
| site/static/orange-compact/docs/[version]/assets/img/ouds-web-sprite.svg | Adds sparkles symbols (including a multi-color variant) for the orange-compact docs sprite. |
| site/src/content/docs/components/buttons.mdx | Adds AI button type + documentation examples for AI buttons. |
| scss/_buttons.scss | Adds AI button styling (gradient border + icon swapping). |
| packages/sosh/scss/tokens/_component.scss | Adds manually-defined AI button border tokens for sosh. |
| packages/sosh/scss/tokens/_component-colors-custom-props.scss | Adds a new custom prop used by the sosh AI border token. |
| packages/orange/scss/tokens/_component.scss | Adds manually-defined AI button border tokens for orange. |
| packages/orange-compact/scss/tokens/_component.scss | Adds manually-defined AI button border tokens for orange-compact. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 13 out of 16 changed files in this pull request and generated 6 comments.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
MaxLardenois
requested changes
Apr 23, 2026
Collaborator
MaxLardenois
left a comment
MaxLardenois
left a comment
There was a problem hiding this comment.
Some suggestions
In line with what spec we have for now...
| } | ||
|
|
||
| // No transparency on the button | ||
| .btn-default.btn-ai:where(:not(:active, [class*="loading-"], :disabled, [aria-disabled="true"], .btn-on-colored-bg)) { |
Collaborator
There was a problem hiding this comment.
Is the :where necessary here?
Member
Author
There was a problem hiding this comment.
Not really, but it might be useful for end-users to avoid adding too much specificty to the selector
Collaborator
There was a problem hiding this comment.
I'm not sure I understand what it adds for users tbh
boosted-bot
moved this from Need Dev Review
to Dev Review In Progress
in 🟣 [Orange-Boosted-Bootstrap] PRs Board
Co-authored-by: Maxime Lardenois <maxime.lardenois@orange.com>
MaxLardenois
approved these changes
May 4, 2026
Collaborator
MaxLardenois
left a comment
MaxLardenois
left a comment
There was a problem hiding this comment.
Still a question on :where but I approve as it's not blocking
boosted-bot
moved this from Dev Review In Progress
to Need Lead Dev Review
in 🟣 [Orange-Boosted-Bootstrap] PRs Board
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Types of change
Related issues
Closes #3522
Context & Motivation
Read #3522
Description
Add some CSS and documentation to handle AI Button.
Checklists
Checklist (for Core Team only)
Progression (for Core Team only)
ouds/mainfollowing conventional commitLive previews