ant-design-x-vue-next/es/code-highlighter/style/index.mjs

Ant Design X for Vue — community continuation aligned with @ant-design/x

import "vue";
import "../../_util/cssinjs/StyleContext.mjs";
import "../../_util/cssinjs/theme/ThemeCache.mjs";
import "../../_util/warning.mjs";
import "../../_util/cssinjs/transformers/legacyLogicalProperties.mjs";
import { merge as t } from "../../_util/cssinjs-utils/util/statistic.mjs";
import { genStyleHooks as r } from "../../theme/genStyleUtils.mjs";
const n = (o) => ({
  [`${o}-code`]: {
    ".token.comment,.token.prolog,.token.doctype,.token.cdata": {
      color: "slategray"
    },
    ".token.punctuation": {
      color: "#999"
    },
    ".token.namespace": {
      opacity: 0.7
    },
    ".token.property,.token.tag,.token.boolean,.token.number,.token.constant,.token.symbol,.token.deleted": {
      color: "#905"
    },
    ".token.selector,.token.attr-name,.token.string,.token.char,.token.builtin,.token.inserted": {
      color: "#690"
    },
    ".token.operator,.token.entity,.token.url,.language-css .token.string,.style .token.string": {
      color: "#9a6e3a"
    },
    ".token.atrule,.token.attr-value,.token.keyword": {
      color: "#07a"
    },
    ".token.function,.token.class-name": {
      color: "#DD4A68"
    },
    ".token.regex,.token.important,.token.variable": {
      color: "#e90"
    },
    ".token.important,.token.bold": {
      fontWeight: "bold"
    },
    ".token.italic": {
      fontStyle: "italic"
    }
  }
}), a = (o) => {
  const { componentCls: e } = o;
  return {
    [e]: {
      [`${e}-header`]: {
        display: "flex",
        alignItems: "center",
        justifyContent: "space-between",
        color: o.colorText,
        background: o.colorFillContent,
        padding: o.paddingSM,
        borderStartStartRadius: o.borderRadius,
        borderStartEndRadius: o.borderRadius
      },
      [`${e}-header-title`]: {
        fontSize: o.fontSize,
        fontWeight: o.fontWeightStrong
      },
      [`${e}-code`]: {
        borderEndEndRadius: o.borderRadius,
        borderEndStartRadius: o.borderRadius,
        borderStartStartRadius: 0,
        borderStartEndRadius: 0,
        background: o.colorBgContainer,
        border: `1px solid ${o.colorBorderSecondary}`,
        borderTop: "none",
        overflow: "hidden",
        "pre,code": {
          whiteSpace: "pre",
          fontSize: o.fontSize,
          // ant-design-vue token may not expose fontFamilyCode
          fontFamily: o.fontFamily,
          lineHeight: 2,
          borderRadius: 0,
          border: "none",
          margin: 0
        },
        "code[class*='language-'],pre[class*='language-']": {
          background: "none"
        },
        pre: {
          minWidth: "100%",
          overflow: "auto",
          padding: o.paddingSM
        }
      },
      ...n(e),
      [`&${e}-rtl`]: {
        direction: "rtl"
      }
    }
  };
}, i = (o) => ({
  colorBgTitle: o.colorFillContent,
  colorBorderCode: o.colorBorderSecondary,
  colorTextTitle: o.colorText
}), k = r(
  "CodeHighlighter",
  (o) => {
    const e = t(o, {});
    return [a(e)];
  },
  i
);
export {
  k as default,
  i as prepareComponentToken
};