@nodeject/ui-components
Version:
UI library for non-trivial components
32 lines (31 loc) • 1.99 kB
JavaScript
import * as React from 'react';
import { useState } from 'react';
import { Content, Footer, GoToButton, Header } from './index';
import * as styles from './Layout.module.less';
export var LayoutTalk = function (props) {
var isChronologicalOrder = props.isChronologicalOrder === undefined
? false
: props.isChronologicalOrder;
var _a = useState(true), showGoToBottomButton = _a[0], setGoToBottomButtonVisibility = _a[1];
var onContentBottomReached = function (bottomReached) {
setGoToBottomButtonVisibility(!bottomReached);
bottomReached && props.onContentBottomReached();
};
var _b = useState(false), showGoToTopButton = _b[0], setGoToTopButtonVisibility = _b[1];
var onContentTopReached = function (topReached) {
setGoToTopButtonVisibility(!topReached);
topReached && props.onContentTopReached();
};
var goToTopButton = !isChronologicalOrder && (React.createElement(GoToButton, { visible: showGoToTopButton, to: 'top', content: props.goToTopButton }));
var goToBottomButton = (React.createElement(GoToButton, { visible: showGoToBottomButton, to: 'bottom', content: props.goToBottomButton }));
return (React.createElement("div", { className: styles.layout },
React.createElement("div", { className: styles.container },
React.createElement("div", { className: styles.header },
React.createElement(Header, { content: props.headerContent }),
goToTopButton),
React.createElement("div", { className: styles.content, id: props.target },
React.createElement(Content, { content: props.content, onContentBottomReached: onContentBottomReached, onContentTopReached: onContentTopReached, targetId: props.target })),
React.createElement("div", { className: styles.footer },
goToBottomButton,
React.createElement(Footer, { content: props.footerContent })))));
};