Material You Lit

Opinionated lit web components

Drop in replacement for @material/web

  "devDependencies": {
    "@material/web": "npm:material-web-evo@^20000.30000.3",

Touch input fix for Chromium-based browsers: Allow clicking on buttons during scrolling to improve UX greatly.
Field, text-field and select: Allow constant floating label: <md-outlined-text-field label="Sticky Label" constant-floating-label> </md-outlined-text-field>
Dialog: Use :backdrop instead of scrim to fix z-index and multi dialog issues and properly clip dialog content during animation. Also uses backdrop-filter blur.
iOS/iPadOS: Disable double tab zoom for all components
iOS/iPadOS: Fix stuck ripple effects on scroll container lists. Make sure you use touch-action: pan-y on scroll containers.
All components: Set and allow modifications for font-tracking / letter-spacing.
All components: All builtin icons are now rounded and rendered at the correct size. To use the correct icons for non-icon-buttons, that render at 18px, zoom the 20px material icons so that they render at the native 20px by setting viewBox="48 -912 864 864" instead of "0 -960 960 960". Setting icon size messes with the layout.
All components: Fix ripple getting stuck on hover after component is reconnected when they were clicked before the disconnect
Select: Use nicer icon and animation.
Checkbox: Make more rounded by default.