@rdlabo/ionic-theme-ios27 1.2.0-beta.pr231.sha22a35d481cf3 → 1.2.0-beta.pr237.sha90661d2c01a8

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 (166) hide show
  1. package/README.md +21 -0
  2. package/dist/_virtual/_rolldown/runtime.js +13 -0
  3. package/dist/css/ionic-theme-ios27.css +1 -1
  4. package/dist/css/vertical-bars.css +1 -1
  5. package/dist/focus-controller/index.d.ts +4 -2
  6. package/dist/focus-controller/index.d.ts.map +1 -1
  7. package/dist/focus-controller/index.js +100 -57
  8. package/dist/focus-controller/index.js.map +1 -0
  9. package/dist/index.d.ts +10 -8
  10. package/dist/index.d.ts.map +1 -1
  11. package/dist/index.js +54 -60
  12. package/dist/index.js.map +1 -0
  13. package/dist/native/components/index.d.ts +13 -10
  14. package/dist/native/components/index.d.ts.map +1 -1
  15. package/dist/native/components/index.js +39 -41
  16. package/dist/native/components/index.js.map +1 -0
  17. package/dist/native/components/ion-back-button.d.ts +6 -1
  18. package/dist/native/components/ion-back-button.d.ts.map +1 -1
  19. package/dist/native/components/ion-back-button.js +19 -13
  20. package/dist/native/components/ion-back-button.js.map +1 -0
  21. package/dist/native/components/ion-button.d.ts +8 -2
  22. package/dist/native/components/ion-button.d.ts.map +1 -1
  23. package/dist/native/components/ion-button.js +22 -17
  24. package/dist/native/components/ion-button.js.map +1 -0
  25. package/dist/native/components/ion-buttons.d.ts +8 -2
  26. package/dist/native/components/ion-buttons.d.ts.map +1 -1
  27. package/dist/native/components/ion-buttons.js +29 -33
  28. package/dist/native/components/ion-buttons.js.map +1 -0
  29. package/dist/native/components/ion-fab.d.ts +6 -1
  30. package/dist/native/components/ion-fab.d.ts.map +1 -1
  31. package/dist/native/components/ion-fab.js +131 -151
  32. package/dist/native/components/ion-fab.js.map +1 -0
  33. package/dist/native/components/ion-menu-button.d.ts +6 -1
  34. package/dist/native/components/ion-menu-button.d.ts.map +1 -1
  35. package/dist/native/components/ion-menu-button.js +29 -19
  36. package/dist/native/components/ion-menu-button.js.map +1 -0
  37. package/dist/native/components/ion-segment.d.ts +6 -1
  38. package/dist/native/components/ion-segment.d.ts.map +1 -1
  39. package/dist/native/components/ion-segment.js +29 -23
  40. package/dist/native/components/ion-segment.js.map +1 -0
  41. package/dist/native/components/ion-tab-bar.d.ts +6 -1
  42. package/dist/native/components/ion-tab-bar.d.ts.map +1 -1
  43. package/dist/native/components/ion-tab-bar.js +49 -40
  44. package/dist/native/components/ion-tab-bar.js.map +1 -0
  45. package/dist/native/components/searchable-tabs.d.ts +17 -15
  46. package/dist/native/components/searchable-tabs.d.ts.map +1 -1
  47. package/dist/native/components/searchable-tabs.js +382 -435
  48. package/dist/native/components/searchable-tabs.js.map +1 -0
  49. package/dist/native/definitions.d.ts +116 -122
  50. package/dist/native/definitions.d.ts.map +1 -1
  51. package/dist/native/definitions.js +0 -6
  52. package/dist/native/index.d.ts +6 -4
  53. package/dist/native/index.d.ts.map +1 -1
  54. package/dist/native/index.js +229 -176
  55. package/dist/native/index.js.map +1 -0
  56. package/dist/native/prehide.d.ts +4 -2
  57. package/dist/native/prehide.d.ts.map +1 -1
  58. package/dist/native/prehide.js +218 -242
  59. package/dist/native/prehide.js.map +1 -0
  60. package/dist/native/runtime.d.ts +3 -1
  61. package/dist/native/runtime.d.ts.map +1 -1
  62. package/dist/native/runtime.js +626 -722
  63. package/dist/native/runtime.js.map +1 -0
  64. package/dist/native/shared/candidate.d.ts +15 -11
  65. package/dist/native/shared/candidate.d.ts.map +1 -1
  66. package/dist/native/shared/candidate.js +88 -95
  67. package/dist/native/shared/candidate.js.map +1 -0
  68. package/dist/native/shared/crossfade.d.ts +6 -4
  69. package/dist/native/shared/crossfade.d.ts.map +1 -1
  70. package/dist/native/shared/crossfade.js +49 -45
  71. package/dist/native/shared/crossfade.js.map +1 -0
  72. package/dist/native/shared/dom.d.ts +6 -4
  73. package/dist/native/shared/dom.d.ts.map +1 -1
  74. package/dist/native/shared/dom.js +163 -211
  75. package/dist/native/shared/dom.js.map +1 -0
  76. package/dist/native/shared/events.d.ts +8 -6
  77. package/dist/native/shared/events.d.ts.map +1 -1
  78. package/dist/native/shared/events.js +12 -7
  79. package/dist/native/shared/events.js.map +1 -0
  80. package/dist/native/shared/icons.d.ts +4 -2
  81. package/dist/native/shared/icons.d.ts.map +1 -1
  82. package/dist/native/shared/icons.js +59 -53
  83. package/dist/native/shared/icons.js.map +1 -0
  84. package/dist/native/shared/modal.d.ts +3 -1
  85. package/dist/native/shared/modal.d.ts.map +1 -1
  86. package/dist/native/shared/modal.js +156 -139
  87. package/dist/native/shared/modal.js.map +1 -0
  88. package/dist/native/vertical-bars-web.d.ts +3 -1
  89. package/dist/native/vertical-bars-web.d.ts.map +1 -1
  90. package/dist/native/vertical-bars-web.js +332 -344
  91. package/dist/native/vertical-bars-web.js.map +1 -0
  92. package/dist/native-integration/index.d.ts +10 -8
  93. package/dist/native-integration/index.d.ts.map +1 -1
  94. package/dist/native-integration/index.js +102 -100
  95. package/dist/native-integration/index.js.map +1 -0
  96. package/dist/native-integration/transition.d.ts +3 -1
  97. package/dist/native-integration/transition.d.ts.map +1 -1
  98. package/dist/native-integration/transition.js +15 -6
  99. package/dist/native-integration/transition.js.map +1 -0
  100. package/dist/searchbar/index.d.ts +4 -2
  101. package/dist/searchbar/index.d.ts.map +1 -1
  102. package/dist/searchbar/index.js +64 -56
  103. package/dist/searchbar/index.js.map +1 -0
  104. package/dist/segment/index.d.ts +3 -1
  105. package/dist/segment/index.d.ts.map +1 -1
  106. package/dist/segment/index.js +465 -324
  107. package/dist/segment/index.js.map +1 -0
  108. package/dist/sheets-of-glass/animations.d.ts +13 -12
  109. package/dist/sheets-of-glass/animations.d.ts.map +1 -1
  110. package/dist/sheets-of-glass/animations.js +496 -306
  111. package/dist/sheets-of-glass/animations.js.map +1 -0
  112. package/dist/sheets-of-glass/index.d.ts +3 -1
  113. package/dist/sheets-of-glass/index.d.ts.map +1 -1
  114. package/dist/sheets-of-glass/index.js +294 -357
  115. package/dist/sheets-of-glass/index.js.map +1 -0
  116. package/dist/sheets-of-glass/interfaces.d.ts +11 -9
  117. package/dist/sheets-of-glass/interfaces.d.ts.map +1 -1
  118. package/dist/sheets-of-glass/interfaces.js +0 -1
  119. package/dist/tab-bar-searchable/animations/enter.d.ts +4 -2
  120. package/dist/tab-bar-searchable/animations/enter.d.ts.map +1 -1
  121. package/dist/tab-bar-searchable/animations/enter.js +50 -69
  122. package/dist/tab-bar-searchable/animations/enter.js.map +1 -0
  123. package/dist/tab-bar-searchable/animations/leave.d.ts +4 -2
  124. package/dist/tab-bar-searchable/animations/leave.d.ts.map +1 -1
  125. package/dist/tab-bar-searchable/animations/leave.js +48 -62
  126. package/dist/tab-bar-searchable/animations/leave.js.map +1 -0
  127. package/dist/tab-bar-searchable/index.d.ts +5 -3
  128. package/dist/tab-bar-searchable/index.d.ts.map +1 -1
  129. package/dist/tab-bar-searchable/index.js +125 -109
  130. package/dist/tab-bar-searchable/index.js.map +1 -0
  131. package/dist/transition/index.d.ts +9 -8
  132. package/dist/transition/index.d.ts.map +1 -1
  133. package/dist/transition/index.js +203 -192
  134. package/dist/transition/index.js.map +1 -0
  135. package/dist/transition/ios.transition.d.ts +7 -5
  136. package/dist/transition/ios.transition.d.ts.map +1 -1
  137. package/dist/transition/ios.transition.js +15 -11
  138. package/dist/transition/ios.transition.js.map +1 -0
  139. package/dist/utils.d.ts +10 -8
  140. package/dist/utils.d.ts.map +1 -1
  141. package/dist/utils.js +58 -66
  142. package/dist/utils.js.map +1 -0
  143. package/dist/vertical-bars.d.ts +4 -5
  144. package/dist/vertical-bars.js +3 -3
  145. package/docs/iphone-duo-with-original-theme.md +24 -8
  146. package/docs/iphone-duo.md +59 -44
  147. package/docs/native-ui-shell.md +5 -3
  148. package/ios/Sources/IonicNativeUIShellPlugin/Components/ShellSearchController.swift +1 -1
  149. package/ios/Sources/IonicNativeUIShellPlugin/Components/ShellVerticalBars.swift +27 -2
  150. package/ios/Sources/IonicNativeUIShellPlugin/Components/ShellVerticalSearch.swift +118 -0
  151. package/ios/Sources/IonicNativeUIShellPlugin/IonicNativeUIShellPlugin.swift +27 -179
  152. package/ios/Tests/IonicNativeUIShellPluginTests/ShellSnapshotTests.swift +37 -0
  153. package/package.json +8 -5
  154. package/src/native/components/index.ts +3 -2
  155. package/src/native/components/ion-button.ts +3 -2
  156. package/src/native/components/ion-buttons.ts +3 -2
  157. package/src/native/components/searchable-tabs.ts +8 -11
  158. package/src/native/definitions.ts +16 -20
  159. package/src/native/index.ts +75 -32
  160. package/src/native/runtime.ts +18 -12
  161. package/src/native/shared/candidate.ts +13 -6
  162. package/src/native/vertical-bars-web.ts +2 -0
  163. package/src/styles/vertical-bars.scss +8 -0
  164. package/src/tab-bar-searchable/index.ts +40 -9
  165. package/src/vertical-bars.ts +7 -2
  166. package/dist/vertical-bars.d.ts.map +0 -1
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","names":[],"sources":["../../src/sheets-of-glass/index.ts"],"sourcesContent":["import { AnimationPosition, EffectScales, registeredEffect } from './interfaces';\nimport { createAnimation, createGesture } from '@ionic/core';\nimport type { Animation, Gesture, GestureDetail } from '@ionic/core';\nimport { changeSelectedElement, cloneElement, getStep } from '../utils';\nimport { isNativeUIShell } from '../native-integration';\nimport {\n animationRect,\n createMoveAnimation,\n createPreMoveAnimation,\n createTabBarDragAnimation,\n createTabBarPressAnimation,\n createTabBarReleaseAnimation,\n getMoveAnimationKeyframe,\n getScaleAnimation,\n} from './animations';\n\nconst GESTURE_NAME = 'ios27-enable-gesture';\nconst ANIMATED_NAME = 'ios27-animated';\n\nexport const registerEffect = (\n targetElement: HTMLElement,\n effectTagName: string,\n selectedClassName: string,\n scales: EffectScales,\n vertical = false,\n): registeredEffect | undefined => {\n if (!targetElement.classList.contains('ios')) {\n return undefined;\n }\n\n let gesture!: Gesture;\n let moveAnimation: Animation | undefined;\n let currentTouchedElement: HTMLElement | undefined;\n let selectedElementBeforeGesture: HTMLElement | undefined;\n let clearActivatedTimer: ReturnType<typeof setTimeout> | undefined;\n let animationPosition: AnimationPosition | undefined = undefined;\n let scaleAnimationPromise: Promise<void> | undefined;\n let startAnimationPromise: Promise<void> | undefined;\n let maxVelocity = 0;\n let releaseAnimation: Animation | undefined;\n let tabPressAnimation: Animation | undefined;\n let tabPressStartedAt = 0;\n let tabDragging = false;\n let destroyed = false;\n const originalTabBarScale = targetElement.style.getPropertyValue('--ios27-tab-bar-scale');\n const effectElement = cloneElement(effectTagName, false);\n if (vertical) effectElement.classList.add('ios27-vertical-tab-effect');\n const stopTabPress = () => {\n if (!tabPressAnimation) return;\n const native = effectElement.shadowRoot!.querySelector<HTMLElement>('[part=\"native\"]')!;\n const transform = getComputedStyle(effectElement).transform;\n const scale = getComputedStyle(native).transform;\n tabPressAnimation.destroy();\n tabPressAnimation = undefined;\n effectElement.style.transform = transform;\n native.style.transform = scale;\n };\n let onPointerUp: (() => void) | undefined;\n let onPointerCancel: (() => void) | undefined;\n\n const removePointerEndListeners = () => {\n if (onPointerUp) {\n document.removeEventListener('pointerup', onPointerUp);\n onPointerUp = undefined;\n }\n if (onPointerCancel) {\n document.removeEventListener('pointercancel', onPointerCancel);\n onPointerCancel = undefined;\n }\n };\n\n const cancelActiveGesture = () => {\n stopTabPress();\n releaseAnimation?.destroy();\n releaseAnimation = undefined;\n removePointerEndListeners();\n if (clearActivatedTimer !== undefined) {\n clearTimeout(clearActivatedTimer);\n clearActivatedTimer = undefined;\n }\n currentTouchedElement?.classList.remove('ion-activated');\n // Preserve a committed selection, or restore the original if the press was cancelled.\n if (!currentTouchedElement?.classList.contains(selectedClassName)) {\n selectedElementBeforeGesture?.classList.add(selectedClassName);\n }\n currentTouchedElement = undefined;\n selectedElementBeforeGesture = undefined;\n moveAnimation?.destroy();\n moveAnimation = undefined;\n effectElement.style.display = 'none';\n maxVelocity = 0;\n targetElement.classList.remove(ANIMATED_NAME);\n };\n\n /**\n * These event listeners fix a bug where gestures don't complete properly.\n * They terminate the gesture using native events as a fallback.\n */\n const onPointerDown = (event: PointerEvent) => {\n if (isNativeUIShell(targetElement)) return;\n stopTabPress();\n tabDragging = false;\n releaseAnimation?.destroy();\n releaseAnimation = undefined;\n clearActivated();\n gesture.destroy();\n createAnimationGesture();\n removePointerEndListeners();\n onPointerUp = () => {\n clearActivatedTimer = setTimeout(async () => {\n await onEndGesture();\n if (destroyed) return;\n gesture.destroy();\n createAnimationGesture();\n });\n removePointerEndListeners();\n };\n onPointerCancel = () => {\n cancelActiveGesture();\n gesture.destroy();\n createAnimationGesture();\n };\n document.addEventListener('pointerup', onPointerUp);\n document.addEventListener('pointercancel', onPointerCancel);\n };\n targetElement.addEventListener('pointerdown', onPointerDown);\n const onClick = (event: MouseEvent) => {\n // A drag commits its destination itself; the browser may click the old pressed tab.\n if (vertical && tabDragging && event.isTrusted && event.detail > 0) {\n event.preventDefault();\n event.stopImmediatePropagation();\n }\n };\n targetElement.addEventListener('click', onClick, true);\n\n const axisDetail = (detail: GestureDetail): GestureDetail =>\n vertical\n ? {\n ...detail,\n currentX: detail.currentY,\n currentY: detail.currentX,\n startX: detail.startY,\n startY: detail.startX,\n velocityX: detail.velocityY,\n velocityY: detail.velocityX,\n }\n : detail;\n const createAnimationGesture = () => {\n targetElement.classList.add(GESTURE_NAME);\n gesture = createGesture({\n el: targetElement,\n threshold: 0,\n direction: vertical ? 'y' : 'x',\n gestureName: `${GESTURE_NAME}_${effectTagName}_${crypto.randomUUID()}`,\n onStart: (event) => onStartGesture(axisDetail(event)),\n onMove: (event) => onMoveGesture(axisDetail(event)),\n onEnd: (detail) => {\n // Ionic coalesces moves; consume the release coordinate before committing a drag.\n if (effectTagName === 'ion-tab-button' && tabDragging) onMoveGesture(axisDetail(detail));\n onEndGesture().then();\n },\n });\n gesture.enable(true);\n };\n createAnimationGesture();\n\n const clearActivated = (isEndGesture: boolean = false) => {\n if (!currentTouchedElement) {\n return;\n }\n if (!isEndGesture && !currentTouchedElement.classList.contains(selectedClassName)) {\n currentTouchedElement!.click();\n currentTouchedElement.classList.add(selectedClassName);\n }\n currentTouchedElement.classList.remove('ion-activated');\n currentTouchedElement = undefined;\n selectedElementBeforeGesture = undefined;\n effectElement.style.display = 'none';\n maxVelocity = 0;\n targetElement.classList.remove(ANIMATED_NAME);\n };\n\n const onStartGesture = (detail: GestureDetail): boolean | undefined => {\n if (isNativeUIShell(targetElement)) return false;\n currentTouchedElement = ((detail.event.target as HTMLElement).closest(effectTagName) as HTMLElement) || undefined;\n const tabSelectedElement = targetElement.querySelector(`${effectTagName}.${selectedClassName}`);\n if (\n currentTouchedElement === undefined ||\n currentTouchedElement.parentElement !== targetElement ||\n (currentTouchedElement as HTMLIonTabButtonElement).disabled ||\n tabSelectedElement === null\n ) {\n currentTouchedElement = undefined;\n return false;\n }\n selectedElementBeforeGesture = tabSelectedElement as HTMLElement;\n if (effectTagName === 'ion-tab-button') {\n // UIKit expands the platter by 14.14pt at both two- and four-tab widths.\n targetElement.style.setProperty(\n '--ios27-tab-bar-scale',\n String(1 + 14.14 / (vertical ? targetElement.offsetHeight : targetElement.offsetWidth)),\n );\n }\n if (vertical) targetElement.classList.add(ANIMATED_NAME);\n animationPosition = {\n minPositionX: animationRect(targetElement, vertical).left,\n maxPositionX:\n animationRect(targetElement, vertical).right - (vertical ? tabSelectedElement.clientHeight : tabSelectedElement.clientWidth),\n width: vertical ? tabSelectedElement.clientHeight : tabSelectedElement.clientWidth,\n positionY: animationRect(tabSelectedElement, vertical).top,\n };\n targetElement.classList.add(ANIMATED_NAME);\n changeSelectedElement(targetElement, currentTouchedElement, effectTagName, selectedClassName);\n\n if (effectTagName === 'ion-tab-button') {\n moveAnimation = createMoveAnimation(effectElement, detail, tabSelectedElement, animationPosition, vertical);\n moveAnimation.progressStart(\n true,\n getStep(\n animationRect(tabSelectedElement, vertical).left + animationRect(tabSelectedElement, vertical).width / 2,\n animationPosition,\n ),\n );\n tabPressAnimation = createTabBarPressAnimation(\n effectElement,\n tabSelectedElement as HTMLElement,\n currentTouchedElement,\n targetElement,\n vertical,\n );\n tabPressStartedAt = performance.now();\n void tabPressAnimation.play();\n return true;\n }\n\n const startAnimation = (() => {\n if (tabSelectedElement === currentTouchedElement) {\n return new Promise<void>((resolve) => resolve());\n } else {\n const preMoveAnimation = createPreMoveAnimation(effectElement, tabSelectedElement, currentTouchedElement, animationPosition!);\n return preMoveAnimation.play().finally(() => preMoveAnimation.destroy());\n }\n })();\n startAnimationPromise = startAnimation;\n startAnimation.then(() => {\n if (!currentTouchedElement) {\n return;\n }\n moveAnimation = createMoveAnimation(effectElement, detail, tabSelectedElement, animationPosition!);\n moveAnimation.progressStart(\n true,\n getStep(currentTouchedElement.getBoundingClientRect().left + currentTouchedElement.clientWidth / 2, animationPosition!),\n );\n });\n getScaleAnimation(effectElement).duration(200).to('opacity', 1).to('transform', scales.large).play();\n return true;\n };\n\n const onMoveGesture = (detail: GestureDetail): boolean | undefined => {\n if (currentTouchedElement === undefined || !moveAnimation || releaseAnimation) {\n return false; // Skip Animation\n }\n if (effectTagName === 'ion-tab-button') {\n if (Math.abs(detail.currentX - detail.startX) < 3 && !tabDragging) return;\n tabDragging = true;\n stopTabPress();\n tabPressAnimation = createTabBarDragAnimation(effectElement, targetElement, detail.velocityX, vertical);\n void tabPressAnimation.play();\n } else if (scaleAnimationPromise === undefined) {\n if (Math.abs(detail.velocityX) > maxVelocity) {\n maxVelocity = Math.abs(detail.velocityX);\n }\n if (Math.abs(detail.velocityX) > 0.2) {\n scaleAnimationPromise = getScaleAnimation(effectElement)\n .duration(720)\n .keyframes(getMoveAnimationKeyframe('slowly', scales))\n .play()\n .finally(() => (scaleAnimationPromise = undefined));\n }\n if (maxVelocity > 0.2 && Math.abs(detail.velocityX) < 0.15 && Math.abs(detail.startX - detail.currentX) > 100) {\n scaleAnimationPromise = getScaleAnimation(effectElement)\n .duration(720)\n .keyframes(getMoveAnimationKeyframe(detail.velocityX > 0 ? 'moveRight' : 'moveLeft', scales))\n .play()\n .finally(() => (scaleAnimationPromise = undefined));\n maxVelocity = 0;\n }\n }\n\n const currentX = detail.currentX;\n const previousY = animationRect(targetElement, vertical).top + animationRect(targetElement, vertical).height / 2;\n const nextEl = (targetElement.getRootNode() as Document | ShadowRoot).elementFromPoint(\n vertical ? previousY : currentX,\n vertical ? currentX : previousY,\n );\n let latestTouchedElement: HTMLElement | undefined = (nextEl?.closest(effectTagName) as HTMLElement) || undefined;\n if (vertical && effectTagName === 'ion-tab-button') {\n // Overlapping, scaled tabs must not steal a drag from their neighbor.\n const bar = targetElement.getBoundingClientRect();\n const tabs = Array.from(targetElement.querySelectorAll<HTMLElement>(effectTagName)).filter((tab) => tab.offsetWidth > 0);\n const distance = (tab: HTMLElement) => Math.abs(currentX - (bar.top + tab.offsetTop + tab.offsetHeight / 2));\n latestTouchedElement =\n currentX >= bar.top && currentX <= bar.bottom\n ? tabs.reduce<HTMLElement | undefined>(\n (closest, tab) => (!closest || distance(tab) < distance(closest) ? tab : closest),\n undefined,\n )\n : undefined;\n }\n\n if (\n latestTouchedElement &&\n latestTouchedElement.parentElement === targetElement &&\n !(latestTouchedElement as HTMLIonTabButtonElement).disabled &&\n currentTouchedElement !== latestTouchedElement\n ) {\n currentTouchedElement = latestTouchedElement;\n changeSelectedElement(targetElement, currentTouchedElement, effectTagName, selectedClassName);\n }\n moveAnimation.progressStep(getStep(detail.currentX, animationPosition!));\n return true;\n };\n\n const onEndGesture = async (): Promise<boolean | undefined> => {\n if (releaseAnimation) return;\n // タイマーをクリア(正常にonEndGestureが実行された場合)\n if (clearActivatedTimer !== undefined) {\n clearTimeout(clearActivatedTimer);\n clearActivatedTimer = undefined;\n }\n\n if (currentTouchedElement && !currentTouchedElement.classList.contains(selectedClassName)) {\n currentTouchedElement.click();\n currentTouchedElement.classList.add(selectedClassName);\n }\n\n if (startAnimationPromise) {\n await startAnimationPromise;\n }\n\n const tapElapsed =\n tabPressAnimation && !tabDragging && selectedElementBeforeGesture !== currentTouchedElement\n ? performance.now() - tabPressStartedAt\n : undefined;\n if (tabPressAnimation && !tabDragging && tapElapsed === undefined) {\n // A quick tap still completes the initial stretch before relaxing.\n const pressing = tabPressAnimation;\n const remaining = 200 - (performance.now() - tabPressStartedAt);\n if (remaining > 0) await new Promise<void>((resolve) => setTimeout(resolve, remaining));\n if (tabPressAnimation !== pressing) return;\n }\n\n if (currentTouchedElement === undefined || !moveAnimation || releaseAnimation) {\n return false;\n }\n\n if (effectTagName !== 'ion-tab-button')\n setTimeout(() => {\n if (!currentTouchedElement) {\n return;\n }\n const targetX = currentTouchedElement.getBoundingClientRect().left + currentTouchedElement.clientWidth / 2;\n const step = getStep(targetX, animationPosition!);\n moveAnimation!.progressStep(step);\n });\n if (effectTagName === 'ion-tab-button') {\n stopTabPress();\n moveAnimation.destroy();\n moveAnimation = undefined;\n const tabs = Array.from(targetElement.querySelectorAll<HTMLElement>(effectTagName)).filter((tab) => tab.offsetWidth > 0);\n if (vertical) {\n currentTouchedElement.classList.remove('ion-activated');\n targetElement.classList.remove(ANIMATED_NAME);\n }\n const releasing = createTabBarReleaseAnimation(\n effectElement,\n currentTouchedElement,\n tapElapsed !== undefined && tapElapsed < 200\n ? {\n elapsed: tapElapsed,\n distance: Math.abs(tabs.indexOf(currentTouchedElement) - tabs.indexOf(selectedElementBeforeGesture!)),\n }\n : undefined,\n vertical,\n );\n currentTouchedElement.classList.remove('ion-activated');\n releaseAnimation = releasing;\n await releasing.play();\n if (releaseAnimation !== releasing) return;\n clearActivated(true);\n releasing.destroy();\n releaseAnimation = undefined;\n } else {\n await getScaleAnimation(effectElement).duration(120).to('transform', `scale(1, 0.92)`).play();\n }\n moveAnimation?.destroy();\n\n clearActivated(true);\n return true;\n };\n\n const nativeChanged = () => {\n gesture.enable(!isNativeUIShell(targetElement));\n cancelActiveGesture();\n };\n targetElement.addEventListener('nativeUIShellChange', nativeChanged);\n if (isNativeUIShell(targetElement)) nativeChanged();\n\n return {\n destroy: () => {\n destroyed = true;\n cancelActiveGesture();\n // Remove event listeners\n targetElement.removeEventListener('pointerdown', onPointerDown);\n targetElement.removeEventListener('click', onClick, true);\n targetElement.removeEventListener('nativeUIShellChange', nativeChanged);\n\n // Destroy gesture\n if (gesture) {\n gesture.destroy();\n }\n // Remove gesture class\n targetElement.classList.remove(GESTURE_NAME);\n effectElement.remove();\n if (effectTagName === 'ion-tab-button') {\n if (originalTabBarScale) targetElement.style.setProperty('--ios27-tab-bar-scale', originalTabBarScale);\n else targetElement.style.removeProperty('--ios27-tab-bar-scale');\n }\n },\n };\n};\n"],"mappings":"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"}
@@ -1,16 +1,18 @@
1
+ //#region src/sheets-of-glass/interfaces.d.ts
1
2
  export interface EffectScales {
2
- small: string;
3
- medium: string;
4
- large: string;
5
- xlarge: string;
3
+ small: string;
4
+ medium: string;
5
+ large: string;
6
+ xlarge: string;
6
7
  }
7
8
  export interface registeredEffect {
8
- destroy: () => void;
9
+ destroy: () => void;
9
10
  }
10
11
  export interface AnimationPosition {
11
- minPositionX: number;
12
- maxPositionX: number;
13
- width: number;
14
- positionY: number;
12
+ minPositionX: number;
13
+ maxPositionX: number;
14
+ width: number;
15
+ positionY: number;
15
16
  }
17
+ //#endregion
16
18
  //# sourceMappingURL=interfaces.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../src/sheets-of-glass/interfaces.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,gBAAgB;IAC/B,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,MAAM,WAAW,iBAAiB;IAChC,YAAY,EAAE,MAAM,CAAC;IACrB,YAAY,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,MAAM,CAAC;CACnB"}
1
+ {"version":3,"file":"interfaces.d.ts","names":[],"sources":["../../src/sheets-of-glass/interfaces.ts"],"mappings":";iBAAiB;EACf;EACA;EACA;EACA;;iBAGe;EACf;;iBAGe;EACf;EACA;EACA;EACA"}
@@ -1 +0,0 @@
1
- export {};
@@ -1,8 +1,10 @@
1
- import { Animation } from '@ionic/core';
2
- import { type ElementReferences, type ElementSizes } from '@rdlabo/ionic-theme-utils';
1
+ import { Animation } from "@ionic/core";
2
+ import { ElementReferences, ElementSizes } from "@rdlabo/ionic-theme-utils";
3
+ //#region src/tab-bar-searchable/animations/enter.d.ts
3
4
  export declare const createEffectAnimation: (references: ElementReferences, sizes: ElementSizes) => Animation;
4
5
  export declare const createSearchContainerAnimation: (references: ElementReferences, sizes: ElementSizes) => Animation;
5
6
  export declare const createCloseButtonsAnimation: (references: ElementReferences) => Animation;
6
7
  export declare const createTabBarAnimation: (ionTabBar: HTMLElement, references: ElementReferences, sizes: ElementSizes) => Animation;
7
8
  export declare const createFabButtonAnimation: (ionFabButton: HTMLElement) => Animation;
9
+ //#endregion
8
10
  //# sourceMappingURL=enter.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"enter.d.ts","sourceRoot":"","sources":["../../../src/tab-bar-searchable/animations/enter.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAmB,MAAM,aAAa,CAAC;AACzD,OAAO,EAAqD,KAAK,iBAAiB,EAAE,KAAK,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAGzI,eAAO,MAAM,qBAAqB,GAAI,YAAY,iBAAiB,EAAE,OAAO,YAAY,KAAG,SA0B1F,CAAC;AAEF,eAAO,MAAM,8BAA8B,GAAI,YAAY,iBAAiB,EAAE,OAAO,YAAY,KAAG,SAUnG,CAAC;AAEF,eAAO,MAAM,2BAA2B,GAAI,YAAY,iBAAiB,KAAG,SAO3E,CAAC;AAEF,eAAO,MAAM,qBAAqB,GAAI,WAAW,WAAW,EAAE,YAAY,iBAAiB,EAAE,OAAO,YAAY,KAAG,SAyBlH,CAAC;AAEF,eAAO,MAAM,wBAAwB,GAAI,cAAc,WAAW,KAAG,SAWpE,CAAC"}
1
+ {"version":3,"file":"enter.d.ts","names":[],"sources":["../../../src/tab-bar-searchable/animations/enter.ts"],"mappings":";;;qBAIa,wBAAyB,YAAY,mBAAmB,OAAO,iBAAe;qBA4B9E,iCAAkC,YAAY,mBAAmB,OAAO,iBAAe;qBAYvF,8BAA+B,YAAY,sBAAoB;qBAS/D,wBAAyB,WAAW,aAAa,YAAY,mBAAmB,OAAO,iBAAe;qBA2BtG,2BAA4B,cAAc,gBAAc"}
@@ -1,74 +1,55 @@
1
- import { createAnimation } from '@ionic/core';
2
- import { ANIMATION_DELAY_CLOSE_BUTTONS, OPACITY_TRANSITION } from '@rdlabo/ionic-theme-utils';
3
- import { cloneElement } from '../../utils';
4
- export const createEffectAnimation = (references, sizes) => {
5
- const effectElement = cloneElement('ion-icon');
6
- const closeButtonRect = references.closeButtonIcon?.getBoundingClientRect();
7
- const iconName = references.selectedTabButtonIcon?.getAttribute('name');
8
- const selectedTabButtonIconRect = references.selectedTabButtonIcon?.getBoundingClientRect();
9
- return createAnimation()
10
- .addElement(effectElement)
11
- .beforeAddWrite(() => {
12
- effectElement.style.display = 'inline-block';
13
- references.closeButtonIcon.style.opacity = '0';
14
- if (iconName && closeButtonRect) {
15
- effectElement.setAttribute('name', iconName);
16
- effectElement.style.width = `${closeButtonRect.width}px`;
17
- effectElement.style.height = `${closeButtonRect.height}px`;
18
- }
19
- })
20
- .afterAddWrite(() => {
21
- effectElement.style.display = 'none';
22
- references.closeButtonIcon.style.opacity = '1';
23
- })
24
- .fromTo('transform', `translate3d(${selectedTabButtonIconRect.left}px, ${selectedTabButtonIconRect.top}px, 0)`, `translate3d(${closeButtonRect.left}px, ${closeButtonRect.top}px, 0)`);
1
+ import { cloneElement } from "../../utils.js";
2
+ import { createAnimation } from "@ionic/core";
3
+ import { ANIMATION_DELAY_CLOSE_BUTTONS, OPACITY_TRANSITION } from "@rdlabo/ionic-theme-utils";
4
+ //#region src/tab-bar-searchable/animations/enter.ts
5
+ const createEffectAnimation = (references, sizes) => {
6
+ const effectElement = cloneElement("ion-icon");
7
+ const closeButtonRect = references.closeButtonIcon?.getBoundingClientRect();
8
+ const iconName = references.selectedTabButtonIcon?.getAttribute("name");
9
+ const selectedTabButtonIconRect = references.selectedTabButtonIcon?.getBoundingClientRect();
10
+ return createAnimation().addElement(effectElement).beforeAddWrite(() => {
11
+ effectElement.style.display = "inline-block";
12
+ references.closeButtonIcon.style.opacity = "0";
13
+ if (iconName && closeButtonRect) {
14
+ effectElement.setAttribute("name", iconName);
15
+ effectElement.style.width = `${closeButtonRect.width}px`;
16
+ effectElement.style.height = `${closeButtonRect.height}px`;
17
+ }
18
+ }).afterAddWrite(() => {
19
+ effectElement.style.display = "none";
20
+ references.closeButtonIcon.style.opacity = "1";
21
+ }).fromTo("transform", `translate3d(${selectedTabButtonIconRect.left}px, ${selectedTabButtonIconRect.top}px, 0)`, `translate3d(${closeButtonRect.left}px, ${closeButtonRect.top}px, 0)`);
25
22
  };
26
- export const createSearchContainerAnimation = (references, sizes) => {
27
- return createAnimation()
28
- .addElement(references.searchContainer)
29
- .beforeAddWrite(() => (references.searchContainer.style.transformOrigin = 'right center'))
30
- .fromTo('transform', `scale(${sizes.fabButton.width / sizes.searchContainer.width}, ${sizes.fabButton.height / sizes.searchContainer.height})`, 'scale(1)')
31
- .fromTo('opacity', '0.2', '1');
23
+ const createSearchContainerAnimation = (references, sizes) => {
24
+ return createAnimation().addElement(references.searchContainer).beforeAddWrite(() => references.searchContainer.style.transformOrigin = "right center").fromTo("transform", `scale(${sizes.fabButton.width / sizes.searchContainer.width}, ${sizes.fabButton.height / sizes.searchContainer.height})`, "scale(1)").fromTo("opacity", "0.2", "1");
32
25
  };
33
- export const createCloseButtonsAnimation = (references) => {
34
- return createAnimation()
35
- .delay(ANIMATION_DELAY_CLOSE_BUTTONS)
36
- .addElement(references.closeButtons)
37
- .beforeAddWrite(() => (references.closeButtons.style.transformOrigin = 'left center'))
38
- .afterClearStyles(['transform', 'transform-origin'])
39
- .fromTo('transform', 'scale(1.5, 1)', 'scale(1)');
26
+ const createCloseButtonsAnimation = (references) => {
27
+ return createAnimation().delay(ANIMATION_DELAY_CLOSE_BUTTONS).addElement(references.closeButtons).beforeAddWrite(() => references.closeButtons.style.transformOrigin = "left center").afterClearStyles(["transform", "transform-origin"]).fromTo("transform", "scale(1.5, 1)", "scale(1)");
40
28
  };
41
- export const createTabBarAnimation = (ionTabBar, references, sizes) => {
42
- return createAnimation()
43
- .addElement(ionTabBar)
44
- .beforeAddWrite(() => {
45
- ionTabBar.style.transformOrigin = 'left center';
46
- ionTabBar.querySelectorAll('ion-tab-button').forEach((element) => {
47
- element.style.transition = OPACITY_TRANSITION;
48
- element.style.opacity = '0';
49
- });
50
- references.selectedTabButton.classList.remove('tab-selected');
51
- const iconName = references.selectedTabButtonIcon?.getAttribute('name');
52
- if (iconName) {
53
- references.closeButtonIcon?.setAttribute('name', iconName);
54
- }
55
- })
56
- .afterAddWrite(() => {
57
- references.selectedTabButton.classList.add('tab-selected');
58
- ionTabBar.style.pointerEvents = 'none';
59
- })
60
- .fromTo('transform', 'scale(1)', `scale(${sizes.closeButton.width / sizes.tabBar.width}, ${sizes.closeButton.height / sizes.tabBar.height})`)
61
- .fromTo('opacity', '1', '0');
29
+ const createTabBarAnimation = (ionTabBar, references, sizes) => {
30
+ return createAnimation().addElement(ionTabBar).beforeAddWrite(() => {
31
+ ionTabBar.style.transformOrigin = "left center";
32
+ ionTabBar.querySelectorAll("ion-tab-button").forEach((element) => {
33
+ element.style.transition = OPACITY_TRANSITION;
34
+ element.style.opacity = "0";
35
+ });
36
+ references.selectedTabButton.classList.remove("tab-selected");
37
+ const iconName = references.selectedTabButtonIcon?.getAttribute("name");
38
+ if (iconName) references.closeButtonIcon?.setAttribute("name", iconName);
39
+ }).afterAddWrite(() => {
40
+ references.selectedTabButton.classList.add("tab-selected");
41
+ ionTabBar.style.pointerEvents = "none";
42
+ }).fromTo("transform", "scale(1)", `scale(${sizes.closeButton.width / sizes.tabBar.width}, ${sizes.closeButton.height / sizes.tabBar.height})`).fromTo("opacity", "1", "0");
62
43
  };
63
- export const createFabButtonAnimation = (ionFabButton) => {
64
- return createAnimation()
65
- .addElement(ionFabButton)
66
- .beforeAddWrite(() => {
67
- ionFabButton.style.transformOrigin = 'center right';
68
- ionFabButton.querySelector('ion-icon')?.style.setProperty('opacity', '0');
69
- })
70
- .afterAddWrite(() => {
71
- ionFabButton.style.pointerEvents = 'none';
72
- })
73
- .fromTo('opacity', '1', '0');
44
+ const createFabButtonAnimation = (ionFabButton) => {
45
+ return createAnimation().addElement(ionFabButton).beforeAddWrite(() => {
46
+ ionFabButton.style.transformOrigin = "center right";
47
+ ionFabButton.querySelector("ion-icon")?.style.setProperty("opacity", "0");
48
+ }).afterAddWrite(() => {
49
+ ionFabButton.style.pointerEvents = "none";
50
+ }).fromTo("opacity", "1", "0");
74
51
  };
52
+ //#endregion
53
+ export { createCloseButtonsAnimation, createEffectAnimation, createFabButtonAnimation, createSearchContainerAnimation, createTabBarAnimation };
54
+
55
+ //# sourceMappingURL=enter.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"enter.js","names":[],"sources":["../../../src/tab-bar-searchable/animations/enter.ts"],"sourcesContent":["import { Animation, createAnimation } from '@ionic/core';\nimport { ANIMATION_DELAY_CLOSE_BUTTONS, OPACITY_TRANSITION, type ElementReferences, type ElementSizes } from '@rdlabo/ionic-theme-utils';\nimport { cloneElement } from '../../utils';\n\nexport const createEffectAnimation = (references: ElementReferences, sizes: ElementSizes): Animation => {\n const effectElement = cloneElement('ion-icon');\n const closeButtonRect = references.closeButtonIcon?.getBoundingClientRect();\n const iconName = references.selectedTabButtonIcon?.getAttribute('name');\n const selectedTabButtonIconRect = references.selectedTabButtonIcon?.getBoundingClientRect();\n\n return createAnimation()\n .addElement(effectElement)\n .beforeAddWrite(() => {\n effectElement.style.display = 'inline-block';\n references.closeButtonIcon.style.opacity = '0';\n if (iconName && closeButtonRect) {\n effectElement.setAttribute('name', iconName);\n effectElement.style.width = `${closeButtonRect.width}px`;\n effectElement.style.height = `${closeButtonRect.height}px`;\n }\n })\n .afterAddWrite(() => {\n effectElement.style.display = 'none';\n references.closeButtonIcon.style.opacity = '1';\n })\n .fromTo(\n 'transform',\n `translate3d(${selectedTabButtonIconRect.left}px, ${selectedTabButtonIconRect.top}px, 0)`,\n `translate3d(${closeButtonRect.left}px, ${closeButtonRect.top}px, 0)`,\n );\n};\n\nexport const createSearchContainerAnimation = (references: ElementReferences, sizes: ElementSizes): Animation => {\n return createAnimation()\n .addElement(references.searchContainer)\n .beforeAddWrite(() => (references.searchContainer.style.transformOrigin = 'right center'))\n .fromTo(\n 'transform',\n `scale(${sizes.fabButton.width / sizes.searchContainer.width}, ${sizes.fabButton.height / sizes.searchContainer.height})`,\n 'scale(1)',\n )\n .fromTo('opacity', '0.2', '1');\n};\n\nexport const createCloseButtonsAnimation = (references: ElementReferences): Animation => {\n return createAnimation()\n .delay(ANIMATION_DELAY_CLOSE_BUTTONS)\n .addElement(references.closeButtons)\n .beforeAddWrite(() => (references.closeButtons.style.transformOrigin = 'left center'))\n .afterClearStyles(['transform', 'transform-origin'])\n .fromTo('transform', 'scale(1.5, 1)', 'scale(1)');\n};\n\nexport const createTabBarAnimation = (ionTabBar: HTMLElement, references: ElementReferences, sizes: ElementSizes): Animation => {\n return createAnimation()\n .addElement(ionTabBar)\n .beforeAddWrite(() => {\n ionTabBar.style.transformOrigin = 'left center';\n ionTabBar.querySelectorAll<HTMLElement>('ion-tab-button').forEach((element: HTMLElement) => {\n element.style.transition = OPACITY_TRANSITION;\n element.style.opacity = '0';\n });\n references.selectedTabButton.classList.remove('tab-selected');\n const iconName = references.selectedTabButtonIcon?.getAttribute('name');\n if (iconName) {\n references.closeButtonIcon?.setAttribute('name', iconName);\n }\n })\n .afterAddWrite(() => {\n references.selectedTabButton.classList.add('tab-selected');\n ionTabBar.style.pointerEvents = 'none';\n })\n .fromTo(\n 'transform',\n 'scale(1)',\n `scale(${sizes.closeButton.width / sizes.tabBar.width}, ${sizes.closeButton.height / sizes.tabBar.height})`,\n )\n .fromTo('opacity', '1', '0');\n};\n\nexport const createFabButtonAnimation = (ionFabButton: HTMLElement): Animation => {\n return createAnimation()\n .addElement(ionFabButton)\n .beforeAddWrite(() => {\n ionFabButton.style.transformOrigin = 'center right';\n ionFabButton.querySelector<HTMLElement>('ion-icon')?.style.setProperty('opacity', '0');\n })\n .afterAddWrite(() => {\n ionFabButton.style.pointerEvents = 'none';\n })\n .fromTo('opacity', '1', '0');\n};\n"],"mappings":";;;;AAIA,MAAa,yBAAyB,YAA+B,UAAmC;CACtG,MAAM,gBAAgB,aAAa,UAAU;CAC7C,MAAM,kBAAkB,WAAW,iBAAiB,sBAAsB;CAC1E,MAAM,WAAW,WAAW,uBAAuB,aAAa,MAAM;CACtE,MAAM,4BAA4B,WAAW,uBAAuB,sBAAsB;CAE1F,OAAO,gBAAgB,CAAC,CACrB,WAAW,aAAa,CAAC,CACzB,qBAAqB;EACpB,cAAc,MAAM,UAAU;EAC9B,WAAW,gBAAgB,MAAM,UAAU;EAC3C,IAAI,YAAY,iBAAiB;GAC/B,cAAc,aAAa,QAAQ,QAAQ;GAC3C,cAAc,MAAM,QAAQ,GAAG,gBAAgB,MAAM;GACrD,cAAc,MAAM,SAAS,GAAG,gBAAgB,OAAO;EACzD;CACF,CAAC,CAAC,CACD,oBAAoB;EACnB,cAAc,MAAM,UAAU;EAC9B,WAAW,gBAAgB,MAAM,UAAU;CAC7C,CAAC,CAAC,CACD,OACC,aACA,eAAe,0BAA0B,KAAK,MAAM,0BAA0B,IAAI,SAClF,eAAe,gBAAgB,KAAK,MAAM,gBAAgB,IAAI,OAChE;AACJ;AAEA,MAAa,kCAAkC,YAA+B,UAAmC;CAC/G,OAAO,gBAAgB,CAAC,CACrB,WAAW,WAAW,eAAe,CAAC,CACtC,qBAAsB,WAAW,gBAAgB,MAAM,kBAAkB,cAAe,CAAC,CACzF,OACC,aACA,SAAS,MAAM,UAAU,QAAQ,MAAM,gBAAgB,MAAM,IAAI,MAAM,UAAU,SAAS,MAAM,gBAAgB,OAAO,IACvH,UACF,CAAC,CACA,OAAO,WAAW,OAAO,GAAG;AACjC;AAEA,MAAa,+BAA+B,eAA6C;CACvF,OAAO,gBAAgB,CAAC,CACrB,MAAM,6BAA6B,CAAC,CACpC,WAAW,WAAW,YAAY,CAAC,CACnC,qBAAsB,WAAW,aAAa,MAAM,kBAAkB,aAAc,CAAC,CACrF,iBAAiB,CAAC,aAAa,kBAAkB,CAAC,CAAC,CACnD,OAAO,aAAa,iBAAiB,UAAU;AACpD;AAEA,MAAa,yBAAyB,WAAwB,YAA+B,UAAmC;CAC9H,OAAO,gBAAgB,CAAC,CACrB,WAAW,SAAS,CAAC,CACrB,qBAAqB;EACpB,UAAU,MAAM,kBAAkB;EAClC,UAAU,iBAA8B,gBAAgB,CAAC,CAAC,SAAS,YAAyB;GAC1F,QAAQ,MAAM,aAAa;GAC3B,QAAQ,MAAM,UAAU;EAC1B,CAAC;EACD,WAAW,kBAAkB,UAAU,OAAO,cAAc;EAC5D,MAAM,WAAW,WAAW,uBAAuB,aAAa,MAAM;EACtE,IAAI,UACF,WAAW,iBAAiB,aAAa,QAAQ,QAAQ;CAE7D,CAAC,CAAC,CACD,oBAAoB;EACnB,WAAW,kBAAkB,UAAU,IAAI,cAAc;EACzD,UAAU,MAAM,gBAAgB;CAClC,CAAC,CAAC,CACD,OACC,aACA,YACA,SAAS,MAAM,YAAY,QAAQ,MAAM,OAAO,MAAM,IAAI,MAAM,YAAY,SAAS,MAAM,OAAO,OAAO,EAC3G,CAAC,CACA,OAAO,WAAW,KAAK,GAAG;AAC/B;AAEA,MAAa,4BAA4B,iBAAyC;CAChF,OAAO,gBAAgB,CAAC,CACrB,WAAW,YAAY,CAAC,CACxB,qBAAqB;EACpB,aAAa,MAAM,kBAAkB;EACrC,aAAa,cAA2B,UAAU,CAAC,EAAE,MAAM,YAAY,WAAW,GAAG;CACvF,CAAC,CAAC,CACD,oBAAoB;EACnB,aAAa,MAAM,gBAAgB;CACrC,CAAC,CAAC,CACD,OAAO,WAAW,KAAK,GAAG;AAC/B"}
@@ -1,8 +1,10 @@
1
- import { Animation } from '@ionic/core';
2
- import { type ElementReferences, type ElementSizes } from '@rdlabo/ionic-theme-utils';
1
+ import { Animation } from "@ionic/core";
2
+ import { ElementReferences, ElementSizes } from "@rdlabo/ionic-theme-utils";
3
+ //#region src/tab-bar-searchable/animations/leave.d.ts
3
4
  export declare const createReverseEffectAnimation: (references: ElementReferences, searchableElementSizes: ElementSizes, colorSelected: string) => Animation;
4
5
  export declare const createReverseSearchContainerAnimation: (references: ElementReferences, sizes: ElementSizes) => Animation;
5
6
  export declare const createReverseCloseButtonsAnimation: (references: ElementReferences) => Animation;
6
7
  export declare const createReverseTabBarAnimation: (ionTabBar: HTMLElement, references: ElementReferences, sizes: ElementSizes) => Animation;
7
8
  export declare const createReverseFabButtonAnimation: (ionFabButton: HTMLElement, references: ElementSizes) => Animation;
9
+ //#endregion
8
10
  //# sourceMappingURL=leave.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"leave.d.ts","sourceRoot":"","sources":["../../../src/tab-bar-searchable/animations/leave.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAmB,MAAM,aAAa,CAAC;AACzD,OAAO,EAAqD,KAAK,iBAAiB,EAAE,KAAK,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAGzI,eAAO,MAAM,4BAA4B,GACvC,YAAY,iBAAiB,EAC7B,wBAAwB,YAAY,EACpC,eAAe,MAAM,KACpB,SAyBF,CAAC;AAEF,eAAO,MAAM,qCAAqC,GAAI,YAAY,iBAAiB,EAAE,OAAO,YAAY,KAAG,SAU1G,CAAC;AAEF,eAAO,MAAM,kCAAkC,GAAI,YAAY,iBAAiB,KAAG,SAOlF,CAAC;AAEF,eAAO,MAAM,4BAA4B,GAAI,WAAW,WAAW,EAAE,YAAY,iBAAiB,EAAE,OAAO,YAAY,KAAG,SAkBzH,CAAC;AAEF,eAAO,MAAM,+BAA+B,GAAI,cAAc,WAAW,EAAE,YAAY,YAAY,KAAG,SAYrG,CAAC"}
1
+ {"version":3,"file":"leave.d.ts","names":[],"sources":["../../../src/tab-bar-searchable/animations/leave.ts"],"mappings":";;;qBAIa,+BACX,YAAY,mBACZ,wBAAwB,cACxB,0BACC;qBA2BU,wCAAyC,YAAY,mBAAmB,OAAO,iBAAe;qBAY9F,qCAAsC,YAAY,sBAAoB;qBAStE,+BAAgC,WAAW,aAAa,YAAY,mBAAmB,OAAO,iBAAe;qBAoB7G,kCAAmC,cAAc,aAAa,YAAY,iBAAe"}
@@ -1,67 +1,53 @@
1
- import { createAnimation } from '@ionic/core';
2
- import { ANIMATION_DELAY_CLOSE_BUTTONS, OPACITY_TRANSITION } from '@rdlabo/ionic-theme-utils';
3
- import { cloneElement } from '../../utils';
4
- export const createReverseEffectAnimation = (references, searchableElementSizes, colorSelected) => {
5
- const effectElement = cloneElement('ion-icon');
6
- const closeButtonRect = references.closeButtonIcon?.getBoundingClientRect();
7
- return createAnimation()
8
- .addElement(effectElement)
9
- .beforeAddWrite(() => {
10
- effectElement.style.display = 'inline-block';
11
- references.closeButtonIcon.style.opacity = '0';
12
- if (searchableElementSizes.selectedTabButtonIcon) {
13
- effectElement.style.width = `${searchableElementSizes.selectedTabButtonIcon.width}px`;
14
- effectElement.style.height = `${searchableElementSizes.selectedTabButtonIcon.height}px`;
15
- effectElement.style.color = colorSelected;
16
- }
17
- })
18
- .afterAddWrite(() => {
19
- effectElement.style.display = 'none';
20
- references.closeButtonIcon.style.opacity = '1';
21
- effectElement.style.color = '';
22
- })
23
- .fromTo('transform', `translate3d(${closeButtonRect.left}px, ${closeButtonRect.top}px, 0)`, `translate3d(${searchableElementSizes.selectedTabButtonIcon.left}px, ${searchableElementSizes.selectedTabButtonIcon.top}px, 0)`);
1
+ import { cloneElement } from "../../utils.js";
2
+ import { createAnimation } from "@ionic/core";
3
+ import { ANIMATION_DELAY_CLOSE_BUTTONS, OPACITY_TRANSITION } from "@rdlabo/ionic-theme-utils";
4
+ //#region src/tab-bar-searchable/animations/leave.ts
5
+ const createReverseEffectAnimation = (references, searchableElementSizes, colorSelected) => {
6
+ const effectElement = cloneElement("ion-icon");
7
+ const closeButtonRect = references.closeButtonIcon?.getBoundingClientRect();
8
+ return createAnimation().addElement(effectElement).beforeAddWrite(() => {
9
+ effectElement.style.display = "inline-block";
10
+ references.closeButtonIcon.style.opacity = "0";
11
+ if (searchableElementSizes.selectedTabButtonIcon) {
12
+ effectElement.style.width = `${searchableElementSizes.selectedTabButtonIcon.width}px`;
13
+ effectElement.style.height = `${searchableElementSizes.selectedTabButtonIcon.height}px`;
14
+ effectElement.style.color = colorSelected;
15
+ }
16
+ }).afterAddWrite(() => {
17
+ effectElement.style.display = "none";
18
+ references.closeButtonIcon.style.opacity = "1";
19
+ effectElement.style.color = "";
20
+ }).fromTo("transform", `translate3d(${closeButtonRect.left}px, ${closeButtonRect.top}px, 0)`, `translate3d(${searchableElementSizes.selectedTabButtonIcon.left}px, ${searchableElementSizes.selectedTabButtonIcon.top}px, 0)`);
24
21
  };
25
- export const createReverseSearchContainerAnimation = (references, sizes) => {
26
- return createAnimation()
27
- .addElement(references.searchContainer)
28
- .beforeAddWrite(() => (references.searchContainer.style.transformOrigin = 'right center'))
29
- .fromTo('transform', 'scale(1)', `scale(${sizes.fabButton.width / sizes.searchContainer.width}, ${sizes.fabButton.height / sizes.searchContainer.height})`)
30
- .fromTo('opacity', '1', '0.2');
22
+ const createReverseSearchContainerAnimation = (references, sizes) => {
23
+ return createAnimation().addElement(references.searchContainer).beforeAddWrite(() => references.searchContainer.style.transformOrigin = "right center").fromTo("transform", "scale(1)", `scale(${sizes.fabButton.width / sizes.searchContainer.width}, ${sizes.fabButton.height / sizes.searchContainer.height})`).fromTo("opacity", "1", "0.2");
31
24
  };
32
- export const createReverseCloseButtonsAnimation = (references) => {
33
- return createAnimation()
34
- .delay(ANIMATION_DELAY_CLOSE_BUTTONS)
35
- .addElement(references.closeButtons)
36
- .beforeAddWrite(() => (references.closeButtons.style.transformOrigin = 'left center'))
37
- .afterClearStyles(['transform', 'transform-origin'])
38
- .fromTo('transform', 'scale(1)', 'scale(1.5, 1)');
25
+ const createReverseCloseButtonsAnimation = (references) => {
26
+ return createAnimation().delay(ANIMATION_DELAY_CLOSE_BUTTONS).addElement(references.closeButtons).beforeAddWrite(() => references.closeButtons.style.transformOrigin = "left center").afterClearStyles(["transform", "transform-origin"]).fromTo("transform", "scale(1)", "scale(1.5, 1)");
39
27
  };
40
- export const createReverseTabBarAnimation = (ionTabBar, references, sizes) => {
41
- return createAnimation()
42
- .addElement(ionTabBar)
43
- .beforeAddWrite(() => {
44
- ionTabBar.style.transformOrigin = 'left center';
45
- ionTabBar.style.pointerEvents = 'auto';
46
- ionTabBar.querySelectorAll('ion-tab-button').forEach((element) => {
47
- element.style.transition = OPACITY_TRANSITION;
48
- element.style.opacity = '1';
49
- });
50
- })
51
- .afterClearStyles(['transform', 'opacity', 'transform-origin'])
52
- .fromTo('transform', `scale(${sizes.closeButton.width / sizes.tabBar.width}, ${sizes.closeButton.height / sizes.tabBar.height})`, 'scale(1)')
53
- .fromTo('opacity', '0', '1');
28
+ const createReverseTabBarAnimation = (ionTabBar, references, sizes) => {
29
+ return createAnimation().addElement(ionTabBar).beforeAddWrite(() => {
30
+ ionTabBar.style.transformOrigin = "left center";
31
+ ionTabBar.style.pointerEvents = "auto";
32
+ ionTabBar.querySelectorAll("ion-tab-button").forEach((element) => {
33
+ element.style.transition = OPACITY_TRANSITION;
34
+ element.style.opacity = "1";
35
+ });
36
+ }).afterClearStyles([
37
+ "transform",
38
+ "opacity",
39
+ "transform-origin"
40
+ ]).fromTo("transform", `scale(${sizes.closeButton.width / sizes.tabBar.width}, ${sizes.closeButton.height / sizes.tabBar.height})`, "scale(1)").fromTo("opacity", "0", "1");
54
41
  };
55
- export const createReverseFabButtonAnimation = (ionFabButton, references) => {
56
- return createAnimation()
57
- .addElement(ionFabButton)
58
- .beforeAddWrite(() => {
59
- ionFabButton.querySelector('ion-icon')?.style.setProperty('opacity', '1');
60
- ionFabButton.style.transformOrigin = 'center right';
61
- })
62
- .afterAddWrite(() => {
63
- ionFabButton.style.pointerEvents = 'auto';
64
- })
65
- .fromTo('opacity', '0', '1')
66
- .fromTo('transform', `scale(${references.searchContainer.height / references.fabButton.height})`, 'scale(1)');
42
+ const createReverseFabButtonAnimation = (ionFabButton, references) => {
43
+ return createAnimation().addElement(ionFabButton).beforeAddWrite(() => {
44
+ ionFabButton.querySelector("ion-icon")?.style.setProperty("opacity", "1");
45
+ ionFabButton.style.transformOrigin = "center right";
46
+ }).afterAddWrite(() => {
47
+ ionFabButton.style.pointerEvents = "auto";
48
+ }).fromTo("opacity", "0", "1").fromTo("transform", `scale(${references.searchContainer.height / references.fabButton.height})`, "scale(1)");
67
49
  };
50
+ //#endregion
51
+ export { createReverseCloseButtonsAnimation, createReverseEffectAnimation, createReverseFabButtonAnimation, createReverseSearchContainerAnimation, createReverseTabBarAnimation };
52
+
53
+ //# sourceMappingURL=leave.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"leave.js","names":[],"sources":["../../../src/tab-bar-searchable/animations/leave.ts"],"sourcesContent":["import { Animation, createAnimation } from '@ionic/core';\nimport { ANIMATION_DELAY_CLOSE_BUTTONS, OPACITY_TRANSITION, type ElementReferences, type ElementSizes } from '@rdlabo/ionic-theme-utils';\nimport { cloneElement } from '../../utils';\n\nexport const createReverseEffectAnimation = (\n references: ElementReferences,\n searchableElementSizes: ElementSizes,\n colorSelected: string,\n): Animation => {\n const effectElement = cloneElement('ion-icon');\n const closeButtonRect = references.closeButtonIcon?.getBoundingClientRect();\n\n return createAnimation()\n .addElement(effectElement)\n .beforeAddWrite(() => {\n effectElement.style.display = 'inline-block';\n references.closeButtonIcon.style.opacity = '0';\n if (searchableElementSizes.selectedTabButtonIcon) {\n effectElement.style.width = `${searchableElementSizes.selectedTabButtonIcon.width}px`;\n effectElement.style.height = `${searchableElementSizes.selectedTabButtonIcon.height}px`;\n effectElement.style.color = colorSelected;\n }\n })\n .afterAddWrite(() => {\n effectElement.style.display = 'none';\n references.closeButtonIcon.style.opacity = '1';\n effectElement.style.color = '';\n })\n .fromTo(\n 'transform',\n `translate3d(${closeButtonRect.left}px, ${closeButtonRect.top}px, 0)`,\n `translate3d(${searchableElementSizes.selectedTabButtonIcon.left}px, ${searchableElementSizes.selectedTabButtonIcon.top}px, 0)`,\n );\n};\n\nexport const createReverseSearchContainerAnimation = (references: ElementReferences, sizes: ElementSizes): Animation => {\n return createAnimation()\n .addElement(references.searchContainer)\n .beforeAddWrite(() => (references.searchContainer.style.transformOrigin = 'right center'))\n .fromTo(\n 'transform',\n 'scale(1)',\n `scale(${sizes.fabButton.width / sizes.searchContainer.width}, ${sizes.fabButton.height / sizes.searchContainer.height})`,\n )\n .fromTo('opacity', '1', '0.2');\n};\n\nexport const createReverseCloseButtonsAnimation = (references: ElementReferences): Animation => {\n return createAnimation()\n .delay(ANIMATION_DELAY_CLOSE_BUTTONS)\n .addElement(references.closeButtons)\n .beforeAddWrite(() => (references.closeButtons.style.transformOrigin = 'left center'))\n .afterClearStyles(['transform', 'transform-origin'])\n .fromTo('transform', 'scale(1)', 'scale(1.5, 1)');\n};\n\nexport const createReverseTabBarAnimation = (ionTabBar: HTMLElement, references: ElementReferences, sizes: ElementSizes): Animation => {\n return createAnimation()\n .addElement(ionTabBar)\n .beforeAddWrite(() => {\n ionTabBar.style.transformOrigin = 'left center';\n ionTabBar.style.pointerEvents = 'auto';\n ionTabBar.querySelectorAll<HTMLElement>('ion-tab-button').forEach((element: HTMLElement) => {\n element.style.transition = OPACITY_TRANSITION;\n element.style.opacity = '1';\n });\n })\n .afterClearStyles(['transform', 'opacity', 'transform-origin'])\n .fromTo(\n 'transform',\n `scale(${sizes.closeButton.width / sizes.tabBar.width}, ${sizes.closeButton.height / sizes.tabBar.height})`,\n 'scale(1)',\n )\n .fromTo('opacity', '0', '1');\n};\n\nexport const createReverseFabButtonAnimation = (ionFabButton: HTMLElement, references: ElementSizes): Animation => {\n return createAnimation()\n .addElement(ionFabButton)\n .beforeAddWrite(() => {\n ionFabButton.querySelector<HTMLElement>('ion-icon')?.style.setProperty('opacity', '1');\n ionFabButton.style.transformOrigin = 'center right';\n })\n .afterAddWrite(() => {\n ionFabButton.style.pointerEvents = 'auto';\n })\n .fromTo('opacity', '0', '1')\n .fromTo('transform', `scale(${references.searchContainer.height / references.fabButton.height})`, 'scale(1)');\n};\n"],"mappings":";;;;AAIA,MAAa,gCACX,YACA,wBACA,kBACc;CACd,MAAM,gBAAgB,aAAa,UAAU;CAC7C,MAAM,kBAAkB,WAAW,iBAAiB,sBAAsB;CAE1E,OAAO,gBAAgB,CAAC,CACrB,WAAW,aAAa,CAAC,CACzB,qBAAqB;EACpB,cAAc,MAAM,UAAU;EAC9B,WAAW,gBAAgB,MAAM,UAAU;EAC3C,IAAI,uBAAuB,uBAAuB;GAChD,cAAc,MAAM,QAAQ,GAAG,uBAAuB,sBAAsB,MAAM;GAClF,cAAc,MAAM,SAAS,GAAG,uBAAuB,sBAAsB,OAAO;GACpF,cAAc,MAAM,QAAQ;EAC9B;CACF,CAAC,CAAC,CACD,oBAAoB;EACnB,cAAc,MAAM,UAAU;EAC9B,WAAW,gBAAgB,MAAM,UAAU;EAC3C,cAAc,MAAM,QAAQ;CAC9B,CAAC,CAAC,CACD,OACC,aACA,eAAe,gBAAgB,KAAK,MAAM,gBAAgB,IAAI,SAC9D,eAAe,uBAAuB,sBAAsB,KAAK,MAAM,uBAAuB,sBAAsB,IAAI,OAC1H;AACJ;AAEA,MAAa,yCAAyC,YAA+B,UAAmC;CACtH,OAAO,gBAAgB,CAAC,CACrB,WAAW,WAAW,eAAe,CAAC,CACtC,qBAAsB,WAAW,gBAAgB,MAAM,kBAAkB,cAAe,CAAC,CACzF,OACC,aACA,YACA,SAAS,MAAM,UAAU,QAAQ,MAAM,gBAAgB,MAAM,IAAI,MAAM,UAAU,SAAS,MAAM,gBAAgB,OAAO,EACzH,CAAC,CACA,OAAO,WAAW,KAAK,KAAK;AACjC;AAEA,MAAa,sCAAsC,eAA6C;CAC9F,OAAO,gBAAgB,CAAC,CACrB,MAAM,6BAA6B,CAAC,CACpC,WAAW,WAAW,YAAY,CAAC,CACnC,qBAAsB,WAAW,aAAa,MAAM,kBAAkB,aAAc,CAAC,CACrF,iBAAiB,CAAC,aAAa,kBAAkB,CAAC,CAAC,CACnD,OAAO,aAAa,YAAY,eAAe;AACpD;AAEA,MAAa,gCAAgC,WAAwB,YAA+B,UAAmC;CACrI,OAAO,gBAAgB,CAAC,CACrB,WAAW,SAAS,CAAC,CACrB,qBAAqB;EACpB,UAAU,MAAM,kBAAkB;EAClC,UAAU,MAAM,gBAAgB;EAChC,UAAU,iBAA8B,gBAAgB,CAAC,CAAC,SAAS,YAAyB;GAC1F,QAAQ,MAAM,aAAa;GAC3B,QAAQ,MAAM,UAAU;EAC1B,CAAC;CACH,CAAC,CAAC,CACD,iBAAiB;EAAC;EAAa;EAAW;CAAkB,CAAC,CAAC,CAC9D,OACC,aACA,SAAS,MAAM,YAAY,QAAQ,MAAM,OAAO,MAAM,IAAI,MAAM,YAAY,SAAS,MAAM,OAAO,OAAO,IACzG,UACF,CAAC,CACA,OAAO,WAAW,KAAK,GAAG;AAC/B;AAEA,MAAa,mCAAmC,cAA2B,eAAwC;CACjH,OAAO,gBAAgB,CAAC,CACrB,WAAW,YAAY,CAAC,CACxB,qBAAqB;EACpB,aAAa,cAA2B,UAAU,CAAC,EAAE,MAAM,YAAY,WAAW,GAAG;EACrF,aAAa,MAAM,kBAAkB;CACvC,CAAC,CAAC,CACD,oBAAoB;EACnB,aAAa,MAAM,gBAAgB;CACrC,CAAC,CAAC,CACD,OAAO,WAAW,KAAK,GAAG,CAAC,CAC3B,OAAO,aAAa,SAAS,WAAW,gBAAgB,SAAS,WAAW,UAAU,OAAO,IAAI,UAAU;AAChH"}
@@ -1,4 +1,6 @@
1
- import { type TabBarSearchableFunction } from '@rdlabo/ionic-theme-utils';
2
- export { TabBarSearchableType, type TabBarSearchableFunction, type SearchableEventCache, type ElementSizes, type ElementReferences, } from '@rdlabo/ionic-theme-utils';
3
- export declare const attachTabBarSearchable: (ionTabBar: HTMLElement, ionFabButton: HTMLElement, ionFooter: HTMLElement) => TabBarSearchableFunction;
1
+ import { ElementReferences, ElementSizes, SearchableEventCache, TabBarSearchableFunction, TabBarSearchableFunction as TabBarSearchableFunction$1, TabBarSearchableType } from "@rdlabo/ionic-theme-utils";
2
+ //#region src/tab-bar-searchable/index.d.ts
3
+ export declare const attachTabBarSearchable: (ionTabBar: HTMLElement, ionFabButton: HTMLElement, ionFooter: HTMLElement) => TabBarSearchableFunction$1;
4
+ //#endregion
5
+ export { type ElementReferences, type ElementSizes, type SearchableEventCache, type TabBarSearchableFunction, TabBarSearchableType };
4
6
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/tab-bar-searchable/index.ts"],"names":[],"mappings":"AACA,OAAO,EAQL,KAAK,wBAAwB,EAE9B,MAAM,2BAA2B,CAAC;AAiBnC,OAAO,EACL,oBAAoB,EACpB,KAAK,wBAAwB,EAC7B,KAAK,oBAAoB,EACzB,KAAK,YAAY,EACjB,KAAK,iBAAiB,GACvB,MAAM,2BAA2B,CAAC;AAqBnC,eAAO,MAAM,sBAAsB,GACjC,WAAW,WAAW,EACtB,cAAc,WAAW,EACzB,WAAW,WAAW,KACrB,wBAwDF,CAAC"}
1
+ {"version":3,"file":"index.d.ts","names":["TabBarSearchableFunction"],"sources":["../../src/tab-bar-searchable/index.ts"],"mappings":";;qBAuDa,yBACX,WAAW,aACX,cAAc,aACd,WAAW,gBACVA"}