@symbiote-native/angular 1.0.0 → 2.0.0

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 (248) hide show
  1. package/README.md +13 -10
  2. package/babel-register-composed.cjs +41 -19
  3. package/bin/symbiote-angular-dev.cjs +16 -4
  4. package/build/angular/anchor-host-registry.js +1 -17
  5. package/build/angular/anchor-host-registry.js.map +1 -1
  6. package/build/angular/change-detection-flush.d.ts +31 -0
  7. package/build/angular/change-detection-flush.js +110 -0
  8. package/build/angular/change-detection-flush.js.map +1 -0
  9. package/build/angular/components/activity-indicator-props.d.ts +2 -0
  10. package/build/angular/components/activity-indicator-props.js +2 -0
  11. package/build/angular/components/activity-indicator-props.js.map +1 -0
  12. package/build/angular/components/button-props.d.ts +2 -0
  13. package/build/angular/components/button-props.js +2 -0
  14. package/build/angular/components/button-props.js.map +1 -0
  15. package/build/angular/components/flat-list/index.d.ts +2 -1
  16. package/build/angular/components/flat-list/index.js +22 -10
  17. package/build/angular/components/flat-list/index.js.map +1 -1
  18. package/build/angular/components/image-background-props.d.ts +6 -0
  19. package/build/angular/components/image-background-props.js +2 -0
  20. package/build/angular/components/image-background-props.js.map +1 -0
  21. package/build/angular/components/{image/shared.d.ts → image-shared.d.ts} +1 -1
  22. package/build/angular/components/{image/shared.js → image-shared.js} +7 -2
  23. package/build/angular/components/image-shared.js.map +1 -0
  24. package/build/angular/components/input-accessory-view-props.d.ts +7 -0
  25. package/build/angular/components/input-accessory-view-props.js +9 -0
  26. package/build/angular/components/input-accessory-view-props.js.map +1 -0
  27. package/build/angular/components/keyboard-avoiding-view/index.js +11 -17
  28. package/build/angular/components/keyboard-avoiding-view/index.js.map +1 -1
  29. package/build/angular/components/modal/index.d.ts +1 -0
  30. package/build/angular/components/modal/index.js +19 -12
  31. package/build/angular/components/modal/index.js.map +1 -1
  32. package/build/angular/components/pressable-props.d.ts +32 -0
  33. package/build/angular/components/pressable-props.js +11 -0
  34. package/build/angular/components/pressable-props.js.map +1 -0
  35. package/build/angular/components/refresh-control-props.d.ts +16 -0
  36. package/build/angular/components/refresh-control-props.js +14 -0
  37. package/build/angular/components/refresh-control-props.js.map +1 -0
  38. package/build/angular/components/safe-area-view-props.d.ts +7 -0
  39. package/build/angular/components/safe-area-view-props.js +11 -0
  40. package/build/angular/components/safe-area-view-props.js.map +1 -0
  41. package/build/angular/components/scroll-view-props.d.ts +76 -0
  42. package/build/angular/components/scroll-view-props.js +18 -0
  43. package/build/angular/components/scroll-view-props.js.map +1 -0
  44. package/build/angular/components/text-input-props.d.ts +45 -0
  45. package/build/angular/components/text-input-props.js +18 -0
  46. package/build/angular/components/text-input-props.js.map +1 -0
  47. package/build/angular/components/touchable-native-feedback/touchable-native-feedback-props.d.ts +6 -0
  48. package/build/angular/components/touchable-native-feedback/touchable-native-feedback-props.js +2 -0
  49. package/build/angular/components/touchable-native-feedback/touchable-native-feedback-props.js.map +1 -0
  50. package/build/angular/components/touchable-props.d.ts +14 -0
  51. package/build/angular/components/touchable-props.js +13 -0
  52. package/build/angular/components/touchable-props.js.map +1 -0
  53. package/build/angular/components/touchable-without-feedback/touchable-without-feedback-props.d.ts +3 -0
  54. package/build/angular/components/touchable-without-feedback/touchable-without-feedback-props.js +2 -0
  55. package/build/angular/components/touchable-without-feedback/touchable-without-feedback-props.js.map +1 -0
  56. package/build/angular/components/virtualized-list/index.d.ts +5 -1
  57. package/build/angular/components/virtualized-list/index.js +366 -280
  58. package/build/angular/components/virtualized-list/index.js.map +1 -1
  59. package/build/angular/components.d.ts +20 -26
  60. package/build/angular/components.js +12 -14
  61. package/build/angular/components.js.map +1 -1
  62. package/build/angular/create-portal/index.d.ts +2 -2
  63. package/build/angular/create-portal/index.js +5 -5
  64. package/build/angular/create-tunnel/index.js +1 -1
  65. package/build/angular/element-props.d.ts +53 -0
  66. package/build/angular/element-props.js +2 -0
  67. package/build/angular/element-props.js.map +1 -0
  68. package/build/angular/elements.d.ts +528 -0
  69. package/build/angular/elements.js +1444 -0
  70. package/build/angular/elements.js.map +1 -0
  71. package/build/angular/host-instance/index.js +1 -1
  72. package/build/angular/index.d.ts +4 -2
  73. package/build/angular/index.js +15 -1
  74. package/build/angular/index.js.map +1 -1
  75. package/build/angular/modules/animated/create-animated-component.d.ts +5 -6
  76. package/build/angular/modules/animated/create-animated-component.js +60 -73
  77. package/build/angular/modules/animated/create-animated-component.js.map +1 -1
  78. package/build/angular/modules/animated/index.js +1 -1
  79. package/build/angular/modules/animated/index.js.map +1 -1
  80. package/build/angular/modules/image/index.d.ts +3 -0
  81. package/build/angular/modules/image/index.js +16 -0
  82. package/build/angular/modules/image/index.js.map +1 -0
  83. package/build/angular/primitives/index.d.ts +18 -18
  84. package/build/angular/primitives/index.js +40 -36
  85. package/build/angular/primitives/index.js.map +1 -1
  86. package/build/angular/primitives/shared.d.ts +2 -3
  87. package/build/angular/primitives/shared.js +8 -53
  88. package/build/angular/primitives/shared.js.map +1 -1
  89. package/build/angular/register.d.ts +1 -1
  90. package/build/angular/register.js +12 -31
  91. package/build/angular/register.js.map +1 -1
  92. package/build/angular/render/index.js +3 -3
  93. package/build/angular/render/index.js.map +1 -1
  94. package/build/angular/renderer/index.js +113 -67
  95. package/build/angular/renderer/index.js.map +1 -1
  96. package/build/angular/renderer/value-change.d.ts +2 -0
  97. package/build/angular/renderer/value-change.js +9 -0
  98. package/build/angular/renderer/value-change.js.map +1 -0
  99. package/metro-config.cjs +23 -5
  100. package/metro-css-parser.cjs +2 -1
  101. package/package.json +5 -14
  102. package/src/anchor-host-registry.ts +1 -17
  103. package/src/change-detection-flush.ts +120 -0
  104. package/src/components/activity-indicator-props.ts +21 -0
  105. package/src/components/button-props.ts +26 -0
  106. package/src/components/flat-list/index.ts +12 -4
  107. package/src/components/image-background-props.ts +24 -0
  108. package/src/components/{image/shared.ts → image-shared.ts} +6 -1
  109. package/src/components/input-accessory-view-props.ts +21 -0
  110. package/src/components/keyboard-avoiding-view/index.ts +6 -9
  111. package/src/components/modal/index.ts +15 -7
  112. package/src/components/pressable-props.ts +73 -0
  113. package/src/components/refresh-control-props.ts +43 -0
  114. package/src/components/safe-area-view-props.ts +28 -0
  115. package/src/components/scroll-view-props.ts +109 -0
  116. package/src/components/text-input-props.ts +72 -0
  117. package/src/components/touchable-native-feedback/touchable-native-feedback-props.ts +23 -0
  118. package/src/components/touchable-props.ts +30 -0
  119. package/src/components/touchable-without-feedback/touchable-without-feedback-props.ts +21 -0
  120. package/src/components/virtualized-list/index.ts +239 -156
  121. package/src/components.ts +84 -35
  122. package/src/create-portal/index.ts +5 -5
  123. package/src/create-tunnel/index.ts +1 -1
  124. package/src/diagnostics.ts +1 -1
  125. package/src/element-props.ts +90 -0
  126. package/src/elements.ts +919 -0
  127. package/src/host-instance/index.ts +1 -1
  128. package/src/index.ts +52 -15
  129. package/src/modules/animated/create-animated-component.ts +50 -55
  130. package/src/modules/animated/index.ts +1 -1
  131. package/src/modules/image/index.ts +18 -0
  132. package/src/primitives/index.ts +22 -18
  133. package/src/primitives/shared.ts +11 -44
  134. package/src/register.ts +12 -40
  135. package/src/render/index.ts +3 -3
  136. package/src/renderer/index.ts +122 -73
  137. package/src/renderer/value-change.ts +8 -0
  138. package/babel-lower-host-primitives.cjs +0 -636
  139. package/build/angular/components/activity-indicator/index.android.d.ts +0 -13
  140. package/build/angular/components/activity-indicator/index.android.js +0 -29
  141. package/build/angular/components/activity-indicator/index.android.js.map +0 -1
  142. package/build/angular/components/activity-indicator/index.d.ts +0 -1
  143. package/build/angular/components/activity-indicator/index.ios.d.ts +0 -9
  144. package/build/angular/components/activity-indicator/index.ios.js +0 -26
  145. package/build/angular/components/activity-indicator/index.ios.js.map +0 -1
  146. package/build/angular/components/activity-indicator/index.js +0 -4
  147. package/build/angular/components/activity-indicator/index.js.map +0 -1
  148. package/build/angular/components/activity-indicator/shared.d.ts +0 -67
  149. package/build/angular/components/activity-indicator/shared.js +0 -260
  150. package/build/angular/components/activity-indicator/shared.js.map +0 -1
  151. package/build/angular/components/button.d.ts +0 -68
  152. package/build/angular/components/button.js +0 -360
  153. package/build/angular/components/button.js.map +0 -1
  154. package/build/angular/components/image/index.android.d.ts +0 -15
  155. package/build/angular/components/image/index.android.js +0 -83
  156. package/build/angular/components/image/index.android.js.map +0 -1
  157. package/build/angular/components/image/index.d.ts +0 -1
  158. package/build/angular/components/image/index.ios.d.ts +0 -15
  159. package/build/angular/components/image/index.ios.js +0 -83
  160. package/build/angular/components/image/index.ios.js.map +0 -1
  161. package/build/angular/components/image/index.js +0 -3
  162. package/build/angular/components/image/index.js.map +0 -1
  163. package/build/angular/components/image/shared.js.map +0 -1
  164. package/build/angular/components/image-background.d.ts +0 -85
  165. package/build/angular/components/image-background.js +0 -443
  166. package/build/angular/components/image-background.js.map +0 -1
  167. package/build/angular/components/input-accessory-view/index.d.ts +0 -66
  168. package/build/angular/components/input-accessory-view/index.js +0 -287
  169. package/build/angular/components/input-accessory-view/index.js.map +0 -1
  170. package/build/angular/components/pressable/index.d.ts +0 -134
  171. package/build/angular/components/pressable/index.js +0 -514
  172. package/build/angular/components/pressable/index.js.map +0 -1
  173. package/build/angular/components/refresh-control/index.d.ts +0 -91
  174. package/build/angular/components/refresh-control/index.js +0 -382
  175. package/build/angular/components/refresh-control/index.js.map +0 -1
  176. package/build/angular/components/safe-area-view/index.d.ts +0 -64
  177. package/build/angular/components/safe-area-view/index.js +0 -287
  178. package/build/angular/components/safe-area-view/index.js.map +0 -1
  179. package/build/angular/components/scroll-view/index.android.d.ts +0 -20
  180. package/build/angular/components/scroll-view/index.android.js +0 -262
  181. package/build/angular/components/scroll-view/index.android.js.map +0 -1
  182. package/build/angular/components/scroll-view/index.d.ts +0 -3
  183. package/build/angular/components/scroll-view/index.ios.d.ts +0 -8
  184. package/build/angular/components/scroll-view/index.ios.js +0 -92
  185. package/build/angular/components/scroll-view/index.ios.js.map +0 -1
  186. package/build/angular/components/scroll-view/index.js +0 -6
  187. package/build/angular/components/scroll-view/index.js.map +0 -1
  188. package/build/angular/components/scroll-view/projection.d.ts +0 -67
  189. package/build/angular/components/scroll-view/projection.js +0 -560
  190. package/build/angular/components/scroll-view/projection.js.map +0 -1
  191. package/build/angular/components/scroll-view/shared.d.ts +0 -241
  192. package/build/angular/components/scroll-view/shared.js +0 -848
  193. package/build/angular/components/scroll-view/shared.js.map +0 -1
  194. package/build/angular/components/scroll-view/sticky-header.d.ts +0 -40
  195. package/build/angular/components/scroll-view/sticky-header.js +0 -224
  196. package/build/angular/components/scroll-view/sticky-header.js.map +0 -1
  197. package/build/angular/components/switch/index.android.d.ts +0 -24
  198. package/build/angular/components/switch/index.android.js +0 -112
  199. package/build/angular/components/switch/index.android.js.map +0 -1
  200. package/build/angular/components/switch/index.d.ts +0 -1
  201. package/build/angular/components/switch/index.ios.d.ts +0 -23
  202. package/build/angular/components/switch/index.ios.js +0 -111
  203. package/build/angular/components/switch/index.ios.js.map +0 -1
  204. package/build/angular/components/switch/index.js +0 -4
  205. package/build/angular/components/switch/index.js.map +0 -1
  206. package/build/angular/components/switch/shared.d.ts +0 -49
  207. package/build/angular/components/switch/shared.js +0 -191
  208. package/build/angular/components/switch/shared.js.map +0 -1
  209. package/build/angular/components/text-input.d.ts +0 -167
  210. package/build/angular/components/text-input.js +0 -684
  211. package/build/angular/components/text-input.js.map +0 -1
  212. package/build/angular/components/touchable/index.d.ts +0 -283
  213. package/build/angular/components/touchable/index.js +0 -1453
  214. package/build/angular/components/touchable/index.js.map +0 -1
  215. package/build/angular/components/touchable-native-feedback/index.d.ts +0 -87
  216. package/build/angular/components/touchable-native-feedback/index.js +0 -409
  217. package/build/angular/components/touchable-native-feedback/index.js.map +0 -1
  218. package/build/angular/state-style.d.ts +0 -9
  219. package/build/angular/state-style.js +0 -39
  220. package/build/angular/state-style.js.map +0 -1
  221. package/metro-transformer.cjs +0 -69
  222. package/src/components/activity-indicator/index.android.ts +0 -23
  223. package/src/components/activity-indicator/index.ios.ts +0 -21
  224. package/src/components/activity-indicator/index.ts +0 -4
  225. package/src/components/activity-indicator/shared.ts +0 -225
  226. package/src/components/button.ts +0 -237
  227. package/src/components/image/index.android.ts +0 -95
  228. package/src/components/image/index.ios.ts +0 -95
  229. package/src/components/image/index.ts +0 -3
  230. package/src/components/image-background.ts +0 -308
  231. package/src/components/input-accessory-view/index.ts +0 -246
  232. package/src/components/pressable/index.ts +0 -522
  233. package/src/components/refresh-control/index.ts +0 -349
  234. package/src/components/safe-area-view/index.ts +0 -247
  235. package/src/components/scroll-view/index.android.ts +0 -205
  236. package/src/components/scroll-view/index.ios.ts +0 -81
  237. package/src/components/scroll-view/index.ts +0 -7
  238. package/src/components/scroll-view/projection.ts +0 -713
  239. package/src/components/scroll-view/shared.ts +0 -1093
  240. package/src/components/scroll-view/sticky-header.ts +0 -267
  241. package/src/components/switch/index.android.ts +0 -113
  242. package/src/components/switch/index.ios.ts +0 -112
  243. package/src/components/switch/index.ts +0 -4
  244. package/src/components/switch/shared.ts +0 -284
  245. package/src/components/text-input.ts +0 -669
  246. package/src/components/touchable/index.ts +0 -956
  247. package/src/components/touchable-native-feedback/index.ts +0 -327
  248. package/src/state-style.ts +0 -39
