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

fix(input): fixed the color of disabled input values #1408

Merged
merged 4 commits into from
May 3, 2021

Conversation

richbachman
Copy link
Contributor

@richbachman richbachman commented Apr 30, 2021

Fixes: #1305

  • Added -webkit-text-fill-color to css scales and enabled it to use textColor tokens
  • Fixed disabled Input value color
  • Fixed disabled TextArea value color
  • Adjusted disabled Combobox story to have an initial value for VRT

@richbachman richbachman added the Area: Components Related to the component library (core) of this system label Apr 30, 2021
@changeset-bot
Copy link

changeset-bot bot commented Apr 30, 2021

🦋 Changeset detected

Latest commit: 09340e8

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

This PR includes changesets to release 4 packages
Name Type
@twilio-paste/input Patch
@twilio-paste/textarea Patch
@twilio-paste/core Patch
@twilio-paste/styling-library 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

@github-actions
Copy link
Contributor

github-actions bot commented Apr 30, 2021

Size Change: +171 B (0%)

Total Size: 522 kB

Filename Size Change
packages/paste-core/components/input/dist/index.es.js 1.35 kB +29 B (+2%)
packages/paste-core/components/input/dist/index.js 1.7 kB +31 B (+2%)
packages/paste-core/components/textarea/dist/index.es.js 5.03 kB +32 B (+1%)
packages/paste-core/components/textarea/dist/index.js 5.08 kB +32 B (+1%)
packages/paste-libraries/styling/dist/index.es.js 26.6 kB +24 B (0%)
packages/paste-libraries/styling/dist/index.js 27 kB +23 B (0%)
ℹ️ View Unchanged
Filename Size Change
packages/paste-core/components/alert/dist/index.es.js 1.26 kB 0 B
packages/paste-core/components/alert/dist/index.js 1.61 kB 0 B
packages/paste-core/components/anchor/dist/index.es.js 1.51 kB 0 B
packages/paste-core/components/anchor/dist/index.js 1.83 kB 0 B
packages/paste-core/components/avatar/dist/index.es.js 1.71 kB 0 B
packages/paste-core/components/avatar/dist/index.js 2.04 kB 0 B
packages/paste-core/components/base-radio-checkbox/dist/index.es.js 1.12 kB 0 B
packages/paste-core/components/base-radio-checkbox/dist/index.js 1.5 kB 0 B
packages/paste-core/components/breadcrumb/dist/index.es.js 1.08 kB 0 B
packages/paste-core/components/breadcrumb/dist/index.js 1.41 kB 0 B
packages/paste-core/components/button/dist/index.es.js 10.1 kB 0 B
packages/paste-core/components/button/dist/index.js 10.4 kB 0 B
packages/paste-core/components/card/dist/index.es.js 697 B 0 B
packages/paste-core/components/card/dist/index.js 1.04 kB 0 B
packages/paste-core/components/checkbox/dist/index.es.js 2.35 kB 0 B
packages/paste-core/components/checkbox/dist/index.js 2.66 kB 0 B
packages/paste-core/components/combobox/dist/index.es.js 13.2 kB 0 B
packages/paste-core/components/combobox/dist/index.js 13.5 kB 0 B
packages/paste-core/components/disclosure/dist/index.es.js 2.28 kB 0 B
packages/paste-core/components/disclosure/dist/index.js 2.62 kB 0 B
packages/paste-core/components/form/dist/index.es.js 256 B 0 B
packages/paste-core/components/form/dist/index.js 692 B 0 B
packages/paste-core/components/heading/dist/index.es.js 889 B 0 B
packages/paste-core/components/heading/dist/index.js 1.23 kB 0 B
packages/paste-core/components/help-text/dist/index.es.js 927 B 0 B
packages/paste-core/components/help-text/dist/index.js 1.28 kB 0 B
packages/paste-core/components/inline-control-group/dist/index.es.js 956 B 0 B
packages/paste-core/components/inline-control-group/dist/index.js 1.3 kB 0 B
packages/paste-core/components/input-box/dist/index.es.js 1.92 kB 0 B
packages/paste-core/components/input-box/dist/index.js 2.22 kB 0 B
packages/paste-core/components/label/dist/index.es.js 1.13 kB 0 B
packages/paste-core/components/label/dist/index.js 1.48 kB 0 B
packages/paste-core/components/list/dist/index.es.js 778 B 0 B
packages/paste-core/components/list/dist/index.js 1.13 kB 0 B
packages/paste-core/components/menu/dist/index.es.js 1.8 kB 0 B
packages/paste-core/components/menu/dist/index.js 2.15 kB 0 B
packages/paste-core/components/modal/dist/index.es.js 2.57 kB 0 B
packages/paste-core/components/modal/dist/index.js 2.88 kB 0 B
packages/paste-core/components/pagination/dist/index.es.js 2.78 kB 0 B
packages/paste-core/components/pagination/dist/index.js 3.07 kB 0 B
packages/paste-core/components/paragraph/dist/index.es.js 570 B 0 B
packages/paste-core/components/paragraph/dist/index.js 914 B 0 B
packages/paste-core/components/popover/dist/index.es.js 1.45 kB 0 B
packages/paste-core/components/popover/dist/index.js 1.8 kB 0 B
packages/paste-core/components/radio-group/dist/index.es.js 1.59 kB 0 B
packages/paste-core/components/radio-group/dist/index.js 1.93 kB 0 B
packages/paste-core/components/screen-reader-only/dist/index.es.js 652 B 0 B
packages/paste-core/components/screen-reader-only/dist/index.js 996 B 0 B
packages/paste-core/components/select/dist/index.es.js 1.55 kB 0 B
packages/paste-core/components/select/dist/index.js 1.86 kB 0 B
packages/paste-core/components/separator/dist/index.es.js 759 B 0 B
packages/paste-core/components/separator/dist/index.js 1.1 kB 0 B
packages/paste-core/components/spinner/dist/index.es.js 744 B 0 B
packages/paste-core/components/spinner/dist/index.js 1.14 kB 0 B
packages/paste-core/components/table/dist/index.es.js 1.74 kB 0 B
packages/paste-core/components/table/dist/index.js 2.07 kB 0 B
packages/paste-core/components/tabs/dist/index.es.js 2.02 kB 0 B
packages/paste-core/components/tabs/dist/index.js 2.34 kB 0 B
packages/paste-core/components/toast/dist/index.es.js 3 kB 0 B
packages/paste-core/components/toast/dist/index.js 3.32 kB 0 B
packages/paste-core/components/tooltip/dist/index.es.js 1.1 kB 0 B
packages/paste-core/components/tooltip/dist/index.js 1.45 kB 0 B
packages/paste-core/components/truncate/dist/index.es.js 588 B 0 B
packages/paste-core/components/truncate/dist/index.js 934 B 0 B
packages/paste-core/components/typography/dist/index.es.js 1.38 kB 0 B
packages/paste-core/components/typography/dist/index.js 1.74 kB 0 B
packages/paste-core/core-bundle/dist/alert.js 194 B 0 B
packages/paste-core/core-bundle/dist/anchor.js 197 B 0 B
packages/paste-core/core-bundle/dist/animation-library.js 211 B 0 B
packages/paste-core/core-bundle/dist/aspect-ratio.js 205 B 0 B
packages/paste-core/core-bundle/dist/avatar.js 200 B 0 B
packages/paste-core/core-bundle/dist/base-radio-checkbox.js 218 B 0 B
packages/paste-core/core-bundle/dist/box.js 195 B 0 B
packages/paste-core/core-bundle/dist/breadcrumb.js 204 B 0 B
packages/paste-core/core-bundle/dist/button.js 201 B 0 B
packages/paste-core/core-bundle/dist/card.js 199 B 0 B
packages/paste-core/core-bundle/dist/checkbox.js 201 B 0 B
packages/paste-core/core-bundle/dist/combobox-primitive.js 213 B 0 B
packages/paste-core/core-bundle/dist/combobox.js 203 B 0 B
packages/paste-core/core-bundle/dist/customization.js 206 B 0 B
packages/paste-core/core-bundle/dist/design-tokens.js 209 B 0 B
packages/paste-core/core-bundle/dist/disclosure-primitive.js 213 B 0 B
packages/paste-core/core-bundle/dist/disclosure.js 204 B 0 B
packages/paste-core/core-bundle/dist/dropdown-library.js 211 B 0 B
packages/paste-core/core-bundle/dist/flex.js 196 B 0 B
packages/paste-core/core-bundle/dist/form.js 197 B 0 B
packages/paste-core/core-bundle/dist/grid.js 196 B 0 B
packages/paste-core/core-bundle/dist/heading.js 199 B 0 B
packages/paste-core/core-bundle/dist/help-text.js 204 B 0 B
packages/paste-core/core-bundle/dist/index.js 1.03 kB 0 B
packages/paste-core/core-bundle/dist/inline-control-group.js 218 B 0 B
packages/paste-core/core-bundle/dist/input-box.js 206 B 0 B
packages/paste-core/core-bundle/dist/input.js 200 B 0 B
packages/paste-core/core-bundle/dist/label.js 196 B 0 B
packages/paste-core/core-bundle/dist/list.js 195 B 0 B
packages/paste-core/core-bundle/dist/media-object.js 202 B 0 B
packages/paste-core/core-bundle/dist/menu-primitive.js 210 B 0 B
packages/paste-core/core-bundle/dist/menu.js 196 B 0 B
packages/paste-core/core-bundle/dist/modal-dialog-primitive.js 219 B 0 B
packages/paste-core/core-bundle/dist/modal.js 196 B 0 B
packages/paste-core/core-bundle/dist/non-modal-dialog-primitive.js 224 B 0 B
packages/paste-core/core-bundle/dist/pagination.js 199 B 0 B
packages/paste-core/core-bundle/dist/paragraph.js 202 B 0 B
packages/paste-core/core-bundle/dist/popover.js 201 B 0 B
packages/paste-core/core-bundle/dist/radio-group.js 208 B 0 B
packages/paste-core/core-bundle/dist/reakit-library.js 211 B 0 B
packages/paste-core/core-bundle/dist/screen-reader-only.js 214 B 0 B
packages/paste-core/core-bundle/dist/select.js 197 B 0 B
packages/paste-core/core-bundle/dist/separator.js 199 B 0 B
packages/paste-core/core-bundle/dist/sibling-box.js 206 B 0 B
packages/paste-core/core-bundle/dist/spinner.js 198 B 0 B
packages/paste-core/core-bundle/dist/stack.js 200 B 0 B
packages/paste-core/core-bundle/dist/style-props.js 202 B 0 B
packages/paste-core/core-bundle/dist/styling-library.js 210 B 0 B
packages/paste-core/core-bundle/dist/table.js 195 B 0 B
packages/paste-core/core-bundle/dist/tabs-primitive.js 210 B 0 B
packages/paste-core/core-bundle/dist/tabs.js 196 B 0 B
packages/paste-core/core-bundle/dist/text.js 195 B 0 B
packages/paste-core/core-bundle/dist/textarea.js 198 B 0 B
packages/paste-core/core-bundle/dist/theme.js 196 B 0 B
packages/paste-core/core-bundle/dist/toast.js 195 B 0 B
packages/paste-core/core-bundle/dist/tooltip-primitive.js 212 B 0 B
packages/paste-core/core-bundle/dist/tooltip.js 198 B 0 B
packages/paste-core/core-bundle/dist/truncate.js 198 B 0 B
packages/paste-core/core-bundle/dist/types.js 196 B 0 B
packages/paste-core/core-bundle/dist/uid-library.js 208 B 0 B
packages/paste-core/layout/aspect-ratio/dist/index.es.js 709 B 0 B
packages/paste-core/layout/aspect-ratio/dist/index.js 1.11 kB 0 B
packages/paste-core/layout/flex/dist/index.es.js 1.62 kB 0 B
packages/paste-core/layout/flex/dist/index.js 1.95 kB 0 B
packages/paste-core/layout/grid/dist/index.es.js 1.65 kB 0 B
packages/paste-core/layout/grid/dist/index.js 1.96 kB 0 B
packages/paste-core/layout/media-object/dist/index.es.js 577 B 0 B
packages/paste-core/layout/media-object/dist/index.js 987 B 0 B
packages/paste-core/layout/stack/dist/index.es.js 1.13 kB 0 B
packages/paste-core/layout/stack/dist/index.js 1.46 kB 0 B
packages/paste-core/primitives/box/dist/index.es.js 1.39 kB 0 B
packages/paste-core/primitives/box/dist/index.js 1.74 kB 0 B
packages/paste-core/primitives/combobox/dist/index.es.js 142 B 0 B
packages/paste-core/primitives/combobox/dist/index.js 561 B 0 B
packages/paste-core/primitives/disclosure/dist/index.es.js 155 B 0 B
packages/paste-core/primitives/disclosure/dist/index.js 570 B 0 B
packages/paste-core/primitives/menu/dist/index.es.js 209 B 0 B
packages/paste-core/primitives/menu/dist/index.js 622 B 0 B
packages/paste-core/primitives/modal-dialog/dist/index.es.js 23.8 kB 0 B
packages/paste-core/primitives/modal-dialog/dist/index.js 23.7 kB 0 B
packages/paste-core/primitives/non-modal-dialog/dist/index.es.js 176 B 0 B
packages/paste-core/primitives/non-modal-dialog/dist/index.js 590 B 0 B
packages/paste-core/primitives/sibling-box/dist/index.es.js 744 B 0 B
packages/paste-core/primitives/sibling-box/dist/index.js 1.16 kB 0 B
packages/paste-core/primitives/tabs/dist/index.es.js 153 B 0 B
packages/paste-core/primitives/tabs/dist/index.js 572 B 0 B
packages/paste-core/primitives/text/dist/index.es.js 1.07 kB 0 B
packages/paste-core/primitives/text/dist/index.js 1.44 kB 0 B
packages/paste-core/primitives/tooltip/dist/index.es.js 163 B 0 B
packages/paste-core/primitives/tooltip/dist/index.js 578 B 0 B
packages/paste-customization/dist/index.es.js 6.41 kB 0 B
packages/paste-customization/dist/index.js 6.68 kB 0 B
packages/paste-libraries/animation/dist/index.es.js 23.8 kB 0 B
packages/paste-libraries/animation/dist/index.js 24.1 kB 0 B
packages/paste-libraries/dropdown/dist/index.es.js 26.4 kB 0 B
packages/paste-libraries/dropdown/dist/index.js 26.5 kB 0 B
packages/paste-libraries/reakit/dist/index.es.js 48.4 kB 0 B
packages/paste-libraries/reakit/dist/index.js 48.6 kB 0 B
packages/paste-libraries/uid/dist/index.es.js 1.72 kB 0 B
packages/paste-libraries/uid/dist/index.js 2.1 kB 0 B
packages/paste-style-props/dist/index.es.js 1.9 kB 0 B
packages/paste-style-props/dist/index.js 2.44 kB 0 B
packages/paste-theme/dist/index.es.js 3 kB 0 B
packages/paste-theme/dist/index.js 3.23 kB 0 B
packages/paste-types/dist/index.es.js 20 B 0 B
packages/paste-types/dist/index.js 20 B 0 B

