import React from "react";
import { Decoration_Type } from "./../ricos-schema/legacy/wix/rich_content/v1/index.js";
import { resolveDocumentColorToCss } from "./../_shared/theme-color-token.js";
import { TEXT_COLOR_TYPE, TEXT_HIGHLIGHT_TYPE } from "./types.js";
const TO_PROPERTY = {
  [TEXT_COLOR_TYPE]: "color",
  [TEXT_HIGHLIGHT_TYPE]: "backgroundColor"
};
const decorator = (element, colorDecoration, context) => {
  const shouldParseColor = (type, color) => {
    return context.config?.[type]?.styleSelectionPredicate?.(color);
  };
  const parseColor = (type, color) => {
    return context.config?.[type]?.customStyleFn(color);
  };
  const getColor = (type, color) => {
    return shouldParseColor(type, color) ? parseColor(type, color) : { [TO_PROPERTY[type]]: resolveDocumentColorToCss(color) };
  };
  const { foreground, background } = colorDecoration?.colorData || {};
  return /* @__PURE__ */ React.createElement(
    "span",
    {
      key: `color-${element.key}`,
      style: {
        ...getColor(TEXT_COLOR_TYPE, foreground),
        ...getColor(TEXT_HIGHLIGHT_TYPE, background),
        textDecoration: "inherit"
      }
    },
    element
  );
};
const ColorDecorator = {
  rule: (node) => {
    return !!node.textData?.decorations?.some(({ type }) => type === Decoration_Type.COLOR);
  },
  decorate: ({ element, node, context }) => {
    const colorDecoration = node.textData?.decorations?.find(
      ({ type }) => type === Decoration_Type.COLOR
    );
    return decorator(element, colorDecoration, context);
  }
};
var node_view_decorator_default = ColorDecorator;
export {
  node_view_decorator_default as default
};
//# sourceMappingURL=node-view-decorator.js.map