@@ -1,1453 +0,0 @@
1
- // The Touchable* family for Angular, all built on Pressable (the Angular twin of the React/Vue
2
- // adapter). The press-timing constants and the deactivation-floor math are shared with every
3
- // adapter (@symbiote-native/components/state/touchable); here Angular owns only the Animated wiring + the
4
- // press scheduling state:
5
- // TouchableOpacity: animate an Animated.Value opacity toward activeOpacity on press-in and back
6
- // to 1 on press-out, driven from Pressable's onPressIn/onPressOut. The opacity Value is held by
7
- // IDENTITY as a plain field (an engine object, never an @Input / reactive wrap) and the
8
- // <symbiote-animated-view> leaf commits it every frame.
9
- // TouchableHighlight: paint underlayColor + lower child opacity while the underlay is SHOWN.
10
- // RN drives that from onPressIn/onPress/onPressOut and holds it past the tap for delayPressOut,
11
- // NOT from Pressable's pressed flag — a tap too fast to see is already un-pressed by then.
12
- // TouchableWithoutFeedback: no visual change, but RN still runs the full press-timing machine.
13
- //
14
- // Every Touchable's own press/hover/accessibility events are now real @Output() EventEmitters too,
15
- // matching Pressable (which they wrap) — `(press)="handler($event)"`, never `[onPress]="handler"`.
16
- // Non-event config (delayLongPress, hitSlop, ...) still rides down as plain @Input() bindings.
17
- // Accessibility EVENTS forward straight through to Pressable's own outputs
18
- // (`(accessibilityAction)="accessibilityAction.emit($event)"`); accessibility STATE folds the web
19
- // aria-*/role aliases and merges `disabled` into the a11y state on Pressable's own host — no re-fold
20
- // here (the a11y host is Pressable's view, mirroring React's `...rest` -> Pressable). No JS-side
21
- // platform branch, so this stays a flat single file, mirroring React/Vue. Each Touchable
22
- // forwards the Angular Pressable surface verbatim; parity is against that surface, exactly as
23
- // React's Touchable parity is against
24
- // the React Pressable surface.
25
- import { CUSTOM_ELEMENTS_SCHEMA, ChangeDetectionStrategy, Component, computed, ElementRef, EventEmitter, inject, Input, Output, signal, } from '@angular/core';
26
- import { createHighlightUnderlayHandlers, createHighlightUnderlayRuntime, createTouchableFeedbackHandlers, createTouchableFeedbackRuntime, hasTouchablePressHandler, resolveHighlightExtraStyles, restingOpacityFromStyle, DEFAULT_ACTIVE_OPACITY, OPACITY_ACTIVE_GRANT_DURATION_MS, OPACITY_INACTIVE_DURATION_MS, RESTING_OPACITY, TOUCHABLE_MIN_PRESS_DURATION_MS, } from '@symbiote-native/components';
27
- import {} from '@symbiote-native/engine';
28
- import { anchorHostStyle, anchorStyleProp, SymbioteStyleInputDirective, } from '../../primitives';
29
- import { Pressable } from '../pressable';
30
- import { Animated, AnimatedView } from '../../modules/animated';
31
- import { gateWanted, injectGateDemandAbove, provideGateDemand, } from '../../gate-demand';
32
- import * as i0 from "@angular/core";
33
- import * as i1 from "../../primitives/shared";
34
- function createTimerScheduler() {
35
- const pending = new Set();
36
- return {
37
- schedule(callback, ms) {
38
- const id = setTimeout(() => {
39
- pending.delete(cancel);
40
- callback();
41
- }, ms);
42
- const cancel = () => {
43
- clearTimeout(id);
44
- pending.delete(cancel);
45
- };
46
- pending.add(cancel);
47
- return cancel;
48
- },
49
- cancelAll() {
50
- for (const cancel of [...pending])
51
- cancel();
52
- pending.clear();
53
- },
54
- };
55
- }
56
- export class TouchableOpacity {
57
- press = new EventEmitter();
58
- pressIn = new EventEmitter();
59
- pressOut = new EventEmitter();
60
- pressMove = new EventEmitter();
61
- longPress = new EventEmitter();
62
- hoverIn = new EventEmitter();
63
- hoverOut = new EventEmitter();
64
- accessibilityAction = new EventEmitter();
65
- accessibilityTap = new EventEmitter();
66
- magicTap = new EventEmitter();
67
- accessibilityEscape = new EventEmitter();
68
- // This wrapper binds the four gated accessibility events on the component it renders, which
69
- // Angular forces to be unconditional and which would light that component's gates on every
70
- // instance. It answers for them instead — see `gate-demand.ts`.
71
- gateDemandAbove = injectGateDemandAbove();
72
- wantsGate(name) {
73
- return gateWanted(this.gateDemandAbove, name, this[name]);
74
- }
75
- activeOpacity;
76
- delayPressIn;
77
- delayPressOut;
78
- minPressDuration;
79
- style;
80
- delayLongPress;
81
- delayHoverIn;
82
- delayHoverOut;
83
- disabled;
84
- cancelable;
85
- hitSlop;
86
- pressRetentionOffset;
87
- unstable_pressDelay;
88
- android_ripple;
89
- android_disableSound;
90
- testID;
91
- nativeID;
92
- hasTVPreferredFocus;
93
- nextFocusDown;
94
- nextFocusForward;
95
- nextFocusLeft;
96
- nextFocusRight;
97
- nextFocusUp;
98
- accessible;
99
- accessibilityLabel;
100
- accessibilityHint;
101
- accessibilityRole;
102
- accessibilityState;
103
- accessibilityValue;
104
- accessibilityActions;
105
- accessibilityLabelledBy;
106
- importantForAccessibility;
107
- accessibilityLiveRegion;
108
- screenReaderFocusable;
109
- accessibilityViewIsModal;
110
- accessibilityElementsHidden;
111
- accessibilityIgnoresInvertColors;
112
- accessibilityLanguage;
113
- accessibilityRespondsToUserInteraction;
114
- accessibilityShowsLargeContentViewer;
115
- accessibilityLargeContentTitle;
116
- ariaLabel;
117
- ariaBusy;
118
- ariaChecked;
119
- ariaDisabled;
120
- ariaExpanded;
121
- ariaHidden;
122
- ariaLabelledBy;
123
- ariaLive;
124
- ariaSelected;
125
- ariaModal;
126
- ariaValueMax;
127
- ariaValueMin;
128
- ariaValueNow;
129
- ariaValueText;
130
- id;
131
- role;
132
- // One Animated.Value per mount. Held by IDENTITY as a plain field (an engine object, never an
133
- // @Input / reactive wrap); the <symbiote-animated-view> leaf rasterizes it for the first paint
134
- // and drives it through setNativeProps every frame.
135
- //
136
- // RN seeds it from _getChildStyleOpacityWithDefault(props.style). Angular writes @Input()s AFTER
137
- // the field initializers run, so `style` is still undefined here — the real resting value is
138
- // seeded by the first ngOnChanges below, which still precedes the first template pass.
139
- opacity = new Animated.Value(RESTING_OPACITY);
140
- // The shared press-scheduling cell (delayPressIn timer + activation clock), persisted on the
141
- // instance; the machine's handlers are rebuilt per event over live @Input()s.
142
- runtime = createTouchableFeedbackRuntime();
143
- timers = createTimerScheduler();
144
- // What the last settle ran for. Undefined until the first ngOnChanges, which is the MOUNT.
145
- settled;
146
- // This component's OWN host — the non-painting anchor `class="..."` at the use site resolves
147
- // onto (see anchorHostStyle's doc comment) — NOT the <symbiote-animated-view> leaf one level down.
148
- elementRef = inject(ElementRef);
149
- // The (possibly animated) style the leaf reduces: the anchor's class-derived style first, then
150
- // the user's explicit style, then the live opacity layered on top (last wins via the style array
151
- // the commit layer flattens). `unknown` because the array mixes a plain style with an
152
- // AnimatedNode, exactly the bag AnimatedView's `style` input accepts.
153
- get animatedStyle() {
154
- return [this.anchorStyle(), this.style, { opacity: this.opacity }];
155
- }
156
- // The anchor's class-derived style is written by the renderer's addClass/removeClass at the USE
157
- // SITE - it never appears in SimpleChanges, and nothing about it dirties THIS component's view.
158
- // A `class=` present at creation therefore worked, while one toggled later did not: the parent
159
- // refreshed, the class landed on the anchor, and this component's own view was never refreshed,
160
- // so whatever merged the anchor style in was never re-evaluated. Polling it into a signal from
161
- // ngDoCheck fixes both halves: ngDoCheck runs during the PARENT's refresh even when this view is
162
- // skipped, and the signal write is what then marks this view for refresh. `signal.set`'s own
163
- // Object.is makes an unchanged poll a no-op, so there is no loop.
164
- anchorStyle = signal(undefined, /* @ts-ignore */
165
- ...(ngDevMode ? [{ debugName: "anchorStyle" }] : /* istanbul ignore next */ []));
166
- ngDoCheck() {
167
- this.anchorStyle.set(anchorHostStyle(this.elementRef));
168
- }
169
- // RN's componentDidUpdate: a changed `disabled` or a changed style opacity re-settles the view,
170
- // so a Touchable disabled mid-press does not stay stuck at its active opacity. The FIRST call is
171
- // the mount (ngOnChanges runs before ngOnInit and before the first template pass), so it seeds
172
- // the Value instead of animating — RN does this on update only, and a fade at mount would animate
173
- // away from the value the leaf is about to paint. A use site with no bindings gets no ngOnChanges
174
- // at all, and there the RESTING_OPACITY seed is already the right answer.
175
- ngOnChanges() {
176
- const settled = { disabled: this.disabled, resting: this.restingOpacity() };
177
- if (this.settled === undefined) {
178
- this.opacity.setValue(settled.resting);
179
- }
180
- else if (this.settled.disabled !== settled.disabled ||
181
- this.settled.resting !== settled.resting) {
182
- this.setOpacityTo(settled.resting, OPACITY_INACTIVE_DURATION_MS);
183
- }
184
- this.settled = settled;
185
- }
186
- // RN's componentWillUnmount: stop the animation so a teardown mid-fade leaves no driver running
187
- // against a node that is gone, and drop any press-out still deferred behind a timer.
188
- ngOnDestroy() {
189
- this.timers.cancelAll();
190
- this.opacity.resetAnimation();
191
- }
192
- // RN's _getChildStyleOpacityWithDefault: the fade settles at the opacity the CALLER's style asks
193
- // for, not at a hard 1 — a Touchable styled `opacity: 0.6` must come back to 0.6.
194
- restingOpacity() {
195
- return restingOpacityFromStyle(this.style);
196
- }
197
- setOpacityTo(toValue, duration) {
198
- Animated.timing(this.opacity, {
199
- toValue,
200
- duration,
201
- easing: Animated.Easing.inOut(Animated.Easing.quad),
202
- // RN's own (TouchableOpacity.js:242). opacity is natively drivable, so the fade survives a
203
- // busy JS thread — which is the entire point of press feedback.
204
- useNativeDriver: true,
205
- }).start();
206
- }
207
- // Built per event so the machine reads live @Input()s (delay/opacity); the runtime persists across
208
- // calls. The shared machine owns the scheduling — the adapter supplies only the native seam: the
209
- // Animated opacity fade + the @Output() emit, as activate/deactivate.
210
- feedbackHandlers() {
211
- return createTouchableFeedbackHandlers({
212
- delayPressIn: this.delayPressIn ?? 0,
213
- delayPressOut: this.delayPressOut ?? 0,
214
- // RN's Touchables override Pressability's own 130ms floor with 0; what holds the active
215
- // visual there is the fade's own duration, not a press-duration floor.
216
- minPressDuration: this.minPressDuration ?? TOUCHABLE_MIN_PRESS_DURATION_MS,
217
- schedule: this.timers.schedule,
218
- now: Date.now,
219
- }, this.runtime, {
220
- activate: (event) => {
221
- this.setOpacityTo(this.activeOpacity ?? DEFAULT_ACTIVE_OPACITY, OPACITY_ACTIVE_GRANT_DURATION_MS);
222
- this.pressIn.emit(event);
223
- },
224
- deactivate: (event) => {
225
- this.setOpacityTo(this.restingOpacity(), OPACITY_INACTIVE_DURATION_MS);
226
- this.pressOut.emit(event);
227
- },
228
- });
229
- }
230
- // Arrow fields (stable identity for OnPush, `this` intact when Pressable's `(pressIn)` invokes
231
- // them). The delayPressIn defer + minPressDuration/delayPressOut hold live in the shared machine.
232
- handlePressIn = (event) => {
233
- this.feedbackHandlers().handlePressIn(event);
234
- };
235
- handlePressOut = (event) => {
236
- this.feedbackHandlers().handlePressOut(event);
237
- };
238
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: TouchableOpacity, deps: [], target: i0.ɵɵFactoryTarget.Component });
239
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.8", type: TouchableOpacity, isStandalone: true, selector: "TouchableOpacity", inputs: { activeOpacity: "activeOpacity", delayPressIn: "delayPressIn", delayPressOut: "delayPressOut", minPressDuration: "minPressDuration", style: "style", delayLongPress: "delayLongPress", delayHoverIn: "delayHoverIn", delayHoverOut: "delayHoverOut", disabled: "disabled", cancelable: "cancelable", hitSlop: "hitSlop", pressRetentionOffset: "pressRetentionOffset", unstable_pressDelay: "unstable_pressDelay", android_ripple: "android_ripple", android_disableSound: "android_disableSound", testID: "testID", nativeID: "nativeID", hasTVPreferredFocus: "hasTVPreferredFocus", nextFocusDown: "nextFocusDown", nextFocusForward: "nextFocusForward", nextFocusLeft: "nextFocusLeft", nextFocusRight: "nextFocusRight", nextFocusUp: "nextFocusUp", accessible: "accessible", accessibilityLabel: "accessibilityLabel", accessibilityHint: "accessibilityHint", accessibilityRole: "accessibilityRole", accessibilityState: "accessibilityState", accessibilityValue: "accessibilityValue", accessibilityActions: "accessibilityActions", accessibilityLabelledBy: "accessibilityLabelledBy", importantForAccessibility: "importantForAccessibility", accessibilityLiveRegion: "accessibilityLiveRegion", screenReaderFocusable: "screenReaderFocusable", accessibilityViewIsModal: "accessibilityViewIsModal", accessibilityElementsHidden: "accessibilityElementsHidden", accessibilityIgnoresInvertColors: "accessibilityIgnoresInvertColors", accessibilityLanguage: "accessibilityLanguage", accessibilityRespondsToUserInteraction: "accessibilityRespondsToUserInteraction", accessibilityShowsLargeContentViewer: "accessibilityShowsLargeContentViewer", accessibilityLargeContentTitle: "accessibilityLargeContentTitle", ariaLabel: "ariaLabel", ariaBusy: "ariaBusy", ariaChecked: "ariaChecked", ariaDisabled: "ariaDisabled", ariaExpanded: "ariaExpanded", ariaHidden: "ariaHidden", ariaLabelledBy: "ariaLabelledBy", ariaLive: "ariaLive", ariaSelected: "ariaSelected", ariaModal: "ariaModal", ariaValueMax: "ariaValueMax", ariaValueMin: "ariaValueMin", ariaValueNow: "ariaValueNow", ariaValueText: "ariaValueText", id: "id", role: "role" }, outputs: { press: "press", pressIn: "pressIn", pressOut: "pressOut", pressMove: "pressMove", longPress: "longPress", hoverIn: "hoverIn", hoverOut: "hoverOut", accessibilityAction: "accessibilityAction", accessibilityTap: "accessibilityTap", magicTap: "magicTap", accessibilityEscape: "accessibilityEscape" }, usesOnChanges: true, hostDirectives: [{ directive: i1.SymbioteStyleInputDirective, inputs: ["style", "style"] }], ngImport: i0, template: `
240
- <Pressable
241
- [__minPressDuration]="0"
242
- (press)="press.emit($event)"
243
- (pressIn)="handlePressIn($event)"
244
- (pressOut)="handlePressOut($event)"
245
- (pressMove)="pressMove.emit($event)"
246
- (longPress)="longPress.emit($event)"
247
- (hoverIn)="hoverIn.emit($event)"
248
- (hoverOut)="hoverOut.emit($event)"
249
- [delayLongPress]="delayLongPress"
250
- [delayHoverIn]="delayHoverIn"
251
- [delayHoverOut]="delayHoverOut"
252
- [disabled]="disabled"
253
- [cancelable]="cancelable"
254
- [hitSlop]="hitSlop"
255
- [pressRetentionOffset]="pressRetentionOffset"
256
- [unstable_pressDelay]="unstable_pressDelay"
257
- [android_ripple]="android_ripple"
258
- [android_disableSound]="android_disableSound"
259
- [testID]="testID"
260
- [nativeID]="nativeID"
261
- [hasTVPreferredFocus]="hasTVPreferredFocus"
262
- [nextFocusDown]="nextFocusDown"
263
- [nextFocusForward]="nextFocusForward"
264
- [nextFocusLeft]="nextFocusLeft"
265
- [nextFocusRight]="nextFocusRight"
266
- [nextFocusUp]="nextFocusUp"
267
- [accessible]="accessible"
268
- [accessibilityLabel]="accessibilityLabel"
269
- [accessibilityHint]="accessibilityHint"
270
- [accessibilityRole]="accessibilityRole"
271
- [accessibilityState]="accessibilityState"
272
- [accessibilityValue]="accessibilityValue"
273
- [accessibilityActions]="accessibilityActions"
274
- [accessibilityLabelledBy]="accessibilityLabelledBy"
275
- [importantForAccessibility]="importantForAccessibility"
276
- [accessibilityLiveRegion]="accessibilityLiveRegion"
277
- [screenReaderFocusable]="screenReaderFocusable"
278
- [accessibilityViewIsModal]="accessibilityViewIsModal"
279
- [accessibilityElementsHidden]="accessibilityElementsHidden"
280
- [accessibilityIgnoresInvertColors]="accessibilityIgnoresInvertColors"
281
- [accessibilityLanguage]="accessibilityLanguage"
282
- [accessibilityRespondsToUserInteraction]="
283
- accessibilityRespondsToUserInteraction
284
- "
285
- [accessibilityShowsLargeContentViewer]="
286
- accessibilityShowsLargeContentViewer
287
- "
288
- [accessibilityLargeContentTitle]="accessibilityLargeContentTitle"
289
- (accessibilityAction)="accessibilityAction.emit($event)"
290
- (accessibilityTap)="accessibilityTap.emit($event)"
291
- (magicTap)="magicTap.emit($event)"
292
- (accessibilityEscape)="accessibilityEscape.emit($event)"
293
- [ariaLabel]="ariaLabel"
294
- [ariaBusy]="ariaBusy"
295
- [ariaChecked]="ariaChecked"
296
- [ariaDisabled]="ariaDisabled"
297
- [ariaExpanded]="ariaExpanded"
298
- [ariaHidden]="ariaHidden"
299
- [ariaLabelledBy]="ariaLabelledBy"
300
- [ariaLive]="ariaLive"
301
- [ariaSelected]="ariaSelected"
302
- [ariaModal]="ariaModal"
303
- [ariaValueMax]="ariaValueMax"
304
- [ariaValueMin]="ariaValueMin"
305
- [ariaValueNow]="ariaValueNow"
306
- [ariaValueText]="ariaValueText"
307
- [id]="id"
308
- [role]="role"
309
- >
310
- <symbiote-animated-view [style]="animatedStyle">
311
- <ng-content></ng-content>
312
- </symbiote-animated-view>
313
- </Pressable>
314
- `, isInline: true, dependencies: [{ kind: "component", type: Pressable, selector: "Pressable", inputs: ["delayLongPress", "disabled", "cancelable", "hitSlop", "pressRetentionOffset", "unstable_pressDelay", "__minPressDuration", "android_ripple", "android_disableSound", "delayHoverIn", "delayHoverOut", "testID", "nativeID", "hasTVPreferredFocus", "nextFocusDown", "nextFocusForward", "nextFocusLeft", "nextFocusRight", "nextFocusUp", "style", "accessible", "accessibilityLabel", "accessibilityHint", "accessibilityRole", "accessibilityState", "accessibilityValue", "accessibilityActions", "accessibilityLabelledBy", "importantForAccessibility", "accessibilityLiveRegion", "screenReaderFocusable", "accessibilityViewIsModal", "accessibilityElementsHidden", "accessibilityIgnoresInvertColors", "accessibilityLanguage", "accessibilityRespondsToUserInteraction", "accessibilityShowsLargeContentViewer", "accessibilityLargeContentTitle", "ariaLabel", "ariaBusy", "ariaChecked", "ariaDisabled", "ariaExpanded", "ariaHidden", "ariaLabelledBy", "ariaLive", "ariaSelected", "ariaModal", "ariaValueMax", "ariaValueMin", "ariaValueNow", "ariaValueText", "id", "role"], outputs: ["press", "pressIn", "pressOut", "pressMove", "longPress", "hoverIn", "hoverOut", "accessibilityAction", "accessibilityTap", "magicTap", "accessibilityEscape"] }, { kind: "component", type: AnimatedView, selector: "AnimatedView, symbiote-animated-view", inputs: ["style", "animatedProps", "passthroughAnimatedPropExplicitValues"] }], viewProviders: [provideGateDemand(() => TouchableOpacity)], changeDetection: i0.ChangeDetectionStrategy.OnPush });
315
- }
316
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: TouchableOpacity, decorators: [{
317
- type: Component,
318
- args: [{
319
- selector: 'TouchableOpacity',
320
- standalone: true,
321
- viewProviders: [provideGateDemand(() => TouchableOpacity)],
322
- hostDirectives: [
323
- { directive: SymbioteStyleInputDirective, inputs: ['style'] },
324
- ],
325
- schemas: [CUSTOM_ELEMENTS_SCHEMA],
326
- imports: [Pressable, AnimatedView],
327
- changeDetection: ChangeDetectionStrategy.OnPush,
328
- template: `
329
- <Pressable
330
- [__minPressDuration]="0"
331
- (press)="press.emit($event)"
332
- (pressIn)="handlePressIn($event)"
333
- (pressOut)="handlePressOut($event)"
334
- (pressMove)="pressMove.emit($event)"
335
- (longPress)="longPress.emit($event)"
336
- (hoverIn)="hoverIn.emit($event)"
337
- (hoverOut)="hoverOut.emit($event)"
338
- [delayLongPress]="delayLongPress"
339
- [delayHoverIn]="delayHoverIn"
340
- [delayHoverOut]="delayHoverOut"
341
- [disabled]="disabled"
342
- [cancelable]="cancelable"
343
- [hitSlop]="hitSlop"
344
- [pressRetentionOffset]="pressRetentionOffset"
345
- [unstable_pressDelay]="unstable_pressDelay"
346
- [android_ripple]="android_ripple"
347
- [android_disableSound]="android_disableSound"
348
- [testID]="testID"
349
- [nativeID]="nativeID"
350
- [hasTVPreferredFocus]="hasTVPreferredFocus"
351
- [nextFocusDown]="nextFocusDown"
352
- [nextFocusForward]="nextFocusForward"
353
- [nextFocusLeft]="nextFocusLeft"
354
- [nextFocusRight]="nextFocusRight"
355
- [nextFocusUp]="nextFocusUp"
356
- [accessible]="accessible"
357
- [accessibilityLabel]="accessibilityLabel"
358
- [accessibilityHint]="accessibilityHint"
359
- [accessibilityRole]="accessibilityRole"
360
- [accessibilityState]="accessibilityState"
361
- [accessibilityValue]="accessibilityValue"
362
- [accessibilityActions]="accessibilityActions"
363
- [accessibilityLabelledBy]="accessibilityLabelledBy"
364
- [importantForAccessibility]="importantForAccessibility"
365
- [accessibilityLiveRegion]="accessibilityLiveRegion"
366
- [screenReaderFocusable]="screenReaderFocusable"
367
- [accessibilityViewIsModal]="accessibilityViewIsModal"
368
- [accessibilityElementsHidden]="accessibilityElementsHidden"
369
- [accessibilityIgnoresInvertColors]="accessibilityIgnoresInvertColors"
370
- [accessibilityLanguage]="accessibilityLanguage"
371
- [accessibilityRespondsToUserInteraction]="
372
- accessibilityRespondsToUserInteraction
373
- "
374
- [accessibilityShowsLargeContentViewer]="
375
- accessibilityShowsLargeContentViewer
376
- "
377
- [accessibilityLargeContentTitle]="accessibilityLargeContentTitle"
378
- (accessibilityAction)="accessibilityAction.emit($event)"
379
- (accessibilityTap)="accessibilityTap.emit($event)"
380
- (magicTap)="magicTap.emit($event)"
381
- (accessibilityEscape)="accessibilityEscape.emit($event)"
382
- [ariaLabel]="ariaLabel"
383
- [ariaBusy]="ariaBusy"
384
- [ariaChecked]="ariaChecked"
385
- [ariaDisabled]="ariaDisabled"
386
- [ariaExpanded]="ariaExpanded"
387
- [ariaHidden]="ariaHidden"
388
- [ariaLabelledBy]="ariaLabelledBy"
389
- [ariaLive]="ariaLive"
390
- [ariaSelected]="ariaSelected"
391
- [ariaModal]="ariaModal"
392
- [ariaValueMax]="ariaValueMax"
393
- [ariaValueMin]="ariaValueMin"
394
- [ariaValueNow]="ariaValueNow"
395
- [ariaValueText]="ariaValueText"
396
- [id]="id"
397
- [role]="role"
398
- >
399
- <symbiote-animated-view [style]="animatedStyle">
400
- <ng-content></ng-content>
401
- </symbiote-animated-view>
402
- </Pressable>
403
- `,
404
- }]
405
- }], propDecorators: { press: [{
406
- type: Output
407
- }], pressIn: [{
408
- type: Output
409
- }], pressOut: [{
410
- type: Output
411
- }], pressMove: [{
412
- type: Output
413
- }], longPress: [{
414
- type: Output
415
- }], hoverIn: [{
416
- type: Output
417
- }], hoverOut: [{
418
- type: Output
419
- }], accessibilityAction: [{
420
- type: Output
421
- }], accessibilityTap: [{
422
- type: Output
423
- }], magicTap: [{
424
- type: Output
425
- }], accessibilityEscape: [{
426
- type: Output
427
- }], activeOpacity: [{
428
- type: Input
429
- }], delayPressIn: [{
430
- type: Input
431
- }], delayPressOut: [{
432
- type: Input
433
- }], minPressDuration: [{
434
- type: Input
435
- }], style: [{
436
- type: Input
437
- }], delayLongPress: [{
438
- type: Input
439
- }], delayHoverIn: [{
440
- type: Input
441
- }], delayHoverOut: [{
442
- type: Input
443
- }], disabled: [{
444
- type: Input
445
- }], cancelable: [{
446
- type: Input
447
- }], hitSlop: [{
448
- type: Input
449
- }], pressRetentionOffset: [{
450
- type: Input
451
- }], unstable_pressDelay: [{
452
- type: Input
453
- }], android_ripple: [{
454
- type: Input
455
- }], android_disableSound: [{
456
- type: Input
457
- }], testID: [{
458
- type: Input
459
- }], nativeID: [{
460
- type: Input
461
- }], hasTVPreferredFocus: [{
462
- type: Input
463
- }], nextFocusDown: [{
464
- type: Input
465
- }], nextFocusForward: [{
466
- type: Input
467
- }], nextFocusLeft: [{
468
- type: Input
469
- }], nextFocusRight: [{
470
- type: Input
471
- }], nextFocusUp: [{
472
- type: Input
473
- }], accessible: [{
474
- type: Input
475
- }], accessibilityLabel: [{
476
- type: Input
477
- }], accessibilityHint: [{
478
- type: Input
479
- }], accessibilityRole: [{
480
- type: Input
481
- }], accessibilityState: [{
482
- type: Input
483
- }], accessibilityValue: [{
484
- type: Input
485
- }], accessibilityActions: [{
486
- type: Input
487
- }], accessibilityLabelledBy: [{
488
- type: Input
489
- }], importantForAccessibility: [{
490
- type: Input
491
- }], accessibilityLiveRegion: [{
492
- type: Input
493
- }], screenReaderFocusable: [{
494
- type: Input
495
- }], accessibilityViewIsModal: [{
496
- type: Input
497
- }], accessibilityElementsHidden: [{
498
- type: Input
499
- }], accessibilityIgnoresInvertColors: [{
500
- type: Input
501
- }], accessibilityLanguage: [{
502
- type: Input
503
- }], accessibilityRespondsToUserInteraction: [{
504
- type: Input
505
- }], accessibilityShowsLargeContentViewer: [{
506
- type: Input
507
- }], accessibilityLargeContentTitle: [{
508
- type: Input
509
- }], ariaLabel: [{
510
- type: Input
511
- }], ariaBusy: [{
512
- type: Input
513
- }], ariaChecked: [{
514
- type: Input
515
- }], ariaDisabled: [{
516
- type: Input
517
- }], ariaExpanded: [{
518
- type: Input
519
- }], ariaHidden: [{
520
- type: Input
521
- }], ariaLabelledBy: [{
522
- type: Input
523
- }], ariaLive: [{
524
- type: Input
525
- }], ariaSelected: [{
526
- type: Input
527
- }], ariaModal: [{
528
- type: Input
529
- }], ariaValueMax: [{
530
- type: Input
531
- }], ariaValueMin: [{
532
- type: Input
533
- }], ariaValueNow: [{
534
- type: Input
535
- }], ariaValueText: [{
536
- type: Input
537
- }], id: [{
538
- type: Input
539
- }], role: [{
540
- type: Input
541
- }] } });
542
- export class TouchableHighlight {
543
- press = new EventEmitter();
544
- pressIn = new EventEmitter();
545
- pressOut = new EventEmitter();
546
- pressMove = new EventEmitter();
547
- longPress = new EventEmitter();
548
- hoverIn = new EventEmitter();
549
- hoverOut = new EventEmitter();
550
- accessibilityAction = new EventEmitter();
551
- accessibilityTap = new EventEmitter();
552
- magicTap = new EventEmitter();
553
- accessibilityEscape = new EventEmitter();
554
- // This wrapper binds the four gated accessibility events on the component it renders, which
555
- // Angular forces to be unconditional and which would light that component's gates on every
556
- // instance. It answers for them instead — see `gate-demand.ts`.
557
- gateDemandAbove = injectGateDemandAbove();
558
- wantsGate(name) {
559
- return gateWanted(this.gateDemandAbove, name, this[name]);
560
- }
561
- // RN's onShowUnderlay / onHideUnderlay — fired on a real transition only, never on a repeat.
562
- showUnderlay = new EventEmitter();
563
- hideUnderlay = new EventEmitter();
564
- activeOpacity;
565
- underlayColor;
566
- delayPressIn;
567
- delayPressOut;
568
- minPressDuration;
569
- style;
570
- delayLongPress;
571
- delayHoverIn;
572
- delayHoverOut;
573
- disabled;
574
- cancelable;
575
- hitSlop;
576
- pressRetentionOffset;
577
- unstable_pressDelay;
578
- android_ripple;
579
- android_disableSound;
580
- testID;
581
- nativeID;
582
- hasTVPreferredFocus;
583
- nextFocusDown;
584
- nextFocusForward;
585
- nextFocusLeft;
586
- nextFocusRight;
587
- nextFocusUp;
588
- accessible;
589
- accessibilityLabel;
590
- accessibilityHint;
591
- accessibilityRole;
592
- accessibilityState;
593
- accessibilityValue;
594
- accessibilityActions;
595
- accessibilityLabelledBy;
596
- importantForAccessibility;
597
- accessibilityLiveRegion;
598
- screenReaderFocusable;
599
- accessibilityViewIsModal;
600
- accessibilityElementsHidden;
601
- accessibilityIgnoresInvertColors;
602
- accessibilityLanguage;
603
- accessibilityRespondsToUserInteraction;
604
- accessibilityShowsLargeContentViewer;
605
- accessibilityLargeContentTitle;
606
- ariaLabel;
607
- ariaBusy;
608
- ariaChecked;
609
- ariaDisabled;
610
- ariaExpanded;
611
- ariaHidden;
612
- ariaLabelledBy;
613
- ariaLive;
614
- ariaSelected;
615
- ariaModal;
616
- ariaValueMax;
617
- ariaValueMin;
618
- ariaValueNow;
619
- ariaValueText;
620
- id;
621
- role;
622
- // This component's OWN host — the non-painting anchor `class="..."` at the use site resolves
623
- // onto (see anchorHostStyle's doc comment) — NOT the Pressable one level down.
624
- elementRef = inject(ElementRef);
625
- // `shown` is NOT Pressable's `pressed`. RN holds the underlay for delayPressOut past the tap so a
626
- // press too fast to see still flashes, and the pressed flag is already false by then. A SIGNAL,
627
- // because the hide fires from a timer — outside any Angular listener, so under zoneless CD
628
- // nothing else would mark this view. A signal write both notifies the change-detection scheduler
629
- // (markAncestorsForTraversal) and dirties this template's own reactive consumer, which is the one
630
- // thing honored in Targeted mode; markForCheck from a plain field would not be reachable here.
631
- shown = signal(false, /* @ts-ignore */
632
- ...(ngDevMode ? [{ debugName: "shown" }] : /* istanbul ignore next */ []));
633
- underlayRuntime = createHighlightUnderlayRuntime();
634
- timers = createTimerScheduler();
635
- // The container style Pressable paints.
636
- //
637
- // POINT-7 DECISION — both halves stay on the CONTAINER, deliberately. RN's _createExtraStyles
638
- // keeps them apart: `underlay` (the backgroundColor) on the container, `child` (the lowered
639
- // opacity) cloned onto the single child. Angular has no cloneElement and no way to reach a
640
- // projected <ng-content> node, so the only path to the child is a permanent wrapper View — which
641
- // inserts a node into the flex chain and silently re-parents any `flex` a child declares. The
642
- // fake Fabric runs no Yoga, so no headless test can measure that damage, only assert the extra
643
- // node exists; shipping an unmeasurable layout change is worse than the visual approximation.
644
- // Same call, same reason, as the Solid adapter. resolveHighlightExtraStyles keeps the two styles
645
- // SEPARATE regardless, so a layout-safe fix (which needs a device check, not a test) stays open.
646
- //
647
- // Returns a NEW ARRAY whenever a dependency moves: Pressable's `style` @Input then reports an
648
- // ordinary change. A stable reference was the earlier bug — Pressable's view never refreshed, so
649
- // a class or [style] toggled after mount never reached the committed view.
650
- containerStyle = computed(() => {
651
- this.inputsRevision();
652
- const base = [this.anchorStyle(), this.style];
653
- const extra = resolveHighlightExtraStyles({
654
- shown: this.shown(),
655
- hasPressHandler: this.hasPressHandler(),
656
- underlayColor: this.underlayColor,
657
- activeOpacity: this.activeOpacity,
658
- });
659
- return extra === undefined ? base : [base, extra.underlay, extra.child];
660
- }, /* @ts-ignore */
661
- ...(ngDevMode ? [{ debugName: "containerStyle" }] : /* istanbul ignore next */ []));
662
- // RN's _hasPressHandler: a Touchable that handles no press paints no underlay. Angular exposes
663
- // the press lifecycle as @Output()s, so "a handler is present" is "something is subscribed" — the
664
- // same `.observed` test Pressable uses to decide whether to arm its long-press timer at all.
665
- hasPressHandler() {
666
- return hasTouchablePressHandler({
667
- onPress: this.press.observed ? this.press : undefined,
668
- onPressIn: this.pressIn.observed ? this.pressIn : undefined,
669
- onPressOut: this.pressOut.observed ? this.pressOut : undefined,
670
- onLongPress: this.longPress.observed ? this.longPress : undefined,
671
- });
672
- }
673
- // Built per event so the machine reads live @Input()s (delayPressOut, the has-handler gate); the
674
- // runtime persists across calls, which is what lets handlePressOut see the timer handlePress set.
675
- underlayHandlers() {
676
- return createHighlightUnderlayHandlers({
677
- delayPressOut: this.delayPressOut ?? 0,
678
- hasPressHandler: this.hasPressHandler(),
679
- schedule: this.timers.schedule,
680
- }, this.underlayRuntime, {
681
- setShown: (shown) => this.shown.set(shown),
682
- onShowUnderlay: () => this.showUnderlay.emit(),
683
- onHideUnderlay: () => this.hideUnderlay.emit(),
684
- });
685
- }
686
- // Visual first, then the caller's own event — RN's order in _createPressabilityConfig.
687
- // onLongPress is deliberately NOT intercepted (Pressable emits it straight through); it is only
688
- // READ, by the has-press-handler gate above.
689
- handlePressIn(event) {
690
- this.underlayHandlers().handlePressIn(event);
691
- this.pressIn.emit(event);
692
- }
693
- handlePress(event) {
694
- this.underlayHandlers().handlePress(event);
695
- this.press.emit(event);
696
- }
697
- handlePressOut(event) {
698
- this.underlayHandlers().handlePressOut(event);
699
- this.pressOut.emit(event);
700
- }
701
- ngOnDestroy() {
702
- this.timers.cancelAll();
703
- }
704
- // `style`, `underlayColor` and `activeOpacity` are read untracked inside containerStyle, so the
705
- // bump is what tells it they moved. See the ngDoCheck note below for the anchor half, which
706
- // ngOnChanges cannot cover.
707
- inputsRevision = signal(0, /* @ts-ignore */
708
- ...(ngDevMode ? [{ debugName: "inputsRevision" }] : /* istanbul ignore next */ []));
709
- anchorStyle = signal(undefined, /* @ts-ignore */
710
- ...(ngDevMode ? [{ debugName: "anchorStyle" }] : /* istanbul ignore next */ []));
711
- ngOnChanges() {
712
- this.inputsRevision.update(revision => revision + 1);
713
- }
714
- // The anchor's class-derived style is written by the renderer's addClass/removeClass at the USE
715
- // SITE - it never appears in SimpleChanges, and nothing about it dirties THIS component's view.
716
- // ngDoCheck runs during the PARENT's refresh even when this view is skipped, and the signal
717
- // write is what then marks this view for refresh. `signal.set`'s own Object.is makes an
718
- // unchanged poll a no-op, so there is no loop.
719
- ngDoCheck() {
720
- this.anchorStyle.set(anchorStyleProp(this.elementRef));
721
- }
722
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: TouchableHighlight, deps: [], target: i0.ɵɵFactoryTarget.Component });
723
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.8", type: TouchableHighlight, isStandalone: true, selector: "TouchableHighlight", inputs: { activeOpacity: "activeOpacity", underlayColor: "underlayColor", delayPressIn: "delayPressIn", delayPressOut: "delayPressOut", minPressDuration: "minPressDuration", style: "style", delayLongPress: "delayLongPress", delayHoverIn: "delayHoverIn", delayHoverOut: "delayHoverOut", disabled: "disabled", cancelable: "cancelable", hitSlop: "hitSlop", pressRetentionOffset: "pressRetentionOffset", unstable_pressDelay: "unstable_pressDelay", android_ripple: "android_ripple", android_disableSound: "android_disableSound", testID: "testID", nativeID: "nativeID", hasTVPreferredFocus: "hasTVPreferredFocus", nextFocusDown: "nextFocusDown", nextFocusForward: "nextFocusForward", nextFocusLeft: "nextFocusLeft", nextFocusRight: "nextFocusRight", nextFocusUp: "nextFocusUp", accessible: "accessible", accessibilityLabel: "accessibilityLabel", accessibilityHint: "accessibilityHint", accessibilityRole: "accessibilityRole", accessibilityState: "accessibilityState", accessibilityValue: "accessibilityValue", accessibilityActions: "accessibilityActions", accessibilityLabelledBy: "accessibilityLabelledBy", importantForAccessibility: "importantForAccessibility", accessibilityLiveRegion: "accessibilityLiveRegion", screenReaderFocusable: "screenReaderFocusable", accessibilityViewIsModal: "accessibilityViewIsModal", accessibilityElementsHidden: "accessibilityElementsHidden", accessibilityIgnoresInvertColors: "accessibilityIgnoresInvertColors", accessibilityLanguage: "accessibilityLanguage", accessibilityRespondsToUserInteraction: "accessibilityRespondsToUserInteraction", accessibilityShowsLargeContentViewer: "accessibilityShowsLargeContentViewer", accessibilityLargeContentTitle: "accessibilityLargeContentTitle", ariaLabel: "ariaLabel", ariaBusy: "ariaBusy", ariaChecked: "ariaChecked", ariaDisabled: "ariaDisabled", ariaExpanded: "ariaExpanded", ariaHidden: "ariaHidden", ariaLabelledBy: "ariaLabelledBy", ariaLive: "ariaLive", ariaSelected: "ariaSelected", ariaModal: "ariaModal", ariaValueMax: "ariaValueMax", ariaValueMin: "ariaValueMin", ariaValueNow: "ariaValueNow", ariaValueText: "ariaValueText", id: "id", role: "role" }, outputs: { press: "press", pressIn: "pressIn", pressOut: "pressOut", pressMove: "pressMove", longPress: "longPress", hoverIn: "hoverIn", hoverOut: "hoverOut", accessibilityAction: "accessibilityAction", accessibilityTap: "accessibilityTap", magicTap: "magicTap", accessibilityEscape: "accessibilityEscape", showUnderlay: "showUnderlay", hideUnderlay: "hideUnderlay" }, usesOnChanges: true, hostDirectives: [{ directive: i1.SymbioteStyleInputDirective, inputs: ["style", "style"] }], ngImport: i0, template: `
724
- <Pressable
725
- [__minPressDuration]="0"
726
- [style]="containerStyle()"
727
- (press)="handlePress($event)"
728
- (pressIn)="handlePressIn($event)"
729
- (pressOut)="handlePressOut($event)"
730
- (pressMove)="pressMove.emit($event)"
731
- (longPress)="longPress.emit($event)"
732
- (hoverIn)="hoverIn.emit($event)"
733
- (hoverOut)="hoverOut.emit($event)"
734
- [delayLongPress]="delayLongPress"
735
- [delayHoverIn]="delayHoverIn"
736
- [delayHoverOut]="delayHoverOut"
737
- [disabled]="disabled"
738
- [cancelable]="cancelable"
739
- [hitSlop]="hitSlop"
740
- [pressRetentionOffset]="pressRetentionOffset"
741
- [unstable_pressDelay]="unstable_pressDelay"
742
- [android_ripple]="android_ripple"
743
- [android_disableSound]="android_disableSound"
744
- [testID]="testID"
745
- [nativeID]="nativeID"
746
- [hasTVPreferredFocus]="hasTVPreferredFocus"
747
- [nextFocusDown]="nextFocusDown"
748
- [nextFocusForward]="nextFocusForward"
749
- [nextFocusLeft]="nextFocusLeft"
750
- [nextFocusRight]="nextFocusRight"
751
- [nextFocusUp]="nextFocusUp"
752
- [accessible]="accessible"
753
- [accessibilityLabel]="accessibilityLabel"
754
- [accessibilityHint]="accessibilityHint"
755
- [accessibilityRole]="accessibilityRole"
756
- [accessibilityState]="accessibilityState"
757
- [accessibilityValue]="accessibilityValue"
758
- [accessibilityActions]="accessibilityActions"
759
- [accessibilityLabelledBy]="accessibilityLabelledBy"
760
- [importantForAccessibility]="importantForAccessibility"
761
- [accessibilityLiveRegion]="accessibilityLiveRegion"
762
- [screenReaderFocusable]="screenReaderFocusable"
763
- [accessibilityViewIsModal]="accessibilityViewIsModal"
764
- [accessibilityElementsHidden]="accessibilityElementsHidden"
765
- [accessibilityIgnoresInvertColors]="accessibilityIgnoresInvertColors"
766
- [accessibilityLanguage]="accessibilityLanguage"
767
- [accessibilityRespondsToUserInteraction]="
768
- accessibilityRespondsToUserInteraction
769
- "
770
- [accessibilityShowsLargeContentViewer]="
771
- accessibilityShowsLargeContentViewer
772
- "
773
- [accessibilityLargeContentTitle]="accessibilityLargeContentTitle"
774
- (accessibilityAction)="accessibilityAction.emit($event)"
775
- (accessibilityTap)="accessibilityTap.emit($event)"
776
- (magicTap)="magicTap.emit($event)"
777
- (accessibilityEscape)="accessibilityEscape.emit($event)"
778
- [ariaLabel]="ariaLabel"
779
- [ariaBusy]="ariaBusy"
780
- [ariaChecked]="ariaChecked"
781
- [ariaDisabled]="ariaDisabled"
782
- [ariaExpanded]="ariaExpanded"
783
- [ariaHidden]="ariaHidden"
784
- [ariaLabelledBy]="ariaLabelledBy"
785
- [ariaLive]="ariaLive"
786
- [ariaSelected]="ariaSelected"
787
- [ariaModal]="ariaModal"
788
- [ariaValueMax]="ariaValueMax"
789
- [ariaValueMin]="ariaValueMin"
790
- [ariaValueNow]="ariaValueNow"
791
- [ariaValueText]="ariaValueText"
792
- [id]="id"
793
- [role]="role"
794
- >
795
- <ng-content></ng-content>
796
- </Pressable>
797
- `, isInline: true, dependencies: [{ kind: "component", type: Pressable, selector: "Pressable", inputs: ["delayLongPress", "disabled", "cancelable", "hitSlop", "pressRetentionOffset", "unstable_pressDelay", "__minPressDuration", "android_ripple", "android_disableSound", "delayHoverIn", "delayHoverOut", "testID", "nativeID", "hasTVPreferredFocus", "nextFocusDown", "nextFocusForward", "nextFocusLeft", "nextFocusRight", "nextFocusUp", "style", "accessible", "accessibilityLabel", "accessibilityHint", "accessibilityRole", "accessibilityState", "accessibilityValue", "accessibilityActions", "accessibilityLabelledBy", "importantForAccessibility", "accessibilityLiveRegion", "screenReaderFocusable", "accessibilityViewIsModal", "accessibilityElementsHidden", "accessibilityIgnoresInvertColors", "accessibilityLanguage", "accessibilityRespondsToUserInteraction", "accessibilityShowsLargeContentViewer", "accessibilityLargeContentTitle", "ariaLabel", "ariaBusy", "ariaChecked", "ariaDisabled", "ariaExpanded", "ariaHidden", "ariaLabelledBy", "ariaLive", "ariaSelected", "ariaModal", "ariaValueMax", "ariaValueMin", "ariaValueNow", "ariaValueText", "id", "role"], outputs: ["press", "pressIn", "pressOut", "pressMove", "longPress", "hoverIn", "hoverOut", "accessibilityAction", "accessibilityTap", "magicTap", "accessibilityEscape"] }], viewProviders: [provideGateDemand(() => TouchableHighlight)], changeDetection: i0.ChangeDetectionStrategy.OnPush });
798
- }
799
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: TouchableHighlight, decorators: [{
800
- type: Component,
801
- args: [{
802
- selector: 'TouchableHighlight',
803
- standalone: true,
804
- viewProviders: [provideGateDemand(() => TouchableHighlight)],
805
- hostDirectives: [
806
- { directive: SymbioteStyleInputDirective, inputs: ['style'] },
807
- ],
808
- imports: [Pressable],
809
- changeDetection: ChangeDetectionStrategy.OnPush,
810
- template: `
811
- <Pressable
812
- [__minPressDuration]="0"
813
- [style]="containerStyle()"
814
- (press)="handlePress($event)"
815
- (pressIn)="handlePressIn($event)"
816
- (pressOut)="handlePressOut($event)"
817
- (pressMove)="pressMove.emit($event)"
818
- (longPress)="longPress.emit($event)"
819
- (hoverIn)="hoverIn.emit($event)"
820
- (hoverOut)="hoverOut.emit($event)"
821
- [delayLongPress]="delayLongPress"
822
- [delayHoverIn]="delayHoverIn"
823
- [delayHoverOut]="delayHoverOut"
824
- [disabled]="disabled"
825
- [cancelable]="cancelable"
826
- [hitSlop]="hitSlop"
827
- [pressRetentionOffset]="pressRetentionOffset"
828
- [unstable_pressDelay]="unstable_pressDelay"
829
- [android_ripple]="android_ripple"
830
- [android_disableSound]="android_disableSound"
831
- [testID]="testID"
832
- [nativeID]="nativeID"
833
- [hasTVPreferredFocus]="hasTVPreferredFocus"
834
- [nextFocusDown]="nextFocusDown"
835
- [nextFocusForward]="nextFocusForward"
836
- [nextFocusLeft]="nextFocusLeft"
837
- [nextFocusRight]="nextFocusRight"
838
- [nextFocusUp]="nextFocusUp"
839
- [accessible]="accessible"
840
- [accessibilityLabel]="accessibilityLabel"
841
- [accessibilityHint]="accessibilityHint"
842
- [accessibilityRole]="accessibilityRole"
843
- [accessibilityState]="accessibilityState"
844
- [accessibilityValue]="accessibilityValue"
845
- [accessibilityActions]="accessibilityActions"
846
- [accessibilityLabelledBy]="accessibilityLabelledBy"
847
- [importantForAccessibility]="importantForAccessibility"
848
- [accessibilityLiveRegion]="accessibilityLiveRegion"
849
- [screenReaderFocusable]="screenReaderFocusable"
850
- [accessibilityViewIsModal]="accessibilityViewIsModal"
851
- [accessibilityElementsHidden]="accessibilityElementsHidden"
852
- [accessibilityIgnoresInvertColors]="accessibilityIgnoresInvertColors"
853
- [accessibilityLanguage]="accessibilityLanguage"
854
- [accessibilityRespondsToUserInteraction]="
855
- accessibilityRespondsToUserInteraction
856
- "
857
- [accessibilityShowsLargeContentViewer]="
858
- accessibilityShowsLargeContentViewer
859
- "
860
- [accessibilityLargeContentTitle]="accessibilityLargeContentTitle"
861
- (accessibilityAction)="accessibilityAction.emit($event)"
862
- (accessibilityTap)="accessibilityTap.emit($event)"
863
- (magicTap)="magicTap.emit($event)"
864
- (accessibilityEscape)="accessibilityEscape.emit($event)"
865
- [ariaLabel]="ariaLabel"
866
- [ariaBusy]="ariaBusy"
867
- [ariaChecked]="ariaChecked"
868
- [ariaDisabled]="ariaDisabled"
869
- [ariaExpanded]="ariaExpanded"
870
- [ariaHidden]="ariaHidden"
871
- [ariaLabelledBy]="ariaLabelledBy"
872
- [ariaLive]="ariaLive"
873
- [ariaSelected]="ariaSelected"
874
- [ariaModal]="ariaModal"
875
- [ariaValueMax]="ariaValueMax"
876
- [ariaValueMin]="ariaValueMin"
877
- [ariaValueNow]="ariaValueNow"
878
- [ariaValueText]="ariaValueText"
879
- [id]="id"
880
- [role]="role"
881
- >
882
- <ng-content></ng-content>
883
- </Pressable>
884
- `,
885
- }]
886
- }], propDecorators: { press: [{
887
- type: Output
888
- }], pressIn: [{
889
- type: Output
890
- }], pressOut: [{
891
- type: Output
892
- }], pressMove: [{
893
- type: Output
894
- }], longPress: [{
895
- type: Output
896
- }], hoverIn: [{
897
- type: Output
898
- }], hoverOut: [{
899
- type: Output
900
- }], accessibilityAction: [{
901
- type: Output
902
- }], accessibilityTap: [{
903
- type: Output
904
- }], magicTap: [{
905
- type: Output
906
- }], accessibilityEscape: [{
907
- type: Output
908
- }], showUnderlay: [{
909
- type: Output
910
- }], hideUnderlay: [{
911
- type: Output
912
- }], activeOpacity: [{
913
- type: Input
914
- }], underlayColor: [{
915
- type: Input
916
- }], delayPressIn: [{
917
- type: Input
918
- }], delayPressOut: [{
919
- type: Input
920
- }], minPressDuration: [{
921
- type: Input
922
- }], style: [{
923
- type: Input
924
- }], delayLongPress: [{
925
- type: Input
926
- }], delayHoverIn: [{
927
- type: Input
928
- }], delayHoverOut: [{
929
- type: Input
930
- }], disabled: [{
931
- type: Input
932
- }], cancelable: [{
933
- type: Input
934
- }], hitSlop: [{
935
- type: Input
936
- }], pressRetentionOffset: [{
937
- type: Input
938
- }], unstable_pressDelay: [{
939
- type: Input
940
- }], android_ripple: [{
941
- type: Input
942
- }], android_disableSound: [{
943
- type: Input
944
- }], testID: [{
945
- type: Input
946
- }], nativeID: [{
947
- type: Input
948
- }], hasTVPreferredFocus: [{
949
- type: Input
950
- }], nextFocusDown: [{
951
- type: Input
952
- }], nextFocusForward: [{
953
- type: Input
954
- }], nextFocusLeft: [{
955
- type: Input
956
- }], nextFocusRight: [{
957
- type: Input
958
- }], nextFocusUp: [{
959
- type: Input
960
- }], accessible: [{
961
- type: Input
962
- }], accessibilityLabel: [{
963
- type: Input
964
- }], accessibilityHint: [{
965
- type: Input
966
- }], accessibilityRole: [{
967
- type: Input
968
- }], accessibilityState: [{
969
- type: Input
970
- }], accessibilityValue: [{
971
- type: Input
972
- }], accessibilityActions: [{
973
- type: Input
974
- }], accessibilityLabelledBy: [{
975
- type: Input
976
- }], importantForAccessibility: [{
977
- type: Input
978
- }], accessibilityLiveRegion: [{
979
- type: Input
980
- }], screenReaderFocusable: [{
981
- type: Input
982
- }], accessibilityViewIsModal: [{
983
- type: Input
984
- }], accessibilityElementsHidden: [{
985
- type: Input
986
- }], accessibilityIgnoresInvertColors: [{
987
- type: Input
988
- }], accessibilityLanguage: [{
989
- type: Input
990
- }], accessibilityRespondsToUserInteraction: [{
991
- type: Input
992
- }], accessibilityShowsLargeContentViewer: [{
993
- type: Input
994
- }], accessibilityLargeContentTitle: [{
995
- type: Input
996
- }], ariaLabel: [{
997
- type: Input
998
- }], ariaBusy: [{
999
- type: Input
1000
- }], ariaChecked: [{
1001
- type: Input
1002
- }], ariaDisabled: [{
1003
- type: Input
1004
- }], ariaExpanded: [{
1005
- type: Input
1006
- }], ariaHidden: [{
1007
- type: Input
1008
- }], ariaLabelledBy: [{
1009
- type: Input
1010
- }], ariaLive: [{
1011
- type: Input
1012
- }], ariaSelected: [{
1013
- type: Input
1014
- }], ariaModal: [{
1015
- type: Input
1016
- }], ariaValueMax: [{
1017
- type: Input
1018
- }], ariaValueMin: [{
1019
- type: Input
1020
- }], ariaValueNow: [{
1021
- type: Input
1022
- }], ariaValueText: [{
1023
- type: Input
1024
- }], id: [{
1025
- type: Input
1026
- }], role: [{
1027
- type: Input
1028
- }] } });
1029
- export class TouchableWithoutFeedback {
1030
- // RN's TouchableWithoutFeedback builds a FULL Pressability config with delayPressIn /
1031
- // delayPressOut / minPressDuration: 0 — "without feedback" means no VISUAL, not no timing. So the
1032
- // same shared machine TouchableOpacity uses runs here, with the visual half left empty: the
1033
- // pressIn/pressOut EMIT is what gets deferred and floored.
1034
- press = new EventEmitter();
1035
- pressIn = new EventEmitter();
1036
- pressOut = new EventEmitter();
1037
- pressMove = new EventEmitter();
1038
- longPress = new EventEmitter();
1039
- hoverIn = new EventEmitter();
1040
- hoverOut = new EventEmitter();
1041
- accessibilityAction = new EventEmitter();
1042
- accessibilityTap = new EventEmitter();
1043
- magicTap = new EventEmitter();
1044
- accessibilityEscape = new EventEmitter();
1045
- // This wrapper binds the four gated accessibility events on the component it renders, which
1046
- // Angular forces to be unconditional and which would light that component's gates on every
1047
- // instance. It answers for them instead — see `gate-demand.ts`.
1048
- gateDemandAbove = injectGateDemandAbove();
1049
- wantsGate(name) {
1050
- return gateWanted(this.gateDemandAbove, name, this[name]);
1051
- }
1052
- delayPressIn;
1053
- delayPressOut;
1054
- minPressDuration;
1055
- style;
1056
- delayLongPress;
1057
- delayHoverIn;
1058
- delayHoverOut;
1059
- disabled;
1060
- cancelable;
1061
- hitSlop;
1062
- pressRetentionOffset;
1063
- unstable_pressDelay;
1064
- android_ripple;
1065
- android_disableSound;
1066
- testID;
1067
- nativeID;
1068
- hasTVPreferredFocus;
1069
- nextFocusDown;
1070
- nextFocusForward;
1071
- nextFocusLeft;
1072
- nextFocusRight;
1073
- nextFocusUp;
1074
- accessible;
1075
- accessibilityLabel;
1076
- accessibilityHint;
1077
- accessibilityRole;
1078
- accessibilityState;
1079
- accessibilityValue;
1080
- accessibilityActions;
1081
- accessibilityLabelledBy;
1082
- importantForAccessibility;
1083
- accessibilityLiveRegion;
1084
- screenReaderFocusable;
1085
- accessibilityViewIsModal;
1086
- accessibilityElementsHidden;
1087
- accessibilityIgnoresInvertColors;
1088
- accessibilityLanguage;
1089
- accessibilityRespondsToUserInteraction;
1090
- accessibilityShowsLargeContentViewer;
1091
- accessibilityLargeContentTitle;
1092
- ariaLabel;
1093
- ariaBusy;
1094
- ariaChecked;
1095
- ariaDisabled;
1096
- ariaExpanded;
1097
- ariaHidden;
1098
- ariaLabelledBy;
1099
- ariaLive;
1100
- ariaSelected;
1101
- ariaModal;
1102
- ariaValueMax;
1103
- ariaValueMin;
1104
- ariaValueNow;
1105
- ariaValueText;
1106
- id;
1107
- role;
1108
- // This component's OWN host — the non-painting anchor `class="..."` at the use site resolves
1109
- // onto (see anchorHostStyle's doc comment) — NOT the Pressable one level down.
1110
- elementRef = inject(ElementRef);
1111
- // The shared press-scheduling cell (delayPressIn timer + activation clock), persisted on the
1112
- // instance; the machine's handlers are rebuilt per event over live @Input()s.
1113
- runtime = createTouchableFeedbackRuntime();
1114
- timers = createTimerScheduler();
1115
- // The anchor's class-derived style goes first, then the explicit style, so an explicit [style]
1116
- // still beats the ambient class.
1117
- get mergedStyle() {
1118
- return [this.anchorStyle(), this.style];
1119
- }
1120
- feedbackHandlers() {
1121
- return createTouchableFeedbackHandlers({
1122
- delayPressIn: this.delayPressIn ?? 0,
1123
- delayPressOut: this.delayPressOut ?? 0,
1124
- minPressDuration: this.minPressDuration ?? TOUCHABLE_MIN_PRESS_DURATION_MS,
1125
- schedule: this.timers.schedule,
1126
- now: Date.now,
1127
- }, this.runtime, {
1128
- activate: (event) => this.pressIn.emit(event),
1129
- deactivate: (event) => this.pressOut.emit(event),
1130
- });
1131
- }
1132
- handlePressIn(event) {
1133
- this.feedbackHandlers().handlePressIn(event);
1134
- }
1135
- handlePressOut(event) {
1136
- this.feedbackHandlers().handlePressOut(event);
1137
- }
1138
- ngOnDestroy() {
1139
- this.timers.cancelAll();
1140
- }
1141
- // The anchor's class-derived style is written by the renderer's addClass/removeClass at the USE
1142
- // SITE - it never appears in SimpleChanges, and nothing about it dirties THIS component's view.
1143
- // A `class=` present at creation therefore worked, while one toggled later did not: the parent
1144
- // refreshed, the class landed on the anchor, and this component's own view was never refreshed,
1145
- // so whatever merged the anchor style in was never re-evaluated. Polling it into a signal from
1146
- // ngDoCheck fixes both halves: ngDoCheck runs during the PARENT's refresh even when this view is
1147
- // skipped, and the signal write is what then marks this view for refresh. `signal.set`'s own
1148
- // Object.is makes an unchanged poll a no-op, so there is no loop.
1149
- anchorStyle = signal(undefined, /* @ts-ignore */
1150
- ...(ngDevMode ? [{ debugName: "anchorStyle" }] : /* istanbul ignore next */ []));
1151
- ngDoCheck() {
1152
- this.anchorStyle.set(anchorStyleProp(this.elementRef));
1153
- }
1154
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: TouchableWithoutFeedback, deps: [], target: i0.ɵɵFactoryTarget.Component });
1155
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.8", type: TouchableWithoutFeedback, isStandalone: true, selector: "TouchableWithoutFeedback", inputs: { delayPressIn: "delayPressIn", delayPressOut: "delayPressOut", minPressDuration: "minPressDuration", style: "style", delayLongPress: "delayLongPress", delayHoverIn: "delayHoverIn", delayHoverOut: "delayHoverOut", disabled: "disabled", cancelable: "cancelable", hitSlop: "hitSlop", pressRetentionOffset: "pressRetentionOffset", unstable_pressDelay: "unstable_pressDelay", android_ripple: "android_ripple", android_disableSound: "android_disableSound", testID: "testID", nativeID: "nativeID", hasTVPreferredFocus: "hasTVPreferredFocus", nextFocusDown: "nextFocusDown", nextFocusForward: "nextFocusForward", nextFocusLeft: "nextFocusLeft", nextFocusRight: "nextFocusRight", nextFocusUp: "nextFocusUp", accessible: "accessible", accessibilityLabel: "accessibilityLabel", accessibilityHint: "accessibilityHint", accessibilityRole: "accessibilityRole", accessibilityState: "accessibilityState", accessibilityValue: "accessibilityValue", accessibilityActions: "accessibilityActions", accessibilityLabelledBy: "accessibilityLabelledBy", importantForAccessibility: "importantForAccessibility", accessibilityLiveRegion: "accessibilityLiveRegion", screenReaderFocusable: "screenReaderFocusable", accessibilityViewIsModal: "accessibilityViewIsModal", accessibilityElementsHidden: "accessibilityElementsHidden", accessibilityIgnoresInvertColors: "accessibilityIgnoresInvertColors", accessibilityLanguage: "accessibilityLanguage", accessibilityRespondsToUserInteraction: "accessibilityRespondsToUserInteraction", accessibilityShowsLargeContentViewer: "accessibilityShowsLargeContentViewer", accessibilityLargeContentTitle: "accessibilityLargeContentTitle", ariaLabel: "ariaLabel", ariaBusy: "ariaBusy", ariaChecked: "ariaChecked", ariaDisabled: "ariaDisabled", ariaExpanded: "ariaExpanded", ariaHidden: "ariaHidden", ariaLabelledBy: "ariaLabelledBy", ariaLive: "ariaLive", ariaSelected: "ariaSelected", ariaModal: "ariaModal", ariaValueMax: "ariaValueMax", ariaValueMin: "ariaValueMin", ariaValueNow: "ariaValueNow", ariaValueText: "ariaValueText", id: "id", role: "role" }, outputs: { press: "press", pressIn: "pressIn", pressOut: "pressOut", pressMove: "pressMove", longPress: "longPress", hoverIn: "hoverIn", hoverOut: "hoverOut", accessibilityAction: "accessibilityAction", accessibilityTap: "accessibilityTap", magicTap: "magicTap", accessibilityEscape: "accessibilityEscape" }, hostDirectives: [{ directive: i1.SymbioteStyleInputDirective, inputs: ["style", "style"] }], ngImport: i0, template: `
1156
- <Pressable
1157
- [__minPressDuration]="0"
1158
- [style]="mergedStyle"
1159
- (press)="press.emit($event)"
1160
- (pressIn)="handlePressIn($event)"
1161
- (pressOut)="handlePressOut($event)"
1162
- (pressMove)="pressMove.emit($event)"
1163
- (longPress)="longPress.emit($event)"
1164
- (hoverIn)="hoverIn.emit($event)"
1165
- (hoverOut)="hoverOut.emit($event)"
1166
- [delayLongPress]="delayLongPress"
1167
- [delayHoverIn]="delayHoverIn"
1168
- [delayHoverOut]="delayHoverOut"
1169
- [disabled]="disabled"
1170
- [cancelable]="cancelable"
1171
- [hitSlop]="hitSlop"
1172
- [pressRetentionOffset]="pressRetentionOffset"
1173
- [unstable_pressDelay]="unstable_pressDelay"
1174
- [android_ripple]="android_ripple"
1175
- [android_disableSound]="android_disableSound"
1176
- [testID]="testID"
1177
- [nativeID]="nativeID"
1178
- [hasTVPreferredFocus]="hasTVPreferredFocus"
1179
- [nextFocusDown]="nextFocusDown"
1180
- [nextFocusForward]="nextFocusForward"
1181
- [nextFocusLeft]="nextFocusLeft"
1182
- [nextFocusRight]="nextFocusRight"
1183
- [nextFocusUp]="nextFocusUp"
1184
- [accessible]="accessible"
1185
- [accessibilityLabel]="accessibilityLabel"
1186
- [accessibilityHint]="accessibilityHint"
1187
- [accessibilityRole]="accessibilityRole"
1188
- [accessibilityState]="accessibilityState"
1189
- [accessibilityValue]="accessibilityValue"
1190
- [accessibilityActions]="accessibilityActions"
1191
- [accessibilityLabelledBy]="accessibilityLabelledBy"
1192
- [importantForAccessibility]="importantForAccessibility"
1193
- [accessibilityLiveRegion]="accessibilityLiveRegion"
1194
- [screenReaderFocusable]="screenReaderFocusable"
1195
- [accessibilityViewIsModal]="accessibilityViewIsModal"
1196
- [accessibilityElementsHidden]="accessibilityElementsHidden"
1197
- [accessibilityIgnoresInvertColors]="accessibilityIgnoresInvertColors"
1198
- [accessibilityLanguage]="accessibilityLanguage"
1199
- [accessibilityRespondsToUserInteraction]="
1200
- accessibilityRespondsToUserInteraction
1201
- "
1202
- [accessibilityShowsLargeContentViewer]="
1203
- accessibilityShowsLargeContentViewer
1204
- "
1205
- [accessibilityLargeContentTitle]="accessibilityLargeContentTitle"
1206
- (accessibilityAction)="accessibilityAction.emit($event)"
1207
- (accessibilityTap)="accessibilityTap.emit($event)"
1208
- (magicTap)="magicTap.emit($event)"
1209
- (accessibilityEscape)="accessibilityEscape.emit($event)"
1210
- [ariaLabel]="ariaLabel"
1211
- [ariaBusy]="ariaBusy"
1212
- [ariaChecked]="ariaChecked"
1213
- [ariaDisabled]="ariaDisabled"
1214
- [ariaExpanded]="ariaExpanded"
1215
- [ariaHidden]="ariaHidden"
1216
- [ariaLabelledBy]="ariaLabelledBy"
1217
- [ariaLive]="ariaLive"
1218
- [ariaSelected]="ariaSelected"
1219
- [ariaModal]="ariaModal"
1220
- [ariaValueMax]="ariaValueMax"
1221
- [ariaValueMin]="ariaValueMin"
1222
- [ariaValueNow]="ariaValueNow"
1223
- [ariaValueText]="ariaValueText"
1224
- [id]="id"
1225
- [role]="role"
1226
- >
1227
- <ng-content></ng-content>
1228
- </Pressable>
1229
- `, isInline: true, dependencies: [{ kind: "component", type: Pressable, selector: "Pressable", inputs: ["delayLongPress", "disabled", "cancelable", "hitSlop", "pressRetentionOffset", "unstable_pressDelay", "__minPressDuration", "android_ripple", "android_disableSound", "delayHoverIn", "delayHoverOut", "testID", "nativeID", "hasTVPreferredFocus", "nextFocusDown", "nextFocusForward", "nextFocusLeft", "nextFocusRight", "nextFocusUp", "style", "accessible", "accessibilityLabel", "accessibilityHint", "accessibilityRole", "accessibilityState", "accessibilityValue", "accessibilityActions", "accessibilityLabelledBy", "importantForAccessibility", "accessibilityLiveRegion", "screenReaderFocusable", "accessibilityViewIsModal", "accessibilityElementsHidden", "accessibilityIgnoresInvertColors", "accessibilityLanguage", "accessibilityRespondsToUserInteraction", "accessibilityShowsLargeContentViewer", "accessibilityLargeContentTitle", "ariaLabel", "ariaBusy", "ariaChecked", "ariaDisabled", "ariaExpanded", "ariaHidden", "ariaLabelledBy", "ariaLive", "ariaSelected", "ariaModal", "ariaValueMax", "ariaValueMin", "ariaValueNow", "ariaValueText", "id", "role"], outputs: ["press", "pressIn", "pressOut", "pressMove", "longPress", "hoverIn", "hoverOut", "accessibilityAction", "accessibilityTap", "magicTap", "accessibilityEscape"] }], viewProviders: [provideGateDemand(() => TouchableWithoutFeedback)], changeDetection: i0.ChangeDetectionStrategy.OnPush });
1230
- }
1231
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: TouchableWithoutFeedback, decorators: [{
1232
- type: Component,
1233
- args: [{
1234
- selector: 'TouchableWithoutFeedback',
1235
- standalone: true,
1236
- viewProviders: [provideGateDemand(() => TouchableWithoutFeedback)],
1237
- hostDirectives: [
1238
- { directive: SymbioteStyleInputDirective, inputs: ['style'] },
1239
- ],
1240
- imports: [Pressable],
1241
- changeDetection: ChangeDetectionStrategy.OnPush,
1242
- template: `
1243
- <Pressable
1244
- [__minPressDuration]="0"
1245
- [style]="mergedStyle"
1246
- (press)="press.emit($event)"
1247
- (pressIn)="handlePressIn($event)"
1248
- (pressOut)="handlePressOut($event)"
1249
- (pressMove)="pressMove.emit($event)"
1250
- (longPress)="longPress.emit($event)"
1251
- (hoverIn)="hoverIn.emit($event)"
1252
- (hoverOut)="hoverOut.emit($event)"
1253
- [delayLongPress]="delayLongPress"
1254
- [delayHoverIn]="delayHoverIn"
1255
- [delayHoverOut]="delayHoverOut"
1256
- [disabled]="disabled"
1257
- [cancelable]="cancelable"
1258
- [hitSlop]="hitSlop"
1259
- [pressRetentionOffset]="pressRetentionOffset"
1260
- [unstable_pressDelay]="unstable_pressDelay"
1261
- [android_ripple]="android_ripple"
1262
- [android_disableSound]="android_disableSound"
1263
- [testID]="testID"
1264
- [nativeID]="nativeID"
1265
- [hasTVPreferredFocus]="hasTVPreferredFocus"
1266
- [nextFocusDown]="nextFocusDown"
1267
- [nextFocusForward]="nextFocusForward"
1268
- [nextFocusLeft]="nextFocusLeft"
1269
- [nextFocusRight]="nextFocusRight"
1270
- [nextFocusUp]="nextFocusUp"
1271
- [accessible]="accessible"
1272
- [accessibilityLabel]="accessibilityLabel"
1273
- [accessibilityHint]="accessibilityHint"
1274
- [accessibilityRole]="accessibilityRole"
1275
- [accessibilityState]="accessibilityState"
1276
- [accessibilityValue]="accessibilityValue"
1277
- [accessibilityActions]="accessibilityActions"
1278
- [accessibilityLabelledBy]="accessibilityLabelledBy"
1279
- [importantForAccessibility]="importantForAccessibility"
1280
- [accessibilityLiveRegion]="accessibilityLiveRegion"
1281
- [screenReaderFocusable]="screenReaderFocusable"
1282
- [accessibilityViewIsModal]="accessibilityViewIsModal"
1283
- [accessibilityElementsHidden]="accessibilityElementsHidden"
1284
- [accessibilityIgnoresInvertColors]="accessibilityIgnoresInvertColors"
1285
- [accessibilityLanguage]="accessibilityLanguage"
1286
- [accessibilityRespondsToUserInteraction]="
1287
- accessibilityRespondsToUserInteraction
1288
- "
1289
- [accessibilityShowsLargeContentViewer]="
1290
- accessibilityShowsLargeContentViewer
1291
- "
1292
- [accessibilityLargeContentTitle]="accessibilityLargeContentTitle"
1293
- (accessibilityAction)="accessibilityAction.emit($event)"
1294
- (accessibilityTap)="accessibilityTap.emit($event)"
1295
- (magicTap)="magicTap.emit($event)"
1296
- (accessibilityEscape)="accessibilityEscape.emit($event)"
1297
- [ariaLabel]="ariaLabel"
1298
- [ariaBusy]="ariaBusy"
1299
- [ariaChecked]="ariaChecked"
1300
- [ariaDisabled]="ariaDisabled"
1301
- [ariaExpanded]="ariaExpanded"
1302
- [ariaHidden]="ariaHidden"
1303
- [ariaLabelledBy]="ariaLabelledBy"
1304
- [ariaLive]="ariaLive"
1305
- [ariaSelected]="ariaSelected"
1306
- [ariaModal]="ariaModal"
1307
- [ariaValueMax]="ariaValueMax"
1308
- [ariaValueMin]="ariaValueMin"
1309
- [ariaValueNow]="ariaValueNow"
1310
- [ariaValueText]="ariaValueText"
1311
- [id]="id"
1312
- [role]="role"
1313
- >
1314
- <ng-content></ng-content>
1315
- </Pressable>
1316
- `,
1317
- }]
1318
- }], propDecorators: { press: [{
1319
- type: Output
1320
- }], pressIn: [{
1321
- type: Output
1322
- }], pressOut: [{
1323
- type: Output
1324
- }], pressMove: [{
1325
- type: Output
1326
- }], longPress: [{
1327
- type: Output
1328
- }], hoverIn: [{
1329
- type: Output
1330
- }], hoverOut: [{
1331
- type: Output
1332
- }], accessibilityAction: [{
1333
- type: Output
1334
- }], accessibilityTap: [{
1335
- type: Output
1336
- }], magicTap: [{
1337
- type: Output
1338
- }], accessibilityEscape: [{
1339
- type: Output
1340
- }], delayPressIn: [{
1341
- type: Input
1342
- }], delayPressOut: [{
1343
- type: Input
1344
- }], minPressDuration: [{
1345
- type: Input
1346
- }], style: [{
1347
- type: Input
1348
- }], delayLongPress: [{
1349
- type: Input
1350
- }], delayHoverIn: [{
1351
- type: Input
1352
- }], delayHoverOut: [{
1353
- type: Input
1354
- }], disabled: [{
1355
- type: Input
1356
- }], cancelable: [{
1357
- type: Input
1358
- }], hitSlop: [{
1359
- type: Input
1360
- }], pressRetentionOffset: [{
1361
- type: Input
1362
- }], unstable_pressDelay: [{
1363
- type: Input
1364
- }], android_ripple: [{
1365
- type: Input
1366
- }], android_disableSound: [{
1367
- type: Input
1368
- }], testID: [{
1369
- type: Input
1370
- }], nativeID: [{
1371
- type: Input
1372
- }], hasTVPreferredFocus: [{
1373
- type: Input
1374
- }], nextFocusDown: [{
1375
- type: Input
1376
- }], nextFocusForward: [{
1377
- type: Input
1378
- }], nextFocusLeft: [{
1379
- type: Input
1380
- }], nextFocusRight: [{
1381
- type: Input
1382
- }], nextFocusUp: [{
1383
- type: Input
1384
- }], accessible: [{
1385
- type: Input
1386
- }], accessibilityLabel: [{
1387
- type: Input
1388
- }], accessibilityHint: [{
1389
- type: Input
1390
- }], accessibilityRole: [{
1391
- type: Input
1392
- }], accessibilityState: [{
1393
- type: Input
1394
- }], accessibilityValue: [{
1395
- type: Input
1396
- }], accessibilityActions: [{
1397
- type: Input
1398
- }], accessibilityLabelledBy: [{
1399
- type: Input
1400
- }], importantForAccessibility: [{
1401
- type: Input
1402
- }], accessibilityLiveRegion: [{
1403
- type: Input
1404
- }], screenReaderFocusable: [{
1405
- type: Input
1406
- }], accessibilityViewIsModal: [{
1407
- type: Input
1408
- }], accessibilityElementsHidden: [{
1409
- type: Input
1410
- }], accessibilityIgnoresInvertColors: [{
1411
- type: Input
1412
- }], accessibilityLanguage: [{
1413
- type: Input
1414
- }], accessibilityRespondsToUserInteraction: [{
1415
- type: Input
1416
- }], accessibilityShowsLargeContentViewer: [{
1417
- type: Input
1418
- }], accessibilityLargeContentTitle: [{
1419
- type: Input
1420
- }], ariaLabel: [{
1421
- type: Input
1422
- }], ariaBusy: [{
1423
- type: Input
1424
- }], ariaChecked: [{
1425
- type: Input
1426
- }], ariaDisabled: [{
1427
- type: Input
1428
- }], ariaExpanded: [{
1429
- type: Input
1430
- }], ariaHidden: [{
1431
- type: Input
1432
- }], ariaLabelledBy: [{
1433
- type: Input
1434
- }], ariaLive: [{
1435
- type: Input
1436
- }], ariaSelected: [{
1437
- type: Input
1438
- }], ariaModal: [{
1439
- type: Input
1440
- }], ariaValueMax: [{
1441
- type: Input
1442
- }], ariaValueMin: [{
1443
- type: Input
1444
- }], ariaValueNow: [{
1445
- type: Input
1446
- }], ariaValueText: [{
1447
- type: Input
1448
- }], id: [{
1449
- type: Input
1450
- }], role: [{
1451
- type: Input
1452
- }] } });
1453
- //# sourceMappingURL=index.js.map