mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2026-03-13 10:22:08 +08:00
refactor(haptics): remove cordova haptics support (#29186)
BREAKING CHANGE: Support for the Cordova Haptics plugin has been removed. Components that integrate with haptics, such as `ion-picker` and `ion-toggle`, will continue to function but will no longer play haptics in Cordova environments. Developers should migrate to Capacitor to continue to have haptics in these components.
This commit is contained in:
@@ -16,6 +16,7 @@ This is a comprehensive list of the breaking changes introduced in the major ver
|
||||
- [Browser and Platform Support](#version-8x-browser-platform-support)
|
||||
- [Dark Mode](#version-8x-dark-mode)
|
||||
- [Global Styles](#version-8x-global-styles)
|
||||
- [Haptics](#version-8x-haptics)
|
||||
- [Components](#version-8x-components)
|
||||
- [Button](#version-8x-button)
|
||||
- [Checkbox](#version-8x-checkbox)
|
||||
@@ -141,6 +142,10 @@ Developers who want to disable dynamic font scaling can set `--ion-dynamic-font:
|
||||
|
||||
For more information on the dynamic font, refer to the [Dynamic Font Scaling documentation](https://ionicframework.com/docs/layout/dynamic-font-scaling).
|
||||
|
||||
<h2 id="version-8x-haptics">Haptics</h2>
|
||||
|
||||
- Support for the Cordova Haptics plugin has been removed. Components that integrate with haptics, such as `ion-picker` and `ion-toggle`, will continue to function but will no longer play haptics in Cordova environments. Developers should migrate to Capacitor to continue to have haptics in these components.
|
||||
|
||||
<h2 id="version-8x-components">Components</h2>
|
||||
|
||||
<h4 id="version-8x-button">Button</h4>
|
||||
|
||||
@@ -56,20 +56,8 @@ interface HapticNotificationOptions {
|
||||
type: CapacitorNotificationType;
|
||||
}
|
||||
|
||||
interface TapticEngine {
|
||||
gestureSelectionStart: () => void;
|
||||
gestureSelectionChanged: () => void;
|
||||
gestureSelectionEnd: () => void;
|
||||
}
|
||||
|
||||
const HapticEngine = {
|
||||
getEngine(): HapticsPlugin | undefined {
|
||||
const tapticEngine = (window as any).TapticEngine;
|
||||
if (tapticEngine) {
|
||||
// Cordova
|
||||
// TODO FW-4707 - Remove this in Ionic 8
|
||||
return tapticEngine;
|
||||
}
|
||||
const capacitor = getCapacitor();
|
||||
|
||||
if (capacitor?.isPluginAvailable('Haptics')) {
|
||||
@@ -102,82 +90,45 @@ const HapticEngine = {
|
||||
|
||||
return true;
|
||||
},
|
||||
isCordova() {
|
||||
return (window as any).TapticEngine !== undefined;
|
||||
},
|
||||
isCapacitor() {
|
||||
return getCapacitor() !== undefined;
|
||||
},
|
||||
impact(options: HapticImpactOptions) {
|
||||
const engine = this.getEngine();
|
||||
if (!engine) {
|
||||
return;
|
||||
}
|
||||
/**
|
||||
* To provide backwards compatibility with Cordova apps,
|
||||
* we convert the style to lowercase.
|
||||
*
|
||||
* TODO: FW-4707 - Remove this in Ionic 8
|
||||
*/
|
||||
const style = this.isCapacitor() ? options.style : (options.style.toLowerCase() as ImpactStyle);
|
||||
engine.impact({ style });
|
||||
|
||||
engine.impact({ style: options.style });
|
||||
},
|
||||
notification(options: HapticNotificationOptions) {
|
||||
const engine = this.getEngine();
|
||||
if (!engine) {
|
||||
return;
|
||||
}
|
||||
/**
|
||||
* To provide backwards compatibility with Cordova apps,
|
||||
* we convert the style to lowercase.
|
||||
*
|
||||
* TODO: FW-4707 - Remove this in Ionic 8
|
||||
*/
|
||||
const type = this.isCapacitor() ? options.type : (options.type.toLowerCase() as NotificationType);
|
||||
engine.notification({ type });
|
||||
|
||||
engine.notification({ type: options.type });
|
||||
},
|
||||
selection() {
|
||||
/**
|
||||
* To provide backwards compatibility with Cordova apps,
|
||||
* we convert the style to lowercase.
|
||||
*
|
||||
* TODO: FW-4707 - Remove this in Ionic 8
|
||||
*/
|
||||
const style = this.isCapacitor() ? ImpactStyle.Light : ('light' as ImpactStyle);
|
||||
this.impact({ style });
|
||||
this.impact({ style: ImpactStyle.Light });
|
||||
},
|
||||
selectionStart() {
|
||||
const engine = this.getEngine();
|
||||
if (!engine) {
|
||||
return;
|
||||
}
|
||||
if (this.isCapacitor()) {
|
||||
engine.selectionStart();
|
||||
} else {
|
||||
(engine as unknown as TapticEngine).gestureSelectionStart();
|
||||
}
|
||||
engine.selectionStart();
|
||||
},
|
||||
selectionChanged() {
|
||||
const engine = this.getEngine();
|
||||
if (!engine) {
|
||||
return;
|
||||
}
|
||||
if (this.isCapacitor()) {
|
||||
engine.selectionChanged();
|
||||
} else {
|
||||
(engine as unknown as TapticEngine).gestureSelectionChanged();
|
||||
}
|
||||
engine.selectionChanged();
|
||||
},
|
||||
selectionEnd() {
|
||||
const engine = this.getEngine();
|
||||
if (!engine) {
|
||||
return;
|
||||
}
|
||||
if (this.isCapacitor()) {
|
||||
engine.selectionEnd();
|
||||
} else {
|
||||
(engine as unknown as TapticEngine).gestureSelectionEnd();
|
||||
}
|
||||
engine.selectionEnd();
|
||||
},
|
||||
};
|
||||
|
||||
|
||||
Reference in New Issue
Block a user