diff --git a/packages/webawesome/custom-elements-manifest.js b/packages/webawesome/custom-elements-manifest.js index 6588d92f6..c58530abd 100644 --- a/packages/webawesome/custom-elements-manifest.js +++ b/packages/webawesome/custom-elements-manifest.js @@ -182,6 +182,10 @@ export default { jsxTypesPlugin({ fileName: 'custom-elements-jsx.d.ts', outdir, + defaultExport: true, + componentTypePath: (_name, _tag, modulePath) => { + return `./${modulePath}`; + }, }), // diff --git a/packages/webawesome/docs/docs/resources/changelog.md b/packages/webawesome/docs/docs/resources/changelog.md index 7344630ff..3dd1b6e9d 100644 --- a/packages/webawesome/docs/docs/resources/changelog.md +++ b/packages/webawesome/docs/docs/resources/changelog.md @@ -22,6 +22,8 @@ Components with the Experimental badge sh - Fixed a bug in `` that prevented keyboard selection of items when nested in shadow roots [issue:1270] - Fixed a bug in `` that prevented items passed in from slots from being detected [issue:1271] - Fixed a bug in JSX typings that prevented the types file from being exported [pr:1295] +- Fixed a bug in JSX typings that generated the incorrect component imports [issue:1303] +- Fixed a bug in `` that prevented the thumb from receiving focus when clicking/tapping [issue:1312] ## 3.0.0-beta.4 diff --git a/packages/webawesome/src/components/slider/slider.css b/packages/webawesome/src/components/slider/slider.css index f0ee323ac..efb206130 100644 --- a/packages/webawesome/src/components/slider/slider.css +++ b/packages/webawesome/src/components/slider/slider.css @@ -33,6 +33,8 @@ } #slider { + touch-action: none; + &:focus { outline: none; } diff --git a/packages/webawesome/src/internal/drag.ts b/packages/webawesome/src/internal/drag.ts index 0b7ae61e9..a1fe23e4b 100644 --- a/packages/webawesome/src/internal/drag.ts +++ b/packages/webawesome/src/internal/drag.ts @@ -55,6 +55,8 @@ const supportsTouch = typeof window !== 'undefined' && 'ontouchstart' in window; * Drag functionality will be enabled as soon as the constructor is called. A `start()` and `stop()` method can be used * to start and stop it, if needed. * + * Use `touch-action: none` on touch devices if scrolling occurs while dragging. Avoid preventing the touchstart event! + * * @usage * * const draggable = new DraggableElement(element, { @@ -85,9 +87,6 @@ export class DraggableElement { const clientX = supportsTouch && 'touches' in event ? event.touches[0].clientX : (event as PointerEvent).clientX; const clientY = supportsTouch && 'touches' in event ? event.touches[0].clientY : (event as PointerEvent).clientY; - // Prevent scrolling while dragging - event.preventDefault(); - if ( this.isDragging || // Prevent right-clicks from triggering drags