@tamagui/react-native-web-lite
Version:
React Native for Web
171 lines • 6.02 kB
JavaScript
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 VirtualizedListCellRenderer_exports = {};
__export(VirtualizedListCellRenderer_exports, {
default: () => CellRenderer
});
module.exports = __toCommonJS(VirtualizedListCellRenderer_exports);
var import_View = __toESM(require("../../../View/index.cjs")),
import_react_native_web_internals = require("@tamagui/react-native-web-internals"),
import_VirtualizedListContext = require("./VirtualizedListContext.cjs"),
React = __toESM(require("react")),
import_jsx_runtime = require("react/jsx-runtime");
class CellRenderer extends React.Component {
state = {
separatorProps: {
highlighted: !1,
leadingItem: this.props.item
}
};
static getDerivedStateFromProps(props, prevState) {
return {
separatorProps: {
...prevState.separatorProps,
leadingItem: props.item
}
};
}
// TODO: consider factoring separator stuff out of VirtualizedList into FlatList since it's not
// reused by SectionList and we can keep VirtualizedList simpler.
// $FlowFixMe[missing-local-annot]
_separators = {
highlight: () => {
const {
cellKey,
prevCellKey
} = this.props;
this.props.onUpdateSeparators?.([cellKey, prevCellKey], {
highlighted: !0
});
},
unhighlight: () => {
const {
cellKey,
prevCellKey
} = this.props;
this.props.onUpdateSeparators?.([cellKey, prevCellKey], {
highlighted: !1
});
},
updateProps: (select, newProps) => {
const {
cellKey,
prevCellKey
} = this.props;
this.props.onUpdateSeparators?.([select === "leading" ? prevCellKey : cellKey], newProps);
}
};
updateSeparatorProps(newProps) {
this.setState(state => ({
separatorProps: {
...state.separatorProps,
...newProps
}
}));
}
componentWillUnmount() {
this.props.onUnmount?.(this.props.cellKey);
}
_onLayout = nativeEvent => {
this.props.onCellLayout?.(nativeEvent, this.props.cellKey, this.props.index);
};
_renderElement(renderItem, ListItemComponent, item, index) {
if (renderItem && ListItemComponent && console.warn("VirtualizedList: Both ListItemComponent and renderItem props are present. ListItemComponent will take precedence over renderItem."), ListItemComponent) return React.createElement(ListItemComponent, {
item,
index,
separators: this._separators
});
if (renderItem) return renderItem({
item,
index,
separators: this._separators
});
(0, import_react_native_web_internals.invariant)(!1, "VirtualizedList: Either ListItemComponent or renderItem props are required but none were found.");
}
render() {
const {
CellRendererComponent,
ItemSeparatorComponent,
ListItemComponent,
cellKey,
horizontal,
item,
index,
inversionStyle,
onCellFocusCapture,
onCellLayout,
renderItem
} = this.props,
element = this._renderElement(renderItem, ListItemComponent, item, index),
itemSeparator = React.isValidElement(ItemSeparatorComponent) ?
// $FlowFixMe[incompatible-type]
ItemSeparatorComponent :
// $FlowFixMe[incompatible-type]
ItemSeparatorComponent && /* @__PURE__ */(0, import_jsx_runtime.jsx)(ItemSeparatorComponent, {
...this.state.separatorProps
}),
cellStyle = inversionStyle ? horizontal ? [styles.rowReverse, inversionStyle] : [styles.columnReverse, inversionStyle] : horizontal ? [styles.row, inversionStyle] : inversionStyle,
result = CellRendererComponent ? /* @__PURE__ */(0, import_jsx_runtime.jsxs)(CellRendererComponent, {
cellKey,
index,
item,
style: cellStyle,
onFocusCapture: onCellFocusCapture,
...(onCellLayout && {
onLayout: this._onLayout
}),
children: [element, itemSeparator]
}) : /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_View.default, {
style: cellStyle,
onFocusCapture: onCellFocusCapture,
...(onCellLayout && {
onLayout: this._onLayout
}),
children: [element, itemSeparator]
});
return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_VirtualizedListContext.VirtualizedListCellContextProvider, {
cellKey: this.props.cellKey,
children: result
});
}
}
const styles = import_react_native_web_internals.StyleSheet.create({
row: {
flexDirection: "row"
},
rowReverse: {
flexDirection: "row-reverse"
},
columnReverse: {
flexDirection: "column-reverse"
}
});