Skip to content

Improve Polaris component examples - Batch 1 (MoneyField, PasswordField, Select, Switch, URLField)#3903

Draft
sordaz00 wants to merge 7 commits into2026-01from
uiext-polaris-examples-batch1
Draft

Improve Polaris component examples - Batch 1 (MoneyField, PasswordField, Select, Switch, URLField)#3903
sordaz00 wants to merge 7 commits into2026-01from
uiext-polaris-examples-batch1

Conversation

@sordaz00
Copy link
Contributor

Summary

Improves documentation examples for 5 Polaris form input components with action-oriented titles, clearer descriptions, and interactive event handling examples.

Components

MoneyField, PasswordField, Select, Switch, URLField

Changes

Titles & Descriptions

  • Updated example titles from generic "Code" to action-oriented (e.g., "Collect a currency value")
  • Added "Click to interact with the preview." to all example descriptions
  • Clarified distinctions between similar examples

New Interactive Examples

  • PasswordField: password-strength-validation.jsx - real-time strength checking
  • Select: handle-selection-change.jsx - dynamic UI updates on selection
  • Switch: toggle-with-feedback.jsx - track and display toggle state
  • URLField: validate-url-input.jsx - real-time URL validation

Removed Redundant Examples

  • MoneyField: "Set minimum and maximum amounts" (covered by real-time validation)
  • Switch: "Enable a preference" (merged into default)
  • URLField: "Add a label and placeholder" (covered by default)

Clarified Use Cases

  • Switch: Distinguished "Submit multiple settings in a form" vs "Apply multiple settings immediately"
  • MoneyField: Added details prop to constraints example

Stephanie Ordaz added 7 commits February 19, 2026 18:41
The 'Set minimum and maximum amounts' static example wasn't useful—min/max
props don't do anything visible without JavaScript validation. The
'Validate input in real time' example already demonstrates min/max with
working validation, making the static example redundant.
Show details prop to communicate min/max constraints to users
Merged into default example description since both showed basic switch usage
- Renamed 'Collect multiple settings' to 'Submit settings in a form'
- Renamed 'Create a settings panel' to 'Apply settings immediately'
- Moved examples next to each other for easy comparison
- Updated descriptions to clarify when to use each pattern
URLField:
- Remove 'Add a label and placeholder' (covered by default)
- Update default description to mention label and placeholder

Switch:
- Add 'multiple' to form/immediate settings titles for clarity
…witch, URLField

Apply consistent 3-sentence pattern to all example descriptions:
- Purpose statement explaining why to use this pattern
- "This example shows..." describing specific implementation
- "Click to interact with the preview." CTA

Also corrected descriptions to accurately match example code.
- Remove "Click to interact with the preview." from all descriptions
- Collapse examples to HTML-only (remove JSX tabs)
- Change language to 'preview' for interactive HTML examples
- Keep JSX-only interactive examples (validation, state tracking)
- Delete 28 unused JSX example files
@sordaz00 sordaz00 force-pushed the uiext-polaris-examples-batch1 branch from 6d100e8 to f2b92e3 Compare February 20, 2026 00:50
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant

Comments