@ionic/core 7.5.8-dev.11701876182.1e71e7a0 → 7.5.8-dev.11701894917.1c1465bd

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (442) hide show
  1. package/components/animation.js +11 -12
  2. package/components/backdrop.js +0 -12
  3. package/components/checkbox.js +3 -5
  4. package/components/gesture-controller.js +1 -1
  5. package/components/index4.js +12 -10
  6. package/components/index5.js +22 -0
  7. package/components/input-shims.js +7 -12
  8. package/components/input.utils.js +2 -3
  9. package/components/ion-content.js +1 -1
  10. package/components/ion-datetime.js +15 -48
  11. package/components/ion-infinite-scroll.js +3 -11
  12. package/components/ion-input.js +8 -31
  13. package/components/ion-modal.js +2 -2
  14. package/components/ion-range.js +3 -5
  15. package/components/ion-select.js +29 -44
  16. package/components/ion-skeleton-text.js +1 -14
  17. package/components/ion-textarea.js +7 -30
  18. package/components/ion-toast.js +74 -419
  19. package/components/ion-toggle.js +3 -5
  20. package/components/item.js +2 -2
  21. package/components/label.js +2 -2
  22. package/components/overlays.js +6 -3
  23. package/components/radio-group.js +0 -2
  24. package/components/radio.js +5 -45
  25. package/dist/cjs/{animation-9b401d39.js → animation-cc40e39c.js} +12 -13
  26. package/dist/cjs/{button-active-a5185907.js → button-active-9d7e0640.js} +2 -2
  27. package/dist/cjs/{capacitor-c04564bf.js → capacitor-46980811.js} +1 -1
  28. package/dist/cjs/{gesture-controller-c40c045a.js → gesture-controller-9436f482.js} +1 -0
  29. package/dist/cjs/{haptic-b882e0bb.js → haptic-216df36c.js} +1 -1
  30. package/dist/cjs/index-306a7476.js +32 -0
  31. package/dist/cjs/{index-ce101dc9.js → index-5cbb20f9.js} +13 -11
  32. package/dist/cjs/{index-b4f986cd.js → index-8c1e77d6.js} +1 -1
  33. package/dist/cjs/{index-f8f13389.js → index-d4c2e02c.js} +2 -2
  34. package/dist/cjs/{index-d1b59ffa.js → index-ee07ed59.js} +1 -1
  35. package/dist/cjs/index.cjs.js +10 -10
  36. package/dist/cjs/{input-shims-a23bb0f4.js → input-shims-87102b6a.js} +10 -15
  37. package/dist/cjs/{input.utils-3d0166a2.js → input.utils-2a11c1fe.js} +3 -4
  38. package/dist/cjs/ion-action-sheet.cjs.entry.js +8 -8
  39. package/dist/cjs/ion-alert.cjs.entry.js +8 -8
  40. package/dist/cjs/ion-app_8.cjs.entry.js +10 -10
  41. package/dist/cjs/ion-backdrop.cjs.entry.js +0 -12
  42. package/dist/cjs/ion-checkbox.cjs.entry.js +3 -5
  43. package/dist/cjs/ion-datetime_3.cjs.entry.js +14 -28
  44. package/dist/cjs/ion-infinite-scroll_2.cjs.entry.js +3 -11
  45. package/dist/cjs/ion-input.cjs.entry.js +11 -34
  46. package/dist/cjs/ion-item-option_3.cjs.entry.js +1 -1
  47. package/dist/cjs/ion-item_8.cjs.entry.js +4 -17
  48. package/dist/cjs/ion-loading.cjs.entry.js +4 -3
  49. package/dist/cjs/ion-menu_3.cjs.entry.js +7 -7
  50. package/dist/cjs/ion-modal.cjs.entry.js +10 -10
  51. package/dist/cjs/ion-nav_2.cjs.entry.js +2 -2
  52. package/dist/cjs/ion-picker-column-internal.cjs.entry.js +3 -3
  53. package/dist/cjs/ion-popover.cjs.entry.js +5 -4
  54. package/dist/cjs/ion-radio_2.cjs.entry.js +4 -9
  55. package/dist/cjs/ion-range.cjs.entry.js +4 -6
  56. package/dist/cjs/ion-refresher_2.cjs.entry.js +7 -7
  57. package/dist/cjs/ion-reorder_2.cjs.entry.js +4 -4
  58. package/dist/cjs/ion-segment_2.cjs.entry.js +1 -1
  59. package/dist/cjs/ion-select_3.cjs.entry.js +36 -51
  60. package/dist/cjs/ion-tab-bar_2.cjs.entry.js +4 -4
  61. package/dist/cjs/ion-textarea.cjs.entry.js +10 -33
  62. package/dist/cjs/ion-toast.cjs.entry.js +93 -434
  63. package/dist/cjs/ion-toggle.cjs.entry.js +7 -9
  64. package/dist/cjs/ionic.cjs.js +1 -1
  65. package/dist/cjs/{ios.transition-6787b799.js → ios.transition-a4ffb5a2.js} +3 -3
  66. package/dist/cjs/{keyboard-af1bb365.js → keyboard-7d621ee9.js} +3 -3
  67. package/dist/cjs/{keyboard-0272231f.js → keyboard-9390928c.js} +1 -1
  68. package/dist/cjs/{keyboard-controller-c05e747a.js → keyboard-controller-2158b478.js} +2 -2
  69. package/dist/cjs/loader.cjs.js +1 -1
  70. package/dist/cjs/{md.transition-e033d20a.js → md.transition-292abe1c.js} +3 -3
  71. package/dist/cjs/{notch-controller-9735e7ac.js → notch-controller-1dce508a.js} +1 -1
  72. package/dist/cjs/{overlays-27a6fb16.js → overlays-2c6b1072.js} +6 -4
  73. package/dist/cjs/{swipe-back-2a858bbd.js → swipe-back-b8f2330b.js} +2 -2
  74. package/dist/collection/components/backdrop/backdrop.js +0 -12
  75. package/dist/collection/components/checkbox/checkbox.ios.css +6 -0
  76. package/dist/collection/components/checkbox/checkbox.js +1 -4
  77. package/dist/collection/components/checkbox/checkbox.md.css +6 -0
  78. package/dist/collection/components/checkbox/test/checkbox.spec.js +0 -14
  79. package/dist/collection/components/content/content.css +0 -4
  80. package/dist/collection/components/datetime/datetime.ios.css +83 -25
  81. package/dist/collection/components/datetime/datetime.js +5 -20
  82. package/dist/collection/components/datetime/datetime.md.css +88 -25
  83. package/dist/collection/components/datetime/test/a11y/datetime.e2e.js +1 -1
  84. package/dist/collection/components/datetime/test/a11y/datetime.spec.js +6 -9
  85. package/dist/collection/components/datetime/test/basic/datetime.e2e.js +10 -0
  86. package/dist/collection/components/datetime/test/month-year-picker/datetime.e2e.js +1 -1
  87. package/dist/collection/components/datetime/test/readonly/datetime.e2e.js +2 -2
  88. package/dist/collection/components/infinite-scroll/infinite-scroll.js +3 -11
  89. package/dist/collection/components/input/input.ios.css +3 -10
  90. package/dist/collection/components/input/input.js +6 -31
  91. package/dist/collection/components/input/input.md.css +12 -13
  92. package/dist/collection/components/item/item.ios.css +3 -41
  93. package/dist/collection/components/item/item.md.css +3 -41
  94. package/dist/collection/components/item/test/basic/item.e2e.js +1 -1
  95. package/dist/collection/components/item/test/disabled/item.e2e.js +1 -0
  96. package/dist/collection/components/item/test/text/item.e2e.js +14 -0
  97. package/dist/collection/components/label/label.ios.css +3 -14
  98. package/dist/collection/components/label/label.md.css +3 -14
  99. package/dist/collection/components/modal/gestures/swipe-to-close.js +1 -2
  100. package/dist/collection/components/note/test/a11y/note.e2e.js +0 -43
  101. package/dist/collection/components/radio/radio.ios.css +6 -0
  102. package/dist/collection/components/radio/radio.js +3 -7
  103. package/dist/collection/components/radio/radio.md.css +6 -0
  104. package/dist/collection/components/radio/test/radio.spec.js +0 -14
  105. package/dist/collection/components/radio-group/radio-group.js +0 -24
  106. package/dist/collection/components/range/range.ios.css +6 -0
  107. package/dist/collection/components/range/range.js +1 -4
  108. package/dist/collection/components/range/range.md.css +6 -0
  109. package/dist/collection/components/range/test/range.spec.js +0 -16
  110. package/dist/collection/components/select/select.ios.css +7 -60
  111. package/dist/collection/components/select/select.js +28 -45
  112. package/dist/collection/components/select/select.md.css +19 -63
  113. package/dist/collection/components/select/test/item/select.e2e.js +0 -15
  114. package/dist/collection/components/select/test/label/select.e2e.js +1 -1
  115. package/dist/collection/components/select/test/legacy/wrapping/select.e2e.js +1 -1
  116. package/dist/collection/components/skeleton-text/skeleton-text.js +0 -39
  117. package/dist/collection/components/textarea/textarea.ios.css +5 -37
  118. package/dist/collection/components/textarea/textarea.js +5 -30
  119. package/dist/collection/components/textarea/textarea.md.css +14 -47
  120. package/dist/collection/components/toast/animations/ios.enter.js +1 -2
  121. package/dist/collection/components/toast/animations/md.enter.js +3 -4
  122. package/dist/collection/components/toast/animations/utils.js +14 -20
  123. package/dist/collection/components/toast/test/toast.spec.js +0 -80
  124. package/dist/collection/components/toast/toast.ios.css +10 -10
  125. package/dist/collection/components/toast/toast.js +1 -104
  126. package/dist/collection/components/toast/toast.md.css +0 -10
  127. package/dist/collection/components/toggle/test/toggle.spec.js +0 -12
  128. package/dist/collection/components/toggle/toggle.ios.css +6 -0
  129. package/dist/collection/components/toggle/toggle.js +1 -4
  130. package/dist/collection/components/toggle/toggle.md.css +6 -0
  131. package/dist/collection/utils/animation/animation.js +11 -12
  132. package/dist/collection/utils/animation/test/animation.spec.js +0 -16
  133. package/dist/collection/utils/browser/index.js +22 -0
  134. package/dist/collection/utils/forms/index.js +0 -1
  135. package/dist/collection/utils/gesture/gesture-controller.js +1 -1
  136. package/dist/collection/utils/input-shims/input-shims.js +6 -12
  137. package/dist/collection/utils/menu-controller/index.js +12 -10
  138. package/dist/collection/utils/overlays.js +5 -2
  139. package/dist/collection/utils/slot-mutation-controller.js +2 -3
  140. package/dist/collection/utils/test/overlays/overlays-scroll-blocking.spec.js +65 -0
  141. package/dist/docs.json +8 -176
  142. package/dist/esm/{animation-dde8cc0d.js → animation-fb0e0f6f.js} +12 -13
  143. package/dist/esm/{button-active-c6ee4f50.js → button-active-ed9d848c.js} +2 -2
  144. package/dist/esm/{capacitor-59395cbd.js → capacitor-b0e5fe83.js} +1 -1
  145. package/dist/esm/{gesture-controller-1bf57181.js → gesture-controller-314a54f6.js} +1 -1
  146. package/dist/esm/{haptic-554688a5.js → haptic-152c4172.js} +1 -1
  147. package/dist/esm/{index-2cf77112.js → index-39782642.js} +2 -2
  148. package/dist/esm/index-7a14ecec.js +29 -0
  149. package/dist/esm/{index-0c12c22b.js → index-80492ed3.js} +13 -11
  150. package/dist/esm/{index-82eeb47f.js → index-ba9976bb.js} +1 -1
  151. package/dist/esm/{index-1932b201.js → index-d8817fb0.js} +2 -2
  152. package/dist/esm/index.js +10 -10
  153. package/dist/esm/{input-shims-6539ce13.js → input-shims-0a2e541d.js} +9 -14
  154. package/dist/esm/{input.utils-a5a2d164.js → input.utils-2846d430.js} +3 -4
  155. package/dist/esm/ion-action-sheet.entry.js +8 -8
  156. package/dist/esm/ion-alert.entry.js +8 -8
  157. package/dist/esm/ion-app_8.entry.js +10 -10
  158. package/dist/esm/ion-backdrop.entry.js +0 -12
  159. package/dist/esm/ion-checkbox.entry.js +3 -5
  160. package/dist/esm/ion-datetime_3.entry.js +14 -28
  161. package/dist/esm/ion-infinite-scroll_2.entry.js +3 -11
  162. package/dist/esm/ion-input.entry.js +11 -34
  163. package/dist/esm/ion-item-option_3.entry.js +1 -1
  164. package/dist/esm/ion-item_8.entry.js +4 -17
  165. package/dist/esm/ion-loading.entry.js +4 -3
  166. package/dist/esm/ion-menu_3.entry.js +7 -7
  167. package/dist/esm/ion-modal.entry.js +10 -10
  168. package/dist/esm/ion-nav_2.entry.js +2 -2
  169. package/dist/esm/ion-picker-column-internal.entry.js +3 -3
  170. package/dist/esm/ion-popover.entry.js +5 -4
  171. package/dist/esm/ion-radio_2.entry.js +4 -9
  172. package/dist/esm/ion-range.entry.js +4 -6
  173. package/dist/esm/ion-refresher_2.entry.js +7 -7
  174. package/dist/esm/ion-reorder_2.entry.js +4 -4
  175. package/dist/esm/ion-segment_2.entry.js +1 -1
  176. package/dist/esm/ion-select_3.entry.js +32 -47
  177. package/dist/esm/ion-tab-bar_2.entry.js +4 -4
  178. package/dist/esm/ion-textarea.entry.js +10 -33
  179. package/dist/esm/ion-toast.entry.js +76 -417
  180. package/dist/esm/ion-toggle.entry.js +7 -9
  181. package/dist/esm/ionic.js +1 -1
  182. package/dist/esm/{ios.transition-802a84a6.js → ios.transition-fd16bec1.js} +3 -3
  183. package/dist/esm/{keyboard-52278bd7.js → keyboard-c402e885.js} +3 -3
  184. package/dist/esm/{keyboard-controller-ec5c2bfa.js → keyboard-controller-5d90929a.js} +2 -2
  185. package/dist/esm/{keyboard-73175e24.js → keyboard-dbb05fb9.js} +1 -1
  186. package/dist/esm/loader.js +1 -1
  187. package/dist/esm/{md.transition-43c2874d.js → md.transition-94ac93e1.js} +3 -3
  188. package/dist/esm/{notch-controller-fea7f9c5.js → notch-controller-d09b6aca.js} +1 -1
  189. package/dist/esm/{overlays-32ef481d.js → overlays-d23ea6e1.js} +7 -4
  190. package/dist/esm/{swipe-back-a6f386fc.js → swipe-back-a8ca7f93.js} +2 -2
  191. package/dist/esm-es5/{animation-dde8cc0d.js → animation-fb0e0f6f.js} +1 -1
  192. package/dist/esm-es5/{button-active-c6ee4f50.js → button-active-ed9d848c.js} +1 -1
  193. package/dist/esm-es5/{capacitor-59395cbd.js → capacitor-b0e5fe83.js} +1 -1
  194. package/dist/esm-es5/{gesture-controller-1bf57181.js → gesture-controller-314a54f6.js} +1 -1
  195. package/dist/esm-es5/{haptic-554688a5.js → haptic-152c4172.js} +1 -1
  196. package/dist/esm-es5/{index-2cf77112.js → index-39782642.js} +1 -1
  197. package/dist/esm-es5/index-80492ed3.js +4 -0
  198. package/dist/esm-es5/{index-82eeb47f.js → index-ba9976bb.js} +1 -1
  199. package/dist/esm-es5/{index-1932b201.js → index-d8817fb0.js} +1 -1
  200. package/dist/esm-es5/index.js +1 -1
  201. package/dist/esm-es5/input-shims-0a2e541d.js +4 -0
  202. package/dist/esm-es5/input.utils-2846d430.js +4 -0
  203. package/dist/esm-es5/ion-action-sheet.entry.js +1 -1
  204. package/dist/esm-es5/ion-alert.entry.js +1 -1
  205. package/dist/esm-es5/ion-app_8.entry.js +1 -1
  206. package/dist/esm-es5/ion-backdrop.entry.js +1 -1
  207. package/dist/esm-es5/ion-checkbox.entry.js +1 -1
  208. package/dist/esm-es5/ion-datetime_3.entry.js +1 -1
  209. package/dist/esm-es5/ion-infinite-scroll_2.entry.js +1 -1
  210. package/dist/esm-es5/ion-input.entry.js +1 -1
  211. package/dist/esm-es5/ion-item-option_3.entry.js +1 -1
  212. package/dist/esm-es5/ion-item_8.entry.js +1 -1
  213. package/dist/esm-es5/ion-loading.entry.js +1 -1
  214. package/dist/esm-es5/ion-menu_3.entry.js +1 -1
  215. package/dist/esm-es5/ion-modal.entry.js +1 -1
  216. package/dist/esm-es5/ion-nav_2.entry.js +1 -1
  217. package/dist/esm-es5/ion-picker-column-internal.entry.js +1 -1
  218. package/dist/esm-es5/ion-popover.entry.js +1 -1
  219. package/dist/esm-es5/ion-radio_2.entry.js +1 -1
  220. package/dist/esm-es5/ion-range.entry.js +1 -1
  221. package/dist/esm-es5/ion-refresher_2.entry.js +1 -1
  222. package/dist/esm-es5/ion-reorder_2.entry.js +1 -1
  223. package/dist/esm-es5/ion-segment_2.entry.js +1 -1
  224. package/dist/esm-es5/ion-select_3.entry.js +1 -1
  225. package/dist/esm-es5/ion-tab-bar_2.entry.js +1 -1
  226. package/dist/esm-es5/ion-textarea.entry.js +1 -1
  227. package/dist/esm-es5/ion-toast.entry.js +1 -1
  228. package/dist/esm-es5/ion-toggle.entry.js +1 -1
  229. package/dist/esm-es5/ionic.js +1 -1
  230. package/dist/esm-es5/{ios.transition-802a84a6.js → ios.transition-fd16bec1.js} +1 -1
  231. package/dist/esm-es5/{keyboard-52278bd7.js → keyboard-c402e885.js} +1 -1
  232. package/dist/esm-es5/{keyboard-controller-ec5c2bfa.js → keyboard-controller-5d90929a.js} +1 -1
  233. package/dist/esm-es5/{keyboard-73175e24.js → keyboard-dbb05fb9.js} +1 -1
  234. package/dist/esm-es5/loader.js +1 -1
  235. package/dist/esm-es5/md.transition-94ac93e1.js +4 -0
  236. package/dist/esm-es5/{notch-controller-fea7f9c5.js → notch-controller-d09b6aca.js} +1 -1
  237. package/dist/esm-es5/overlays-d23ea6e1.js +4 -0
  238. package/dist/esm-es5/swipe-back-a8ca7f93.js +4 -0
  239. package/dist/html.html-data.json +1 -14
  240. package/dist/ionic/index.esm.js +1 -1
  241. package/dist/ionic/ionic.esm.js +1 -1
  242. package/dist/ionic/{p-8985cdb6.system.js → p-0e4f2e17.system.js} +1 -1
  243. package/dist/ionic/{p-33a37fad.system.js → p-1d624e03.system.js} +1 -1
  244. package/dist/ionic/p-1e57bd24.entry.js +4 -0
  245. package/dist/ionic/p-1f620cd4.system.entry.js +4 -0
  246. package/dist/ionic/{p-3dd98a73.entry.js → p-1fc72959.entry.js} +1 -1
  247. package/dist/ionic/{p-c7c8429a.system.js → p-20d469d0.system.js} +1 -1
  248. package/dist/ionic/p-22e5af95.entry.js +4 -0
  249. package/dist/ionic/p-232d1f22.entry.js +4 -0
  250. package/dist/ionic/{p-4d67d27a.entry.js → p-27ea6f4e.entry.js} +1 -1
  251. package/dist/ionic/p-2ab4e925.system.entry.js +4 -0
  252. package/dist/ionic/p-2d5aeccc.js +4 -0
  253. package/dist/ionic/p-2d600c25.system.js +4 -0
  254. package/dist/ionic/{p-a9978d08.entry.js → p-2dc43d20.entry.js} +1 -1
  255. package/dist/ionic/p-2f2293da.system.entry.js +4 -0
  256. package/dist/ionic/{p-251666e2.entry.js → p-2f300cca.entry.js} +1 -1
  257. package/dist/ionic/{p-31fcb233.system.js → p-30029cc2.system.js} +1 -1
  258. package/dist/ionic/{p-cabad15b.system.js → p-304383f9.system.js} +1 -1
  259. package/dist/ionic/p-308e1341.js +4 -0
  260. package/dist/ionic/{p-cdbeaadc.js → p-31158892.js} +1 -1
  261. package/dist/ionic/p-32303650.system.entry.js +4 -0
  262. package/dist/ionic/{p-0bd51c34.system.js → p-32e19bee.system.js} +1 -1
  263. package/dist/ionic/p-34c39c48.entry.js +4 -0
  264. package/dist/ionic/p-39a335b6.system.entry.js +4 -0
  265. package/dist/ionic/p-3b568d18.entry.js +4 -0
  266. package/dist/ionic/p-3ba01a9c.system.entry.js +4 -0
  267. package/dist/ionic/p-3c58a71b.js +4 -0
  268. package/dist/ionic/{p-31b2326e.system.js → p-3e1e14d9.system.js} +1 -1
  269. package/dist/ionic/{p-fba0a6e7.system.entry.js → p-3e3d06a6.system.entry.js} +1 -1
  270. package/dist/ionic/{p-78aadecb.entry.js → p-3f6270b3.entry.js} +1 -1
  271. package/dist/ionic/p-3fd26bd6.system.entry.js +4 -0
  272. package/dist/ionic/p-3fe96156.system.js +4 -0
  273. package/dist/ionic/p-42ba3902.entry.js +4 -0
  274. package/dist/ionic/{p-6de472cb.js → p-4890093d.js} +1 -1
  275. package/dist/ionic/{p-88fde0e0.entry.js → p-4911a5d6.entry.js} +1 -1
  276. package/dist/ionic/p-4a31c99f.entry.js +4 -0
  277. package/dist/ionic/{p-8acae6b0.system.entry.js → p-4df97e3c.system.entry.js} +1 -1
  278. package/dist/ionic/{p-27281edd.js → p-4e8e09e1.js} +1 -1
  279. package/dist/ionic/p-51abefb7.system.js +4 -0
  280. package/dist/ionic/{p-4f3ae45a.entry.js → p-535d2a67.entry.js} +1 -1
  281. package/dist/ionic/{p-5e745192.system.js → p-57477107.system.js} +1 -1
  282. package/dist/ionic/p-5a68960f.entry.js +4 -0
  283. package/dist/ionic/p-60502e3f.system.entry.js +4 -0
  284. package/dist/ionic/p-60b386c9.system.entry.js +4 -0
  285. package/dist/ionic/{p-42f189f4.js → p-643a8fae.js} +1 -1
  286. package/dist/ionic/{p-b6f9d32a.entry.js → p-67da080d.entry.js} +1 -1
  287. package/dist/ionic/p-6c37f051.js +4 -0
  288. package/dist/ionic/{p-a1987850.entry.js → p-6d72fb44.entry.js} +1 -1
  289. package/dist/ionic/{p-e6d68e02.system.entry.js → p-6fd64e7c.system.entry.js} +1 -1
  290. package/dist/ionic/{p-dee7c1d0.system.entry.js → p-73ea8f82.system.entry.js} +1 -1
  291. package/dist/ionic/{p-3a75d7fd.js → p-75445583.js} +1 -1
  292. package/dist/ionic/{p-f70970cf.js → p-76d3765d.js} +1 -1
  293. package/dist/ionic/{p-a0bb7b92.system.entry.js → p-77965464.system.entry.js} +1 -1
  294. package/dist/ionic/p-7b725280.entry.js +4 -0
  295. package/dist/ionic/p-83af3685.system.js +4 -0
  296. package/dist/ionic/p-856c430d.js +4 -0
  297. package/dist/ionic/p-8780cc2a.entry.js +4 -0
  298. package/dist/ionic/p-8c97cdc0.entry.js +4 -0
  299. package/dist/ionic/{p-f5d2dc9b.js → p-8ededb41.js} +1 -1
  300. package/dist/ionic/p-93000a81.system.entry.js +4 -0
  301. package/dist/ionic/{p-1cca10d6.system.js → p-95c26010.system.js} +1 -1
  302. package/dist/ionic/{p-ddbb2d5b.system.js → p-98d82c73.system.js} +1 -1
  303. package/dist/ionic/p-990ffd0e.js +4 -0
  304. package/dist/ionic/{p-bb3615f7.js → p-9b97df10.js} +1 -1
  305. package/dist/ionic/{p-3137c025.system.entry.js → p-9c229210.system.entry.js} +2 -2
  306. package/dist/ionic/p-a225bf0f.system.entry.js +4 -0
  307. package/dist/ionic/p-a60a1ce5.js +4 -0
  308. package/dist/ionic/p-a98dc0c1.entry.js +4 -0
  309. package/dist/ionic/{p-5eda1d7d.entry.js → p-a9a80f5b.entry.js} +1 -1
  310. package/dist/ionic/p-a9e3b5be.system.entry.js +4 -0
  311. package/dist/ionic/p-ab11130c.system.js +4 -0
  312. package/dist/ionic/p-ab9456e9.system.entry.js +4 -0
  313. package/dist/ionic/p-af16fe62.entry.js +4 -0
  314. package/dist/ionic/p-af19a573.entry.js +4 -0
  315. package/dist/ionic/{p-6de62649.system.entry.js → p-b4d31b30.system.entry.js} +1 -1
  316. package/dist/ionic/{p-46d400b4.system.entry.js → p-b752714f.system.entry.js} +1 -1
  317. package/dist/ionic/p-c14f8ac8.js +4 -0
  318. package/dist/ionic/p-cde52378.system.entry.js +4 -0
  319. package/dist/ionic/p-d43f1f3d.system.js +4 -0
  320. package/dist/ionic/p-d662d908.js +4 -0
  321. package/dist/ionic/p-d9695ad9.system.js +4 -0
  322. package/dist/ionic/p-da15f571.system.entry.js +4 -0
  323. package/dist/ionic/p-e1e5afe1.system.entry.js +4 -0
  324. package/dist/ionic/p-e3584231.system.js +1 -1
  325. package/dist/ionic/{p-ada96dd0.system.entry.js → p-e3ad9607.system.entry.js} +1 -1
  326. package/dist/ionic/p-e4d90573.js +4 -0
  327. package/dist/ionic/{p-6577aea9.system.entry.js → p-e8e86f69.system.entry.js} +1 -1
  328. package/dist/ionic/p-f54c72b0.system.js +4 -0
  329. package/dist/ionic/p-f78efbd1.entry.js +4 -0
  330. package/dist/ionic/p-f7a36cd0.system.js +4 -0
  331. package/dist/ionic/p-f967631d.js +4 -0
  332. package/dist/ionic/p-fe4dde76.entry.js +4 -0
  333. package/dist/ionic/{p-e24ce1e5.system.js → p-fff7a57e.system.js} +1 -1
  334. package/dist/types/components/backdrop/backdrop.d.ts +0 -3
  335. package/dist/types/components/checkbox/checkbox.d.ts +0 -1
  336. package/dist/types/components/datetime/datetime.d.ts +0 -1
  337. package/dist/types/components/infinite-scroll/infinite-scroll.d.ts +0 -7
  338. package/dist/types/components/input/input.d.ts +0 -2
  339. package/dist/types/components/menu/menu.d.ts +1 -1
  340. package/dist/types/components/radio/radio.d.ts +0 -1
  341. package/dist/types/components/radio-group/radio-group-interface.d.ts +0 -1
  342. package/dist/types/components/radio-group/radio-group.d.ts +1 -8
  343. package/dist/types/components/range/range.d.ts +0 -1
  344. package/dist/types/components/router/router.d.ts +1 -2
  345. package/dist/types/components/select/select.d.ts +1 -6
  346. package/dist/types/components/skeleton-text/skeleton-text.d.ts +1 -9
  347. package/dist/types/components/textarea/textarea.d.ts +0 -2
  348. package/dist/types/components/toast/animations/utils.d.ts +4 -15
  349. package/dist/types/components/toast/toast-interface.d.ts +0 -2
  350. package/dist/types/components/toast/toast.d.ts +1 -28
  351. package/dist/types/components/toggle/toggle.d.ts +0 -1
  352. package/dist/types/components.d.ts +6 -37
  353. package/dist/types/interface.d.ts +5 -1
  354. package/dist/types/utils/animation/animation-interface.d.ts +4 -4
  355. package/dist/types/utils/browser/index.d.ts +2 -11
  356. package/dist/types/utils/forms/index.d.ts +0 -1
  357. package/dist/types/utils/gesture/gesture-controller.d.ts +1 -0
  358. package/dist/types/utils/hardware-back-button.d.ts +0 -4
  359. package/dist/types/utils/overlays.d.ts +0 -1
  360. package/dist/types/utils/slot-mutation-controller.d.ts +2 -2
  361. package/hydrate/index.js +194 -676
  362. package/package.json +1 -1
  363. package/dist/cjs/compare-with-utils-df1001d7.js +0 -44
  364. package/dist/cjs/index-c8d52405.js +0 -10
  365. package/dist/collection/components/infinite-scroll/test/small-dom-update/infinite-scroll.e2e.js +0 -31
  366. package/dist/collection/components/input/test/slot/input.e2e.js +0 -51
  367. package/dist/collection/components/radio-group/test/radio-group.spec.js +0 -69
  368. package/dist/collection/components/select/test/slot/select.e2e.js +0 -67
  369. package/dist/collection/components/textarea/test/slot/textarea.e2e.js +0 -51
  370. package/dist/collection/components/toast/gestures/swipe-to-dismiss.js +0 -267
  371. package/dist/collection/components/toast/test/swipe-gesture/toast.e2e.js +0 -84
  372. package/dist/collection/components/toast/test/toast-config.spec.js +0 -25
  373. package/dist/collection/utils/forms/compare-with-utils.js +0 -39
  374. package/dist/esm/compare-with-utils-a96ff2ea.js +0 -41
  375. package/dist/esm/index-a5d50daf.js +0 -7
  376. package/dist/esm-es5/compare-with-utils-a96ff2ea.js +0 -4
  377. package/dist/esm-es5/index-0c12c22b.js +0 -4
  378. package/dist/esm-es5/input-shims-6539ce13.js +0 -4
  379. package/dist/esm-es5/input.utils-a5a2d164.js +0 -4
  380. package/dist/esm-es5/md.transition-43c2874d.js +0 -4
  381. package/dist/esm-es5/overlays-32ef481d.js +0 -4
  382. package/dist/esm-es5/swipe-back-a6f386fc.js +0 -4
  383. package/dist/ionic/p-01d14eba.system.entry.js +0 -4
  384. package/dist/ionic/p-042e6f4b.entry.js +0 -4
  385. package/dist/ionic/p-05d83227.system.entry.js +0 -4
  386. package/dist/ionic/p-16756e94.system.entry.js +0 -4
  387. package/dist/ionic/p-1b19c04b.entry.js +0 -4
  388. package/dist/ionic/p-1e4371bd.js +0 -4
  389. package/dist/ionic/p-28249b10.system.entry.js +0 -4
  390. package/dist/ionic/p-28a2c2a2.entry.js +0 -4
  391. package/dist/ionic/p-29d03b3a.js +0 -4
  392. package/dist/ionic/p-2b7827c7.js +0 -4
  393. package/dist/ionic/p-2d3b9fa3.system.entry.js +0 -4
  394. package/dist/ionic/p-2d539df1.entry.js +0 -4
  395. package/dist/ionic/p-35ce400e.system.js +0 -4
  396. package/dist/ionic/p-36d187af.js +0 -4
  397. package/dist/ionic/p-376a6063.js +0 -4
  398. package/dist/ionic/p-38f2c6bb.system.js +0 -4
  399. package/dist/ionic/p-39c31982.system.entry.js +0 -4
  400. package/dist/ionic/p-3e6b47e8.system.entry.js +0 -4
  401. package/dist/ionic/p-3f5179b5.entry.js +0 -4
  402. package/dist/ionic/p-40f68333.system.js +0 -4
  403. package/dist/ionic/p-438e1b8a.entry.js +0 -4
  404. package/dist/ionic/p-47b6ba5b.js +0 -4
  405. package/dist/ionic/p-517a9885.system.entry.js +0 -4
  406. package/dist/ionic/p-53ec4f1c.system.js +0 -4
  407. package/dist/ionic/p-5e4eec2e.entry.js +0 -4
  408. package/dist/ionic/p-6a6477b2.js +0 -4
  409. package/dist/ionic/p-72f6ff89.js +0 -4
  410. package/dist/ionic/p-765f4dde.entry.js +0 -4
  411. package/dist/ionic/p-7d92bf15.system.entry.js +0 -4
  412. package/dist/ionic/p-7ee0f3f2.entry.js +0 -4
  413. package/dist/ionic/p-8314281e.system.js +0 -4
  414. package/dist/ionic/p-88d5fbd3.js +0 -4
  415. package/dist/ionic/p-8d69a624.entry.js +0 -4
  416. package/dist/ionic/p-8de17614.system.entry.js +0 -4
  417. package/dist/ionic/p-908475e7.system.entry.js +0 -4
  418. package/dist/ionic/p-91d33c4a.js +0 -4
  419. package/dist/ionic/p-979d4f5c.system.js +0 -4
  420. package/dist/ionic/p-9b7f0b0f.entry.js +0 -4
  421. package/dist/ionic/p-9e447eb1.system.js +0 -4
  422. package/dist/ionic/p-9f6ee2c0.system.entry.js +0 -4
  423. package/dist/ionic/p-a0d7bb5e.system.js +0 -4
  424. package/dist/ionic/p-a3277a67.entry.js +0 -4
  425. package/dist/ionic/p-afd6ca9d.entry.js +0 -4
  426. package/dist/ionic/p-b56d0866.system.entry.js +0 -4
  427. package/dist/ionic/p-c61cc894.js +0 -4
  428. package/dist/ionic/p-d032f825.system.entry.js +0 -4
  429. package/dist/ionic/p-d51674c5.system.js +0 -4
  430. package/dist/ionic/p-de6f8b28.system.js +0 -4
  431. package/dist/ionic/p-de756e5c.js +0 -4
  432. package/dist/ionic/p-dfd9432a.entry.js +0 -4
  433. package/dist/ionic/p-e94c392d.entry.js +0 -4
  434. package/dist/ionic/p-f0445d82.system.entry.js +0 -4
  435. package/dist/ionic/p-f656e032.system.entry.js +0 -4
  436. package/dist/ionic/p-feae5133.entry.js +0 -4
  437. package/dist/types/components/toast/gestures/swipe-to-dismiss.d.ts +0 -9
  438. package/dist/types/jest.d.ts +0 -5
  439. package/dist/types/utils/forms/compare-with-utils.d.ts +0 -18
  440. /package/dist/esm-es5/{index-a5d50daf.js → index-7a14ecec.js} +0 -0
  441. /package/dist/ionic/{p-792919fd.system.js → p-0e94957a.system.js} +0 -0
  442. /package/dist/ionic/{p-7b30edcc.js → p-b347cfd1.js} +0 -0
