feat(TextInput): Convert TextInput (Part 2) - Update CSS to use data attributes #5257

hussam-i-am · 2024-11-08T22:33:53Z

Relates to https://github.com/github/primer/issues/4365

Changelog

New

Changed

As a precursor to feat(TextInput): Convert TextInput (Part 3) - Update TextInputWrapper and TextInputWithTokens #5227, updated the styled components to use data attributes for styling and moved away from using the functions
Replaced get calls with CSS variables and removed fallbacks
Updated test helper to include the data attributes
Updated snapshots to reflect reordered styles and CSS variables

Removed

Rollout strategy

Patch release
Minor release
Major release; if selected, include a written rollout or migration plan
None; if selected, include a brief description as to why

Testing & Reviewing

Not sure if it is a known issue but it seems that passing in small for size does not currently do anything, whereas with the changes made, we are getting smaller inputs

Merge checklist

Added/updated tests
Added/updated documentation
Added/updated previews (Storybook)
Changes are SSR compatible
Tested in Chrome
Tested in Firefox
Tested in Safari
Tested in Edge
(GitHub staff only) Integration tests pass at github/github (Learn more about how to run integration tests)

…tes for …" This reverts commit c424c36.

changeset-bot · 2024-11-08T22:33:58Z

🦋 Changeset detected

Latest commit: 6e9f2e7

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

This PR includes changesets to release 1 package

Name	Type
@primer/react	Minor

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 · 2024-11-08T22:34:22Z

👋 Hi, this pull request contains changes to the source code that github/github depends on. If you are GitHub staff, we recommend testing these changes with github/github using the integration workflow. Thanks!

github-actions · 2024-11-08T22:37:03Z

size-limit report 📦

Path	Size
packages/react/dist/browser.esm.js	98.88 KB (+0.18% 🔺)
packages/react/dist/browser.umd.js	99.2 KB (+0.22% 🔺)

…am/remove-textinput-width-props

…thub.com/primer/react into hussam-i-am/remove-textinput-width-props

…thub.com/primer/react into revert-5256-revert-5242-hussam-i-am/text-input-data-attrs

…256-revert-5242-hussam-i-am/text-input-data-attrs

hussam-i-am · 2024-11-12T15:58:27Z

packages/react/src/__tests__/Textarea.test.tsx

-    const defaultStyles = renderStyles(<Textarea block />)
-    const blockStyles = renderStyles(<Textarea />)
+    const defaultStyles = renderStyles(<Textarea />)
+    const blockStyles = renderStyles(<Textarea block />)


Updated so that variable names match component props

…thub.com/primer/react into revert-5256-revert-5242-hussam-i-am/text-input-data-attrs

…56-revert-5242-hussam-i-am/text-input-data-attrs

hussam-i-am · 2024-11-13T23:10:36Z

Failing integration tests are the same owns failing in main #5276

…ut-data-attrs

primer-integration · 2024-11-14T15:53:49Z

👋 Hi from github/github! Your integration PR is ready: https://github.com/github/github/pull/351099

primer-integration · 2024-11-14T16:15:11Z

🔴 golden-jobs completed with status failure.

hussam-i-am added 4 commits November 8, 2024 20:03

feat(TextInput): Remove width props from TextInput

7e74223

type fixes

1958184

Merge branch 'main' into hussam-i-am/remove-textinput-width-props

de2b18f

Revert "Revert "feat(TextInput): Update TextInput to use data attribu…

bbac544

…tes for …" This reverts commit c424c36.

hussam-i-am self-assigned this Nov 8, 2024

github-actions bot added the integration-tests: recommended This change needs to be tested for breaking changes. See https://arc.net/l/quote/tdmpakpm label Nov 8, 2024

hussam-i-am temporarily deployed to github-pages November 8, 2024 22:35 — with GitHub Actions Inactive

github-actions bot temporarily deployed to storybook-preview-5257 November 8, 2024 22:36 Inactive

hussam-i-am added 4 commits November 8, 2024 22:40

Merge branch 'main' of https://github.com/primer/react into hussam-i-…

95c0827

…am/remove-textinput-width-props

lint fix

a2fd736

Merge branch 'hussam-i-am/remove-textinput-width-props' of https://gi…

5d36dd7

…thub.com/primer/react into hussam-i-am/remove-textinput-width-props

remove unused imports

f64022b

github-actions bot added integration-tests: failing Changes in this PR cause breaking changes in gh/gh and removed integration-tests: recommended This change needs to be tested for breaking changes. See https://arc.net/l/quote/tdmpakpm labels Nov 8, 2024

hussam-i-am added 2 commits November 9, 2024 00:07

Merge branch 'hussam-i-am/remove-textinput-width-props' of https://gi…

66aa372

…thub.com/primer/react into revert-5256-revert-5242-hussam-i-am/text-input-data-attrs

fix type error and add test

40ab2b3

hussam-i-am temporarily deployed to github-pages November 9, 2024 00:30 — with GitHub Actions Inactive

hussam-i-am changed the base branch from main to hussam-i-am/remove-textinput-width-props November 9, 2024 00:30

github-actions bot temporarily deployed to storybook-preview-5257 November 9, 2024 00:30 Inactive

