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

feat(TextField): forward maxLength prop to TextField and TextInput input element #2854

Merged
merged 5 commits into from
Jul 25, 2024

Conversation

ragafus
Copy link
Contributor

@ragafus ragafus commented Jul 12, 2024

Closes #2860

Summary

The new prop will allow developers to restrict the max. number of characters of a text input.

Description

In Priceless we need to render a field that will only accept 1 character.

@ragafus ragafus self-assigned this Jul 12, 2024
Copy link

changeset-bot bot commented Jul 12, 2024

🦋 Changeset detected

Latest commit: 5fb9247

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 96 packages
Name Type
@commercetools-uikit/text-field Patch
@commercetools-uikit/text-input Patch
@commercetools-uikit/fields Patch
@commercetools-uikit/localized-text-input Patch
@commercetools-uikit/inputs Patch
@commercetools-frontend/ui-kit Patch
@commercetools-uikit/localized-text-field Patch
@commercetools-uikit/design-system Patch
@commercetools-uikit/calendar-time-utils Patch
@commercetools-uikit/calendar-utils Patch
@commercetools-uikit/hooks Patch
@commercetools-uikit/i18n Patch
@commercetools-uikit/localized-utils Patch
@commercetools-uikit/utils Patch
@commercetools-uikit/accessible-hidden Patch
@commercetools-uikit/avatar Patch
@commercetools-uikit/card Patch
@commercetools-uikit/collapsible-motion Patch
@commercetools-uikit/collapsible-panel Patch
@commercetools-uikit/collapsible Patch
@commercetools-uikit/constraints Patch
@commercetools-uikit/data-table-manager Patch
@commercetools-uikit/data-table Patch
@commercetools-uikit/field-errors Patch
@commercetools-uikit/field-label Patch
@commercetools-uikit/field-warnings Patch
@commercetools-uikit/grid Patch
@commercetools-uikit/icons Patch
@commercetools-uikit/label Patch
@commercetools-uikit/link Patch
@commercetools-uikit/loading-spinner Patch
@commercetools-uikit/messages Patch
@commercetools-uikit/notifications Patch
@commercetools-uikit/pagination Patch
@commercetools-uikit/primary-action-dropdown Patch
@commercetools-uikit/progress-bar Patch
@commercetools-uikit/stamp Patch
@commercetools-uikit/tag Patch
@commercetools-uikit/text Patch
@commercetools-uikit/tooltip Patch
@commercetools-uikit/view-switcher Patch
@commercetools-uikit/accessible-button Patch
@commercetools-uikit/flat-button Patch
@commercetools-uikit/icon-button Patch
@commercetools-uikit/link-button Patch
@commercetools-uikit/primary-button Patch
@commercetools-uikit/secondary-button Patch
@commercetools-uikit/secondary-icon-button Patch
@commercetools-uikit/dropdown-menu Patch
@commercetools-uikit/async-creatable-select-field Patch
@commercetools-uikit/async-select-field Patch
@commercetools-uikit/creatable-select-field Patch
@commercetools-uikit/date-field Patch
@commercetools-uikit/date-range-field Patch
@commercetools-uikit/date-time-field Patch
@commercetools-uikit/localized-multiline-text-field Patch
@commercetools-uikit/money-field Patch
@commercetools-uikit/multiline-text-field Patch
@commercetools-uikit/number-field Patch
@commercetools-uikit/password-field Patch
@commercetools-uikit/radio-field Patch
@commercetools-uikit/search-select-field Patch
@commercetools-uikit/select-field Patch
@commercetools-uikit/time-field Patch
@commercetools-uikit/async-creatable-select-input Patch
@commercetools-uikit/async-select-input Patch
@commercetools-uikit/checkbox-input Patch
@commercetools-uikit/creatable-select-input Patch
@commercetools-uikit/date-input Patch
@commercetools-uikit/date-range-input Patch
@commercetools-uikit/date-time-input Patch
@commercetools-uikit/input-utils Patch
@commercetools-uikit/localized-money-input Patch
@commercetools-uikit/localized-multiline-text-input Patch
@commercetools-uikit/localized-rich-text-input Patch
@commercetools-uikit/money-input Patch
@commercetools-uikit/multiline-text-input Patch
@commercetools-uikit/number-input Patch
@commercetools-uikit/password-input Patch
@commercetools-uikit/radio-input Patch
@commercetools-uikit/rich-text-input Patch
@commercetools-uikit/rich-text-utils Patch
@commercetools-uikit/search-select-input Patch
@commercetools-uikit/search-text-input Patch
@commercetools-uikit/select-input Patch
@commercetools-uikit/select-utils Patch
@commercetools-uikit/selectable-search-input Patch
@commercetools-uikit/time-input Patch
@commercetools-uikit/toggle-input Patch
@commercetools-uikit/spacings-inline Patch
@commercetools-uikit/spacings-inset-squish Patch
@commercetools-uikit/spacings-inset Patch
@commercetools-uikit/spacings-stack Patch
@commercetools-uikit/buttons Patch
@commercetools-uikit/spacings Patch
visual-testing-app 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

