Skip to content

docs(select): add new section on rich content options - #4512

Merged
brandyscarney merged 18 commits into
major-9.0from
FW-7289
Jun 9, 2026
Merged

docs(select): add new section on rich content options#4512
brandyscarney merged 18 commits into
major-9.0from
FW-7289

Conversation

@brandyscarney

@brandyscarneybrandyscarney commented May 20, 2026•
edited
Loading

Copy link
Copy Markdown
Member

Adds the following:

  1. Select documentation for the new feature allowing HTML to be passed to select options.
  2. Updates the StackBlitz utilities to combine any config object being passed with the mode of the Playground.

Preview

@vercel

vercelBot commented May 20, 2026•
edited
Loading

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

ProjectDeploymentActionsUpdated (UTC)
ionic-docsReadyReadyPreview, CommentJun 9, 2026 9:21pm

Request Review

brandyscarney
brandyscarney commented May 20, 2026
View reviewed changes
Comment threadsrc/components/global/Playground/index.tsx Outdated
brandyscarney
brandyscarney commented May 20, 2026
View reviewed changes
Comment threadsrc/components/global/Playground/playground.types.ts Outdated
brandyscarney
brandyscarney commented May 20, 2026
View reviewed changes
Comment threadsrc/components/global/Playground/README.md Outdated
brandyscarney
brandyscarney commented May 20, 2026
View reviewed changes
Comment threadstatic/usage/v9/select/rich-content-options/javascript/index_html.md
Comment on lines +56 to +64
const formatInterfaceLabel = (selectInterface) => {
return selectInterface
.split('-')
.map((word) => word.charAt(0).toUpperCase() + word.slice(1))
.join(' ');
};

/* Dynamically create the different Select components */
const selectInterfaces = ['alert', 'action-sheet', 'modal', 'popover'];

@brandyscarneybrandyscarneyMay 20, 2026

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Originally I defined the interface array like this:

constselectInterfaces=[{label: 'Alert',value: 'alert',},{label: 'Action Sheet',value: 'action-sheet',},{label: 'Modal',value: 'modal',},{label: 'Popover',value: 'popover',}];

but I removed it in favor of using the single string and converting it to the label. If we think this is too much for the demo, I can go back to the object array.

brandyscarney
brandyscarney commented May 20, 2026
View reviewed changes
Comment threadstatic/usage/v9/select/rich-content-options/javascript/index_html.md
Comment on lines +102 to +106
/* The interfaceOptions property is for demonstration purposes only. */
/* It is not required for the rich options to work. */
select.interfaceOptions = {
header: 'Travel mode',
};

@brandyscarneybrandyscarneyMay 20, 2026

Copy link
Copy Markdown
MemberAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is just to make the demo look nicer but can be removed if desired.

@brandyscarney
brandyscarney marked this pull request as ready for review May 20, 2026 18:26
@brandyscarney
brandyscarney requested a review from a team as a code ownerMay 20, 2026 18:26
@brandyscarney
brandyscarney requested review from gnbm and thetaPC and removed request for a team and gnbmMay 20, 2026 18:26
thetaPC
thetaPC approved these changes May 22, 2026
View reviewed changes

@thetaPCthetaPC left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM, minor suggestions!

Thank you for updating the Playground docs!

Comment threaddocs/api/select.md
Comment threaddocs/api/select.md
Comment threaddocs/api/select.md Outdated
Comment threaddocs/techniques/security.md Outdated
Comment threadsrc/components/global/Playground/index.tsx Outdated
Comment threadsrc/components/global/Playground/README.md Outdated
thetaPC
thetaPC approved these changes May 28, 2026
View reviewed changes

@thetaPCthetaPC left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

thetaPC
thetaPC approved these changes Jun 9, 2026
View reviewed changes

@thetaPCthetaPC left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@brandyscarney
brandyscarney merged commit cafa744 into major-9.0Jun 9, 2026
4 checks passed
@brandyscarney
brandyscarney deleted the FW-7289 branch June 9, 2026 21:29
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@thetaPCthetaPCthetaPC approved these changes

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

2 participants

@brandyscarney@thetaPC