@symbiote-native/angular 0.0.0-canary-20260724081123
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.
- package/LICENSE +21 -0
- package/README.md +157 -0
- package/babel-linker.cjs +7 -0
- package/babel-register-composed.cjs +127 -0
- package/bin/symbiote-angular-dev.cjs +93 -0
- package/build/angular/anchor-host-registry.d.ts +2 -0
- package/build/angular/anchor-host-registry.js +84 -0
- package/build/angular/anchor-host-registry.js.map +1 -0
- package/build/angular/bootstrap.d.ts +7 -0
- package/build/angular/bootstrap.js +15 -0
- package/build/angular/bootstrap.js.map +1 -0
- package/build/angular/components/activity-indicator/index.android.d.ts +12 -0
- package/build/angular/components/activity-indicator/index.android.js +21 -0
- package/build/angular/components/activity-indicator/index.android.js.map +1 -0
- package/build/angular/components/activity-indicator/index.d.ts +1 -0
- package/build/angular/components/activity-indicator/index.ios.d.ts +8 -0
- package/build/angular/components/activity-indicator/index.ios.js +21 -0
- package/build/angular/components/activity-indicator/index.ios.js.map +1 -0
- package/build/angular/components/activity-indicator/index.js +4 -0
- package/build/angular/components/activity-indicator/index.js.map +1 -0
- package/build/angular/components/activity-indicator/shared.d.ts +67 -0
- package/build/angular/components/activity-indicator/shared.js +260 -0
- package/build/angular/components/activity-indicator/shared.js.map +1 -0
- package/build/angular/components/button.d.ts +63 -0
- package/build/angular/components/button.js +332 -0
- package/build/angular/components/button.js.map +1 -0
- package/build/angular/components/flat-list/index.d.ts +122 -0
- package/build/angular/components/flat-list/index.js +688 -0
- package/build/angular/components/flat-list/index.js.map +1 -0
- package/build/angular/components/image/index.android.d.ts +10 -0
- package/build/angular/components/image/index.android.js +59 -0
- package/build/angular/components/image/index.android.js.map +1 -0
- package/build/angular/components/image/index.d.ts +1 -0
- package/build/angular/components/image/index.ios.d.ts +10 -0
- package/build/angular/components/image/index.ios.js +59 -0
- package/build/angular/components/image/index.ios.js.map +1 -0
- package/build/angular/components/image/index.js +3 -0
- package/build/angular/components/image/index.js.map +1 -0
- package/build/angular/components/image/shared.d.ts +101 -0
- package/build/angular/components/image/shared.js +406 -0
- package/build/angular/components/image/shared.js.map +1 -0
- package/build/angular/components/image-background.d.ts +81 -0
- package/build/angular/components/image-background.js +418 -0
- package/build/angular/components/image-background.js.map +1 -0
- package/build/angular/components/input-accessory-view/index.d.ts +60 -0
- package/build/angular/components/input-accessory-view/index.js +251 -0
- package/build/angular/components/input-accessory-view/index.js.map +1 -0
- package/build/angular/components/keyboard-avoiding-view/index.d.ts +82 -0
- package/build/angular/components/keyboard-avoiding-view/index.js +358 -0
- package/build/angular/components/keyboard-avoiding-view/index.js.map +1 -0
- package/build/angular/components/modal/index.d.ts +92 -0
- package/build/angular/components/modal/index.js +360 -0
- package/build/angular/components/modal/index.js.map +1 -0
- package/build/angular/components/pressable/index.d.ts +123 -0
- package/build/angular/components/pressable/index.js +420 -0
- package/build/angular/components/pressable/index.js.map +1 -0
- package/build/angular/components/refresh-control/index.d.ts +86 -0
- package/build/angular/components/refresh-control/index.js +342 -0
- package/build/angular/components/refresh-control/index.js.map +1 -0
- package/build/angular/components/safe-area-view/index.d.ts +57 -0
- package/build/angular/components/safe-area-view/index.js +248 -0
- package/build/angular/components/safe-area-view/index.js.map +1 -0
- package/build/angular/components/scroll-view/index.android.d.ts +21 -0
- package/build/angular/components/scroll-view/index.android.js +235 -0
- package/build/angular/components/scroll-view/index.android.js.map +1 -0
- package/build/angular/components/scroll-view/index.d.ts +3 -0
- package/build/angular/components/scroll-view/index.ios.d.ts +9 -0
- package/build/angular/components/scroll-view/index.ios.js +86 -0
- package/build/angular/components/scroll-view/index.ios.js.map +1 -0
- package/build/angular/components/scroll-view/index.js +6 -0
- package/build/angular/components/scroll-view/index.js.map +1 -0
- package/build/angular/components/scroll-view/projection.d.ts +32 -0
- package/build/angular/components/scroll-view/projection.js +334 -0
- package/build/angular/components/scroll-view/projection.js.map +1 -0
- package/build/angular/components/scroll-view/shared.d.ts +230 -0
- package/build/angular/components/scroll-view/shared.js +682 -0
- package/build/angular/components/scroll-view/shared.js.map +1 -0
- package/build/angular/components/scroll-view/sticky-header.d.ts +40 -0
- package/build/angular/components/scroll-view/sticky-header.js +225 -0
- package/build/angular/components/scroll-view/sticky-header.js.map +1 -0
- package/build/angular/components/section-list/index.d.ts +116 -0
- package/build/angular/components/section-list/index.js +641 -0
- package/build/angular/components/section-list/index.js.map +1 -0
- package/build/angular/components/switch/index.android.d.ts +20 -0
- package/build/angular/components/switch/index.android.js +70 -0
- package/build/angular/components/switch/index.android.js.map +1 -0
- package/build/angular/components/switch/index.d.ts +1 -0
- package/build/angular/components/switch/index.ios.d.ts +19 -0
- package/build/angular/components/switch/index.ios.js +69 -0
- package/build/angular/components/switch/index.ios.js.map +1 -0
- package/build/angular/components/switch/index.js +4 -0
- package/build/angular/components/switch/index.js.map +1 -0
- package/build/angular/components/switch/shared.d.ts +40 -0
- package/build/angular/components/switch/shared.js +127 -0
- package/build/angular/components/switch/shared.js.map +1 -0
- package/build/angular/components/text-input.d.ts +153 -0
- package/build/angular/components/text-input.js +599 -0
- package/build/angular/components/text-input.js.map +1 -0
- package/build/angular/components/touchable/index.d.ts +245 -0
- package/build/angular/components/touchable/index.js +1186 -0
- package/build/angular/components/touchable/index.js.map +1 -0
- package/build/angular/components/touchable-native-feedback/index.d.ts +83 -0
- package/build/angular/components/touchable-native-feedback/index.js +371 -0
- package/build/angular/components/touchable-native-feedback/index.js.map +1 -0
- package/build/angular/components/virtualized-list/directives.d.ts +54 -0
- package/build/angular/components/virtualized-list/directives.js +153 -0
- package/build/angular/components/virtualized-list/directives.js.map +1 -0
- package/build/angular/components/virtualized-list/index.d.ts +253 -0
- package/build/angular/components/virtualized-list/index.js +1031 -0
- package/build/angular/components/virtualized-list/index.js.map +1 -0
- package/build/angular/components/virtualized-section-list/directives.d.ts +37 -0
- package/build/angular/components/virtualized-section-list/directives.js +76 -0
- package/build/angular/components/virtualized-section-list/directives.js.map +1 -0
- package/build/angular/components/virtualized-section-list/index.d.ts +178 -0
- package/build/angular/components/virtualized-section-list/index.js +720 -0
- package/build/angular/components/virtualized-section-list/index.js.map +1 -0
- package/build/angular/components.d.ts +39 -0
- package/build/angular/components.js +38 -0
- package/build/angular/components.js.map +1 -0
- package/build/angular/create-portal/index.d.ts +22 -0
- package/build/angular/create-portal/index.js +74 -0
- package/build/angular/create-portal/index.js.map +1 -0
- package/build/angular/create-tunnel/index.d.ts +34 -0
- package/build/angular/create-tunnel/index.js +126 -0
- package/build/angular/create-tunnel/index.js.map +1 -0
- package/build/angular/descriptor-to-angular/index.d.ts +22 -0
- package/build/angular/descriptor-to-angular/index.js +142 -0
- package/build/angular/descriptor-to-angular/index.js.map +1 -0
- package/build/angular/host-instance/index.d.ts +2 -0
- package/build/angular/host-instance/index.js +37 -0
- package/build/angular/host-instance/index.js.map +1 -0
- package/build/angular/index.d.ts +22 -0
- package/build/angular/index.js +46 -0
- package/build/angular/index.js.map +1 -0
- package/build/angular/modules/animated/animated-leaf-binder/index.d.ts +14 -0
- package/build/angular/modules/animated/animated-leaf-binder/index.js +91 -0
- package/build/angular/modules/animated/animated-leaf-binder/index.js.map +1 -0
- package/build/angular/modules/animated/animated-leaf-binder.d.ts +14 -0
- package/build/angular/modules/animated/animated-leaf-binder.js +91 -0
- package/build/angular/modules/animated/animated-leaf-binder.js.map +1 -0
- package/build/angular/modules/animated/create-animated-component.d.ts +59 -0
- package/build/angular/modules/animated/create-animated-component.js +364 -0
- package/build/angular/modules/animated/create-animated-component.js.map +1 -0
- package/build/angular/modules/animated/index.d.ts +51 -0
- package/build/angular/modules/animated/index.js +59 -0
- package/build/angular/modules/animated/index.js.map +1 -0
- package/build/angular/modules/app-registry/index.d.ts +7 -0
- package/build/angular/modules/app-registry/index.js +23 -0
- package/build/angular/modules/app-registry/index.js.map +1 -0
- package/build/angular/modules/status-bar/index.d.ts +20 -0
- package/build/angular/modules/status-bar/index.js +59 -0
- package/build/angular/modules/status-bar/index.js.map +1 -0
- package/build/angular/primitives/index.d.ts +63 -0
- package/build/angular/primitives/index.js +189 -0
- package/build/angular/primitives/index.js.map +1 -0
- package/build/angular/primitives/shared.d.ts +88 -0
- package/build/angular/primitives/shared.js +171 -0
- package/build/angular/primitives/shared.js.map +1 -0
- package/build/angular/render/index.d.ts +11 -0
- package/build/angular/render/index.js +171 -0
- package/build/angular/render/index.js.map +1 -0
- package/build/angular/renderer/index.d.ts +37 -0
- package/build/angular/renderer/index.js +301 -0
- package/build/angular/renderer/index.js.map +1 -0
- package/build/angular/services/color-scheme.service.d.ts +16 -0
- package/build/angular/services/color-scheme.service.js +31 -0
- package/build/angular/services/color-scheme.service.js.map +1 -0
- package/build/angular/services/index.d.ts +2 -0
- package/build/angular/services/index.js +3 -0
- package/build/angular/services/index.js.map +1 -0
- package/build/angular/services/window-dimensions.service.d.ts +16 -0
- package/build/angular/services/window-dimensions.service.js +42 -0
- package/build/angular/services/window-dimensions.service.js.map +1 -0
- package/metro-config.cjs +48 -0
- package/metro-css-parser.cjs +13 -0
- package/package.json +80 -0
- package/src/__tests__/responder-change-detection.test.ts +102 -0
- package/src/__tests__/responder-nested-cd.test.ts +113 -0
- package/src/anchor-host-registry.ts +88 -0
- package/src/angular-gaps.test.ts +142 -0
- package/src/angular-imports.test.ts +100 -0
- package/src/bootstrap.ts +26 -0
- package/src/components/activity-indicator/activity-indicator-class-style.test.ts +44 -0
- package/src/components/activity-indicator/activity-indicator.test.ts +131 -0
- package/src/components/activity-indicator/index.android.ts +16 -0
- package/src/components/activity-indicator/index.ios.ts +17 -0
- package/src/components/activity-indicator/index.ts +4 -0
- package/src/components/activity-indicator/shared.ts +206 -0
- package/src/components/button.ts +193 -0
- package/src/components/flat-list/column-wrapper-style-class.test.ts +116 -0
- package/src/components/flat-list/flat-list-array-style.test.ts +131 -0
- package/src/components/flat-list/flat-list-class-style.test.ts +74 -0
- package/src/components/flat-list/flat-list-scroll-containment.test.ts +107 -0
- package/src/components/flat-list/flat-list.test.ts +99 -0
- package/src/components/flat-list/index.ts +574 -0
- package/src/components/image/image-class-style.test.ts +46 -0
- package/src/components/image/index.android.ts +48 -0
- package/src/components/image/index.ios.ts +48 -0
- package/src/components/image/index.ts +3 -0
- package/src/components/image/shared.ts +479 -0
- package/src/components/image-background-class-style.test.ts +48 -0
- package/src/components/image-background-style-class.test.ts +79 -0
- package/src/components/image-background.ts +270 -0
- package/src/components/input-accessory-view/index.ts +185 -0
- package/src/components/input-accessory-view/input-accessory-view.test.ts +43 -0
- package/src/components/keyboard-avoiding-view/index.ts +303 -0
- package/src/components/keyboard-avoiding-view/keyboard-avoiding-view.test.ts +54 -0
- package/src/components/modal/index.ts +299 -0
- package/src/components/modal/modal.test.ts +43 -0
- package/src/components/pressable/index.ts +373 -0
- package/src/components/pressable/pressable.test.ts +85 -0
- package/src/components/refresh-control/index.ts +284 -0
- package/src/components/refresh-control/refresh-control.test.ts +41 -0
- package/src/components/safe-area-view/index.ts +177 -0
- package/src/components/safe-area-view/safe-area-view.test.ts +43 -0
- package/src/components/scroll-view/android-scroll-view-axis-projection.test.ts +123 -0
- package/src/components/scroll-view/content-container-style-class.test.ts +75 -0
- package/src/components/scroll-view/index.android.ts +190 -0
- package/src/components/scroll-view/index.ios.ts +79 -0
- package/src/components/scroll-view/index.ts +7 -0
- package/src/components/scroll-view/projection.ts +414 -0
- package/src/components/scroll-view/scroll-view-class-style.test.ts +134 -0
- package/src/components/scroll-view/scroll-view-projection.test.ts +194 -0
- package/src/components/scroll-view/shared.ts +844 -0
- package/src/components/scroll-view/sticky-header.ts +255 -0
- package/src/components/section-list/index.ts +445 -0
- package/src/components/switch/android-switch-class.test.ts +42 -0
- package/src/components/switch/index.android.ts +61 -0
- package/src/components/switch/index.ios.ts +60 -0
- package/src/components/switch/index.ts +4 -0
- package/src/components/switch/shared.ts +197 -0
- package/src/components/switch/switch.test.ts +92 -0
- package/src/components/text-input-class-style.test.ts +54 -0
- package/src/components/text-input.ts +531 -0
- package/src/components/touchable/index.ts +629 -0
- package/src/components/touchable/touchable.test.ts +102 -0
- package/src/components/touchable-native-feedback/index.ts +254 -0
- package/src/components/touchable-native-feedback/touchable-native-feedback.test.ts +49 -0
- package/src/components/virtualized-list/directives.ts +168 -0
- package/src/components/virtualized-list/index.ts +992 -0
- package/src/components/virtualized-list/virtualized-list-class-style.test.ts +76 -0
- package/src/components/virtualized-section-list/directives.ts +90 -0
- package/src/components/virtualized-section-list/index.ts +601 -0
- package/src/components/virtualized-section-list/virtualized-section-list-class-style.test.ts +60 -0
- package/src/components.ts +149 -0
- package/src/create-portal/create-portal.test.ts +90 -0
- package/src/create-portal/index.ts +74 -0
- package/src/create-tunnel/create-tunnel.test.ts +120 -0
- package/src/create-tunnel/index.ts +136 -0
- package/src/descriptor-to-angular/descriptor-outlet.test.ts +94 -0
- package/src/descriptor-to-angular/index.ts +190 -0
- package/src/host-instance/host-instance.test.ts +49 -0
- package/src/host-instance/index.ts +36 -0
- package/src/index.ts +261 -0
- package/src/modules/animated/animated-leaf-binder/animated-leaf-binder.test.ts +116 -0
- package/src/modules/animated/animated-leaf-binder/index.ts +101 -0
- package/src/modules/animated/animated-leaf-binder.test.ts +116 -0
- package/src/modules/animated/animated-leaf-binder.ts +101 -0
- package/src/modules/animated/animated-scroll-view.test.ts +102 -0
- package/src/modules/animated/create-animated-component.ts +365 -0
- package/src/modules/animated/index.ts +105 -0
- package/src/modules/app-registry/app-registry.test.ts +106 -0
- package/src/modules/app-registry/index.ts +60 -0
- package/src/modules/status-bar/index.ts +57 -0
- package/src/modules/status-bar/status-bar.test.ts +50 -0
- package/src/primitives/index.ts +119 -0
- package/src/primitives/shared.ts +190 -0
- package/src/render/index.ts +235 -0
- package/src/render/render.test.ts +147 -0
- package/src/renderer/index.ts +347 -0
- package/src/renderer/renderer.test.ts +203 -0
- package/src/services/color-scheme.service.ts +27 -0
- package/src/services/index.ts +2 -0
- package/src/services/services.test.ts +163 -0
- package/src/services/window-dimensions.service.ts +41 -0
- package/tsconfig.angular.base.json +30 -0
|
@@ -0,0 +1,688 @@
|
|
|
1
|
+
// FlatList, the Angular convenience surface over VirtualizedList. It takes a plain `data` array
|
|
2
|
+
// and derives getItem/getItemCount; numColumns packs items into rows (each row a flex-row of N
|
|
3
|
+
// columns), so the virtualized stream is rows, not items (RN's FlatList). All windowing /
|
|
4
|
+
// viewability / batching / imperative scrolling are inherited from VirtualizedList; the data
|
|
5
|
+
// shaping (chunkIntoRows / rowKeyExtractor / expandRowViewability / row-separator unwrap) is shared
|
|
6
|
+
// verbatim from @symbiote-native/components, exactly as the React and Vue FlatLists reuse it. This is the
|
|
7
|
+
// Angular twin of adapters/vue/src/components/flat-list/index.ts.
|
|
8
|
+
//
|
|
9
|
+
// TEMPLATE FORWARDING — both paths RE-STAMP; neither uses a bare `<ng-content>` passthrough.
|
|
10
|
+
// Angular's @ContentChild does NOT resolve a directive across a SECOND `<ng-content>` re-projection
|
|
11
|
+
// hop (it only sees what was projected directly onto the querying component's own tag) — a bare
|
|
12
|
+
// `<VirtualizedList ...><ng-content></ng-content></VirtualizedList>` here left VirtualizedList's own
|
|
13
|
+
// itemDir/headerDir/etc. undefined, so every cell rendered empty (a real, confirmed device bug — see
|
|
14
|
+
// flat-list.test.ts). Fixed for both column modes the same way:
|
|
15
|
+
// * Single column (numColumns <= 1): FlatList captures the app's `<ng-template vListItem>` (and
|
|
16
|
+
// vListHeader/vListFooter/vListEmpty/vListSeparator) with its OWN @ContentChild — a single,
|
|
17
|
+
// direct projection hop, which always resolves — then re-authors equivalent `<ng-template>`s on
|
|
18
|
+
// `<VirtualizedList>`, each forwarding the captured templateRef + context through
|
|
19
|
+
// VListOutletDirective. Item/index/separators pass through 1:1 (no row wrapping).
|
|
20
|
+
// * Multi column (numColumns > 1): the same re-stamp, but the app's vListItem is typed for ItemT
|
|
21
|
+
// while the virtualized stream is rows (IRow<ItemT>), so a plain passthrough couldn't work even if
|
|
22
|
+
// the projection issue didn't exist. The row vListItem lays out the N columns side by side (each
|
|
23
|
+
// cell stamps the app's item template via VListOutletDirective with the per-item context {item,
|
|
24
|
+
// index: row.startIndex + column, separators}), the row vListSeparator unwraps the flanking rows
|
|
25
|
+
// to their last/first item, and onViewableItemsChanged is wrapped with expandRowViewability so the
|
|
26
|
+
// caller still sees per-item visibility. This mirrors exactly how Vue's FlatList intercepts
|
|
27
|
+
// renderItem with renderRow.
|
|
28
|
+
//
|
|
29
|
+
// The imperative handle (scrollToIndex / scrollToOffset / scrollToEnd / scrollToItem /
|
|
30
|
+
// recordInteraction / flashScrollIndicators / getScroll* / getNativeScrollRef) is RN's FlatList
|
|
31
|
+
// surface; FlatList re-exposes it by delegating to the inner VirtualizedList (@ViewChild). The
|
|
32
|
+
// element-returning props (renderItem / ItemSeparatorComponent / List{Header,Footer,Empty}Component)
|
|
33
|
+
// are templates in Angular, so they are absent from IFlatListProps, per the per-adapter
|
|
34
|
+
// children/render prop split; everything agnostic mirrors IVirtualizedListProps.
|
|
35
|
+
import { CUSTOM_ELEMENTS_SCHEMA, ChangeDetectionStrategy, Component, ContentChild, ElementRef, EventEmitter, Input, Output, ViewChild, inject, } from '@angular/core';
|
|
36
|
+
import { SINGLE_COLUMN, chunkIntoRows, expandRowViewability, firstItemOfRow, lastItemOfRow, rowKeyExtractor, } from '@symbiote-native/components';
|
|
37
|
+
import { dlog, flattenStyle, resolveClassName, } from '@symbiote-native/engine';
|
|
38
|
+
import { VirtualizedList, VListEmptyDirective, VListFooterDirective, VListHeaderDirective, VListItemDirective, VListSeparatorDirective, } from '../virtualized-list';
|
|
39
|
+
import { VListOutletDirective } from '../virtualized-list/directives';
|
|
40
|
+
import { stableAnchorStyle, ViewHost } from '../../primitives';
|
|
41
|
+
import * as i0 from "@angular/core";
|
|
42
|
+
function isRecord(value) {
|
|
43
|
+
return typeof value === 'object' && value !== null;
|
|
44
|
+
}
|
|
45
|
+
function isRow(value) {
|
|
46
|
+
return (isRecord(value) && Array.isArray(value['items']) && typeof value['startIndex'] === 'number');
|
|
47
|
+
}
|
|
48
|
+
function isSeparators(value) {
|
|
49
|
+
return (isRecord(value) &&
|
|
50
|
+
typeof value['highlight'] === 'function' &&
|
|
51
|
+
typeof value['unhighlight'] === 'function');
|
|
52
|
+
}
|
|
53
|
+
// Used only as a type-safe fallback if a row's separators handle is ever absent; VirtualizedList
|
|
54
|
+
// always supplies a real one, so in practice the live handle flows through.
|
|
55
|
+
const NOOP_SEPARATORS = {
|
|
56
|
+
highlight: () => undefined,
|
|
57
|
+
unhighlight: () => undefined,
|
|
58
|
+
updateProps: () => undefined,
|
|
59
|
+
};
|
|
60
|
+
// Angular cannot preserve VListSeparatorDirective<ItemT>'s type parameter across this re-stamp
|
|
61
|
+
// reuse (the directive is matched structurally in FlatList's own template with no explicit type
|
|
62
|
+
// argument to pin ItemT to, so `let-leadingItem`/`let-trailingItem` arrive typed `unknown`) — even
|
|
63
|
+
// though VirtualizedList's own buildSeparatorContext always supplies a real ItemT value. The
|
|
64
|
+
// narrowest possible I/O-boundary cast for that gap; not a general-purpose unknown-to-T narrowing.
|
|
65
|
+
function asItem(value) {
|
|
66
|
+
return value;
|
|
67
|
+
}
|
|
68
|
+
export { VListEmptyDirective, VListFooterDirective, VListHeaderDirective, VListItemDirective, VListSeparatorDirective, } from '../virtualized-list';
|
|
69
|
+
export class FlatList {
|
|
70
|
+
// The list's edge/viewability/failure events as real Angular events: `(endReached)="…"`, not
|
|
71
|
+
// `[onEndReached]="…"` — re-emitted straight from the inner VirtualizedList's own @Output()s (see
|
|
72
|
+
// the template's `(endReached)="endReached.emit($event)"` style forwarding above).
|
|
73
|
+
endReached = new EventEmitter();
|
|
74
|
+
startReached = new EventEmitter();
|
|
75
|
+
refresh = new EventEmitter();
|
|
76
|
+
viewableItemsChanged = new EventEmitter();
|
|
77
|
+
scrollToIndexFailed = new EventEmitter();
|
|
78
|
+
data;
|
|
79
|
+
numColumns;
|
|
80
|
+
columnWrapperStyle;
|
|
81
|
+
keyExtractor;
|
|
82
|
+
getItemLayout;
|
|
83
|
+
horizontal;
|
|
84
|
+
inverted;
|
|
85
|
+
extraData;
|
|
86
|
+
onEndReachedThreshold;
|
|
87
|
+
onStartReachedThreshold;
|
|
88
|
+
refreshing;
|
|
89
|
+
progressViewOffset;
|
|
90
|
+
viewabilityConfig;
|
|
91
|
+
viewabilityConfigCallbackPairs;
|
|
92
|
+
initialNumToRender;
|
|
93
|
+
initialScrollIndex;
|
|
94
|
+
maxToRenderPerBatch;
|
|
95
|
+
updateCellsBatchingPeriod;
|
|
96
|
+
windowSize;
|
|
97
|
+
stickyHeaderIndices;
|
|
98
|
+
maintainVisibleContentPosition;
|
|
99
|
+
onScroll;
|
|
100
|
+
onScrollBeginDrag;
|
|
101
|
+
onScrollEndDrag;
|
|
102
|
+
onMomentumScrollBegin;
|
|
103
|
+
onMomentumScrollEnd;
|
|
104
|
+
scrollEventThrottle;
|
|
105
|
+
keyboardShouldPersistTaps;
|
|
106
|
+
keyboardDismissMode;
|
|
107
|
+
style;
|
|
108
|
+
contentContainerStyle;
|
|
109
|
+
// The app's cell + slot templates, captured for the multi-column re-stamp path. In the
|
|
110
|
+
// single-column path they are ALSO projected through <ng-content> to the inner list and these
|
|
111
|
+
// captures stay unused (the inner list's own @ContentChild resolves them across the projection).
|
|
112
|
+
itemDir;
|
|
113
|
+
headerDir;
|
|
114
|
+
footerDir;
|
|
115
|
+
emptyDir;
|
|
116
|
+
separatorDir;
|
|
117
|
+
// The composed inner list (whichever numColumns branch rendered). Its instance IS the
|
|
118
|
+
// IVirtualizedListHandle, so FlatList's handle delegates straight to it.
|
|
119
|
+
listRef;
|
|
120
|
+
// This component's OWN host — the non-painting anchor `class="..."` at the use site resolves
|
|
121
|
+
// onto (see anchorHostStyle's doc comment) — NOT `listRef` above, which targets the real inner
|
|
122
|
+
// `<VirtualizedList>` one level down (itself its own separate anchor host).
|
|
123
|
+
elementRef = inject(ElementRef);
|
|
124
|
+
// --- derived view state (recomputed in ngOnChanges, stable identity across CD) ---
|
|
125
|
+
rows = [];
|
|
126
|
+
// Angular's [style]="…" binding compiles to the built-in ɵɵstyleMap instruction (NOT a
|
|
127
|
+
// regular @Input() property write), which only understands a flat object — an array (RN's
|
|
128
|
+
// own `style={[a, b]}` composition idiom) crashes deep inside Angular's styling engine. So
|
|
129
|
+
// every style value this component stamps onto a template `[style]=` binding is flattened
|
|
130
|
+
// via the engine's own flattenStyle first, here at the source rather than at each call site.
|
|
131
|
+
rowStyle = flattenStyle([{ flexDirection: 'row' }]);
|
|
132
|
+
rowViewabilityPairs;
|
|
133
|
+
columnCellStyle = { flex: 1 };
|
|
134
|
+
resolvedStyle = undefined;
|
|
135
|
+
get columns() {
|
|
136
|
+
return this.numColumns ?? SINGLE_COLUMN;
|
|
137
|
+
}
|
|
138
|
+
get isMultiColumn() {
|
|
139
|
+
return this.columns > SINGLE_COLUMN;
|
|
140
|
+
}
|
|
141
|
+
ngOnChanges(changes) {
|
|
142
|
+
// Recomputed on EVERY ngOnChanges call, not gated on `changes['style']`: a class= on the
|
|
143
|
+
// FlatList use site (no matching [style] binding at all) never appears in `changes`, so a
|
|
144
|
+
// guard here would permanently skip picking up anchorHostStyle for that (the actual bug-report
|
|
145
|
+
// shape) — ngOnChanges still fires at least once at mount via the required `data` @Input(), and
|
|
146
|
+
// by then the anchor's class-derived style is already resolved synchronously (routeProp runs
|
|
147
|
+
// inline from Renderer2.addClass, before this component's own lifecycle hooks). stableAnchorStyle
|
|
148
|
+
// (not a bare flattenStyle) keeps `resolvedStyle`'s REFERENCE stable across ticks where nothing
|
|
149
|
+
// actually changed — `[style]="resolvedStyle"` binds onto VirtualizedList's own `@Input() style`,
|
|
150
|
+
// which feeds its `ngDoCheck` dedup gate; a fresh object every tick would defeat that gate and
|
|
151
|
+
// free-run change detection forever (see stableAnchorStyle's doc comment).
|
|
152
|
+
this.resolvedStyle = stableAnchorStyle(this.elementRef, this.style, this.resolvedStyle);
|
|
153
|
+
if (changes['columnWrapperStyle'] !== undefined) {
|
|
154
|
+
// A class-name string resolves through the shared registry before flattenStyle, which
|
|
155
|
+
// only understands style objects/arrays.
|
|
156
|
+
const resolvedColumnWrapperStyle = typeof this.columnWrapperStyle === 'string'
|
|
157
|
+
? resolveClassName(this.columnWrapperStyle)
|
|
158
|
+
: this.columnWrapperStyle;
|
|
159
|
+
this.rowStyle = flattenStyle([{ flexDirection: 'row' }, resolvedColumnWrapperStyle]);
|
|
160
|
+
}
|
|
161
|
+
if (changes['data'] !== undefined || changes['numColumns'] !== undefined) {
|
|
162
|
+
this.rows = this.isMultiColumn ? chunkIntoRows(this.data, this.columns) : [];
|
|
163
|
+
dlog(`Angular FlatList over ${this.data?.length ?? 0} items, ${this.columns} column(s)`);
|
|
164
|
+
}
|
|
165
|
+
if (changes['viewabilityConfigCallbackPairs'] !== undefined ||
|
|
166
|
+
changes['numColumns'] !== undefined) {
|
|
167
|
+
this.rowViewabilityPairs = this.buildRowViewabilityPairs();
|
|
168
|
+
}
|
|
169
|
+
}
|
|
170
|
+
// ---- single-column data adaptation (plain array -> getItem/getItemCount) ----
|
|
171
|
+
getFlatItem = (_data, index) => this.data[index];
|
|
172
|
+
getFlatCount = (_data) => this.data.length;
|
|
173
|
+
// ---- multi-column data adaptation (the virtualized stream is rows) ----
|
|
174
|
+
getRow = (_data, index) => this.rows[index];
|
|
175
|
+
getRowCount = (_data) => this.rows.length;
|
|
176
|
+
rowKey = (row, _index) => rowKeyExtractor(row);
|
|
177
|
+
// Viewability over rows expands back to per-item tokens, so the caller sees item-level
|
|
178
|
+
// visibility, not row-level (shared expandRowViewability), matching Vue.
|
|
179
|
+
rowViewableItemsChanged = (info) => {
|
|
180
|
+
this.viewableItemsChanged.emit(expandRowViewability(info, this.keyExtractor));
|
|
181
|
+
};
|
|
182
|
+
buildRowViewabilityPairs() {
|
|
183
|
+
return this.viewabilityConfigCallbackPairs?.map(pair => ({
|
|
184
|
+
viewabilityConfig: pair.viewabilityConfig,
|
|
185
|
+
onViewableItemsChanged: (rowInfo) => {
|
|
186
|
+
pair.onViewableItemsChanged?.(expandRowViewability(rowInfo, this.keyExtractor));
|
|
187
|
+
},
|
|
188
|
+
}));
|
|
189
|
+
}
|
|
190
|
+
// Lay out one row's N columns: every item shares the row's separators handle (the divider sits
|
|
191
|
+
// between rows, not columns) and carries its absolute index (row.startIndex + column), like RN's
|
|
192
|
+
// multi-column FlatList. Args arrive `unknown` from the template's `let` bindings (Angular cannot
|
|
193
|
+
// type a generic structural directive's context), narrowed here — no `as`.
|
|
194
|
+
rowCells(row, separators) {
|
|
195
|
+
if (!isRow(row))
|
|
196
|
+
return [];
|
|
197
|
+
const handle = isSeparators(separators) ? separators : NOOP_SEPARATORS;
|
|
198
|
+
return row.items.map((item, column) => {
|
|
199
|
+
const index = row.startIndex + column;
|
|
200
|
+
const key = this.keyExtractor ? this.keyExtractor(item, index) : String(index);
|
|
201
|
+
return { key, context: { $implicit: item, index, separators: handle } };
|
|
202
|
+
});
|
|
203
|
+
}
|
|
204
|
+
// The divider between rows shows real items (last of the row above, first of the row below), so the
|
|
205
|
+
// app's separator template, typed on ItemT, sees items rather than the IRow wrapper. Args arrive
|
|
206
|
+
// `unknown` from the template's `let` bindings, narrowed here.
|
|
207
|
+
rowSeparatorContext(highlighted, leadingRow, trailingRow) {
|
|
208
|
+
const isHighlighted = highlighted === true;
|
|
209
|
+
return {
|
|
210
|
+
$implicit: isHighlighted,
|
|
211
|
+
highlighted: isHighlighted,
|
|
212
|
+
leadingItem: isRow(leadingRow) ? lastItemOfRow(leadingRow) : undefined,
|
|
213
|
+
trailingItem: isRow(trailingRow) ? firstItemOfRow(trailingRow) : undefined,
|
|
214
|
+
};
|
|
215
|
+
}
|
|
216
|
+
// Single-column separator context: leadingItem/trailingItem are already real items (no row
|
|
217
|
+
// wrapper to narrow through — see the asItem boundary comment above).
|
|
218
|
+
itemSeparatorContext(highlighted, leadingItem, trailingItem) {
|
|
219
|
+
const isHighlighted = highlighted === true;
|
|
220
|
+
return {
|
|
221
|
+
$implicit: isHighlighted,
|
|
222
|
+
highlighted: isHighlighted,
|
|
223
|
+
leadingItem: asItem(leadingItem),
|
|
224
|
+
trailingItem: asItem(trailingItem),
|
|
225
|
+
};
|
|
226
|
+
}
|
|
227
|
+
// ---- imperative handle (RN FlatList surface) — delegates to the inner VirtualizedList ----
|
|
228
|
+
scrollToOffset(params) {
|
|
229
|
+
this.listRef?.scrollToOffset(params);
|
|
230
|
+
}
|
|
231
|
+
scrollToIndex(params) {
|
|
232
|
+
this.listRef?.scrollToIndex(params);
|
|
233
|
+
}
|
|
234
|
+
scrollToItem(params) {
|
|
235
|
+
this.listRef?.scrollToItem(params);
|
|
236
|
+
}
|
|
237
|
+
scrollToEnd(params) {
|
|
238
|
+
this.listRef?.scrollToEnd(params);
|
|
239
|
+
}
|
|
240
|
+
flashScrollIndicators() {
|
|
241
|
+
this.listRef?.flashScrollIndicators();
|
|
242
|
+
}
|
|
243
|
+
getNativeScrollRef() {
|
|
244
|
+
return this.listRef?.getNativeScrollRef() ?? null;
|
|
245
|
+
}
|
|
246
|
+
getScrollableNode() {
|
|
247
|
+
return this.listRef?.getScrollableNode() ?? null;
|
|
248
|
+
}
|
|
249
|
+
getScrollResponder() {
|
|
250
|
+
return this.listRef?.getScrollResponder() ?? null;
|
|
251
|
+
}
|
|
252
|
+
getScrollNode() {
|
|
253
|
+
return this.listRef?.getScrollNode() ?? null;
|
|
254
|
+
}
|
|
255
|
+
recordInteraction() {
|
|
256
|
+
this.listRef?.recordInteraction();
|
|
257
|
+
}
|
|
258
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: FlatList, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
259
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: FlatList, isStandalone: true, selector: "FlatList", inputs: { data: "data", numColumns: "numColumns", columnWrapperStyle: "columnWrapperStyle", keyExtractor: "keyExtractor", getItemLayout: "getItemLayout", horizontal: "horizontal", inverted: "inverted", extraData: "extraData", onEndReachedThreshold: "onEndReachedThreshold", onStartReachedThreshold: "onStartReachedThreshold", refreshing: "refreshing", progressViewOffset: "progressViewOffset", viewabilityConfig: "viewabilityConfig", viewabilityConfigCallbackPairs: "viewabilityConfigCallbackPairs", initialNumToRender: "initialNumToRender", initialScrollIndex: "initialScrollIndex", maxToRenderPerBatch: "maxToRenderPerBatch", updateCellsBatchingPeriod: "updateCellsBatchingPeriod", windowSize: "windowSize", stickyHeaderIndices: "stickyHeaderIndices", maintainVisibleContentPosition: "maintainVisibleContentPosition", onScroll: "onScroll", onScrollBeginDrag: "onScrollBeginDrag", onScrollEndDrag: "onScrollEndDrag", onMomentumScrollBegin: "onMomentumScrollBegin", onMomentumScrollEnd: "onMomentumScrollEnd", scrollEventThrottle: "scrollEventThrottle", keyboardShouldPersistTaps: "keyboardShouldPersistTaps", keyboardDismissMode: "keyboardDismissMode", style: "style", contentContainerStyle: "contentContainerStyle" }, outputs: { endReached: "endReached", startReached: "startReached", refresh: "refresh", viewableItemsChanged: "viewableItemsChanged", scrollToIndexFailed: "scrollToIndexFailed" }, queries: [{ propertyName: "itemDir", first: true, predicate: VListItemDirective, descendants: true }, { propertyName: "headerDir", first: true, predicate: VListHeaderDirective, descendants: true }, { propertyName: "footerDir", first: true, predicate: VListFooterDirective, descendants: true }, { propertyName: "emptyDir", first: true, predicate: VListEmptyDirective, descendants: true }, { propertyName: "separatorDir", first: true, predicate: VListSeparatorDirective, descendants: true }], viewQueries: [{ propertyName: "listRef", first: true, predicate: VirtualizedList, descendants: true }], usesOnChanges: true, ngImport: i0, template: `
|
|
260
|
+
@if (isMultiColumn) {
|
|
261
|
+
<VirtualizedList
|
|
262
|
+
[data]="rows"
|
|
263
|
+
[getItem]="getRow"
|
|
264
|
+
[getItemCount]="getRowCount"
|
|
265
|
+
[keyExtractor]="rowKey"
|
|
266
|
+
[getItemLayout]="getItemLayout"
|
|
267
|
+
[horizontal]="horizontal"
|
|
268
|
+
[inverted]="inverted"
|
|
269
|
+
[extraData]="extraData"
|
|
270
|
+
(endReached)="endReached.emit($event)"
|
|
271
|
+
[onEndReachedThreshold]="onEndReachedThreshold"
|
|
272
|
+
(startReached)="startReached.emit($event)"
|
|
273
|
+
[onStartReachedThreshold]="onStartReachedThreshold"
|
|
274
|
+
(refresh)="refresh.emit()"
|
|
275
|
+
[refreshRequested]="refresh.observed"
|
|
276
|
+
[refreshing]="refreshing"
|
|
277
|
+
[progressViewOffset]="progressViewOffset"
|
|
278
|
+
(viewableItemsChanged)="rowViewableItemsChanged($event)"
|
|
279
|
+
[viewabilityConfig]="viewabilityConfig"
|
|
280
|
+
[viewabilityConfigCallbackPairs]="rowViewabilityPairs"
|
|
281
|
+
(scrollToIndexFailed)="scrollToIndexFailed.emit($event)"
|
|
282
|
+
[initialNumToRender]="initialNumToRender"
|
|
283
|
+
[initialScrollIndex]="initialScrollIndex"
|
|
284
|
+
[maxToRenderPerBatch]="maxToRenderPerBatch"
|
|
285
|
+
[updateCellsBatchingPeriod]="updateCellsBatchingPeriod"
|
|
286
|
+
[windowSize]="windowSize"
|
|
287
|
+
[stickyHeaderIndices]="stickyHeaderIndices"
|
|
288
|
+
[maintainVisibleContentPosition]="maintainVisibleContentPosition"
|
|
289
|
+
[onScroll]="onScroll"
|
|
290
|
+
[onScrollBeginDrag]="onScrollBeginDrag"
|
|
291
|
+
[onScrollEndDrag]="onScrollEndDrag"
|
|
292
|
+
[onMomentumScrollBegin]="onMomentumScrollBegin"
|
|
293
|
+
[onMomentumScrollEnd]="onMomentumScrollEnd"
|
|
294
|
+
[scrollEventThrottle]="scrollEventThrottle"
|
|
295
|
+
[keyboardShouldPersistTaps]="keyboardShouldPersistTaps"
|
|
296
|
+
[keyboardDismissMode]="keyboardDismissMode"
|
|
297
|
+
[style]="resolvedStyle"
|
|
298
|
+
[contentContainerStyle]="contentContainerStyle"
|
|
299
|
+
>
|
|
300
|
+
<ng-template vListItem let-row let-separators="separators">
|
|
301
|
+
<symbiote-view [style]="rowStyle">
|
|
302
|
+
@for (cell of rowCells(row, separators); track cell.key) {
|
|
303
|
+
<symbiote-view [style]="columnCellStyle">
|
|
304
|
+
<ng-container
|
|
305
|
+
[vListOutlet]="itemDir?.templateRef"
|
|
306
|
+
[vListOutletContext]="cell.context"
|
|
307
|
+
></ng-container>
|
|
308
|
+
</symbiote-view>
|
|
309
|
+
}
|
|
310
|
+
</symbiote-view>
|
|
311
|
+
</ng-template>
|
|
312
|
+
@if (headerDir !== undefined) {
|
|
313
|
+
<ng-template vListHeader>
|
|
314
|
+
<ng-container [vListOutlet]="headerDir.templateRef"></ng-container>
|
|
315
|
+
</ng-template>
|
|
316
|
+
}
|
|
317
|
+
@if (footerDir !== undefined) {
|
|
318
|
+
<ng-template vListFooter>
|
|
319
|
+
<ng-container [vListOutlet]="footerDir.templateRef"></ng-container>
|
|
320
|
+
</ng-template>
|
|
321
|
+
}
|
|
322
|
+
@if (emptyDir !== undefined) {
|
|
323
|
+
<ng-template vListEmpty>
|
|
324
|
+
<ng-container [vListOutlet]="emptyDir.templateRef"></ng-container>
|
|
325
|
+
</ng-template>
|
|
326
|
+
}
|
|
327
|
+
@if (separatorDir !== undefined) {
|
|
328
|
+
<ng-template
|
|
329
|
+
vListSeparator
|
|
330
|
+
let-highlighted="highlighted"
|
|
331
|
+
let-leadingItem="leadingItem"
|
|
332
|
+
let-trailingItem="trailingItem"
|
|
333
|
+
>
|
|
334
|
+
<ng-container
|
|
335
|
+
[vListOutlet]="separatorDir.templateRef"
|
|
336
|
+
[vListOutletContext]="rowSeparatorContext(highlighted, leadingItem, trailingItem)"
|
|
337
|
+
></ng-container>
|
|
338
|
+
</ng-template>
|
|
339
|
+
}
|
|
340
|
+
</VirtualizedList>
|
|
341
|
+
} @else {
|
|
342
|
+
<VirtualizedList
|
|
343
|
+
[data]="data"
|
|
344
|
+
[getItem]="getFlatItem"
|
|
345
|
+
[getItemCount]="getFlatCount"
|
|
346
|
+
[keyExtractor]="keyExtractor"
|
|
347
|
+
[getItemLayout]="getItemLayout"
|
|
348
|
+
[horizontal]="horizontal"
|
|
349
|
+
[inverted]="inverted"
|
|
350
|
+
[extraData]="extraData"
|
|
351
|
+
(endReached)="endReached.emit($event)"
|
|
352
|
+
[onEndReachedThreshold]="onEndReachedThreshold"
|
|
353
|
+
(startReached)="startReached.emit($event)"
|
|
354
|
+
[onStartReachedThreshold]="onStartReachedThreshold"
|
|
355
|
+
(refresh)="refresh.emit()"
|
|
356
|
+
[refreshRequested]="refresh.observed"
|
|
357
|
+
[refreshing]="refreshing"
|
|
358
|
+
[progressViewOffset]="progressViewOffset"
|
|
359
|
+
(viewableItemsChanged)="viewableItemsChanged.emit($event)"
|
|
360
|
+
[viewabilityConfig]="viewabilityConfig"
|
|
361
|
+
[viewabilityConfigCallbackPairs]="viewabilityConfigCallbackPairs"
|
|
362
|
+
(scrollToIndexFailed)="scrollToIndexFailed.emit($event)"
|
|
363
|
+
[initialNumToRender]="initialNumToRender"
|
|
364
|
+
[initialScrollIndex]="initialScrollIndex"
|
|
365
|
+
[maxToRenderPerBatch]="maxToRenderPerBatch"
|
|
366
|
+
[updateCellsBatchingPeriod]="updateCellsBatchingPeriod"
|
|
367
|
+
[windowSize]="windowSize"
|
|
368
|
+
[stickyHeaderIndices]="stickyHeaderIndices"
|
|
369
|
+
[maintainVisibleContentPosition]="maintainVisibleContentPosition"
|
|
370
|
+
[onScroll]="onScroll"
|
|
371
|
+
[onScrollBeginDrag]="onScrollBeginDrag"
|
|
372
|
+
[onScrollEndDrag]="onScrollEndDrag"
|
|
373
|
+
[onMomentumScrollBegin]="onMomentumScrollBegin"
|
|
374
|
+
[onMomentumScrollEnd]="onMomentumScrollEnd"
|
|
375
|
+
[scrollEventThrottle]="scrollEventThrottle"
|
|
376
|
+
[keyboardShouldPersistTaps]="keyboardShouldPersistTaps"
|
|
377
|
+
[keyboardDismissMode]="keyboardDismissMode"
|
|
378
|
+
[style]="resolvedStyle"
|
|
379
|
+
[contentContainerStyle]="contentContainerStyle"
|
|
380
|
+
>
|
|
381
|
+
<ng-template vListItem let-item let-index="index" let-separators="separators">
|
|
382
|
+
<ng-container
|
|
383
|
+
[vListOutlet]="itemDir?.templateRef"
|
|
384
|
+
[vListOutletContext]="{ $implicit: item, index, separators }"
|
|
385
|
+
></ng-container>
|
|
386
|
+
</ng-template>
|
|
387
|
+
@if (headerDir !== undefined) {
|
|
388
|
+
<ng-template vListHeader>
|
|
389
|
+
<ng-container [vListOutlet]="headerDir.templateRef"></ng-container>
|
|
390
|
+
</ng-template>
|
|
391
|
+
}
|
|
392
|
+
@if (footerDir !== undefined) {
|
|
393
|
+
<ng-template vListFooter>
|
|
394
|
+
<ng-container [vListOutlet]="footerDir.templateRef"></ng-container>
|
|
395
|
+
</ng-template>
|
|
396
|
+
}
|
|
397
|
+
@if (emptyDir !== undefined) {
|
|
398
|
+
<ng-template vListEmpty>
|
|
399
|
+
<ng-container [vListOutlet]="emptyDir.templateRef"></ng-container>
|
|
400
|
+
</ng-template>
|
|
401
|
+
}
|
|
402
|
+
@if (separatorDir !== undefined) {
|
|
403
|
+
<ng-template
|
|
404
|
+
vListSeparator
|
|
405
|
+
let-highlighted="highlighted"
|
|
406
|
+
let-leadingItem="leadingItem"
|
|
407
|
+
let-trailingItem="trailingItem"
|
|
408
|
+
>
|
|
409
|
+
<ng-container
|
|
410
|
+
[vListOutlet]="separatorDir.templateRef"
|
|
411
|
+
[vListOutletContext]="itemSeparatorContext(highlighted, leadingItem, trailingItem)"
|
|
412
|
+
></ng-container>
|
|
413
|
+
</ng-template>
|
|
414
|
+
}
|
|
415
|
+
</VirtualizedList>
|
|
416
|
+
}
|
|
417
|
+
`, isInline: true, dependencies: [{ kind: "component", type: VirtualizedList, selector: "VirtualizedList", inputs: ["data", "getItem", "getItemCount", "keyExtractor", "getItemLayout", "horizontal", "inverted", "extraData", "onEndReachedThreshold", "onStartReachedThreshold", "refreshing", "progressViewOffset", "refreshRequested", "viewabilityConfig", "viewabilityConfigCallbackPairs", "initialNumToRender", "initialScrollIndex", "maxToRenderPerBatch", "updateCellsBatchingPeriod", "windowSize", "stickyHeaderIndices", "maintainVisibleContentPosition", "onScroll", "onScrollBeginDrag", "onScrollEndDrag", "onMomentumScrollBegin", "onMomentumScrollEnd", "scrollEventThrottle", "keyboardShouldPersistTaps", "keyboardDismissMode", "style", "contentContainerStyle", "testID", "nativeID", "accessible", "accessibilityLabel", "accessibilityHint", "accessibilityRole", "accessibilityState", "accessibilityValue", "accessibilityActions", "accessibilityLabelledBy", "importantForAccessibility", "accessibilityLiveRegion", "screenReaderFocusable", "accessibilityViewIsModal", "accessibilityElementsHidden", "accessibilityIgnoresInvertColors", "accessibilityLanguage", "accessibilityRespondsToUserInteraction", "accessibilityShowsLargeContentViewer", "accessibilityLargeContentTitle", "role", "ariaLabel", "ariaLabelledBy", "ariaLive", "ariaHidden", "ariaBusy", "ariaChecked", "ariaDisabled", "ariaExpanded", "ariaSelected", "ariaModal", "ariaValueMax", "ariaValueMin", "ariaValueNow", "ariaValueText"], outputs: ["endReached", "startReached", "refresh", "viewableItemsChanged", "scrollToIndexFailed", "accessibilityAction", "accessibilityTap", "magicTap", "accessibilityEscape"] }, { kind: "directive", type: VListItemDirective, selector: "[vListItem]" }, { kind: "directive", type: VListHeaderDirective, selector: "[vListHeader]" }, { kind: "directive", type: VListFooterDirective, selector: "[vListFooter]" }, { kind: "directive", type: VListEmptyDirective, selector: "[vListEmpty]" }, { kind: "directive", type: VListSeparatorDirective, selector: "[vListSeparator]" }, { kind: "directive", type: VListOutletDirective, selector: "[vListOutlet]", inputs: ["vListOutlet", "vListOutletContext"] }, { kind: "component", type: ViewHost, selector: "symbiote-view, View" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
418
|
+
}
|
|
419
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: FlatList, decorators: [{
|
|
420
|
+
type: Component,
|
|
421
|
+
args: [{
|
|
422
|
+
selector: 'FlatList',
|
|
423
|
+
standalone: true,
|
|
424
|
+
schemas: [CUSTOM_ELEMENTS_SCHEMA],
|
|
425
|
+
imports: [
|
|
426
|
+
VirtualizedList,
|
|
427
|
+
VListItemDirective,
|
|
428
|
+
VListHeaderDirective,
|
|
429
|
+
VListFooterDirective,
|
|
430
|
+
VListEmptyDirective,
|
|
431
|
+
VListSeparatorDirective,
|
|
432
|
+
VListOutletDirective,
|
|
433
|
+
ViewHost,
|
|
434
|
+
],
|
|
435
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
436
|
+
template: `
|
|
437
|
+
@if (isMultiColumn) {
|
|
438
|
+
<VirtualizedList
|
|
439
|
+
[data]="rows"
|
|
440
|
+
[getItem]="getRow"
|
|
441
|
+
[getItemCount]="getRowCount"
|
|
442
|
+
[keyExtractor]="rowKey"
|
|
443
|
+
[getItemLayout]="getItemLayout"
|
|
444
|
+
[horizontal]="horizontal"
|
|
445
|
+
[inverted]="inverted"
|
|
446
|
+
[extraData]="extraData"
|
|
447
|
+
(endReached)="endReached.emit($event)"
|
|
448
|
+
[onEndReachedThreshold]="onEndReachedThreshold"
|
|
449
|
+
(startReached)="startReached.emit($event)"
|
|
450
|
+
[onStartReachedThreshold]="onStartReachedThreshold"
|
|
451
|
+
(refresh)="refresh.emit()"
|
|
452
|
+
[refreshRequested]="refresh.observed"
|
|
453
|
+
[refreshing]="refreshing"
|
|
454
|
+
[progressViewOffset]="progressViewOffset"
|
|
455
|
+
(viewableItemsChanged)="rowViewableItemsChanged($event)"
|
|
456
|
+
[viewabilityConfig]="viewabilityConfig"
|
|
457
|
+
[viewabilityConfigCallbackPairs]="rowViewabilityPairs"
|
|
458
|
+
(scrollToIndexFailed)="scrollToIndexFailed.emit($event)"
|
|
459
|
+
[initialNumToRender]="initialNumToRender"
|
|
460
|
+
[initialScrollIndex]="initialScrollIndex"
|
|
461
|
+
[maxToRenderPerBatch]="maxToRenderPerBatch"
|
|
462
|
+
[updateCellsBatchingPeriod]="updateCellsBatchingPeriod"
|
|
463
|
+
[windowSize]="windowSize"
|
|
464
|
+
[stickyHeaderIndices]="stickyHeaderIndices"
|
|
465
|
+
[maintainVisibleContentPosition]="maintainVisibleContentPosition"
|
|
466
|
+
[onScroll]="onScroll"
|
|
467
|
+
[onScrollBeginDrag]="onScrollBeginDrag"
|
|
468
|
+
[onScrollEndDrag]="onScrollEndDrag"
|
|
469
|
+
[onMomentumScrollBegin]="onMomentumScrollBegin"
|
|
470
|
+
[onMomentumScrollEnd]="onMomentumScrollEnd"
|
|
471
|
+
[scrollEventThrottle]="scrollEventThrottle"
|
|
472
|
+
[keyboardShouldPersistTaps]="keyboardShouldPersistTaps"
|
|
473
|
+
[keyboardDismissMode]="keyboardDismissMode"
|
|
474
|
+
[style]="resolvedStyle"
|
|
475
|
+
[contentContainerStyle]="contentContainerStyle"
|
|
476
|
+
>
|
|
477
|
+
<ng-template vListItem let-row let-separators="separators">
|
|
478
|
+
<symbiote-view [style]="rowStyle">
|
|
479
|
+
@for (cell of rowCells(row, separators); track cell.key) {
|
|
480
|
+
<symbiote-view [style]="columnCellStyle">
|
|
481
|
+
<ng-container
|
|
482
|
+
[vListOutlet]="itemDir?.templateRef"
|
|
483
|
+
[vListOutletContext]="cell.context"
|
|
484
|
+
></ng-container>
|
|
485
|
+
</symbiote-view>
|
|
486
|
+
}
|
|
487
|
+
</symbiote-view>
|
|
488
|
+
</ng-template>
|
|
489
|
+
@if (headerDir !== undefined) {
|
|
490
|
+
<ng-template vListHeader>
|
|
491
|
+
<ng-container [vListOutlet]="headerDir.templateRef"></ng-container>
|
|
492
|
+
</ng-template>
|
|
493
|
+
}
|
|
494
|
+
@if (footerDir !== undefined) {
|
|
495
|
+
<ng-template vListFooter>
|
|
496
|
+
<ng-container [vListOutlet]="footerDir.templateRef"></ng-container>
|
|
497
|
+
</ng-template>
|
|
498
|
+
}
|
|
499
|
+
@if (emptyDir !== undefined) {
|
|
500
|
+
<ng-template vListEmpty>
|
|
501
|
+
<ng-container [vListOutlet]="emptyDir.templateRef"></ng-container>
|
|
502
|
+
</ng-template>
|
|
503
|
+
}
|
|
504
|
+
@if (separatorDir !== undefined) {
|
|
505
|
+
<ng-template
|
|
506
|
+
vListSeparator
|
|
507
|
+
let-highlighted="highlighted"
|
|
508
|
+
let-leadingItem="leadingItem"
|
|
509
|
+
let-trailingItem="trailingItem"
|
|
510
|
+
>
|
|
511
|
+
<ng-container
|
|
512
|
+
[vListOutlet]="separatorDir.templateRef"
|
|
513
|
+
[vListOutletContext]="rowSeparatorContext(highlighted, leadingItem, trailingItem)"
|
|
514
|
+
></ng-container>
|
|
515
|
+
</ng-template>
|
|
516
|
+
}
|
|
517
|
+
</VirtualizedList>
|
|
518
|
+
} @else {
|
|
519
|
+
<VirtualizedList
|
|
520
|
+
[data]="data"
|
|
521
|
+
[getItem]="getFlatItem"
|
|
522
|
+
[getItemCount]="getFlatCount"
|
|
523
|
+
[keyExtractor]="keyExtractor"
|
|
524
|
+
[getItemLayout]="getItemLayout"
|
|
525
|
+
[horizontal]="horizontal"
|
|
526
|
+
[inverted]="inverted"
|
|
527
|
+
[extraData]="extraData"
|
|
528
|
+
(endReached)="endReached.emit($event)"
|
|
529
|
+
[onEndReachedThreshold]="onEndReachedThreshold"
|
|
530
|
+
(startReached)="startReached.emit($event)"
|
|
531
|
+
[onStartReachedThreshold]="onStartReachedThreshold"
|
|
532
|
+
(refresh)="refresh.emit()"
|
|
533
|
+
[refreshRequested]="refresh.observed"
|
|
534
|
+
[refreshing]="refreshing"
|
|
535
|
+
[progressViewOffset]="progressViewOffset"
|
|
536
|
+
(viewableItemsChanged)="viewableItemsChanged.emit($event)"
|
|
537
|
+
[viewabilityConfig]="viewabilityConfig"
|
|
538
|
+
[viewabilityConfigCallbackPairs]="viewabilityConfigCallbackPairs"
|
|
539
|
+
(scrollToIndexFailed)="scrollToIndexFailed.emit($event)"
|
|
540
|
+
[initialNumToRender]="initialNumToRender"
|
|
541
|
+
[initialScrollIndex]="initialScrollIndex"
|
|
542
|
+
[maxToRenderPerBatch]="maxToRenderPerBatch"
|
|
543
|
+
[updateCellsBatchingPeriod]="updateCellsBatchingPeriod"
|
|
544
|
+
[windowSize]="windowSize"
|
|
545
|
+
[stickyHeaderIndices]="stickyHeaderIndices"
|
|
546
|
+
[maintainVisibleContentPosition]="maintainVisibleContentPosition"
|
|
547
|
+
[onScroll]="onScroll"
|
|
548
|
+
[onScrollBeginDrag]="onScrollBeginDrag"
|
|
549
|
+
[onScrollEndDrag]="onScrollEndDrag"
|
|
550
|
+
[onMomentumScrollBegin]="onMomentumScrollBegin"
|
|
551
|
+
[onMomentumScrollEnd]="onMomentumScrollEnd"
|
|
552
|
+
[scrollEventThrottle]="scrollEventThrottle"
|
|
553
|
+
[keyboardShouldPersistTaps]="keyboardShouldPersistTaps"
|
|
554
|
+
[keyboardDismissMode]="keyboardDismissMode"
|
|
555
|
+
[style]="resolvedStyle"
|
|
556
|
+
[contentContainerStyle]="contentContainerStyle"
|
|
557
|
+
>
|
|
558
|
+
<ng-template vListItem let-item let-index="index" let-separators="separators">
|
|
559
|
+
<ng-container
|
|
560
|
+
[vListOutlet]="itemDir?.templateRef"
|
|
561
|
+
[vListOutletContext]="{ $implicit: item, index, separators }"
|
|
562
|
+
></ng-container>
|
|
563
|
+
</ng-template>
|
|
564
|
+
@if (headerDir !== undefined) {
|
|
565
|
+
<ng-template vListHeader>
|
|
566
|
+
<ng-container [vListOutlet]="headerDir.templateRef"></ng-container>
|
|
567
|
+
</ng-template>
|
|
568
|
+
}
|
|
569
|
+
@if (footerDir !== undefined) {
|
|
570
|
+
<ng-template vListFooter>
|
|
571
|
+
<ng-container [vListOutlet]="footerDir.templateRef"></ng-container>
|
|
572
|
+
</ng-template>
|
|
573
|
+
}
|
|
574
|
+
@if (emptyDir !== undefined) {
|
|
575
|
+
<ng-template vListEmpty>
|
|
576
|
+
<ng-container [vListOutlet]="emptyDir.templateRef"></ng-container>
|
|
577
|
+
</ng-template>
|
|
578
|
+
}
|
|
579
|
+
@if (separatorDir !== undefined) {
|
|
580
|
+
<ng-template
|
|
581
|
+
vListSeparator
|
|
582
|
+
let-highlighted="highlighted"
|
|
583
|
+
let-leadingItem="leadingItem"
|
|
584
|
+
let-trailingItem="trailingItem"
|
|
585
|
+
>
|
|
586
|
+
<ng-container
|
|
587
|
+
[vListOutlet]="separatorDir.templateRef"
|
|
588
|
+
[vListOutletContext]="itemSeparatorContext(highlighted, leadingItem, trailingItem)"
|
|
589
|
+
></ng-container>
|
|
590
|
+
</ng-template>
|
|
591
|
+
}
|
|
592
|
+
</VirtualizedList>
|
|
593
|
+
}
|
|
594
|
+
`,
|
|
595
|
+
}]
|
|
596
|
+
}], propDecorators: { endReached: [{
|
|
597
|
+
type: Output
|
|
598
|
+
}], startReached: [{
|
|
599
|
+
type: Output
|
|
600
|
+
}], refresh: [{
|
|
601
|
+
type: Output
|
|
602
|
+
}], viewableItemsChanged: [{
|
|
603
|
+
type: Output
|
|
604
|
+
}], scrollToIndexFailed: [{
|
|
605
|
+
type: Output
|
|
606
|
+
}], data: [{
|
|
607
|
+
type: Input,
|
|
608
|
+
args: [{ required: true }]
|
|
609
|
+
}], numColumns: [{
|
|
610
|
+
type: Input
|
|
611
|
+
}], columnWrapperStyle: [{
|
|
612
|
+
type: Input
|
|
613
|
+
}], keyExtractor: [{
|
|
614
|
+
type: Input
|
|
615
|
+
}], getItemLayout: [{
|
|
616
|
+
type: Input
|
|
617
|
+
}], horizontal: [{
|
|
618
|
+
type: Input
|
|
619
|
+
}], inverted: [{
|
|
620
|
+
type: Input
|
|
621
|
+
}], extraData: [{
|
|
622
|
+
type: Input
|
|
623
|
+
}], onEndReachedThreshold: [{
|
|
624
|
+
type: Input
|
|
625
|
+
}], onStartReachedThreshold: [{
|
|
626
|
+
type: Input
|
|
627
|
+
}], refreshing: [{
|
|
628
|
+
type: Input
|
|
629
|
+
}], progressViewOffset: [{
|
|
630
|
+
type: Input
|
|
631
|
+
}], viewabilityConfig: [{
|
|
632
|
+
type: Input
|
|
633
|
+
}], viewabilityConfigCallbackPairs: [{
|
|
634
|
+
type: Input
|
|
635
|
+
}], initialNumToRender: [{
|
|
636
|
+
type: Input
|
|
637
|
+
}], initialScrollIndex: [{
|
|
638
|
+
type: Input
|
|
639
|
+
}], maxToRenderPerBatch: [{
|
|
640
|
+
type: Input
|
|
641
|
+
}], updateCellsBatchingPeriod: [{
|
|
642
|
+
type: Input
|
|
643
|
+
}], windowSize: [{
|
|
644
|
+
type: Input
|
|
645
|
+
}], stickyHeaderIndices: [{
|
|
646
|
+
type: Input
|
|
647
|
+
}], maintainVisibleContentPosition: [{
|
|
648
|
+
type: Input
|
|
649
|
+
}], onScroll: [{
|
|
650
|
+
type: Input
|
|
651
|
+
}], onScrollBeginDrag: [{
|
|
652
|
+
type: Input
|
|
653
|
+
}], onScrollEndDrag: [{
|
|
654
|
+
type: Input
|
|
655
|
+
}], onMomentumScrollBegin: [{
|
|
656
|
+
type: Input
|
|
657
|
+
}], onMomentumScrollEnd: [{
|
|
658
|
+
type: Input
|
|
659
|
+
}], scrollEventThrottle: [{
|
|
660
|
+
type: Input
|
|
661
|
+
}], keyboardShouldPersistTaps: [{
|
|
662
|
+
type: Input
|
|
663
|
+
}], keyboardDismissMode: [{
|
|
664
|
+
type: Input
|
|
665
|
+
}], style: [{
|
|
666
|
+
type: Input
|
|
667
|
+
}], contentContainerStyle: [{
|
|
668
|
+
type: Input
|
|
669
|
+
}], itemDir: [{
|
|
670
|
+
type: ContentChild,
|
|
671
|
+
args: [VListItemDirective]
|
|
672
|
+
}], headerDir: [{
|
|
673
|
+
type: ContentChild,
|
|
674
|
+
args: [VListHeaderDirective]
|
|
675
|
+
}], footerDir: [{
|
|
676
|
+
type: ContentChild,
|
|
677
|
+
args: [VListFooterDirective]
|
|
678
|
+
}], emptyDir: [{
|
|
679
|
+
type: ContentChild,
|
|
680
|
+
args: [VListEmptyDirective]
|
|
681
|
+
}], separatorDir: [{
|
|
682
|
+
type: ContentChild,
|
|
683
|
+
args: [VListSeparatorDirective]
|
|
684
|
+
}], listRef: [{
|
|
685
|
+
type: ViewChild,
|
|
686
|
+
args: [VirtualizedList]
|
|
687
|
+
}] } });
|
|
688
|
+
//# sourceMappingURL=index.js.map
|