UNPKG

@eccenca/gui-elements

Version:

GUI elements based on other libraries, usable in React application, written in Typescript.

464 lines 29.6 kB
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 __rest = (this && this.__rest) || function (s, e) { var t = {}; for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p]; if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]]; } return t; }; 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 { Position, useStoreState as getStoreStateFlowV9 } from "react-flow-renderer"; import { useStore as getStoreStateFlowV12 } from "@xyflow/react"; import Color from "color"; import { Resizable } from "re-resizable"; import { intentClassName } from "../../../common/Intent/index.js"; import { CLASSPREFIX as eccgui } from "../../../configuration/constants.js"; import { Depiction, Icon, OverflowText } from "../../../index.js"; import { ReactFlowVersions, useReactFlowVersion } from "../versionsupport.js"; import { HandleDefault } from "./../handles/HandleDefault.js"; var defaultHandles = function (flowVersion) { switch (flowVersion) { case "v9": case "v12": return [{ type: "target" }, { type: "source" }]; default: return []; } }; var getDefaultMinimalTooltipData = function (node) { var _a, _b, _c, _d; return { label: (_a = node.data) === null || _a === void 0 ? void 0 : _a.label, content: (_b = node.data) === null || _b === void 0 ? void 0 : _b.content, iconName: (_c = node.data) === null || _c === void 0 ? void 0 : _c.iconName, depiction: (_d = node.data) === null || _d === void 0 ? void 0 : _d.depiction, }; }; var addHandles = function (handles, position, posDirection, isConnectable, nodeStyle, flowVersion) { if (flowVersion === void 0) { flowVersion = ReactFlowVersions.V9; } return handles[position].map(function (handle, idx) { var _a, _b; // FIXME: remove? orig v12 change: return handles[position].map((handle: any, idx: any) => { var _c = handle.style, style = _c === void 0 ? {} : _c, otherHandleProps = __rest(handle, ["style"]); var styleAdditions = { color: (_a = nodeStyle.borderColor) !== null && _a !== void 0 ? _a : undefined, }; styleAdditions[posDirection] = (100 / (handles[position].length + 1)) * (idx + 1) + "%"; var handleProperties = __assign(__assign({}, otherHandleProps), { position: (_b = handle.position) !== null && _b !== void 0 ? _b : position, style: __assign(__assign({}, style), styleAdditions), posdirection: posDirection, isConnectable: typeof handle.isConnectable !== "undefined" ? handle.isConnectable : isConnectable, }); return (React.createElement(MemoHandler, __assign({ flowVersion: flowVersion }, handleProperties, { key: "handle" + idx }))); // FIXME: remove? orig v12 change: return <MemoHandler flowVersion={flowVersion} {...handleProperties} key={"handle" + idx} />; }); }; function compareStyleDirection(styleA, styleB, direction) { return styleA[direction] === styleB[direction]; } var MemoHandler = React.memo(function (props) { return React.createElement(HandleDefault, __assign({}, props)); }, function (prev, next) { return ( // we only test a few properties to control re-rendering // need to be extended if also other properties need to be changed late compareStyleDirection(prev.style, next.style, prev.posdirection) && prev.isConnectable === next.isConnectable && prev.intent === next.intent && prev.category === next.category); }); var DEFAULT_RESIZE_DIRECTIONS = { bottom: true, right: true }; /** * The `NodeContent` element manages the main view of how a node is displaying which content. * This element cannot be used directly, all properties must be routed through the `data` property of an `elements` property item inside the `ReactFlow` container. */ export function NodeContent(_a) { var _b, _c, _d; var _e, _f, _g, _h; var flowVersion = _a.flowVersion, iconName = _a.iconName, depiction = _a.depiction, leftElement = _a.leftElement, typeLabel = _a.typeLabel, label = _a.label, labelSubline = _a.labelSubline, enlargeHeader = _a.enlargeHeader, fullWidth = _a.fullWidth, _j = _a.showExecutionButtons, showExecutionButtons = _j === void 0 ? true : _j, executionButtons = _a.executionButtons, menuButtons = _a.menuButtons, content = _a.content, contentExtension = _a.contentExtension, footerContent = _a.footerContent, _k = _a.size, size = _k === void 0 ? "small" : _k, _l = _a.minimalShape, minimalShape = _l === void 0 ? "circular" : _l, intent = _a.intent, border = _a.border, highlightColor = _a.highlightColor, //handles = defaultHandles(), adaptHeightForHandleMinCount = _a.adaptHeightForHandleMinCount, _m = _a.adaptSizeIncrement, adaptSizeIncrement = _m === void 0 ? 15 : _m, // FIXME: getMinimalTooltipData is just being ignored, only used in `NodeDefault` _o = _a.getMinimalTooltipData, // FIXME: getMinimalTooltipData is just being ignored, only used in `NodeDefault` getMinimalTooltipData = _o === void 0 ? getDefaultMinimalTooltipData : _o, _p = _a.style, style = _p === void 0 ? {} : _p, _q = _a.showUnconnectableHandles, showUnconnectableHandles = _q === void 0 ? false : _q, _r = _a.animated, animated = _r === void 0 ? false : _r, _s = _a.introductionTime, introductionTime = _s === void 0 ? 0 : _s, // resizing onNodeResize = _a.onNodeResize, nodeDimensions = _a.nodeDimensions, _t = _a.resizeDirections, resizeDirections = _t === void 0 ? DEFAULT_RESIZE_DIRECTIONS : _t, resizeMaxDimensions = _a.resizeMaxDimensions, // forwarded props _u = _a.targetPosition, // forwarded props targetPosition = _u === void 0 ? Position.Left : _u, _v = _a.sourcePosition, sourcePosition = _v === void 0 ? Position.Right : _v, _w = _a.isConnectable, isConnectable = _w === void 0 ? true : _w, selected = _a.selected, _x = _a.letPassWheelEvents, letPassWheelEvents = _x === void 0 ? false : _x, // FIXME: businessData is just being ignored businessData = _a.businessData, // other props for DOM element otherDomProps = __rest(_a, ["flowVersion", "iconName", "depiction", "leftElement", "typeLabel", "label", "labelSubline", "enlargeHeader", "fullWidth", "showExecutionButtons", "executionButtons", "menuButtons", "content", "contentExtension", "footerContent", "size", "minimalShape", "intent", "border", "highlightColor", "adaptHeightForHandleMinCount", "adaptSizeIncrement", "getMinimalTooltipData", "style", "showUnconnectableHandles", "animated", "introductionTime", "onNodeResize", "nodeDimensions", "resizeDirections", "resizeMaxDimensions", "targetPosition", "sourcePosition", "isConnectable", "selected", "letPassWheelEvents", "businessData"]); var evaluateFlowVersion = useReactFlowVersion(); var flowVersionCheck = flowVersion || evaluateFlowVersion; var _y = __read(React.useState(false), 2), introductionDone = _y[0], setIntroductionDone = _y[1]; // ignore some properties for now (remove them later) // if (otherDomProps.businessData) { delete otherDomProps.businessData } // if (otherDomProps.getMinimalTooltipData) { delete otherDomProps.getMinimalTooltipData } var _z = otherDomProps.handles, handles = _z === void 0 ? defaultHandles(flowVersionCheck) : _z, otherProps = __rest(otherDomProps, ["handles"]); var hasValidResizeDirection = resizeDirections.bottom || resizeDirections.right; var isResizable = typeof onNodeResize === "function" && hasValidResizeDirection && minimalShape === "none"; var _3 = __read(React.useState((_e = nodeDimensions === null || nodeDimensions === void 0 ? void 0 : nodeDimensions.width) !== null && _e !== void 0 ? _e : undefined), 2), width = _3[0], setWidth = _3[1]; var _4 = __read(React.useState((_f = nodeDimensions === null || nodeDimensions === void 0 ? void 0 : nodeDimensions.height) !== null && _f !== void 0 ? _f : undefined), 2), height = _4[0], setHeight = _4[1]; // Keeps the initial size of the element var originalSize = React.useRef({}); var zoom = 1; if (isResizable) try { switch (flowVersionCheck) { case "v9": _b = __read(getStoreStateFlowV9(function (state) { return state.transform; }), 3), zoom = _b[2]; break; case "v12": // we are calling a hook here conditionally. Not recommended, by the flowversion check is // is basically compile time determined. So we just do it. _c = __read(getStoreStateFlowV12(function (state) { return state.transform; }), 3), zoom = _c[2]; break; } } catch (error) { // do not handle error but at least push it to the console // eslint-disable-next-line no-console console.error(error); } var _5 = __read(React.useState({}), 2), adjustedContentProps = _5[0], setAdjustedContentProps = _5[1]; var nodeContentRef = React.useRef(); var handleStack = (_d = {}, _d[Position.Top] = [], _d[Position.Right] = [], _d[Position.Bottom] = [], _d[Position.Left] = [], _d); var saveOriginalSize = function () { var currentClassNames = nodeContentRef.current.classList; if (currentClassNames.contains("was-resized") && !width && !height) { currentClassNames.remove("was-resized"); } originalSize.current.width = nodeContentRef.current.offsetWidth; originalSize.current.height = nodeContentRef.current.offsetHeight; }; React.useEffect(function () { if (nodeContentRef.current && (!(originalSize.current.width || originalSize.current.height) || !(width || height))) { saveOriginalSize(); } }, [!!nodeContentRef.current, !(originalSize.current.width || originalSize.current.height), !(width || height)]); // Update width and height when node dimensions parameters has changed React.useEffect(function () { var updateWidth = (nodeDimensions === null || nodeDimensions === void 0 ? void 0 : nodeDimensions.width) ? validateWidth(nodeDimensions === null || nodeDimensions === void 0 ? void 0 : nodeDimensions.width) : undefined; var updateHeight = (nodeDimensions === null || nodeDimensions === void 0 ? void 0 : nodeDimensions.height) ? validateHeight(nodeDimensions === null || nodeDimensions === void 0 ? void 0 : nodeDimensions.height) : undefined; setWidth(updateWidth); setHeight(updateHeight); }, [nodeDimensions]); var isResizingActive = React.useCallback(function () { var currentClassNames = nodeContentRef.current.classList; return (resizeDirections.right === currentClassNames.contains("is-resizable-horizontal") || resizeDirections.bottom === currentClassNames.contains("is-resizable-vertical")); }, []); // force default size when resizing is activated but no dimensions are set React.useEffect(function () { var _a, _b; var resizingActive = isResizingActive(); if (isResizable && !resizingActive) { if (!width || !height) { var newWidth = validateWidth(width !== null && width !== void 0 ? width : (_a = originalSize.current) === null || _a === void 0 ? void 0 : _a.width); var newHeight = validateHeight(height !== null && height !== void 0 ? height : (_b = originalSize.current) === null || _b === void 0 ? void 0 : _b.height); setWidth(newWidth); setHeight(newHeight); } } }, [ nodeContentRef.current, onNodeResize, minimalShape, resizeDirections === null || resizeDirections === void 0 ? void 0 : resizeDirections.bottom, resizeDirections === null || resizeDirections === void 0 ? void 0 : resizeDirections.right, width, height, ]); // need to be done everytime a property is changed and the element is re-rendered, otherwise the resizing class is lost // conditional enhancements for activated resizing React.useEffect(function () { var currentClassNames = nodeContentRef.current.classList; var resizingActive = isResizingActive(); if (isResizable && !resizingActive) { if (currentClassNames.contains("is-resizable-horizontal")) { currentClassNames.remove("is-resizable-horizontal"); } if (currentClassNames.contains("is-resizable-vertical")) { currentClassNames.remove("is-resizable-vertical"); } if (resizeDirections.right) { currentClassNames.add("is-resizable-horizontal"); } if (resizeDirections.bottom) { currentClassNames.add("is-resizable-vertical"); } } }); // need to be done everytime a property is changed and the element is re-rendered, otherwise the resizing class is lost // remove introduction class React.useEffect(function () { var _a; if (nodeContentRef && introductionTime) { var timeDelay = typeof introductionTime === "object" ? (_a = introductionTime.delay) !== null && _a !== void 0 ? _a : 0 : 0; var timeRun = typeof introductionTime === "object" ? introductionTime.run : introductionTime; setTimeout(function () { nodeContentRef.current.className = nodeContentRef.current.className.replace("".concat(eccgui, "-graphviz__node--introduction"), "".concat(eccgui, "-graphviz__node--introduction-runs")); }, timeDelay); setTimeout(function () { nodeContentRef.current.className = nodeContentRef.current.className.replace("".concat(eccgui, "-graphviz__node--introduction-runs"), "".concat(eccgui, "-graphviz__node--introduction-done")); setIntroductionDone(true); }, timeDelay + timeRun); } }, [nodeContentRef, introductionTime]); if (handles.length > 0) { handles .sort(function (a, b) { if (a.category === "dependency") { return 1; } if (b.category === "dependency") { return -1; } return 0; }) .forEach(function (handle) { var position = handle.position; // force position regarding special configuration if (handle.category === "configuration") { position = Position.Top; } else { var handleType = handle; if (handleType.type === "target") { position = targetPosition; } if (handleType.type === "source") { position = sourcePosition; } } handle.position = position; handleStack[position].push(handle); }); } var styleExpandDimensions = Object.create(null); if (typeof adaptHeightForHandleMinCount !== "undefined" && (minimalShape === "none" || !!selected) && adaptSizeIncrement && (handleStack[Position.Left].length >= adaptHeightForHandleMinCount || handleStack[Position.Right].length >= adaptHeightForHandleMinCount)) { var minHeightLeft = handleStack[Position.Left].length * adaptSizeIncrement; var minHeightRight = handleStack[Position.Right].length * adaptSizeIncrement; styleExpandDimensions["minHeight"] = Math.max(minHeightLeft, minHeightRight); } var _6 = evaluateHighlightColors("--node-highlight", highlightColor), highlightClassNameSuffix = _6.highlightClassNameSuffix, highlightCustomPropertySettings = _6.highlightCustomPropertySettings; var resizableStyles = isResizable && (width !== null && width !== void 0 ? width : 0) + (height !== null && height !== void 0 ? height : 0) > 0 ? { width: width, height: height, maxWidth: resizeDirections.right ? (_g = resizeMaxDimensions === null || resizeMaxDimensions === void 0 ? void 0 : resizeMaxDimensions.width) !== null && _g !== void 0 ? _g : undefined : undefined, maxHeight: resizeDirections.bottom ? (_h = resizeMaxDimensions === null || resizeMaxDimensions === void 0 ? void 0 : resizeMaxDimensions.height) !== null && _h !== void 0 ? _h : undefined : undefined, } : {}; var introductionStyles = introductionTime && !introductionDone ? { "--node-introduction-time": "".concat(typeof introductionTime === "object" ? introductionTime.run : introductionTime, "ms"), } : {}; var nodeContent = (React.createElement(React.Fragment, null, React.createElement("section", __assign({ ref: nodeContentRef }, otherProps, { style: __assign(__assign(__assign(__assign(__assign({}, style), highlightCustomPropertySettings), styleExpandDimensions), resizableStyles), introductionStyles), className: "".concat(eccgui, "-graphviz__node") + " ".concat(eccgui, "-graphviz__node--").concat(flowVersionCheck) + " ".concat(eccgui, "-graphviz__node--").concat(size) + " ".concat(eccgui, "-graphviz__node--minimal-").concat(minimalShape) + (fullWidth ? " ".concat(eccgui, "-graphviz__node--fullwidth") : "") + (border ? " ".concat(eccgui, "-graphviz__node--border-").concat(border) : "") + (intent ? " ".concat(intentClassName(intent)) : "") + (highlightClassNameSuffix.length > 0 ? highlightClassNameSuffix .map(function (highlight) { return " ".concat(eccgui, "-graphviz__node--highlight-").concat(highlight); }) .join("") : "") + (animated ? " ".concat(eccgui, "-graphviz__node--animated") : "") + (introductionTime && !introductionDone ? " ".concat(eccgui, "-graphviz__node--introduction") : "") + (showUnconnectableHandles === false ? " ".concat(eccgui, "-graphviz__node--hidehandles") : "") + (letPassWheelEvents === false ? " nowheel" : ""), "data-introduction-animation": typeof introductionTime === "object" && !introductionDone ? introductionTime.animation : undefined }), React.createElement("header", { className: "".concat(eccgui, "-graphviz__node__header") + (enlargeHeader && minimalShape === "none" ? " ".concat(eccgui, "-graphviz__node__header--large") : "") }, (!!iconName || !!depiction || !!leftElement) && (React.createElement("div", { className: "".concat(eccgui, "-graphviz__node__header-depiction") }, leftElement, !!depiction && !leftElement && typeof depiction === "string" && (React.createElement(Depiction, { image: React.createElement("img", { src: depiction, alt: "" }), caption: minimalShape === "none" || selected ? typeLabel : undefined, captionPosition: "tooltip", padding: "tiny", ratio: "1:1", resizing: "contain", forceInlineSvg: true })), !!depiction && !leftElement && typeof depiction !== "string" && React.cloneElement(depiction, { caption: minimalShape === "none" || selected ? typeLabel : undefined, captionPosition: "tooltip", padding: "tiny", ratio: "1:1", resizing: "contain", forceInlineSvg: true, }), !!iconName && !leftElement && !depiction && (React.createElement(Depiction, { image: React.createElement(Icon, { name: iconName }), caption: minimalShape === "none" || selected ? typeLabel : undefined, captionPosition: "tooltip", padding: "tiny", ratio: "1:1", resizing: "contain", forceInlineSvg: true })))), React.createElement("div", { className: "".concat(eccgui, "-graphviz__node__header-label"), title: typeof label === "string" ? label : undefined }, typeof label === "string" ? (React.createElement(OverflowText, { className: "".concat(eccgui, "-graphviz__node__header-label__mainline") }, label)) : (React.createElement("div", { className: "".concat(eccgui, "-graphviz__node__header-label__mainline") }, label)), !!labelSubline && (React.createElement("div", { className: "".concat(eccgui, "-graphviz__node__header-label__subline") }, labelSubline))), (menuButtons || (showExecutionButtons && executionButtons)) && (React.createElement("div", { className: "".concat(eccgui, "-graphviz__node__header-menu nodrag") }, showExecutionButtons && typeof executionButtons === "function" ? executionButtons(adjustedContentProps, setAdjustedContentProps) : null, menuButtons !== null && menuButtons !== void 0 ? menuButtons : null))), content && (React.createElement("div", { className: "".concat(eccgui, "-graphviz__node__content") }, typeof content === "function" ? content(adjustedContentProps) : content)), contentExtension, footerContent && React.createElement("footer", { className: "".concat(eccgui, "-graphviz__node__footer") }, footerContent)), !!handles && (React.createElement(React.Fragment, null, addHandles(handleStack, Position.Top, "left", isConnectable, style, flowVersionCheck), addHandles(handleStack, Position.Right, "top", isConnectable, style, flowVersionCheck), addHandles(handleStack, Position.Bottom, "left", isConnectable, style, flowVersionCheck), addHandles(handleStack, Position.Left, "top", isConnectable, style, flowVersionCheck))))); var validateWidth = function (resizedWidth) { var _a; // only allow value if resize direction is allowed if (!resizeDirections.right) { return undefined; } // we need to check because there is probably a min value defined via CSS var min = parseFloat(getComputedStyle(nodeContentRef.current).getPropertyValue("min-width")); // we need to check for a given max value var max = (_a = resizeMaxDimensions === null || resizeMaxDimensions === void 0 ? void 0 : resizeMaxDimensions.width) !== null && _a !== void 0 ? _a : Infinity; var validatedWidth = Math.max(Math.min(resizedWidth, max), min); return validatedWidth; }; var validateHeight = function (resizedHeight) { var _a; if (!resizeDirections.bottom) { return undefined; } // we need to check because there is probably a min value defined via CSS var min = parseFloat(getComputedStyle(nodeContentRef.current).getPropertyValue("min-height")); var max = (_a = resizeMaxDimensions === null || resizeMaxDimensions === void 0 ? void 0 : resizeMaxDimensions.height) !== null && _a !== void 0 ? _a : Infinity; var validatedHeight = Math.max(Math.min(resizedHeight, max), min); return validatedHeight; }; var onResize = React.useCallback(function (_0, _1, _2, d) { var _a, _b; if (nodeContentRef.current) { var nextWidth = resizeDirections.right ? ((_a = width !== null && width !== void 0 ? width : originalSize.current.width) !== null && _a !== void 0 ? _a : 0) + d.width : undefined; var nextHeight = resizeDirections.bottom ? ((_b = height !== null && height !== void 0 ? height : originalSize.current.height) !== null && _b !== void 0 ? _b : 0) + d.height : undefined; if (nextWidth || nextHeight) { var currentClassNames = nodeContentRef.current.classList; currentClassNames.add("was-resized"); } if (nextWidth) { nodeContentRef.current.style.width = "".concat(nextWidth, "px"); } if (nextHeight) { nodeContentRef.current.style.height = "".concat(nextHeight, "px"); } } }, [resizeDirections, originalSize, width, height]); var onResizeStop = React.useCallback(function (_0, _1, _2, d) { var _a, _b; var nextWidth = validateWidth(((_a = width !== null && width !== void 0 ? width : originalSize.current.width) !== null && _a !== void 0 ? _a : 0) + d.width); var nextHeight = validateHeight(((_b = height !== null && height !== void 0 ? height : originalSize.current.height) !== null && _b !== void 0 ? _b : 0) + d.height); setWidth(nextWidth); setHeight(nextHeight); if (onNodeResize) { onNodeResize({ height: nextHeight, width: nextWidth, }); } }, [onNodeResize, width, height, originalSize]); var resizableSize = React.useMemo(function () { return ({ height: height !== null && height !== void 0 ? height : "auto", width: width !== null && width !== void 0 ? width : "auto" }); }, [height, width]); var enableResize = React.useMemo(function () { return resizeDirections.bottom && resizeDirections.right ? { bottomRight: true } : resizeDirections; }, [resizeDirections]); var resizableNode = function () { var _a, _b; return (React.createElement(Resizable, { className: "".concat(eccgui, "-graphviz__node__resizer") + (resizeDirections.right ? " ".concat(eccgui, "-graphviz__node__resizer--right") : "") + (resizeDirections.bottom ? " ".concat(eccgui, "-graphviz__node__resizer--bottom") : ""), handleWrapperClass: "".concat(eccgui, "-graphviz__node__resizer--cursorhandles") + " nodrag", size: resizableSize, maxHeight: (_a = resizeMaxDimensions === null || resizeMaxDimensions === void 0 ? void 0 : resizeMaxDimensions.height) !== null && _a !== void 0 ? _a : undefined, maxWidth: (_b = resizeMaxDimensions === null || resizeMaxDimensions === void 0 ? void 0 : resizeMaxDimensions.width) !== null && _b !== void 0 ? _b : undefined, enable: enableResize, scale: zoom, onResize: onResize, onResizeStop: onResizeStop }, nodeContent)); }; return isResizable ? resizableNode() : nodeContent; } var evaluateHighlightColors = function (baseCustomProperty, highlightColor) { var _a; var styleHighlightColors = (_a = {}, _a["".concat(baseCustomProperty, "-default-color")] = undefined, _a["".concat(baseCustomProperty, "-alternate-color")] = undefined, _a); var classesHightlightColors = []; if (highlightColor) { var highlightingColors = typeof highlightColor === "string" ? [highlightColor] : highlightColor; highlightingColors.map(function (color, idx) { var _a, _b; switch (color) { case "default": classesHightlightColors.push("default"); break; case "alternate": classesHightlightColors.push("alternate"); break; default: { classesHightlightColors.push("custom"); var customColor = Color("#ffffff"); try { customColor = Color(color); } catch (_c) { // eslint-disable-next-line no-console console.warn("Received invalid color for highlight: " + color); } if (idx === 0) { styleHighlightColors = __assign(__assign({}, styleHighlightColors), (_a = {}, _a["".concat(baseCustomProperty, "-default-color")] = customColor.rgb().toString(), _a)); } else { styleHighlightColors = __assign(__assign({}, styleHighlightColors), (_b = {}, _b["".concat(baseCustomProperty, "-alternate-color")] = customColor.rgb().toString(), _b)); } break; } } return color; }); } return { highlightClassNameSuffix: classesHightlightColors, highlightCustomPropertySettings: styleHighlightColors, }; }; export var nodeContentUtils = { evaluateHighlightColors: evaluateHighlightColors, }; //# sourceMappingURL=NodeContent.js.map