import {
  styled
} from "../../chunk.XMQYLX4J.js";
import "../../chunk.DXADCDEM.js";
import "../../chunk.PSO6NFST.js";

// src/runtime/internal/components/CodeSnippet.tsx
import {
  createElement,
  useMemo
} from "react";
function createSnippetComponent(parseResult) {
  return function BoundCodeSnippet(props) {
    return /* @__PURE__ */ createElement(CodeSnippet, {
      ...props,
      parseResult
    });
  };
}
function CodeSnippetComponent(props) {
  const {bgColor, fgColor, firstLineOffset, language, tokensByLine} = props.parseResult;
  const fromLine = Math.max(0, (props.fromLine || 1) - 1);
  const toLine = Math.max(fromLine + 1, props.toLine || tokensByLine.length);
  const lineSlice = tokensByLine.slice(fromLine, toLine);
  const firstLineNumber = firstLineOffset + fromLine + 1;
  const emphasizeLines = useMemo(() => (props.emphasizeRanges || []).reduce((lines, [fromLine2, toLine2]) => {
    for (let i = fromLine2; i <= toLine2; i++) {
      lines.add(i);
    }
    return lines;
  }, new Set()), [props.emphasizeRanges]);
  const bgHex = hexToRgb(bgColor);
  const fgHex = hexToRgb(fgColor);
  const classNames = [
    props.className,
    props.lineNumbers ? "line-numbers" : void 0,
    emphasizeLines.size ? "has-emphasis" : void 0
  ].filter(Boolean).join(" ");
  return /* @__PURE__ */ createElement("pre", {
    "data-lang": language || "unknown",
    className: classNames,
    style: {
      backgroundColor: bgColor,
      color: fgColor,
      "--bgColor": bgHex ? `${bgHex.r}, ${bgHex.g}, ${bgHex.b}` : bgColor,
      "--fgColor": fgHex ? `${fgHex.r}, ${fgHex.g}, ${fgHex.b}` : fgColor
    }
  }, /* @__PURE__ */ createElement("code", null, lineSlice.map((line, lineIdx) => {
    const lineNumber = firstLineNumber + lineIdx;
    return /* @__PURE__ */ createElement("span", {
      className: emphasizeLines.has(lineNumber) ? "has-emphasis" : void 0,
      "data-lineno": lineNumber,
      key: lineNumber
    }, line.map((token, tokenIdx) => {
      const [value, fgColor2] = Array.isArray(token) ? token : [token];
      return /* @__PURE__ */ createElement("span", {
        key: tokenIdx,
        style: {color: fgColor2}
      }, value);
    }), lineIdx < lineSlice.length - 1 ? "\n" : null);
  })));
}
var CodeSnippet = styled(CodeSnippetComponent)`
  pre&[data-lang] {
    background-color: rgb(var(--bgColor, transparent));
    position: relative;
    overflow: auto;
    padding-left: 0;
    padding-right: 0;
  }

  & > code {
    padding: 0.857143em 0;
    display: block;
    min-width: max-content;
  }

  & span[data-lineno] {
    background-color: rgb(var(--bgColor, transparent));
    display: block;
    transition: filter 0.2s ease-in-out;
    width: 100%;
    padding-left: 1.6em;
    padding-right: 1.6em;
    position: relative;
  }

  &.line-numbers span[data-lineno] {
    padding-left: 0;
  }

  &.line-numbers span[data-lineno]::before {
    display: inline-block;
    position: sticky;
    left: 0;
    content: attr(data-lineno);
    background-color: rgb(var(--bgColor, transparent));
    color: rgba(var(--fgColor), 0.8);
    text-align: right;
    padding-right: 0.4rem;
    margin-right: 0.4em;
    transition: filter, border-color 0.2s ease-in-out;
    width: 4rem;
  }

  /* Emphasis border with line numbers */
  &.line-numbers span[data-lineno].has-emphasis::before {
    border-left: 0.3rem solid rgba(var(--fgColor), 0.8);
  }

  /* Emphasis border without line numbers */
  & span[data-lineno].has-emphasis::after {
    border-left: 0.3rem solid rgba(var(--fgColor), 0.8);
    display: inline-block;
    position: absolute;
    top: 0;
    left: 0;
    content: ' ';
  }

  &.has-emphasis {
    span[data-lineno]:not(.has-emphasis) {
      filter: contrast(0.6) brightness(0.6);
    }

    &:hover {
      span[data-lineno] {
        filter: contrast(1) brightness(1);

        /* Emphasis border with line numbers while block hovered */
        &.has-emphasis::before {
          border-left: 0.3rem solid rgba(var(--fgColor), 0.9);
        }

        /* Emphasis border without line numbers while block hovered */
        &.has-emphasis::after {
          border-left-color: rgba(var(--fgColor), 0.9);
        }
      }
    }
  }

  &.has-emphasis span[data-lineno].has-emphasis {
    background-color: rgb(var(--bgColor, transparent));
  }
`;
function hexToRgb(hex) {
  var shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i;
  hex = hex.replace(shorthandRegex, function(_, r, g, b) {
    return r + r + g + g + b + b;
  });
  var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
  return result ? {
    r: parseInt(result[1], 16),
    g: parseInt(result[2], 16),
    b: parseInt(result[3], 16)
  } : null;
}
export {
  CodeSnippet,
  createSnippetComponent
};
