Skip to content

fix(buttons): render leading icon slot when checkmark is not active - #153

Merged
treeder merged 2 commits into
mainfrom
fix/button-icon-slot
Oct 26, 2026
Merged

treeder merged 2 commits into
mainfrom
fix/button-icon-slot

Conversation

@treeder

@treeder treeder commented Oct 26, 2026

Copy link
Copy Markdown
Member

Summary

  • In Button.renderContent(), checkmark defaulted to Lit's nothing (Symbol.for('lit-nothing')), which is truthy in JavaScript (Boolean(nothing) === true).
  • As a result, checkmark || icon evaluated nothing || icon → nothing whenever this.checkmark && this.selected was false, preventing <slot name="icon"> from ever rendering for leading icons.
  • Default checkmark to null so checkmark || icon falls back to icon when the checkmark is not shown.

Verification

  • Verified that <md-button><md-icon slot="icon">...</md-icon>Label</md-button> renders <slot name="icon"> in shadow DOM and aligns leading icons properly.

@cloudflare-workers-and-pages

cloudflare-workers-and-pages Bot commented Oct 26, 2026 •

Copy link
Copy Markdown

🚀 Deploying Preview to Cloudflare 🚀

Preview URL: https://fix-button-icon-slot-material.treeder.workers.dev (commit e58f63f)

This URL reflects your latest Preview deployment

Preview Deployments by commit

Status Deployment URL Commit Updated (UTC) See this deployment's details
  • Build: Cancelled 🚫

View logs ↗
10f3f4a 2026-10-26T21:57:53.215Z View logs ↗
  • Build: Success ✅
  • Deployment: Success ✅

View logs ↗
https://514c4c6c-material.treeder.workers.dev e58f63f 2026-10-26T21:54:41.119Z Visit the dashboard ↗

@github-actions github-actions Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

📋 Review Summary

This pull request fixes a defect in the button component where leading icons were inadvertently hidden when no checkmark was shown. Because Lit's nothing sentinel is a truthy Symbol, the expression checkmark || icon was previously resolving to nothing rather than falling back to the icon slot. Changing the unselected checkmark value to null restores the expected fallback behaviour for leading icons.

🔍 General Feedback

  • Great catch on identifying this bug. In Lit, nothing is a Symbol (Symbol.for('lit-nothing')), which evaluates to truthy under JavaScript boolean coercion. Consequently, nothing || icon always returned nothing, suppressing standard leading icons on non-selected buttons.
  • The fix correctly allows null || icon to fall back to the standard icon slot. Consider adding a unit test covering button icon rendering when checkmark is disabled or unselected to safeguard against future regressions.
📊 Token Usage & Cost Efficiency
Metric Value
Input Tokens (uncached) 22,806
Input Tokens (cached) 427,664 (⚡ 94.9% cached)
Thinking / Reasoning Tokens 8,023
Output Tokens 396
Total Session Tokens 458,889
Cost (uncached input) $0.0171
Cost (cached input) $0.0321
Cost (thinking / reasoning) $0.0301
Cost (response output) $0.0015
Estimated Total Cost $0.0808

Gemini 3.8 Flash: introductory rate $0.75/$3.75 per 1M applied; reverts to $1.5/$7.5 after 2026-12-31.
Gemini 3.8 Flash: standard tier; batch and flex are half again, priority is higher.
Cache reads are priced here, but context-cache STORAGE, where the model charges for it separately per token-hour, is not included, so the figure can run slightly low.

Comment thread buttons/button.js Resolved
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
@treeder
treeder merged commit 5eaab92 into main Oct 26, 2026
1 of 2 checks passed
@treeder
treeder deleted the fix/button-icon-slot branch October 26, 2026 21:57
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.

1 participant