stream-chat-react-native-core
Version:
The official React Native and Expo components for Stream Chat, a service for building chat applications
85 lines • 3.97 kB
JavaScript
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.MessageActionListItem = void 0;
var _react = _interopRequireWildcard(require("react"));
var _reactNative = require("react-native");
var _reactNativeGestureHandler = require("react-native-gesture-handler");
var _useAccessibilityActivateAction = require("../../a11y/hooks/useAccessibilityActivateAction");
var _ThemeContext = require("../../contexts/themeContext/ThemeContext");
var _hooks = require("../../hooks");
var _stateStore = require("../../state-store");
var _theme = require("../../theme");
var _jsxRuntime = require("react/jsx-runtime");
var _jsxFileName = "/home/runner/work/stream-chat-react-native/stream-chat-react-native/package/src/components/MessageMenu/MessageActionListItem.tsx";
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
var MessageActionListItem = props => {
var action = props.action,
actionType = props.actionType,
icon = props.icon,
title = props.title,
titleStyle = props.titleStyle;
var _useTheme = (0, _ThemeContext.useTheme)(),
_useTheme$theme = _useTheme.theme,
semantics = _useTheme$theme.semantics,
_useTheme$theme$messa = _useTheme$theme.messageMenu.actionListItem,
container = _useTheme$theme$messa.container,
iconTheme = _useTheme$theme$messa.icon,
titleTheme = _useTheme$theme$messa.title;
var styles = useStyles();
var onActionPress = (0, _hooks.useStableCallback)(() => {
(0, _stateStore.closeOverlay)();
(0, _stateStore.scheduleActionOnClose)(() => action());
});
var accessibilityLabel = `${actionType} action list item`;
var accessibilityActivateActionProps = (0, _useAccessibilityActivateAction.useAccessibilityActivateAction)({
onPress: onActionPress,
shouldHandleActivate: true
});
return (0, _jsxRuntime.jsx)(_reactNativeGestureHandler.Pressable, {
accessible: true,
accessibilityLabel: accessibilityLabel,
accessibilityRole: "menuitem",
...accessibilityActivateActionProps,
onPress: onActionPress,
style: ({
pressed
}) => [styles.buttonContainer, {
backgroundColor: pressed ? semantics.backgroundUtilityPressed : 'transparent'
}],
children: (0, _jsxRuntime.jsxs)(_reactNative.View, {
style: [styles.container, container],
children: [(0, _jsxRuntime.jsx)(_reactNative.View, {
style: iconTheme,
children: icon
}), (0, _jsxRuntime.jsx)(_reactNative.Text, {
style: [styles.titleStyle, titleStyle, titleTheme],
children: title
})]
})
});
};
exports.MessageActionListItem = MessageActionListItem;
var useStyles = () => {
var _useTheme2 = (0, _ThemeContext.useTheme)(),
semantics = _useTheme2.theme.semantics;
return (0, _react.useMemo)(() => _reactNative.StyleSheet.create({
buttonContainer: {
borderRadius: _theme.primitives.radiusLg
},
container: {
alignItems: 'center',
flexDirection: 'row',
justifyContent: 'flex-start',
padding: _theme.primitives.spacingXs
},
titleStyle: {
paddingLeft: _theme.primitives.spacingXs,
fontWeight: _theme.primitives.typographyFontWeightMedium,
fontSize: _theme.primitives.typographyFontSizeMd,
lineHeight: _theme.primitives.typographyLineHeightNormal,
color: semantics.textPrimary
}
}), [semantics.textPrimary]);
};
//# sourceMappingURL=MessageActionListItem.js.map