@eccenca/gui-elements
Version:
GUI elements based on other libraries, usable in React application, written in Typescript.
45 lines • 2.34 kB
JavaScript
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
var __read = (this && this.__read) || function (o, n) {
var m = typeof Symbol === "function" && o[Symbol.iterator];
if (!m) return o;
var i = m.call(o), r, ar = [], e;
try {
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
}
catch (error) { e = { error: error }; }
finally {
try {
if (r && !r.done && (m = i["return"])) m.call(i);
}
finally { if (e) throw e.error; }
}
return ar;
};
import React from "react";
import { Markdown } from "../../cmem/markdown/Markdown.js";
import { IconButton } from "../Icon/IconButton.js";
import { TextReducer } from "../TextReducer/TextReducer.js";
/**
* Adds an auto collapsing feature for convenience to `ChatContent`.
*/
export var ChatContentCollapsed = function (_a) {
var children = _a.children, _b = _a.collapsed, collapsed = _b === void 0 ? true : _b, _c = _a.textReducerProps, textReducerProps = _c === void 0 ? {} : _c, _d = _a.textCollapse, textCollapse = _d === void 0 ? "Collapse" : _d, _e = _a.textExpand, textExpand = _e === void 0 ? "Expand" : _e;
var _f = __read(React.useState(collapsed), 2), displayCollapsed = _f[0], setDispayCollapsed = _f[1];
var childrenAsTextline = (React.createElement(TextReducer, __assign({ useOverflowTextWrapper: true }, textReducerProps), typeof children.props.children === "string" ? (React.createElement(Markdown, null, children.props.children)) : (children.props.children)));
return React.cloneElement(children, {
children: displayCollapsed ? childrenAsTextline : children.props.children,
actionButton: (React.createElement(IconButton, { text: displayCollapsed ? textExpand : textCollapse, name: displayCollapsed ? "toggler-showmore" : "toggler-showless", onClick: function () { return setDispayCollapsed(!displayCollapsed); } })),
});
};
export default ChatContentCollapsed;
//# sourceMappingURL=ChatContentCollapsed.js.map