@botonic/react
Version:
Build Chatbots using React
51 lines • 2.33 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.MessageTimestamp = exports.resolveMessageTimestamps = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = tslib_1.__importDefault(require("react"));
const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
const constants_1 = require("../constants");
const resolveMessageTimestamps = (getThemeFn, messageTimestampEnabled) => {
const timestampsFormat = getThemeFn('message.timestamps.format');
const timestampStyle = getThemeFn('message.timestamps.style');
const timestampsEnabled = Boolean(messageTimestampEnabled !== undefined
? messageTimestampEnabled
: getThemeFn('message.timestamps.enable', Boolean(timestampStyle) || Boolean(timestampsFormat) || false));
const defaultTimestampFormat = {
month: 'short',
day: 'numeric',
hour: 'numeric',
minute: 'numeric',
second: 'numeric',
};
const getFormattedTimestamp = (timestampsFormat && timestampsFormat()) ||
new Date().toLocaleString(undefined, defaultTimestampFormat);
return {
timestampsEnabled,
getFormattedTimestamp,
timestampStyle,
};
};
exports.resolveMessageTimestamps = resolveMessageTimestamps;
const TimestampContainer = styled_components_1.default.div `
display: flex;
position: relative;
align-items: flex-start;
`;
const TimestampText = styled_components_1.default.div `
@import url('https://fonts.googleapis.com/css?family=Lato');
font-family: Lato;
font-size: 10px;
color: ${constants_1.COLORS.SOLID_BLACK};
width: 100%;
text-align: ${props => (props.isfromuser ? 'right' : 'left')};
padding: ${props => (props.isfromuser ? '0px 15px' : '0px 50px')};
margin-bottom: 5px;
`;
const MessageTimestamp = ({ timestamp, style, isfromuser }) => {
const classSufix = isfromuser ? 'user' : 'bot';
return ((0, jsx_runtime_1.jsx)(TimestampContainer, Object.assign({ className: `botonic-timestamp-${classSufix}` }, { children: (0, jsx_runtime_1.jsx)(TimestampText, Object.assign({ isfromuser: isfromuser, style: Object.assign({}, style) }, { children: timestamp })) })));
};
exports.MessageTimestamp = MessageTimestamp;
//# sourceMappingURL=timestamps.js.map