Skip to content

feat(text-field): add support for color input type - #124

Open
treeder wants to merge 1 commit into
mainfrom
support-color-input
Open

feat(text-field): add support for color input type#124
treeder wants to merge 1 commit into
mainfrom
support-color-input

Conversation

@treeder

@treeder treeder commented Aug 27, 2026

Copy link
Copy Markdown
Member

Description

Adds support for type="color" on <md-text-field>.

Details:

  • Updates renderField() to automatically mark type === 'color' as populated so the floating label floats properly above the color swatch.
  • Adds Material Design 3 styles for .input[type='color'] and cross-browser swatch pseudo-elements (::-webkit-color-swatch, ::-moz-color-swatch).
  • Adds disabled state styles and pointer cursor on the field for color inputs.
  • Updates documentation and adds an example to the inputs demo.

Verification:

  • Verified syntax, styles, and demo integration.

@github-actions github-actions Bot left a comment

Copy link
Copy Markdown

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 adds native HTML5 type="color" input support to the md-text-field component. It includes custom styling for color swatches across WebKit and Gecko engines, ensures appropriate label floating via the populated attribute, and updates documentation and demo files.

🔍 General Feedback

  • Clean and minimal implementation for supporting native color inputs within md-text-field.
  • Good handling of the populated state to ensure floating labels do not overlap the native color swatch when no initial value is explicitly provided.
📊 Token Usage & Cost Efficiency
Metric Value
Input Tokens (uncached) 35,051
Input Tokens (cached) 323,315 (⚡ 90.2% cached)
Output Tokens 144
Total Session Tokens 359,891
Cost (uncached input) $0.0263
Cost (cached input) $0.0242
Cost (output) $0.0005
Estimated Total Cost $0.0511

Gemini 3.7 Flash: introductory rate $0.75/$3.75 per 1M applied; reverts to $1.5/$7.5 after 2026-12-31.
Gemini 3.7 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.

@cloudflare-workers-and-pages

Copy link
Copy Markdown

Deploying with  Cloudflare Workers  Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status Name Latest Commit Preview URL Updated (UTC)
✅ Deployment successful!
View logs
material d602958 Commit Preview URL

Branch Preview URL
Aug 27 2026, 06:06 AM

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