Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update validity state functionality and documentation #165

Merged
merged 6 commits into from
Jan 9, 2025

Conversation

jordanjones243
Copy link
Contributor

@jordanjones243 jordanjones243 commented Jan 3, 2025

Alaska Airlines Pull Request

Before Submitting this pull request:

  • Link all tickets in this repository related to this PR in the Development section
    note: all pull requests require at least one linked ticket
  • If this PR is Ready For Review, all ticket's linked under Development must have their status changed to Ready For Review as well

By submitting this Pull Request, I confirm that my contribution is made under the terms of the Apache 2.0 license and I have performed a self-review of my own update.

Summary by Sourcery

Update the validity state functionality and documentation for form components.

Summary by Sourcery

Update the handling of validation states and error messages for form components.

New Features:

  • Add support for basic range selection in the datepicker.

Enhancements:

  • Improve the error message handling in form components.

Documentation:

  • Document the updated validity state functionality for form components.

@jordanjones243 jordanjones243 self-assigned this Jan 3, 2025
Copy link

sourcery-ai bot commented Jan 3, 2025

Reviewer's Guide by Sourcery

This pull request updates the validity state functionality and documentation for form components. The key change is the replacement of the setCustomValidity attribute with more specific attributes like setCustomValidityCustomError, setCustomValidityPatternMismatch, and setCustomValidityValueMissing to align with HTML5 validation standards. The error attribute now sets the validation message directly. Additionally, the documentation has been reorganized to improve clarity and flow.

Class diagram showing updated form validation components

classDiagram
      class BaseInput {
        +String error
        +String validity
        +String setCustomValidity
        +String setCustomValidityCustomError
        +String setCustomValidityPatternMismatch
        +String setCustomValidityValueMissing
        +String setCustomValidityTooShort
        +String setCustomValidityTooLong
        +String setCustomValidityRangeOverflow
        +String setCustomValidityRangeUnderflow
        +validate()
      }

      class AuroInput {
        +render()
      }

      class AuroSelect {
        +String error
        +String validity 
        +String setCustomValidity
        +String setCustomValidityCustomError
        +String setCustomValidityValueMissing
        +reset()
        +validate()
      }

      class AuroDatePicker {
        +String error
        +String validity
        +String setCustomValidity
        +String setCustomValidityCustomError
        +String setCustomValidityValueMissing
        +validate()
      }

      BaseInput <|-- AuroInput
      BaseInput <|-- AuroSelect
      BaseInput <|-- AuroDatePicker

      note for BaseInput "Base class with common validation functionality"
Loading

State diagram for form validation states

stateDiagram-v2
      [*] --> Valid
      Valid --> Invalid: Validation fails
      Invalid --> Valid: Validation passes

      state Invalid {
        [*] --> CustomError: error attribute set
        [*] --> ValueMissing: required but empty
        [*] --> PatternMismatch: pattern validation fails
        [*] --> RangeOverflow: value > max
        [*] --> RangeUnderflow: value < min
        [*] --> TooLong: value too long
        [*] --> TooShort: value too short
      }

      Invalid --> Valid: Validation passes
      Valid --> [*]
Loading

File-Level Changes

Change Details Files
Replaced generic custom validity attributes with type-specific custom validity attributes.
  • setCustomValidity attribute replaced with specific custom validity attributes for different error types (e.g., setCustomValidityCustomError, setCustomValidityPatternMismatch, setCustomValidityValueMissing).
  • Logic updated to handle type-specific custom validity attributes.
  • Documentation updated to reflect the changes in custom validity attributes.
components/datepicker/src/auro-datepicker.js
components/input/src/base-input.js
packages/form-validation/src/validation.js
components/combobox/src/auro-combobox.js
components/select/src/auro-select.js
components/checkbox/src/auro-checkbox-group.js
components/input/apiExamples/pattern.html
components/input/apiExamples/validateOnInput.html
Updated the handling of the error attribute.
  • The error attribute now directly sets the validation message.
  • Removed redundant setting of setCustomValidity when error is present.
  • Updated documentation to reflect the change in error attribute handling.
components/datepicker/src/auro-datepicker.js
components/input/src/base-input.js
packages/form-validation/src/validation.js
components/combobox/src/auro-combobox.js
components/select/src/auro-select.js
components/checkbox/src/auro-checkbox-group.js
components/datepicker/apiExamples/error.html
Improved documentation for clarity and consistency.
  • Reorganized sections for better flow.
  • Clarified descriptions of attributes and properties.
  • Updated examples to reflect best practices.
  • Ensured consistent language and terminology across documentation.