@@ -5,107 +5,19 @@
5
5
 
6
6
  Object.defineProperty(exports, '__esModule', { value: true });
7
7
 
8
- const index$3 = require('./index-bbb4336c.js');
8
+ const index$2 = require('./index-bbb4336c.js');
9
9
  const config = require('./config-4f60b98a.js');
10
10
  const helpers = require('./helpers-76bb7efb.js');
11
11
  const lockController = require('./lock-controller-6585a42a.js');
12
12
  const index$1 = require('./index-5915f9b3.js');
13
- const overlays = require('./overlays-27a6fb16.js');
13
+ const overlays = require('./overlays-2c6b1072.js');
14
14
  const theme = require('./theme-d1c573d2.js');
15
15
  const ionicGlobal = require('./ionic-global-f4a2093b.js');
16
- const animation = require('./animation-9b401d39.js');
17
- const index = require('./index-c8d52405.js');
18
- const index$2 = require('./index-d1b59ffa.js');
16
+ const animation = require('./animation-cc40e39c.js');
17
+ const index = require('./index-306a7476.js');
19
18
  require('./framework-delegate-1c29b14a.js');
19
+ require('./gesture-controller-9436f482.js');
20
20
  require('./hardware-back-button-76833cac.js');
21
- require('./gesture-controller-c40c045a.js');
22
-
23
- /**
24
- * Calculate the CSS top and bottom position of the toast, to be used
25
- * as starting points for the animation keyframes.
26
- *
27
- * The default animations for both MD and iOS
28
- * use translateY, which calculates from the
29
- * top edge of the screen. This behavior impacts
30
- * how we compute the offset when a toast has
31
- * position='bottom' since we need to calculate from
32
- * the bottom edge of the screen instead.
33
- *
34
- * @param position The value of the toast's position prop.
35
- * @param positionAnchor The element the toast should be anchored to,
36
- * if applicable.
37
- * @param mode The toast component's mode (md, ios, etc).
38
- * @param toast A reference to the toast element itself.
39
- */
40
- function getAnimationPosition(position, positionAnchor, mode, toast) {
41
- /**
42
- * Start with a predefined offset from the edge the toast will be
43
- * positioned relative to, whether on the screen or anchor element.
44
- */
45
- let offset;
46
- if (mode === 'md') {
47
- offset = position === 'top' ? 8 : -8;
48
- }
49
- else {
50
- offset = position === 'top' ? 10 : -10;
51
- }
52
- /**
53
- * If positionAnchor is defined, add in the distance from the target
54
- * screen edge to the target anchor edge. For position="top", the
55
- * bottom anchor edge is targeted. For position="bottom", the top
56
- * anchor edge is targeted.
57
- */
58
- if (positionAnchor && index.win) {
59
- warnIfAnchorIsHidden(positionAnchor, toast);
60
- const box = positionAnchor.getBoundingClientRect();
61
- if (position === 'top') {
62
- offset += box.bottom;
63
- }
64
- else if (position === 'bottom') {
65
- /**
66
- * Just box.top is the distance from the top edge of the screen
67
- * to the top edge of the anchor. We want to calculate from the
68
- * bottom edge of the screen instead.
69
- */
70
- offset -= index.win.innerHeight - box.top;
71
- }
72
- /**
73
- * We don't include safe area here because that should already be
74
- * accounted for when checking the position of the anchor.
75
- */
76
- return {
77
- top: `${offset}px`,
78
- bottom: `${offset}px`,
79
- };
80
- }
81
- else {
82
- return {
83
- top: `calc(${offset}px + var(--ion-safe-area-top, 0px))`,
84
- bottom: `calc(${offset}px - var(--ion-safe-area-bottom, 0px))`,
85
- };
86
- }
87
- }
88
- /**
89
- * If the anchor element is hidden, getBoundingClientRect()
90
- * will return all 0s for it, which can cause unexpected
91
- * results in the position calculation when animating.
92
- */
93
- function warnIfAnchorIsHidden(positionAnchor, toast) {
94
- if (positionAnchor.offsetParent === null) {
95
- index$1.printIonWarning('The positionAnchor element for ion-toast was found in the DOM, but appears to be hidden. This may lead to unexpected positioning of the toast.', toast);
96
- }
97
- }
98
- /**
99
- * Returns the top offset required to place
100
- * the toast in the middle of the screen.
101
- * Only needed when position="toast".
102
- * @param toastHeight - The height of the ion-toast element
103
- * @param wrapperHeight - The height of the .toast-wrapper element
104
- * inside the toast's shadow root.
105
- */
106
- const getOffsetForMiddlePosition = (toastHeight, wrapperHeight) => {
107
- return Math.floor(toastHeight / 2 - wrapperHeight / 2);
108
- };
109
21
 
