UNPKG

@tamagui/react-native-web-lite

Version:
195 lines (194 loc) 9.44 kB
var __create = Object.create; var __defProp = Object.defineProperty; var __getOwnPropDesc = Object.getOwnPropertyDescriptor; var __getOwnPropNames = Object.getOwnPropertyNames; var __getProtoOf = Object.getPrototypeOf, __hasOwnProp = Object.prototype.hasOwnProperty; var __export = (target, all) => { for (var name in all) __defProp(target, name, { get: all[name], enumerable: !0 }); }, __copyProps = (to, from, except, desc) => { if (from && typeof from == "object" || typeof from == "function") for (let key of __getOwnPropNames(from)) !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable }); return to; }; var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps( // If the importer is in node compatibility mode or this is not an ESM // file that has been converted to a CommonJS file using a Babel- // compatible transform (i.e. "__esModule" has not been set), then set // "default" to the CommonJS "module.exports" for node compatibility. isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: !0 }) : target, mod )), __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod); var FlatList_exports = {}; __export(FlatList_exports, { FlatList: () => FlatList, default: () => FlatList_default }); module.exports = __toCommonJS(FlatList_exports); var import_react_native_web_internals = require("@tamagui/react-native-web-internals"), import_memoize_one = __toESM(require("memoize-one"), 1), import_react = __toESM(require("react"), 1), import_deepDiffer = require("./vendor/react-native/deepDiffer"), import_VirtualizedList = require("./vendor/react-native/VirtualizedList"), import_VirtualizeUtils = require("./vendor/react-native/VirtualizeUtils"), import_View = require("./View"), import_jsx_runtime = require("react/jsx-runtime"); function removeClippedSubviewsOrDefault(removeClippedSubviews) { return removeClippedSubviews ?? import_react_native_web_internals.Platform.OS === "android"; } function numColumnsOrDefault(numColumns) { return numColumns ?? 1; } function isArrayLike(data) { return typeof Object(data).length == "number"; } class FlatList extends import_react.default.PureComponent { props; _listRef = null; _virtualizedListPairs = []; constructor(props) { super(props), this.props = props, this._checkProps(this.props), this.props.viewabilityConfigCallbackPairs ? this._virtualizedListPairs = this.props.viewabilityConfigCallbackPairs.map( (pair) => ({ viewabilityConfig: pair.viewabilityConfig, onViewableItemsChanged: this._createOnViewableItemsChanged( pair.onViewableItemsChanged ) }) ) : this.props.onViewableItemsChanged && this._virtualizedListPairs.push({ viewabilityConfig: this.props.viewabilityConfig, onViewableItemsChanged: this._createOnViewableItemsChanged( this.props.onViewableItemsChanged ) }); } componentDidUpdate(prevProps) { (0, import_react_native_web_internals.invariant)( prevProps.numColumns === this.props.numColumns, "Changing numColumns on the fly is not supported. Change the key prop on FlatList when changing the number of columns to force a fresh render of the component." ), (0, import_react_native_web_internals.invariant)( prevProps.onViewableItemsChanged === this.props.onViewableItemsChanged, "Changing onViewableItemsChanged on the fly is not supported" ), (0, import_react_native_web_internals.invariant)( !(0, import_deepDiffer.deepDiffer)(prevProps.viewabilityConfig, this.props.viewabilityConfig), "Changing viewabilityConfig on the fly is not supported" ), (0, import_react_native_web_internals.invariant)( prevProps.viewabilityConfigCallbackPairs === this.props.viewabilityConfigCallbackPairs, "Changing viewabilityConfigCallbackPairs on the fly is not supported" ), this._checkProps(this.props); } _captureRef = (ref) => { this._listRef = ref; }; _checkProps(props) { const { getItem, getItemCount, horizontal, columnWrapperStyle, onViewableItemsChanged, viewabilityConfigCallbackPairs } = props, numColumns = numColumnsOrDefault(this.props.numColumns); (0, import_react_native_web_internals.invariant)(!getItem && !getItemCount, "FlatList does not support custom data formats."), numColumns > 1 ? (0, import_react_native_web_internals.invariant)(!horizontal, "numColumns does not support horizontal.") : (0, import_react_native_web_internals.invariant)( !columnWrapperStyle, "columnWrapperStyle not supported for single column lists" ), (0, import_react_native_web_internals.invariant)( !(onViewableItemsChanged && viewabilityConfigCallbackPairs), "FlatList does not support setting both onViewableItemsChanged and viewabilityConfigCallbackPairs." ); } _getItem = (data, index) => { const numColumns = numColumnsOrDefault(this.props.numColumns); if (numColumns > 1) { const ret = []; for (let kk = 0; kk < numColumns; kk++) { const itemIndex = index * numColumns + kk; if (itemIndex < data.length) { const item = data[itemIndex]; ret.push(item); } } return ret; } else return data[index]; }; _getItemCount = (data) => { if (data != null && isArrayLike(data)) { const numColumns = numColumnsOrDefault(this.props.numColumns); return numColumns > 1 ? Math.ceil(data.length / numColumns) : data.length; } else return 0; }; _keyExtractor = (items, index) => { const numColumns = numColumnsOrDefault(this.props.numColumns), keyExtractor = this.props.keyExtractor ?? import_VirtualizeUtils.keyExtractor; return numColumns > 1 ? ((0, import_react_native_web_internals.invariant)( Array.isArray(items), "FlatList: Expected each item to be an array with multiple columns." ), items.map((item, kk) => keyExtractor(item, index * numColumns + kk)).join(":")) : keyExtractor(items, index); }; _pushMultiColumnViewable(arr, v) { const numColumns = numColumnsOrDefault(this.props.numColumns), keyExtractor = this.props.keyExtractor ?? import_VirtualizeUtils.keyExtractor; v.item.forEach((item, ii) => { (0, import_react_native_web_internals.invariant)(v.index != null, "Missing index!"); const index = v.index * numColumns + ii; arr.push({ ...v, item, key: keyExtractor(item, index), index }); }); } _createOnViewableItemsChanged(onViewableItemsChanged) { return (info) => { const numColumns = numColumnsOrDefault(this.props.numColumns); if (onViewableItemsChanged) if (numColumns > 1) { const changed = [], viewableItems = []; info.viewableItems.forEach( (v) => this._pushMultiColumnViewable(viewableItems, v) ), info.changed.forEach((v) => this._pushMultiColumnViewable(changed, v)), onViewableItemsChanged({ viewableItems, changed }); } else onViewableItemsChanged(info); }; } _renderer = (ListItemComponent, renderItem, columnWrapperStyle, numColumns, extraData) => { const cols = numColumnsOrDefault(numColumns), render = (props) => ListItemComponent ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ListItemComponent, { ...props }) : renderItem ? renderItem(props) : null, renderProp = (info) => { if (cols > 1) { const { item, index } = info; return (0, import_react_native_web_internals.invariant)(Array.isArray(item), "Expected array of items with numColumns > 1"), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_View.View, { style: [styles.row, columnWrapperStyle], children: item.map((it, kk) => { const element = render({ item: it, index: index * cols + kk, separators: info.separators }); return element != null ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react.default.Fragment, { children: element }, kk) : null; }) }); } else return render(info); }; return ListItemComponent ? { ListItemComponent: renderProp } : { renderItem: renderProp }; }; _memoizedRenderer = (0, import_memoize_one.default)(this._renderer); render() { const { numColumns, columnWrapperStyle, removeClippedSubviews: _removeClippedSubviews, strictMode = !1, ...restProps } = this.props, renderer = strictMode ? this._memoizedRenderer : this._renderer; return /* @__PURE__ */ (0, import_jsx_runtime.jsx)( import_VirtualizedList.VirtualizedList, { ...restProps, getItem: this._getItem, getItemCount: this._getItemCount, keyExtractor: this._keyExtractor, ref: this._captureRef, viewabilityConfigCallbackPairs: this._virtualizedListPairs, removeClippedSubviews: removeClippedSubviewsOrDefault(_removeClippedSubviews), ...renderer( this.props.ListItemComponent, this.props.renderItem, columnWrapperStyle, numColumns, this.props.extraData ) } ); } } const styles = { row: { flexDirection: "row" } }; var FlatList_default = FlatList; //# sourceMappingURL=FlatList.js.map