Repository navigation
feat(ui)!: redesign shared buttons and migrate app controls - #8859
Merged
Merged
Conversation
Why: These wrappers still referenced Button props removed by the canonical API migration. What: Use accessible labels and structured tooltips, preserve split shortcut defaults, and update number-stepper callers and migration guidance.
Why: Direct hosted requests produced reported CORS failures during the preview. What: Document the approved same-origin proxy launch while retaining HTTP and port 3007. Backend CORS policies remain unchanged.
Restore padding around task creation options and let the share header button fill its group segment without an extra tooltip wrapper. Use ghost secondary actions, accent submission actions, and compact search-clear and split-close controls with explicit icon sizes.
Keep the separate Show and Hide navigation actions ghost-styled without a persistent expanded-state fill.
Use accent styling for shared create, send, and confirmation controls, plus main save, submit, invitation, approval, and import actions. Keep the neutral Button default and utility controls separate. Preserve danger and success treatments for confirmations with explicit tones.
Align document creation, collaborator saving, and onboarding continuation with the main-action accent styling.
Keep the New launcher neutral while final submit actions retain accent styling. Use the icon size recipe for Add tag instead of combining a labeled control minimum height with a narrower width override.
Why: Task composer and document/task metadata need filled neutral controls instead of outline pills. What: Allow secondary property and tag pills and select them on these surfaces. Remove document-level background and border overrides without resizing controls or changing other property consumers.
Why: Board pagination needs an outline action instead of a filled primary. What: Set column and board Load more buttons to the outline variant. Keep pagination callbacks, loading behavior, and sizing unchanged.
Why: Composer utility controls inherited the prominent default Button style, and reply attachment and trash icons had no explicit dimensions. What: Use ghost styling for composer utilities and keep Send unchanged. Size reply action icons directly without changing button hit areas.
Why: Folder expand and close controls compete with the final creation action. What: Use ghost styling for both header utilities and preserve Create Folder.
Why: Inline task and document properties need a more compact footprint. What: Use xs sizing for property pills, tags, and Add property controls. Expose size on shared helpers while preserving defaults elsewhere.
Why: Unspecified variants made utility controls inherit prominent primary faces after the Button migration. What: Set utility actions to ghost and final submissions to accent. Use outline for neutral launchers and pagination, and danger for member removal. Preserve inherited group styles and caller-controlled wrappers.
Why: ButtonGroup kept the legacy raised frame without an explicit finish. What: Keep the existing frame and layout, remove automatic elevation, and document the flat default for grouped actions.
Why: Project creation retained larger outlined controls after task composer styling changed. What: Use compact secondary draft and property controls, a matching sharing toggle, and a small accent create action. Preserve draft and submission behavior.
Why: Project details and composer icons differed from the task presentation. What: Use compact secondary property pills and matching row typography. Keep composer header icons at 16px without changing button targets or project editing behavior.
Why: The shared New launcher needs the raised finish while staying neutral. What: Apply the raised finish to the existing outline New button without changing its sizing, placement, or actions.
Contributor
|
Important Review skippedToo many files! This PR contains 738 files, which is 438 over the limit of 300. To get a review, reduce the PR to 300 files or fewer by splitting it into smaller PRs or changing its base branch. Usage-priced reviews support at most 300 files.
|
Redesign the canonical app Button and derive its materials from the existing theme renderer without changing saved themes. Migrate callers to explicit variants, icon sizes, tooltip options, and ButtonGroup.Button composition. Align header actions and composer controls with the new sizing and materials, including secondary raised New actions. BREAKING CHANGE: Button removes legacy label, square, depth, glass, noTouchResize, and root tooltip configuration props. Use aria-label, icon-* sizes, optional finishes, and tooltip options instead. ButtonGroup inheritance now requires explicit ButtonGroup.Button composition.
dev-rb
force-pushed
the
rahul/feat-button-redesign
branch
from
October 26, 2026 19:15
e6803a6 to
306f1f2
Compare
Integrate the latest calendar, sharing, review, and media changes while retaining the new Button API and explicit grouped-action composition. Preserve upstream guest visibility, event permissions, shared-calendar request gating, and download behavior. Adapt incoming note, import, and file-preview actions to supported variants, labels, and icon sizing.
Why: Button fills, states, and shadows do not need a JavaScript material recipe for each theme. What: Move material values to CSS at each light/dark theme scope. Keep only accent contrast selection in JavaScript and refresh the scope marker during live color edits.
Why: CSS button materials need the existing light/dark marker on each independent theme scope. What: Mark appearance previews and the scheduling fixture with their theme mode so they do not inherit another scope's button materials.
Keep channel tabs compact and reserve a small desktop gutter inside the clipped header measurement region. The elevated outline extends beyond the tab box, so the last tab needs space before the clipping boundary.
Match the compact channel tabs with 14px labels and a 28px minimum\nheight while retaining the existing selection and touch behavior.
Set channel sections and Email Signal/Noise to the shared medium tab size. Retain the existing channel outline gutter and touch treatments.
Keep tab text, frame heights, and square icon sizes on the Button scale. Separate label padding from tab frames so labels remain full-size click targets, and retain the existing touch treatments.
Give labeled medium tabs 12px of horizontal padding while retaining the shared text size, minimum height, and vertical padding. Keep Button and square icon-tab sizing unchanged.
Match send, microphone, and attachment controls at the shared 40px icon size on desktop and touch. Remove size overrides while preserving glyph dimensions and document the sizing convention.
Add an explicit neutral variant with grayscale light and dark materials and shared interaction and finish behavior. Keep primary accent-colored and leave existing consumers unchanged. Expose neutral in the gallery and document its role.
Restore medium send, microphone, and attachment controls. Use 20px desktop glyphs and 24px touch glyphs while preserving the shared touch minimum.
Keep chat, channel, and email send actions monochrome through the shared SendButton. Preserve control sizing, pending states, and send behavior. Document the send-specific exception to primary action styling.
Restore inverse-filled Settings actions through the shared neutral variant instead of the obsolete descendant CTA override. Remove the Invite action's custom fill and text colors while retaining its typography. Keep accent actions, utility controls, destructive treatments, sizing, and handlers unchanged.
Why: - Compare the filled secondary treatment across existing neutral actions. - Keep quiet controls subdued until interaction. What: - Replace application outline Button usages with secondary styling. - Dim secondary and outline text at rest while preserving active feedback. - Retain the outline API and comparison examples.
Why: - Keep the Button migration aligned with current application behavior. What: - Merge main through 0549ed1. - Preserve current dictation colors with the migrated Button API.
Why: - New callers and fixtures still use the former Button and theme APIs. - Locale data varies in day-period whitespace across JavaScript runtimes. What: - Migrate desktop tab actions and the task launcher to current Button props. - Fix the theme fixture import and side-panel test selectors. - Normalize only day-period whitespace in date-range assertions. - Document isolated dependencies and the completed frontend validation.
Why: - Keep the updated Button callers consistent with the frontend formatter. What: - Reflow JSX props, imports, and variant expressions without changing behavior.
Why: - Keep the Button migration current with upstream changes. What: - Preserve main's distinct saved-view creation controls and keyboard scopes. - Retain the migrated Button API and secondary creation styling. - Align saved-view guidance with the resolved controls.
Why: - Independent border, Button, glass, and avatar blocks scatter mode values. What: - Group dark defaults and light overrides in adjacent theme blocks. - Preserve token values and existing root and device conditions. - Document the shared runtime token structure for future changes.
Why: - Keep the shared Button contract in durable rules rather than a migration log. What: - Document sizing, tooltips, activation, and explicit group composition. - Correct stale dialog variant guidance and link the shared contract. - Remove the obsolete Button migration document.
Why: - Integrate current main without losing the redesigned Button contract. What: - Retain updated pull request actions and shared share-link handling. - Preserve calendar invitation forwarding and reusable guest controls. - Adapt affected actions to explicit ButtonGroup segments and current props.
Why: - Expanded diffs and other disclosure controls looked selected because Button treated every aria-expanded state as a pressed action. What: - Restrict expansion-driven styling to triggers with aria-haspopup. - Preserve disclosure semantics, popup feedback, and true toggle states. - Document the distinction in the shared Button and diff-view guidance.
Why: The desktop details test searches for tooltip text instead of the button's accessible name and times out after the Button migration. What: Use the exact Show details name in the functional test and shared e2e helper without changing the production control or test assertions.
dev-rb
enabled auto-merge (squash)
October 28, 2026 19:18
Why: Keep the Button redesign aligned with current application changes. What: Merge main and retain snippet-to-task creation with the migrated Button API, preserving the new task handler and contextual tooltip.
Why: Keep the redesign compatible with incoming application changes and the current Button contract. What: Preserve document-menu downloads while resolving the Word toolbar merge. Migrate return-to-call and document fixture triggers to accessible names and supported tooltip options.
Why: Routine template sharing introduces controls that need the current Button API while preserving the grouped routine actions. What: Merge current main, keep template sharing in the routine menu, and use supported primary and secondary variants in template controls.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Why
Redesign the existing shared Button so actions use consistent materials, sizing, and explicit composition across desktop and touch layouts, without maintaining a parallel implementation.
How it works
The canonical
@uiButton uses semantic materials generated by the existing theme renderer, including accent-aware foreground colors.ButtonGroup.Buttonexplicitly opts into a shared frame; ordinary Buttons remain independent. Callers migrate directly to the new API rather than relying on compatibility translations.What
variant="secondary" finish="raised".Breaking API changes: replace legacy
label,square,depth,glass,noTouchResize, and root tooltip options witharia-label,icon-*sizes, optionalfinish, and thetooltipoptions object. Group inheritance requiresButtonGroup.Button.Follow-ups