Skip to content

fix(file-upload): style disabled delete triggers - #10979

Merged
segunadebayo merged 1 commit into
chakra-ui:mainfrom
dvd233:fix/file-upload-disabled-styles-10977
Sep 9, 2026
Merged

segunadebayo merged 1 commit into
chakra-ui:mainfrom
dvd233:fix/file-upload-disabled-styles-10977

Conversation

@dvd233

@dvd233 dvd233 commented Sep 9, 2026 •

Copy link
Copy Markdown
Contributor

Closes #10977

📝 Description

Apply Chakra's existing disabled layer style to file upload item delete
triggers in both the React theme and the Panda preset. A changeset covers both
published packages.

⛳️ Current behavior (updates)

For a disabled FileUpload with pre-existing files, the delete trigger is
disabled in the DOM, but its recipe still applies the active button cursor
and full opacity, so the X icon looks interactive.

🚀 New behavior

Disabled item delete triggers use the shared disabled layer, which applies the
themeable cursor.disabled token and reduced opacity. Enabled triggers are
unchanged, and the React and Panda recipes stay aligned.

💣 Is this a breaking change (Yes/No):

No.

📝 Additional Information

  • Reproduced with the issue's StackBlitz in Chromium: the button has both
    disabled and data-disabled, but currently computes to cursor: pointer
    and opacity: 1.
  • Verified the shared disabled layer computes to cursor: not-allowed and
    opacity: 0.5 with the default theme.
  • prettier --check passes for all three changed files.
  • TypeScript 5.9.3 reports no syntax diagnostics for either recipe file.

AI assistance was used during implementation; I reviewed the complete diff and
verified the reported behavior in Chromium.

RetriggerView in GreptileConfidence Score: 5/5

The PR appears safe to merge, with no actionable defects identified in the changed styling or release metadata.

Summary

  • Adds disabled cursor and reduced-opacity styling to the React file-upload recipe.
  • Keeps the Panda preset recipe aligned with the React theme.
  • Adds a changeset for @chakra-ui/react and @chakra-ui/panda-preset.

@changeset-bot

changeset-bot Bot commented Sep 9, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: 2bf413b

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

This PR includes changesets to release 6 packages
Name Type
@chakra-ui/react Patch
@chakra-ui/panda-preset Patch
@chakra-ui/charts Patch
@chakra-ui/cli Patch
@chakra-ui/codemod Patch
tanstack-router-ts 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

@vercel

vercel Bot commented Sep 9, 2026 •

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated
chakra-ui-storybook Ready Ready Preview Sep 9, 2026 2:54am UTC
chakra-v3-docs Ready Ready Preview Sep 9, 2026 2:54am UTC

Request Review

@segunadebayo
segunadebayo merged commit 67abe9f into chakra-ui:main Sep 9, 2026
3 checks passed
@github-actions github-actions Bot mentioned this pull request Sep 9, 2026

This branch was successfully deployed

2 active deployments
Preview – chakra-v3-docs — 2bf413bd Deployed Sep 9, 2026 by vercel[bot]
Preview – chakra-ui-storybook — 2bf413bd Deployed Sep 9, 2026 by vercel[bot]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Missing disabled styles on FileUpload.List

2 participants