110
22
  /**
111
23
  * iOS Toast Enter Animation
@@ -122,7 +34,7 @@ const iosEnterAnimation = (baseEl, opts) => {
122
34
  wrapperAnimation.fromTo('transform', 'translateY(-100%)', `translateY(${top})`);
123
35
  break;
124
36
  case 'middle':
125
- const topPosition = getOffsetForMiddlePosition(baseEl.clientHeight, wrapperEl.clientHeight);
37
+ const topPosition = Math.floor(baseEl.clientHeight / 2 - wrapperEl.clientHeight / 2);
126
38
  wrapperEl.style.top = `${topPosition}px`;
127
39
  wrapperAnimation.fromTo('opacity', 0.01, 1);
128
40
  break;
@@ -169,16 +81,16 @@ const mdEnterAnimation = (baseEl, opts) => {
169
81
  wrapperAnimation.addElement(wrapperEl);
170
82
  switch (position) {
171
83
  case 'top':
172
- wrapperEl.style.setProperty('transform', `translateY(${top})`);
84
+ wrapperEl.style.top = top;
173
85
  wrapperAnimation.fromTo('opacity', 0.01, 1);
174
86
  break;
175
87
  case 'middle':
176
- const topPosition = getOffsetForMiddlePosition(baseEl.clientHeight, wrapperEl.clientHeight);
88
+ const topPosition = Math.floor(baseEl.clientHeight / 2 - wrapperEl.clientHeight / 2);
177
89
  wrapperEl.style.top = `${topPosition}px`;
178
90
  wrapperAnimation.fromTo('opacity', 0.01, 1);
179
91
  break;
180
92
  default:
181
- wrapperEl.style.setProperty('transform', `translateY(${bottom})`);
93
+ wrapperEl.style.bottom = bottom;
182
94
  wrapperAnimation.fromTo('opacity', 0.01, 1);
183
95
  break;
184
96
  }
@@ -198,277 +110,101 @@ const mdLeaveAnimation = (baseEl) => {
198
110
  };
199
111
 
200
112
  /**
201
- * Create a gesture that allows the Toast
202
- * to be swiped to dismiss.
203
- * @param el - The Toast element
204
- * @param toastPosition - The last computed position of the Toast. This is computed in the "present" method.
205
- * @param onDismiss - A callback to fire when the Toast was swiped to dismiss.
113
+ * Calculate the CSS top and bottom position of the toast, to be used
114
+ * as starting points for the animation keyframes.
115
+ *
116
+ * Note that MD animates bottom-positioned toasts using style.bottom,
117
+ * which calculates from the bottom edge of the screen, while iOS uses
118
+ * translateY, which calculates from the top edge of the screen. This
119
+ * is why the bottom calculates differ slightly between modes.
120
+ *
121
+ * @param position The value of the toast's position prop.
122
+ * @param positionAnchor The element the toast should be anchored to,
123
+ * if applicable.
124
+ * @param mode The toast component's mode (md, ios, etc).
125
+ * @param toast A reference to the toast element itself.
206
126
  */