compressed-size-action

@codesandbox-ci
Copy link

codesandbox-ci bot commented Apr 30, 2021

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 09340e8:

Sandbox Source
@twilio-paste/nextjs-template Configuration

@cypress
Copy link

cypress bot commented Apr 30, 2021



Test summary

2 0 0 0Flakiness 0


Run details

Project Paste
Status Passed
Commit 09340e8
Started May 3, 2021 11:11 PM
Ended May 3, 2021 11:11 PM
Duration 00:30 💡
OS Linux Ubuntu - 20.04
Browser Electron 83

View run in Cypress Dashboard ➡️


This comment has been generated by cypress-bot as a result of this project's GitHub integration settings. You can manage this integration in this project's settings in the Cypress Dashboard

Copy link
Contributor

@gloriliale gloriliale left a comment

Choose a reason for hiding this comment

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

This looks great 🙌🏽! Do we need to include a changeset for combobox as well?

@richbachman
Copy link
Contributor Author

This looks great 🙌🏽! Do we need to include a changeset for combobox as well?

@gloriliale I don't think so since we're just adding a story there. Nothing in the package actually changes.

Copy link
Contributor

@TheSisb TheSisb left a comment

Choose a reason for hiding this comment

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

Just not sure how this works, but the fix seems reasonable devoid of alternatives.

@richbachman richbachman marked this pull request as ready for review May 3, 2021 23:09
@richbachman richbachman merged commit 0757b99 into main May 3, 2021
@richbachman richbachman deleted the fix/input-color branch May 3, 2021 23:20
@TwilioPasteBot TwilioPasteBot mentioned this pull request May 3, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Area: Components Related to the component library (core) of this system
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Input type "disabled" blends input value into background color in Safari
3 participants