fixes #2005

docs/pages/resources/changelog.md

@@ -19,6 +19,7 @@ New versions of Shoelace are released as-needed and generally occur when a criti
 - Fixed a bug in `<sl-tooltip>` that allowed unwanted text properties to leak in [#1947]
 - Fixed a bug in `<sl-button-group>` classes [#1974]
 - Fixed a bug in `<sl-textarea>` that may throw errors on `disconnectedCallback` in test environments [#1985]
+- Fixed a bug in `<sl-color-picker>` that would log a non-passive event listener warning [#2005]
 
 ## 2.15.0
 

src/components/color-picker/color-picker.component.ts

@@ -2,11 +2,11 @@ import { clamp } from '../../internal/math.js';
 import { classMap } from 'lit/directives/class-map.js';
 import { defaultValue } from '../../internal/default-value.js';
 import { drag } from '../../internal/drag.js';
+import { eventOptions, property, query, state } from 'lit/decorators.js';
 import { FormControlController } from '../../internal/form.js';
 import { html } from 'lit';
 import { ifDefined } from 'lit/directives/if-defined.js';
 import { LocalizeController } from '../../utilities/localize.js';
-import { property, query, state } from 'lit/decorators.js';
 import { styleMap } from 'lit/directives/style-map.js';
 import { TinyColor } from '@ctrl/tinycolor';
 import { watch } from '../../internal/watch.js';
@@ -488,6 +488,7 @@ export default class SlColorPicker extends ShoelaceElement implements ShoelaceFo
     this.formControlController.emitInvalidEvent(event);
   }
 
+  @eventOptions({ passive: false })
   private handleTouchMove(event: TouchEvent) {
     event.preventDefault();
   }