207
- const createSwipeToDismissGesture = (el, toastPosition, onDismiss) => {
208
- /**
209
- * Users should swipe on the visible toast wrapper
210
- * rather than on ion-toast which covers the entire screen.
211
- * When testing the class instance the inner wrapper will not
212
- * be defined. As a result, we use a placeholder element in those environments.
213
- */
214
- const wrapperEl = helpers.getElementRoot(el).querySelector('.toast-wrapper');
215
- const hostElHeight = el.clientHeight;
216
- const wrapperElBox = wrapperEl.getBoundingClientRect();
217
- /**
218
- * The maximum amount that
219
- * the toast can be swiped. This should
220
- * account for the wrapper element's height
221
- * too so the toast can be swiped offscreen
222
- * completely.
223
- */
224
- let MAX_SWIPE_DISTANCE = 0;
225
- /**
226
- * The step value at which a toast
227
- * is eligible for dismissing via gesture.
228
- */
229
- const DISMISS_THRESHOLD = 0.5;
230
- /**
231
- * The middle position Toast starts 50% of the way
232
- * through the animation, so we need to use this
233
- * as the starting point for our step values.
234
- */
235
- const STEP_OFFSET = el.position === 'middle' ? 0.5 : 0;
127
+ function getAnimationPosition(position, positionAnchor, mode, toast) {
236
128
  /**
237
- * When the Toast is at the top users will be
238
- * swiping up. As a result, the delta values will be
239
- * negative numbers which will result in negative steps
240
- * and thresholds. As a result, we need to make those numbers
241
- * positive.
129
+ * Start with a predefined offset from the edge the toast will be
130
+ * positioned relative to, whether on the screen or anchor element.
242
131
  */
243
- const INVERSION_FACTOR = el.position === 'top' ? -1 : 1;
132
+ let offset;
133
+ if (mode === 'md') {
134
+ offset = 8;
135
+ }
136
+ else {
137
+ offset = position === 'top' ? 10 : -10;
138
+ }
244
139
  /**
245
- * The top offset that places the
246
- * toast in the middle of the screen.
247
- * Only needed when position="middle".
140
+ * If positionAnchor is defined, add in the distance from the target
141
+ * screen edge to the target anchor edge. For position="top", the
142
+ * bottom anchor edge is targeted. For position="bottom", the top
143
+ * anchor edge is targeted.
248
144
  */
249
- const topPosition = getOffsetForMiddlePosition(hostElHeight, wrapperElBox.height);
250
- const SWIPE_UP_DOWN_KEYFRAMES = [
251
- { offset: 0, transform: `translateY(-${topPosition + wrapperElBox.height}px)` },
252
- { offset: 0.5, transform: `translateY(0px)` },
253
- { offset: 1, transform: `translateY(${topPosition + wrapperElBox.height}px)` },
254
- ];
255
- const swipeAnimation = animation.createAnimation('toast-swipe-to-dismiss-animation')
256
- .addElement(wrapperEl)
257
- /**
258
- * The specific value here does not actually
259
- * matter. We just need this to be a positive
260
- * value so the animation does not jump
261
- * to the end when the user beings to drag.
262
- */
263
- .duration(100);
264
- switch (el.position) {
265
- case 'middle':
266
- MAX_SWIPE_DISTANCE = hostElHeight + wrapperElBox.height;
267
- swipeAnimation.keyframes(SWIPE_UP_DOWN_KEYFRAMES);
268
- /**
269
- * Toast can be swiped up or down but
270
- * should start in the middle of the screen.
271
- */
272
- swipeAnimation.progressStart(true, 0.5);
273
- break;
274
- case 'top':
275
- /**
276
- * The bottom edge of the wrapper
277
- * includes the distance between the top
278
- * of the screen and the top of the wrapper
279
- * as well as the wrapper height so the wrapper
280
- * can be dragged fully offscreen.
281
- */
282
- MAX_SWIPE_DISTANCE = wrapperElBox.bottom;
283
- swipeAnimation.keyframes([
284
- { offset: 0, transform: `translateY(${toastPosition.top})` },
285
- { offset: 1, transform: 'translateY(-100%)' },
286
- ]);
287
- swipeAnimation.progressStart(true, 0);
288
- break;
289
- case 'bottom':
290
- default:
291
- /**
292
- * This computes the distance between the
293
- * top of the wrapper and the bottom of the
294
- * screen including the height of the wrapper
295
- * element so it can be dragged fully offscreen.
296
- */
297
- MAX_SWIPE_DISTANCE = hostElHeight - wrapperElBox.top;
298
- swipeAnimation.keyframes([
299
- { offset: 0, transform: `translateY(${toastPosition.bottom})` },
300
- { offset: 1, transform: 'translateY(100%)' },
301
- ]);
302
- swipeAnimation.progressStart(true, 0);
303
- break;
304
- }
305
- const computeStep = (delta) => {
306
- return (delta * INVERSION_FACTOR) / MAX_SWIPE_DISTANCE;
307
- };
308
- const onMove = (detail) => {
309
- const step = STEP_OFFSET + computeStep(detail.deltaY);
310
- swipeAnimation.progressStep(step);
311
- };
312
- const onEnd = (detail) => {
313
- const velocity = detail.velocityY;
314
- const threshold = ((detail.deltaY + velocity * 1000) / MAX_SWIPE_DISTANCE) * INVERSION_FACTOR;
315
- /**
316
- * Disable the gesture for the remainder of the animation.
317
- * It will be re-enabled if the toast animates back to
318
- * its initial presented position.
319
- */
320
- gesture.enable(false);
321
- let shouldDismiss = true;
322
- let playTo = 1;
323
- let step = 0;
324
- let remainingDistance = 0;
325
- if (el.position === 'middle') {
326
- /**
327
- * A middle positioned Toast appears
328
- * in the middle of the screen (at animation offset 0.5).
329
- * As a result, the threshold will be calculated relative
330
- * to this starting position. In other words at animation offset 0.5
331
- * the threshold will be 0. We want the middle Toast to be eligible
332
- * for dismiss when the user has swiped either half way up or down the
333
- * screen. As a result, we divide DISMISS_THRESHOLD in half. We also
334
- * consider when the threshold is a negative in the event the
335
- * user drags up (since the deltaY will also be negative).
336
- */
337
- shouldDismiss = threshold >= DISMISS_THRESHOLD / 2 || threshold <= -DISMISS_THRESHOLD / 2;
338
- /**
339
- * Since we are replacing the keyframes
340
- * below the animation always starts from
341
- * the beginning of the new keyframes.
342
- * Similarly, we are always playing to
343
- * the end of the new keyframes.
344
- */
345
- playTo = 1;
346
- step = 0;
347
- /**
348
- * The Toast should animate from wherever its
349
- * current position is to the desired end state.
350
- *
351
- * To begin, we get the current position of the
352
- * Toast for its starting state.
353
- */
354
- const wrapperElBox = wrapperEl.getBoundingClientRect();
355
- const startOffset = wrapperElBox.top - topPosition;
356
- const startPosition = `${startOffset}px`;
357
- /**
358
- * If the deltaY is negative then the user is swiping
359
- * up, so the Toast should animate to the top of the screen.
360
- * If the deltaY is positive then the user is swiping
361
- * down, so the Toast should animate to the bottom of the screen.
362
- * We also account for when the deltaY is 0, but realistically
363
- * that should never happen because it means the user did not drag
364
- * the toast.
365
- */
366
- const offsetFactor = detail.deltaY <= 0 ? -1 : 1;
367
- const endOffset = (topPosition + wrapperElBox.height) * offsetFactor;
368
- /**
369
- * If the Toast should dismiss
370
- * then we need to figure out which edge of
371
- * the screen it should animate towards.
372
- * By default, the Toast will come
373
- * back to its default state in the
374
- * middle of the screen.
375
- */
376
- const endPosition = shouldDismiss ? `${endOffset}px` : '0px';
377
- const KEYFRAMES = [
378
- { offset: 0, transform: `translateY(${startPosition})` },
379
- { offset: 1, transform: `translateY(${endPosition})` },
380
- ];
381
- swipeAnimation.keyframes(KEYFRAMES);
382
- /**
383
- * Compute the remaining amount of pixels the
384
- * toast needs to move to be fully dismissed.
385
- */
386
- remainingDistance = endOffset - startOffset;
145
+ if (positionAnchor && index.win) {
146
+ warnIfAnchorIsHidden(positionAnchor, toast);
147
+ const box = positionAnchor.getBoundingClientRect();
148
+ if (position === 'top') {
149
+ offset += box.bottom;
387
150
  }
388
- else {
389
- shouldDismiss = threshold >= DISMISS_THRESHOLD;
390
- playTo = shouldDismiss ? 1 : 0;
391
- step = computeStep(detail.deltaY);
151
+ else if (position === 'bottom') {
392
152
  /**
393
- * Compute the remaining amount of pixels the
394
- * toast needs to move to be fully dismissed.
153
+ * Just box.top is the distance from the top edge of the screen
154
+ * to the top edge of the anchor. We want to calculate from the
155
+ * bottom edge of the screen instead.
395
156
  */
396
- const remainingStepAmount = shouldDismiss ? 1 - step : step;
397
- remainingDistance = remainingStepAmount * MAX_SWIPE_DISTANCE;
398
- }
399
- /**
400
- * The animation speed should depend on how quickly
401
- * the user flicks the toast across the screen. However,
402
- * it should be no slower than 200ms.
403
- * We use Math.abs on the remainingDistance because that value
404
- * can be negative when swiping up on a middle position toast.
405
- */
406
- const duration = Math.min(Math.abs(remainingDistance) / Math.abs(velocity), 200);
407
- swipeAnimation
408
- .onFinish(() => {
409
- if (shouldDismiss) {
410
- onDismiss();
411
- swipeAnimation.destroy();
157
+ if (mode === 'md') {
158
+ offset += index.win.innerHeight - box.top;
412
159
  }
413
160
  else {
414
- if (el.position === 'middle') {
415
- /**
416
- * If the toast snapped back to
417
- * the middle of the screen we need
418
- * to reset the keyframes
419
- * so the toast can be swiped
420
- * up or down again.
421
- */
422
- swipeAnimation.keyframes(SWIPE_UP_DOWN_KEYFRAMES).progressStart(true, 0.5);
423
- }
424
- else {
425
- swipeAnimation.progressStart(true, 0);
426
- }
427
- /**
428
- * If the toast did not dismiss then
429
- * the user should be able to swipe again.
430
- */
431
- gesture.enable(true);
161
+ offset -= index.win.innerHeight - box.top;
432
162
  }
433
- /**
434
- * This must be a one time callback
435
- * otherwise a new callback will
436
- * be added every time onEnd runs.
437
- */
438
- }, { oneTimeCallback: true })
439
- .progressEnd(playTo, step, duration);
440
- };
441
- const gesture = index$2.createGesture({
442
- el: wrapperEl,
443
- gestureName: 'toast-swipe-to-dismiss',
444
- gesturePriority: overlays.OVERLAY_GESTURE_PRIORITY,
163
+ }
445
164
  /**
446
- * Toast only supports vertical swipes.
447
- * This needs to be updated if we later
448
- * support horizontal swipes.
165
+ * We don't include safe area here because that should already be
166
+ * accounted for when checking the position of the anchor.
449
167
  */
450
- direction: 'y',
451
- onMove,
452
- onEnd,
453
- });
454
- return gesture;
455
- };
168
+ return {
169
+ top: `${offset}px`,
170
+ bottom: `${offset}px`,
171
+ };
172
+ }
173
+ else {
174
+ return {
175
+ top: `calc(${offset}px + var(--ion-safe-area-top, 0px))`,
176
+ bottom: mode === 'md'
177
+ ? `calc(${offset}px + var(--ion-safe-area-bottom, 0px))`
178
+ : `calc(${offset}px - var(--ion-safe-area-bottom, 0px))`,
179
+ };
180
+ }
181
+ }
182
+ /**
183
+ * If the anchor element is hidden, getBoundingClientRect()
184
+ * will return all 0s for it, which can cause unexpected
185
+ * results in the position calculation when animating.
186
+ */
187
+ function warnIfAnchorIsHidden(positionAnchor, toast) {
188
+ if (positionAnchor.offsetParent === null) {
189
+ index$1.printIonWarning('The positionAnchor element for ion-toast was found in the DOM, but appears to be hidden. This may lead to unexpected positioning of the toast.', toast);
190
+ }
191
+ }
456
192
 
457
- const toastIosCss = ":host{--border-width:0;--border-style:none;--border-color:initial;--box-shadow:none;--min-width:auto;--width:auto;--min-height:auto;--height:auto;--max-height:auto;--white-space:normal;top:0;display:block;position:absolute;width:100%;height:100%;outline:none;color:var(--color);font-family:var(--ion-font-family, inherit);contain:strict;z-index:1001;pointer-events:none}@supports (inset-inline-start: 0){:host{inset-inline-start:0}}@supports not (inset-inline-start: 0){:host{left:0}:host-context([dir=rtl]){left:unset;right:unset;right:0}@supports selector(:dir(rtl)){:host(:dir(rtl)){left:unset;right:unset;right:0}}}:host(.overlay-hidden){display:none}:host(.ion-color){--button-color:inherit;color:var(--ion-color-contrast)}:host(.ion-color) .toast-button-cancel{color:inherit}:host(.ion-color) .toast-wrapper{background:var(--ion-color-base)}.toast-wrapper{border-radius:var(--border-radius);width:var(--width);min-width:var(--min-width);max-width:var(--max-width);height:var(--height);min-height:var(--min-height);max-height:var(--max-height);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--background);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow)}@supports (inset-inline-start: 0){.toast-wrapper{inset-inline-start:var(--start);inset-inline-end:var(--end)}}@supports not (inset-inline-start: 0){.toast-wrapper{left:var(--start);right:var(--end)}:host-context([dir=rtl]) .toast-wrapper{left:unset;right:unset;left:var(--end);right:var(--start)}[dir=rtl] .toast-wrapper{left:unset;right:unset;left:var(--end);right:var(--start)}@supports selector(:dir(rtl)){.toast-wrapper:dir(rtl){left:unset;right:unset;left:var(--end);right:var(--start)}}}.toast-wrapper.toast-top{-webkit-transform:translate3d(0, -100%, 0);transform:translate3d(0, -100%, 0);top:0}.toast-wrapper.toast-bottom{-webkit-transform:translate3d(0, 100%, 0);transform:translate3d(0, 100%, 0);bottom:0}.toast-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;pointer-events:auto;height:inherit;min-height:inherit;max-height:inherit;contain:content}.toast-layout-stacked .toast-container{-ms-flex-wrap:wrap;flex-wrap:wrap}.toast-layout-baseline .toast-content{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center}.toast-icon{-webkit-margin-start:16px;margin-inline-start:16px}.toast-content{min-width:0}.toast-message{-ms-flex:1;flex:1;white-space:var(--white-space)}.toast-button-group{display:-ms-flexbox;display:flex}.toast-layout-stacked .toast-button-group{-ms-flex-pack:end;justify-content:end;width:100%}.toast-button{border:0;outline:none;color:var(--button-color);z-index:0}.toast-icon,.toast-button-icon{font-size:1.4em}.toast-button-inner{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}@media (any-hover: hover){.toast-button:hover{cursor:pointer}}:host{--background:var(--ion-color-step-50, #f2f2f2);--border-radius:14px;--button-color:var(--ion-color-primary, #3880ff);--color:var(--ion-color-step-850, #262626);--max-width:700px;--max-height:478px;--start:10px;--end:10px;font-size:clamp(14px, 0.875rem, 43.4px)}.toast-wrapper{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:auto;margin-bottom:auto;display:block;position:absolute;z-index:10}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){:host(.toast-translucent) .toast-wrapper{background:rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.8);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px)}:host(.ion-color.toast-translucent) .toast-wrapper{background:rgba(var(--ion-color-base-rgb), 0.8)}}.toast-wrapper.toast-middle{opacity:0.01}.toast-content{-webkit-padding-start:15px;padding-inline-start:15px;-webkit-padding-end:15px;padding-inline-end:15px;padding-top:15px;padding-bottom:15px}.toast-header{margin-bottom:2px;font-weight:500}.toast-button{-webkit-padding-start:15px;padding-inline-start:15px;-webkit-padding-end:15px;padding-inline-end:15px;padding-top:10px;padding-bottom:10px;min-height:44px;-webkit-transition:background-color, opacity 100ms linear;transition:background-color, opacity 100ms linear;border:0;background-color:transparent;font-family:var(--ion-font-family);font-size:clamp(17px, 1.0625rem, 21.998px);font-weight:500;overflow:hidden}.toast-button.ion-activated{opacity:0.4}@media (any-hover: hover){.toast-button:hover{opacity:0.6}}";
193
+ const toastIosCss = ":host{--border-width:0;--border-style:none;--border-color:initial;--box-shadow:none;--min-width:auto;--width:auto;--min-height:auto;--height:auto;--max-height:auto;--white-space:normal;top:0;display:block;position:absolute;width:100%;height:100%;outline:none;color:var(--color);font-family:var(--ion-font-family, inherit);contain:strict;z-index:1001;pointer-events:none}@supports (inset-inline-start: 0){:host{inset-inline-start:0}}@supports not (inset-inline-start: 0){:host{left:0}:host-context([dir=rtl]){left:unset;right:unset;right:0}@supports selector(:dir(rtl)){:host(:dir(rtl)){left:unset;right:unset;right:0}}}:host(.overlay-hidden){display:none}:host(.ion-color){--button-color:inherit;color:var(--ion-color-contrast)}:host(.ion-color) .toast-button-cancel{color:inherit}:host(.ion-color) .toast-wrapper{background:var(--ion-color-base)}.toast-wrapper{border-radius:var(--border-radius);width:var(--width);min-width:var(--min-width);max-width:var(--max-width);height:var(--height);min-height:var(--min-height);max-height:var(--max-height);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--background);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow)}@supports (inset-inline-start: 0){.toast-wrapper{inset-inline-start:var(--start);inset-inline-end:var(--end)}}@supports not (inset-inline-start: 0){.toast-wrapper{left:var(--start);right:var(--end)}:host-context([dir=rtl]) .toast-wrapper{left:unset;right:unset;left:var(--end);right:var(--start)}[dir=rtl] .toast-wrapper{left:unset;right:unset;left:var(--end);right:var(--start)}@supports selector(:dir(rtl)){.toast-wrapper:dir(rtl){left:unset;right:unset;left:var(--end);right:var(--start)}}}.toast-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;pointer-events:auto;height:inherit;min-height:inherit;max-height:inherit;contain:content}.toast-layout-stacked .toast-container{-ms-flex-wrap:wrap;flex-wrap:wrap}.toast-layout-baseline .toast-content{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center}.toast-icon{-webkit-margin-start:16px;margin-inline-start:16px}.toast-content{min-width:0}.toast-message{-ms-flex:1;flex:1;white-space:var(--white-space)}.toast-button-group{display:-ms-flexbox;display:flex}.toast-layout-stacked .toast-button-group{-ms-flex-pack:end;justify-content:end;width:100%}.toast-button{border:0;outline:none;color:var(--button-color);z-index:0}.toast-icon,.toast-button-icon{font-size:1.4em}.toast-button-inner{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}@media (any-hover: hover){.toast-button:hover{cursor:pointer}}:host{--background:var(--ion-color-step-50, #f2f2f2);--border-radius:14px;--button-color:var(--ion-color-primary, #3880ff);--color:var(--ion-color-step-850, #262626);--max-width:700px;--max-height:478px;--start:10px;--end:10px;font-size:clamp(14px, 0.875rem, 43.4px)}.toast-wrapper{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:auto;margin-bottom:auto;display:block;position:absolute;z-index:10}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){:host(.toast-translucent) .toast-wrapper{background:rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.8);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px)}:host(.ion-color.toast-translucent) .toast-wrapper{background:rgba(var(--ion-color-base-rgb), 0.8)}}.toast-wrapper.toast-top{-webkit-transform:translate3d(0, -100%, 0);transform:translate3d(0, -100%, 0);top:0}.toast-wrapper.toast-middle{opacity:0.01}.toast-wrapper.toast-bottom{-webkit-transform:translate3d(0, 100%, 0);transform:translate3d(0, 100%, 0);bottom:0}.toast-content{-webkit-padding-start:15px;padding-inline-start:15px;-webkit-padding-end:15px;padding-inline-end:15px;padding-top:15px;padding-bottom:15px}.toast-header{margin-bottom:2px;font-weight:500}.toast-button{-webkit-padding-start:15px;padding-inline-start:15px;-webkit-padding-end:15px;padding-inline-end:15px;padding-top:10px;padding-bottom:10px;min-height:44px;-webkit-transition:background-color, opacity 100ms linear;transition:background-color, opacity 100ms linear;border:0;background-color:transparent;font-family:var(--ion-font-family);font-size:clamp(17px, 1.0625rem, 21.998px);font-weight:500;overflow:hidden}.toast-button.ion-activated{opacity:0.4}@media (any-hover: hover){.toast-button:hover{opacity:0.6}}";
458
194
 
459
- const toastMdCss = ":host{--border-width:0;--border-style:none;--border-color:initial;--box-shadow:none;--min-width:auto;--width:auto;--min-height:auto;--height:auto;--max-height:auto;--white-space:normal;top:0;display:block;position:absolute;width:100%;height:100%;outline:none;color:var(--color);font-family:var(--ion-font-family, inherit);contain:strict;z-index:1001;pointer-events:none}@supports (inset-inline-start: 0){:host{inset-inline-start:0}}@supports not (inset-inline-start: 0){:host{left:0}:host-context([dir=rtl]){left:unset;right:unset;right:0}@supports selector(:dir(rtl)){:host(:dir(rtl)){left:unset;right:unset;right:0}}}:host(.overlay-hidden){display:none}:host(.ion-color){--button-color:inherit;color:var(--ion-color-contrast)}:host(.ion-color) .toast-button-cancel{color:inherit}:host(.ion-color) .toast-wrapper{background:var(--ion-color-base)}.toast-wrapper{border-radius:var(--border-radius);width:var(--width);min-width:var(--min-width);max-width:var(--max-width);height:var(--height);min-height:var(--min-height);max-height:var(--max-height);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--background);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow)}@supports (inset-inline-start: 0){.toast-wrapper{inset-inline-start:var(--start);inset-inline-end:var(--end)}}@supports not (inset-inline-start: 0){.toast-wrapper{left:var(--start);right:var(--end)}:host-context([dir=rtl]) .toast-wrapper{left:unset;right:unset;left:var(--end);right:var(--start)}[dir=rtl] .toast-wrapper{left:unset;right:unset;left:var(--end);right:var(--start)}@supports selector(:dir(rtl)){.toast-wrapper:dir(rtl){left:unset;right:unset;left:var(--end);right:var(--start)}}}.toast-wrapper.toast-top{-webkit-transform:translate3d(0, -100%, 0);transform:translate3d(0, -100%, 0);top:0}.toast-wrapper.toast-bottom{-webkit-transform:translate3d(0, 100%, 0);transform:translate3d(0, 100%, 0);bottom:0}.toast-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;pointer-events:auto;height:inherit;min-height:inherit;max-height:inherit;contain:content}.toast-layout-stacked .toast-container{-ms-flex-wrap:wrap;flex-wrap:wrap}.toast-layout-baseline .toast-content{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center}.toast-icon{-webkit-margin-start:16px;margin-inline-start:16px}.toast-content{min-width:0}.toast-message{-ms-flex:1;flex:1;white-space:var(--white-space)}.toast-button-group{display:-ms-flexbox;display:flex}.toast-layout-stacked .toast-button-group{-ms-flex-pack:end;justify-content:end;width:100%}.toast-button{border:0;outline:none;color:var(--button-color);z-index:0}.toast-icon,.toast-button-icon{font-size:1.4em}.toast-button-inner{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}@media (any-hover: hover){.toast-button:hover{cursor:pointer}}:host{--background:var(--ion-color-step-800, #333333);--border-radius:4px;--box-shadow:0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12);--button-color:var(--ion-color-primary, #3880ff);--color:var(--ion-color-step-50, #f2f2f2);--max-width:700px;--start:8px;--end:8px;font-size:0.875rem}.toast-wrapper{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:auto;margin-bottom:auto;display:block;position:absolute;opacity:0.01;z-index:10}.toast-content{-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:14px;padding-bottom:14px}.toast-header{margin-bottom:2px;font-weight:500;line-height:1.25rem}.toast-message{line-height:1.25rem}.toast-layout-baseline .toast-button-group-start{-webkit-margin-start:8px;margin-inline-start:8px}.toast-layout-stacked .toast-button-group-start{-webkit-margin-end:8px;margin-inline-end:8px;margin-top:8px}.toast-layout-baseline .toast-button-group-end{-webkit-margin-end:8px;margin-inline-end:8px}.toast-layout-stacked .toast-button-group-end{-webkit-margin-end:8px;margin-inline-end:8px;margin-bottom:8px}.toast-button{-webkit-padding-start:15px;padding-inline-start:15px;-webkit-padding-end:15px;padding-inline-end:15px;padding-top:10px;padding-bottom:10px;position:relative;background-color:transparent;font-family:var(--ion-font-family);font-size:0.875rem;font-weight:500;letter-spacing:0.84px;text-transform:uppercase;overflow:hidden}.toast-button-cancel{color:var(--ion-color-step-100, #e6e6e6)}.toast-button-icon-only{border-radius:50%;-webkit-padding-start:9px;padding-inline-start:9px;-webkit-padding-end:9px;padding-inline-end:9px;padding-top:9px;padding-bottom:9px;width:36px;height:36px}@media (any-hover: hover){.toast-button:hover{background-color:rgba(var(--ion-color-primary-rgb, 56, 128, 255), 0.08)}.toast-button-cancel:hover{background-color:rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.08)}}";
195
+ const toastMdCss = ":host{--border-width:0;--border-style:none;--border-color:initial;--box-shadow:none;--min-width:auto;--width:auto;--min-height:auto;--height:auto;--max-height:auto;--white-space:normal;top:0;display:block;position:absolute;width:100%;height:100%;outline:none;color:var(--color);font-family:var(--ion-font-family, inherit);contain:strict;z-index:1001;pointer-events:none}@supports (inset-inline-start: 0){:host{inset-inline-start:0}}@supports not (inset-inline-start: 0){:host{left:0}:host-context([dir=rtl]){left:unset;right:unset;right:0}@supports selector(:dir(rtl)){:host(:dir(rtl)){left:unset;right:unset;right:0}}}:host(.overlay-hidden){display:none}:host(.ion-color){--button-color:inherit;color:var(--ion-color-contrast)}:host(.ion-color) .toast-button-cancel{color:inherit}:host(.ion-color) .toast-wrapper{background:var(--ion-color-base)}.toast-wrapper{border-radius:var(--border-radius);width:var(--width);min-width:var(--min-width);max-width:var(--max-width);height:var(--height);min-height:var(--min-height);max-height:var(--max-height);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);background:var(--background);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow)}@supports (inset-inline-start: 0){.toast-wrapper{inset-inline-start:var(--start);inset-inline-end:var(--end)}}@supports not (inset-inline-start: 0){.toast-wrapper{left:var(--start);right:var(--end)}:host-context([dir=rtl]) .toast-wrapper{left:unset;right:unset;left:var(--end);right:var(--start)}[dir=rtl] .toast-wrapper{left:unset;right:unset;left:var(--end);right:var(--start)}@supports selector(:dir(rtl)){.toast-wrapper:dir(rtl){left:unset;right:unset;left:var(--end);right:var(--start)}}}.toast-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;pointer-events:auto;height:inherit;min-height:inherit;max-height:inherit;contain:content}.toast-layout-stacked .toast-container{-ms-flex-wrap:wrap;flex-wrap:wrap}.toast-layout-baseline .toast-content{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center}.toast-icon{-webkit-margin-start:16px;margin-inline-start:16px}.toast-content{min-width:0}.toast-message{-ms-flex:1;flex:1;white-space:var(--white-space)}.toast-button-group{display:-ms-flexbox;display:flex}.toast-layout-stacked .toast-button-group{-ms-flex-pack:end;justify-content:end;width:100%}.toast-button{border:0;outline:none;color:var(--button-color);z-index:0}.toast-icon,.toast-button-icon{font-size:1.4em}.toast-button-inner{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}@media (any-hover: hover){.toast-button:hover{cursor:pointer}}:host{--background:var(--ion-color-step-800, #333333);--border-radius:4px;--box-shadow:0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12);--button-color:var(--ion-color-primary, #3880ff);--color:var(--ion-color-step-50, #f2f2f2);--max-width:700px;--start:8px;--end:8px;font-size:0.875rem}.toast-wrapper{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:auto;margin-bottom:auto;display:block;position:absolute;opacity:0.01;z-index:10}.toast-content{-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:14px;padding-bottom:14px}.toast-header{margin-bottom:2px;font-weight:500;line-height:1.25rem}.toast-message{line-height:1.25rem}.toast-layout-baseline .toast-button-group-start{-webkit-margin-start:8px;margin-inline-start:8px}.toast-layout-stacked .toast-button-group-start{-webkit-margin-end:8px;margin-inline-end:8px;margin-top:8px}.toast-layout-baseline .toast-button-group-end{-webkit-margin-end:8px;margin-inline-end:8px}.toast-layout-stacked .toast-button-group-end{-webkit-margin-end:8px;margin-inline-end:8px;margin-bottom:8px}.toast-button{-webkit-padding-start:15px;padding-inline-start:15px;-webkit-padding-end:15px;padding-inline-end:15px;padding-top:10px;padding-bottom:10px;position:relative;background-color:transparent;font-family:var(--ion-font-family);font-size:0.875rem;font-weight:500;letter-spacing:0.84px;text-transform:uppercase;overflow:hidden}.toast-button-cancel{color:var(--ion-color-step-100, #e6e6e6)}.toast-button-icon-only{border-radius:50%;-webkit-padding-start:9px;padding-inline-start:9px;-webkit-padding-end:9px;padding-inline-end:9px;padding-top:9px;padding-bottom:9px;width:36px;height:36px}@media (any-hover: hover){.toast-button:hover{background-color:rgba(var(--ion-color-primary-rgb, 56, 128, 255), 0.08)}.toast-button-cancel:hover{background-color:rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.08)}}";
460
196
 
461
197
  const Toast = class {
462
198
  constructor(hostRef) {
463
- index$3.registerInstance(this, hostRef);
464
- this.didPresent = index$3.createEvent(this, "ionToastDidPresent", 7);
465
- this.willPresent = index$3.createEvent(this, "ionToastWillPresent", 7);
466
- this.willDismiss = index$3.createEvent(this, "ionToastWillDismiss", 7);
467
- this.didDismiss = index$3.createEvent(this, "ionToastDidDismiss", 7);
468
- this.didPresentShorthand = index$3.createEvent(this, "didPresent", 7);
469
- this.willPresentShorthand = index$3.createEvent(this, "willPresent", 7);
470
- this.willDismissShorthand = index$3.createEvent(this, "willDismiss", 7);
471
- this.didDismissShorthand = index$3.createEvent(this, "didDismiss", 7);
199
+ index$2.registerInstance(this, hostRef);
200
+ this.didPresent = index$2.createEvent(this, "ionToastDidPresent", 7);
201
+ this.willPresent = index$2.createEvent(this, "ionToastWillPresent", 7);
202
+ this.willDismiss = index$2.createEvent(this, "ionToastWillDismiss", 7);
203
+ this.didDismiss = index$2.createEvent(this, "ionToastDidDismiss", 7);
204
+ this.didPresentShorthand = index$2.createEvent(this, "didPresent", 7);
205
+ this.willPresentShorthand = index$2.createEvent(this, "willPresent", 7);
206
+ this.willDismissShorthand = index$2.createEvent(this, "willDismiss", 7);
207
+ this.didDismissShorthand = index$2.createEvent(this, "didDismiss", 7);
472
208
  this.delegateController = overlays.createDelegateController(this);
473
209
  this.lockController = lockController.createLockController();
474
210
  this.triggerController = overlays.createTriggerController();
@@ -481,41 +217,6 @@ const Toast = class {
481
217
  this.callButtonHandler(cancelButton);
482
218
  }
483
219
  };
484
- /**
485
- * Create a new swipe gesture so Toast
486
- * can be swiped to dismiss.
487
- */
488
- this.createSwipeGesture = (toastPosition) => {
489
- const gesture = (this.gesture = createSwipeToDismissGesture(this.el, toastPosition, () => {
490
- /**
491
- * If the gesture completed then
492
- * we should dismiss the toast.
493
- */
494
- this.dismiss(undefined, overlays.GESTURE);
495
- }));
496
- gesture.enable(true);
497
- };
498
- /**
499
- * Destroy an existing swipe gesture
500
- * so Toast can no longer be swiped to dismiss.
501
- */
502
- this.destroySwipeGesture = () => {
503
- const { gesture } = this;
504
- if (gesture === undefined) {
505
- return;
506
- }
507
- gesture.destroy();
508
- this.gesture = undefined;
509
- };
510
- /**
511
- * Returns `true` if swipeGesture
512
- * is configured to a value that enables the swipe behavior.
513
- * Returns `false` otherwise.
514
- */
515
- this.prefersSwipeGesture = () => {
516
- const { swipeGesture } = this;
517
- return swipeGesture === 'vertical';
518
- };
519
220
  this.revealContentToScreenReader = false;
520
221
  this.overlayIndex = undefined;
521
222
  this.delegate = undefined;
@@ -536,37 +237,9 @@ const Toast = class {
536
237
  this.animated = true;
537
238
  this.icon = undefined;
538
239
  this.htmlAttributes = undefined;
539
- this.swipeGesture = undefined;
540
240
  this.isOpen = false;
541
241
  this.trigger = undefined;
542
242
  }
543
- swipeGestureChanged() {
544
- /**
545
- * If the Toast is presented, then we need to destroy
546
- * any actives gestures before a new gesture is potentially
547
- * created below.
548
- *
549
- * If the Toast is dismissed, then no gesture should be available
550
- * since the Toast is not visible. This case should never
551
- * happen since the "dismiss" method handles destroying
552
- * any active swipe gestures, but we keep this code
553
- * around to handle the first case.
554
- */
555
- this.destroySwipeGesture();
556
- /**
557
- * A new swipe gesture should only be created
558
- * if the Toast is presented. If the Toast is not
559
- * yet presented then the "present" method will
560
- * handle calling the swipe gesture setup function.
561
- */
562
- if (this.presented && this.prefersSwipeGesture()) {
563
- /**
564
- * If the Toast is presented then
565
- * lastPresentedPosition is defined.
566
- */
567
- this.createSwipeGesture(this.lastPresentedPosition);
568
- }
569
- }
570
243
  onIsOpenChange(newValue, oldValue) {
571
244
  if (newValue === true && oldValue === false) {
572
245
  this.present();
@@ -638,14 +311,6 @@ const Toast = class {
638
311
  if (this.duration > 0) {
639
312
  this.durationTimeout = setTimeout(() => this.dismiss(undefined, 'timeout'), this.duration);
640
313
  }
641
- /**
642
- * If the Toast has a swipe gesture then we can
643
- * create the gesture so users can swipe the
644
- * presented Toast.
645
- */
646
- if (this.prefersSwipeGesture()) {
647
- this.createSwipeGesture(animationPosition);
648
- }
649
314
  unlock();
650
315
  }
651
316
  /**
@@ -680,11 +345,6 @@ const Toast = class {
680
345
  this.revealContentToScreenReader = false;
681
346
  }
682
347
  this.lastPresentedPosition = undefined;
683
- /**
684
- * If the Toast has a swipe gesture then we can
685
- * safely destroy it now that it is dismissed.
686
- */
687
- this.destroySwipeGesture();
688
348
  unlock();
689
349
  return dismissed;
690
350
  }
@@ -783,7 +443,7 @@ const Toast = class {
783
443
  'toast-button-group': true,
784
444
  [`toast-button-group-${side}`]: true,
785
445
  };
786
- return (index$3.h("div", { class: buttonGroupsClasses }, buttons.map((b) => (index$3.h("button", Object.assign({}, b.htmlAttributes, { type: "button", class: buttonClass(b), tabIndex: 0, onClick: () => this.buttonClick(b), part: buttonPart(b) }), index$3.h("div", { class: "toast-button-inner" }, b.icon && (index$3.h("ion-icon", { "aria-hidden": "true", icon: b.icon, slot: b.text === undefined ? 'icon-only' : undefined, class: "toast-button-icon" })), b.text), mode === 'md' && (index$3.h("ion-ripple-effect", { type: b.icon !== undefined && b.text === undefined ? 'unbounded' : 'bounded' })))))));
446
+ return (index$2.h("div", { class: buttonGroupsClasses }, buttons.map((b) => (index$2.h("button", Object.assign({}, b.htmlAttributes, { type: "button", class: buttonClass(b), tabIndex: 0, onClick: () => this.buttonClick(b), part: buttonPart(b) }), index$2.h("div", { class: "toast-button-inner" }, b.icon && (index$2.h("ion-icon", { "aria-hidden": "true", icon: b.icon, slot: b.text === undefined ? 'icon-only' : undefined, class: "toast-button-icon" })), b.text), mode === 'md' && (index$2.h("ion-ripple-effect", { type: b.icon !== undefined && b.text === undefined ? 'unbounded' : 'bounded' })))))));
787
447
  }
788
448
  /**
789
449
  * Render the `message` property.
@@ -793,9 +453,9 @@ const Toast = class {
793
453
  renderToastMessage(key, ariaHidden = null) {
794
454
  const { customHTMLEnabled, message } = this;
795
455
  if (customHTMLEnabled) {
796
- return (index$3.h("div", { key: key, "aria-hidden": ariaHidden, class: "toast-message", part: "message", innerHTML: config.sanitizeDOMString(message) }));
456
+ return (index$2.h("div", { key: key, "aria-hidden": ariaHidden, class: "toast-message", part: "message", innerHTML: config.sanitizeDOMString(message) }));
797
457
  }
798
- return (index$3.h("div", { key: key, "aria-hidden": ariaHidden, class: "toast-message", part: "message" }, message));
458
+ return (index$2.h("div", { key: key, "aria-hidden": ariaHidden, class: "toast-message", part: "message" }, message));
799
459
  }
800
460
  /**
801
461
  * Render the `header` property.
@@ -803,7 +463,7 @@ const Toast = class {
803
463
  * @param ariaHidden - If "true" then content will be hidden from screen readers.
804
464
  */
805
465
  renderHeader(key, ariaHidden = null) {
806
- return (index$3.h("div", { key: key, class: "toast-header", "aria-hidden": ariaHidden, part: "header" }, this.header));
466
+ return (index$2.h("div", { key: key, class: "toast-header", "aria-hidden": ariaHidden, part: "header" }, this.header));
807
467
  }
808
468
  render() {
809
469
  const { layout, el, revealContentToScreenReader, header, message } = this;
@@ -823,13 +483,12 @@ const Toast = class {
823
483
  if (layout === 'stacked' && startButtons.length > 0 && endButtons.length > 0) {
824
484
  index$1.printIonWarning('This toast is using start and end buttons with the stacked toast layout. We recommend following the best practice of using either start or end buttons with the stacked toast layout.', el);
825
485
  }
826
- return (index$3.h(index$3.Host, Object.assign({ tabindex: "-1" }, this.htmlAttributes, { style: {
486
+ return (index$2.h(index$2.Host, Object.assign({ tabindex: "-1" }, this.htmlAttributes, { style: {
827
487
  zIndex: `${60000 + this.overlayIndex}`,
828
- }, class: theme.createColorClasses(this.color, Object.assign(Object.assign({ [mode]: true }, theme.getClassMap(this.cssClass)), { 'overlay-hidden': true, 'toast-translucent': this.translucent })), onIonToastWillDismiss: this.dispatchCancelHandler }), index$3.h("div", { class: wrapperClass }, index$3.h("div", { class: "toast-container", part: "container" }, this.renderButtons(startButtons, 'start'), this.icon !== undefined && (index$3.h("ion-icon", { class: "toast-icon", part: "icon", icon: this.icon, lazy: false, "aria-hidden": "true" })), index$3.h("div", { class: "toast-content", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !revealContentToScreenReader && header !== undefined && this.renderHeader('oldHeader', 'true'), !revealContentToScreenReader && message !== undefined && this.renderToastMessage('oldMessage', 'true'), revealContentToScreenReader && header !== undefined && this.renderHeader('header'), revealContentToScreenReader && message !== undefined && this.renderToastMessage('header')), this.renderButtons(endButtons, 'end')))));
488
+ }, class: theme.createColorClasses(this.color, Object.assign(Object.assign({ [mode]: true }, theme.getClassMap(this.cssClass)), { 'overlay-hidden': true, 'toast-translucent': this.translucent })), onIonToastWillDismiss: this.dispatchCancelHandler }), index$2.h("div", { class: wrapperClass }, index$2.h("div", { class: "toast-container", part: "container" }, this.renderButtons(startButtons, 'start'), this.icon !== undefined && (index$2.h("ion-icon", { class: "toast-icon", part: "icon", icon: this.icon, lazy: false, "aria-hidden": "true" })), index$2.h("div", { class: "toast-content", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !revealContentToScreenReader && header !== undefined && this.renderHeader('oldHeader', 'true'), !revealContentToScreenReader && message !== undefined && this.renderToastMessage('oldMessage', 'true'), revealContentToScreenReader && header !== undefined && this.renderHeader('header'), revealContentToScreenReader && message !== undefined && this.renderToastMessage('header')), this.renderButtons(endButtons, 'end')))));
829
489
  }
830
- get el() { return index$3.getElement(this); }
490
+ get el() { return index$2.getElement(this); }
831
491
  static get watchers() { return {
832
- "swipeGesture": ["swipeGestureChanged"],
833
492
  "isOpen": ["onIsOpenChange"],
834
493
  "trigger": ["triggerChanged"]
835
494
  }; }