@rdlabo/ionic-theme-ios26 2.0.0 → 2.0.1

package/README.md

@@ -62,45 +62,61 @@ And import the theme in your project's main CSS file (e.g., `src/styles.scss`).
 Next, configure the animations for iOS 26. Add the following to your Ionic configuration options.
 
 ```ts
+import { isPlatform } from '@ionic/core'; // or @ionic/angular/standalone, @ionic/react, @ionic/vue
 import { iosTransitionAnimation, popoverEnterAnimation, popoverLeaveAnimation } from '@rdlabo/ionic-theme-ios26';
 
 // Angular
 provideIonicAngular({
     ...
-    navAnimation: iosTransitionAnimation,
-    popoverEnter: popoverEnterAnimation,
-    popoverLeave: popoverLeaveAnimation,
+    navAnimation: isPlatform('ios') ? iosTransitionAnimation: undefined,
+    popoverEnter: isPlatform('ios') ? popoverEnterAnimation: undefined,
+    popoverLeave: isPlatform('ios') ? popoverLeaveAnimation: undefined,
 });
 
 // React
 setupIonicReact({
     ...
-    navAnimation: iosTransitionAnimation,
-    popoverEnter: popoverEnterAnimation,
-    popoverLeave: popoverLeaveAnimation,
+    navAnimation: isPlatform('ios') ? iosTransitionAnimation: undefined,
+    popoverEnter: isPlatform('ios') ? popoverEnterAnimation: undefined,
+    popoverLeave: isPlatform('ios') ? popoverLeaveAnimation: undefined,
 });
 
 // Vue
 createApp(App)
     .use(IonicVue, {
         ...
-        navAnimation: iosTransitionAnimation,
-        popoverEnter: popoverEnterAnimation,
-        popoverLeave: popoverLeaveAnimation,
+        navAnimation: isPlatform('ios') ? iosTransitionAnimation: undefined,
+        popoverEnter: isPlatform('ios') ? popoverEnterAnimation: undefined,
+        popoverLeave: isPlatform('ios') ? popoverLeaveAnimation: undefined,
 })
 ```
 
+## Important Notes
 
-## Customization
+### Using `ion-item-group`
 
-### CSS Variables
+Under specific conditions, you need to use `ion-item-group`.
 
-To customize the library's default styles to match your design, several CSS variables are provided. See this file for details:
-https://github.com/rdlabo-team/ionic-theme-ios26/blob/main/src/styles/default-variables.scss
+```diff
+  <ion-list inset=true>
+    <ion-list-header><ion-label>Label</ion-label></ion-list-header>
++   <ion-item-group>
+      <ion-item>...</ion-item>
+      <ion-item>...</ion-item>
++   </ion-item-group>
+  </ion-list>
+```
+
+For details, please refer to [USING_ION_ITEM_GROUP.md](./USING_ION_ITEM_GROUP.md).
 
 
 ## Features
 
+### CSS Variables
+
+To customize the library's default styles to match your design, several CSS variables are provided. See this file for details:
+https://github.com/rdlabo-team/ionic-theme-ios26/blob/main/src/styles/default-variables.scss
+
 ### `.ios26-disabled` Class
 
 Add the `.ios26-disabled` class to disable the iOS26 theme on specific components.
@@ -132,7 +148,7 @@ To achieve higher fidelity to iOS26 design, you can implement additional design
 https://ionic-theme-ios26.netlify.app/main/docs
 
 
-## Experimental: Animation
+## Experimental Animation
 
 __This feature is experimental. The library can be used without this feature.__
 
@@ -212,24 +228,6 @@ const dismiss = (event: Event) => {
 }
 ```
 
-## Important Notes
-
-### Using `ion-item-group`
-
-Under specific conditions, you need to use `ion-item-group`.
-
-```diff
-  <ion-list inset=true>
-    <ion-list-header><ion-label>Label</ion-label></ion-list-header>
-+   <ion-item-group>
-      <ion-item>...</ion-item>
-      <ion-item>...</ion-item>
-+   </ion-item-group>
-  </ion-list>
-```
-
-For details, please refer to [USING_ION_ITEM_GROUP.md](./USING_ION_ITEM_GROUP.md).
-
 
 ## Additional Information
 

package/dist/index.d.ts

@@ -3,6 +3,7 @@ export * from './sheets-of-glass/interfaces';
 export { iosEnterAnimation as popoverEnterAnimation } from './popover/animations/ios.enter';
 export { iosLeaveAnimation as popoverLeaveAnimation } from './popover/animations/ios.leave';
 export * from './tab-bar-searchable';
+export * from './transition/ios.transition';
 export declare const registerTabBarEffect: (targetElement: HTMLElement) => registeredEffect | undefined;
 export declare const registerSegmentEffect: (targetElement: HTMLElement) => registeredEffect | undefined;
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAEhE,cAAc,8BAA8B,CAAC;AAC7C,OAAO,EAAE,iBAAiB,IAAI,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAC5F,OAAO,EAAE,iBAAiB,IAAI,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAC5F,cAAc,sBAAsB,CAAC;AAErC,eAAO,MAAM,oBAAoB,GAAI,eAAe,WAAW,KAAG,gBAAgB,GAAG,SAOpF,CAAC;AAEF,eAAO,MAAM,qBAAqB,GAAI,eAAe,WAAW,KAAG,gBAAgB,GAAG,SAerF,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAEhE,cAAc,8BAA8B,CAAC;AAC7C,OAAO,EAAE,iBAAiB,IAAI,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAC5F,OAAO,EAAE,iBAAiB,IAAI,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAC5F,cAAc,sBAAsB,CAAC;AACrC,cAAc,6BAA6B,CAAC;AAE5C,eAAO,MAAM,oBAAoB,GAAI,eAAe,WAAW,KAAG,gBAAgB,GAAG,SAOpF,CAAC;AAEF,eAAO,MAAM,qBAAqB,GAAI,eAAe,WAAW,KAAG,gBAAgB,GAAG,SAerF,CAAC"}

package/dist/index.js

@@ -3,6 +3,7 @@ export * from './sheets-of-glass/interfaces';
 export { iosEnterAnimation as popoverEnterAnimation } from './popover/animations/ios.enter';
 export { iosLeaveAnimation as popoverLeaveAnimation } from './popover/animations/ios.leave';
 export * from './tab-bar-searchable';
+export * from './transition/ios.transition';
 export const registerTabBarEffect = (targetElement) => {
     return registerEffect(targetElement, 'ion-tab-button', 'tab-selected', {
         small: 'scale(1.1, 1)',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rdlabo/ionic-theme-ios26",
-  "version": "2.0.0",
+  "version": "2.0.1",
   "description": "iOS26 Theme for Ionic Framework",
   "main": "./dist/index.js",
   "module": "./dist/index.js",

package/src/index.ts

@@ -4,6 +4,7 @@ export * from './sheets-of-glass/interfaces';
 export { iosEnterAnimation as popoverEnterAnimation } from './popover/animations/ios.enter';
 export { iosLeaveAnimation as popoverLeaveAnimation } from './popover/animations/ios.leave';
 export * from './tab-bar-searchable';
+export * from './transition/ios.transition';
 
 export const registerTabBarEffect = (targetElement: HTMLElement): registeredEffect | undefined => {
   return registerEffect(targetElement, 'ion-tab-button', 'tab-selected', {