@smui/touch-target

Svelte Material UI - Touch Target

A touch target is the area that extends beyond the visible boundary of an interactive element that still responds to touch inputs. According to the Material Design spec, touch targets should be no less than 48px x 48px in size. SMUI provides a touch prop on the following components that will increased their touch target.

• Button
• Chips
• Checkbox
• Radio
• Mini FAB
• Segmented Button

This component provides a wrapper to ensure that collapsing margins don't cause touch targets to overlap.

Installation

npm install --save-dev @smui/touch-target

Examples and Usage Information

https://sveltematerialui.com/demo/touch-target

Exports

(default)

A fragment used as a touch target wrapper.

Equivalent to the ClassAdder with Div common component.

More Information

See Layout and typography in the Material design spec.

See Touch Target in MDC-Web for information about the upstream library's architecture.

Changelog

7.0.0-beta.0 (2022-10-12)

Bug Fixes

• adjust position of snackbar when a page level bottom app bar is present (e6db9f2)
• default element in common icon (98b1536)
• icon button mini size (9dc65de)
• return correct element type when the component is static (441bb09)
• rework Object.entries into more compatible code (41246d4)
• scroll direction that makes bottom app bar hide (8405e9a)
• turns out, svelte still doesn't report exported module members in typescript (72702aa)
• use separate svg component and fix all type errors (9accd0b)
• workaround for chrome bug with bottom app bar background (c9f0726)

Features

• add standard variant for bottom app bar with scrolling behavior (68deb4b)
• migrate to common element component instead of elemental components (8aaf611)
• new bottom app bar component (8448267)
• new common element component with dynamic element support (bfa69d2)
• new typing method gets rid of separate type files, keeps html prop autocomplete (bf7b2a4)
• redo type system to bring types into their svelte files (61b9395)
• trying to get components with generic types working (9952576)
• update to mdc-web 14, implement new features and fixes (cca1827)