components/datepicker/docs/partials/api.md
components/input/docs/api.md
components/combobox/demo/api.md
components/combobox/docs/api.md
components/select/demo/api.md
components/select/docs/partials/api.md
components/datepicker/docs/api.md
components/input/docs/partials/index.md
components/checkbox/docs/api.md
Refactored value handling and validation in auro-select.
  • Removed handling of undefined values.
  • Simplified value setting logic.
  • Improved validation for invalid values.
  • Updated tests to cover new value handling behavior.
components/select/src/auro-select.js
components/select/demo/api.md
components/select/apiExamples/value.js
components/select/apiExamples/value.html
components/select/test/auro-select.test.js
Minor updates and fixes.
  • Improved styling of notification icons.
  • Fixed minor UI inconsistencies.
  • Simplified event handling in auro-menu.
  • Updated error message handling in auro-radio-group.
components/input/src/styles/notificationIcons.scss
components/input/src/auro-input.js
components/menu/src/auro-menu.js
components/radio/src/auro-radio-group.js
Reorganized documentation sections in datepicker and input components.
  • Moved sections for better logical grouping.
  • Improved readability and navigation within the documentation.
components/datepicker/docs/partials/api.md
components/input/docs/partials/api.md

Tips and commands

Interacting with Sourcery

  • Trigger a new review: Comment @sourcery-ai review on the pull request.
  • Continue discussions: Reply directly to Sourcery's review comments.
  • Generate a GitHub issue from a review comment: Ask Sourcery to create an
    issue from a review comment by replying to it.
  • Generate a pull request title: Write @sourcery-ai anywhere in the pull
    request title to generate a title at any time.
  • Generate a pull request summary: Write @sourcery-ai summary anywhere in
    the pull request body to generate a PR summary at any time. You can also use
    this command to specify where the summary should be inserted.

Customizing Your Experience

Access your dashboard to:

  • Enable or disable review features such as the Sourcery-generated pull request
    summary, the reviewer's guide, and others.
  • Change the review language.
  • Add, remove or edit custom review instructions.
  • Adjust other review settings.

Getting Help

@CLAassistant
Copy link

CLAassistant commented Jan 3, 2025

CLA assistant check
All committers have signed the CLA.

@jordanjones243 jordanjones243 force-pushed the jjones/validityStateUpdates branch from 7c87570 to 009587a Compare January 7, 2025 23:39
@jordanjones243 jordanjones243 marked this pull request as ready for review January 8, 2025 05:51
@jordanjones243 jordanjones243 requested a review from a team as a code owner January 8, 2025 05:51
Copy link

@sourcery-ai sourcery-ai bot left a comment

Choose a reason for hiding this comment

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

Hey @jordanjones243 - I've reviewed your changes and they look great!

Here's what I looked at during the review
  • 🟢 General issues: all looks good
  • 🟢 Security: all looks good
  • 🟢 Testing: all looks good
  • 🟢 Complexity: all looks good
  • 🟢 Documentation: all looks good

Sourcery is free for open source - if you like our reviews please consider sharing them ✨
Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.

packages/form-validation/src/validation.js Outdated Show resolved Hide resolved
packages/form-validation/src/validation.js Outdated Show resolved Hide resolved
@jordanjones243 jordanjones243 force-pushed the jjones/validityStateUpdates branch 2 times, most recently from 6ad2251 to c2c4c56 Compare January 8, 2025 06:01
packages/form-validation/src/validation.js Outdated Show resolved Hide resolved
components/select/test/auro-select.test.js Show resolved Hide resolved
components/select/demo/api.md Outdated Show resolved Hide resolved
components/select/demo/api.md Show resolved Hide resolved
components/input/src/styles/notificationIcons.scss Outdated Show resolved Hide resolved
components/input/src/base-input.js Outdated Show resolved Hide resolved
components/input/docs/partials/api.md Show resolved Hide resolved
components/datepicker/src/auro-datepicker.js Show resolved Hide resolved
@jordanjones243 jordanjones243 merged commit 4c6a1e1 into beta Jan 9, 2025
4 checks passed
@jordanjones243 jordanjones243 deleted the jjones/validityStateUpdates branch January 9, 2025 21:47
@jason-capsule42
Copy link
Member

🎉 This PR is included in version 2.0.0-beta.3 🎉

The release is available on:

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment