json-joy
Version:
Collection of libraries for building collaborative editing apps.
31 lines (30 loc) • 1.32 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.RenderInline = void 0;
const tslib_1 = require("tslib");
// biome-ignore lint: React is used for JSX
const React = tslib_1.__importStar(require("react"));
const react_1 = require("../../web/react");
const hooks_1 = require("../../web/react/hooks");
const constants_1 = require("./constants");
const RenderInlineSelection = (props) => {
const { children, selection } = props;
const { dom } = (0, react_1.usePeritext)();
const focus = (0, hooks_1.useSyncStoreOpt)(dom?.cursor.focus) || false;
const [left, right] = selection;
const style = {
backgroundColor: focus ? constants_1.DefaultRendererColors.ActiveSelection : constants_1.DefaultRendererColors.InactiveSelection,
borderRadius: left === 'anchor' ? '.25em 1px 1px .25em' : right === 'anchor' ? '1px .25em .25em 1px' : '1px',
};
return React.createElement("span", { style: style }, children);
};
const RenderInline = (props) => {
const { inline, children } = props;
const selection = inline.selection();
let element = children;
if (selection) {
element = (React.createElement(RenderInlineSelection, { ...props, selection: selection }, element));
}
return element;
};
exports.RenderInline = RenderInline;