github-actions bot added integration-tests: passing Changes in this PR do NOT cause breaking changes in gh/gh and removed integration-tests: failing Changes in this PR cause breaking changes in gh/gh labels Nov 9, 2024

hussam-i-am marked this pull request as ready for review November 12, 2024 15:49

hussam-i-am requested a review from a team as a code owner November 12, 2024 15:49

hussam-i-am requested a review from camertron November 12, 2024 15:49

hussam-i-am added 2 commits November 12, 2024 10:57

Merge branch 'main' into hussam-i-am/remove-textinput-width-props

75a2a67

Merge branch 'hussam-i-am/remove-textinput-width-props' into revert-5…

50e4f49

…256-revert-5242-hussam-i-am/text-input-data-attrs

hussam-i-am commented Nov 12, 2024

View reviewed changes

revert back to get

8915312

hussam-i-am temporarily deployed to github-pages November 13, 2024 19:56 — with GitHub Actions Inactive

github-actions bot temporarily deployed to storybook-preview-5257 November 13, 2024 19:57 Inactive

revert more gets

29464fd

hussam-i-am temporarily deployed to github-pages November 13, 2024 20:05 — with GitHub Actions Inactive

github-actions bot temporarily deployed to storybook-preview-5257 November 13, 2024 20:05 Inactive

hussam-i-am requested a review from joshblack November 13, 2024 20:08

hussam-i-am added 2 commits November 13, 2024 20:18

Properly mark props as deprecated

d7deba0

Merge branch 'hussam-i-am/remove-textinput-width-props' of https://gi…

ae9748b

…thub.com/primer/react into revert-5256-revert-5242-hussam-i-am/text-input-data-attrs

hussam-i-am temporarily deployed to github-pages November 13, 2024 20:28 — with GitHub Actions Inactive

github-actions bot temporarily deployed to storybook-preview-5257 November 13, 2024 20:29 Inactive

Base automatically changed from hussam-i-am/remove-textinput-width-props to main November 13, 2024 20:38

Merge branch 'main' of https://github.com/primer/react into revert-52…

4e51a6b

…56-revert-5242-hussam-i-am/text-input-data-attrs

hussam-i-am temporarily deployed to github-pages November 13, 2024 20:45 — with GitHub Actions Inactive

github-actions bot temporarily deployed to storybook-preview-5257 November 13, 2024 20:45 Inactive

Merge branch 'main' into revert-5256-revert-5242-hussam-i-am/text-inp…

7b20e63

…ut-data-attrs

hussam-i-am temporarily deployed to github-pages November 14, 2024 06:06 — with GitHub Actions Inactive

github-actions bot temporarily deployed to storybook-preview-5257 November 14, 2024 06:07 Inactive

Merge branch 'main' into revert-5256-revert-5242-hussam-i-am/text-inp…

6e9f2e7

…ut-data-attrs

hussam-i-am deployed to github-pages November 14, 2024 15:48 — with GitHub Actions View deployment

github-actions bot deployed to storybook-preview-5257 November 14, 2024 15:48 View deployment

jonrohan approved these changes Nov 14, 2024

View reviewed changes

hussam-i-am added this pull request to the merge queue Nov 14, 2024

Merged via the queue into main with commit 4aa40c9 Nov 14, 2024
43 checks passed

hussam-i-am deleted the revert-5256-revert-5242-hussam-i-am/text-input-data-attrs branch November 14, 2024 18:05

primer bot mentioned this pull request Nov 14, 2024

Release tracking (37.6.0) #5296

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(TextInput): Convert TextInput (Part 2) - Update CSS to use data attributes #5257

feat(TextInput): Convert TextInput (Part 2) - Update CSS to use data attributes #5257

hussam-i-am commented Nov 8, 2024 •

edited

Loading

changeset-bot bot commented Nov 8, 2024 •

edited

Loading

github-actions bot commented Nov 8, 2024

github-actions bot commented Nov 8, 2024 •

edited

Loading

hussam-i-am Nov 12, 2024

hussam-i-am commented Nov 13, 2024

primer-integration bot commented Nov 14, 2024

primer-integration bot commented Nov 14, 2024

feat(TextInput): Convert TextInput (Part 2) - Update CSS to use data attributes #5257

feat(TextInput): Convert TextInput (Part 2) - Update CSS to use data attributes #5257

Conversation

hussam-i-am commented Nov 8, 2024 • edited Loading

Changelog

New

Changed

Removed

Rollout strategy

Testing & Reviewing

Merge checklist

changeset-bot bot commented Nov 8, 2024 • edited Loading

🦋 Changeset detected

github-actions bot commented Nov 8, 2024

github-actions bot commented Nov 8, 2024 • edited Loading

size-limit report 📦

hussam-i-am Nov 12, 2024

Choose a reason for hiding this comment

hussam-i-am commented Nov 13, 2024

primer-integration bot commented Nov 14, 2024

primer-integration bot commented Nov 14, 2024

hussam-i-am commented Nov 8, 2024 •

edited

Loading

changeset-bot bot commented Nov 8, 2024 •

edited

Loading

github-actions bot commented Nov 8, 2024 •

edited

Loading