Copy link

vercel bot commented Jul 12, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
ui-kit ✅ Ready (Inspect) Visit Preview 💬 Add feedback Jul 24, 2024 9:59am
ui-kit-storybook-v2 ❌ Failed (Inspect) Jul 24, 2024 9:59am

@ragafus ragafus marked this pull request as ready for review July 12, 2024 17:28
@ragafus ragafus requested a review from a team July 12, 2024 17:28
Copy link

gitstream-cm bot commented Jul 12, 2024

This PR is missing a Jira ticket reference in the title or description.
Please add a Jira ticket reference to the title or description of this PR.

Copy link

gitstream-cm bot commented Jul 12, 2024

🥷 Code experts: jmcreasman

jmcreasman has most 👩‍💻 activity in the files.
Rhotimee has most 🧠 knowledge in the files.

See details

packages/components/fields/text-field/README.md

Activity based on git-commit:

jmcreasman
JUL
JUN
MAY
APR 1 additions & 0 deletions
MAR
FEB

Knowledge based on git-blame:
Rhotimee: 28%

packages/components/fields/text-field/src/text-field.story.js

Activity based on git-commit:

jmcreasman
JUL
JUN
MAY
APR 1 additions & 0 deletions
MAR
FEB

Knowledge based on git-blame:

packages/components/fields/text-field/src/text-field.tsx

Activity based on git-commit:

jmcreasman
JUL
JUN
MAY
APR 5 additions & 0 deletions
MAR
FEB

Knowledge based on git-blame:
Rhotimee: 79%

packages/components/inputs/text-input/README.md

Activity based on git-commit:

jmcreasman
JUL
JUN
MAY
APR 1 additions & 0 deletions
MAR
FEB

Knowledge based on git-blame:

packages/components/inputs/text-input/src/text-input.story.js

Activity based on git-commit:

jmcreasman
JUL
JUN
MAY
APR 1 additions & 0 deletions
MAR
FEB

Knowledge based on git-blame:

packages/components/inputs/text-input/src/text-input.tsx

Activity based on git-commit:

jmcreasman
JUL
JUN
MAY
APR 4 additions & 0 deletions
MAR
FEB

Knowledge based on git-blame:

To learn more about /:\ gitStream - Visit our Docs

Copy link
Contributor

@ddouglasz ddouglasz left a comment

Choose a reason for hiding this comment

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

Thank you! 🙏🏾.
Looks good to me. I left some comments after checking in with our designer.
We at least have to remind the developers that they should provide a form of visual notification when they use this property.
I added requested changes in line with this.

image

Copy link
Contributor

@misama-ct misama-ct left a comment

Choose a reason for hiding this comment

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

Thank you!

@ddouglasz ddouglasz merged commit de77fa9 into main Jul 25, 2024
7 checks passed
@ddouglasz ddouglasz deleted the rg-max-length-text-field branch July 25, 2024 11:00
@ct-changesets ct-changesets bot mentioned this pull request Jul 25, 2024
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.

Add maxLength prop to TextInput and TextField and forward it to their input element
4 participants