import {
  useClipboard
} from "./chunk-QHODHUW2.js";
import {
  lineClamp
} from "./chunk-FAWI3ZGU.js";
import {
  Icon
} from "./chunk-DMPXNHDT.js";
import {
  applyTypography
} from "./chunk-2C7DZIDY.js";
import {
  elide
} from "./chunk-HAC5YAGQ.js";
import {
  getLineHeightNumberForTypographyType
} from "./chunk-KCUSJWDZ.js";
import {
  __spreadProps,
  __spreadValues
} from "./chunk-W7FAWX6T.js";

// src/components/ClipboardTextField.tsx
import { useTheme } from "@emotion/react";
import styled from "@emotion/styled";
import { useCallback } from "react";
import { jsx, jsxs } from "@emotion/react/jsx-runtime";
function ClipboardTextField({
  value,
  icon,
  iconName,
  id,
  stopPropagation,
  maxLines,
  elide: elideArgs,
  wordBreakAll = false,
  tag = "span",
  iconSide = "left",
  iconColor: iconColorProp,
  typography,
  clipboardCallbacks
}) {
  const theme = useTheme();
  const { canWriteToClipboard, writeTextToClipboard } = useClipboard(clipboardCallbacks);
  const addLineClamp = Boolean(maxLines && maxLines > 1);
  const displayValue = elideArgs ? elide(value, elideArgs) : value;
  const valueNode = /* @__PURE__ */ jsx(
    ClipboardTextFieldValue,
    {
      wordBreakAll,
      typography,
      addLineClamp,
      maxLines,
      children: displayValue
    }
  );
  const onClick = useCallback(
    (event) => {
      if (stopPropagation) {
        event.stopPropagation();
      }
      void writeTextToClipboard(value);
    },
    [stopPropagation, value, writeTextToClipboard]
  );
  function onKeyDown(event) {
    if (event.key === "Enter" || event.key === " ") {
      if (stopPropagation) {
        event.stopPropagation();
      }
      void writeTextToClipboard(value);
    }
  }
  const commonProps = {
    as: tag,
    id,
    addLineClamp,
    maxLines
  };
  const typographyType = (typography == null ? void 0 : typography.type) || "Body";
  const typographySize = (typography == null ? void 0 : typography.size) || "ExtraSmall";
  const lineHeight = getLineHeightNumberForTypographyType(
    typographyType,
    typographySize,
    theme
  );
  const iconColor = iconColorProp || (typography == null ? void 0 : typography.color) || "inherit";
  return canWriteToClipboard && value ? /* @__PURE__ */ jsxs(
    StyledClipboardTextField,
    __spreadProps(__spreadValues({
      onClick,
      role: "button",
      tabIndex: 0,
      onKeyDown
    }, commonProps), {
      children: [
        icon && iconSide === "left" ? /* @__PURE__ */ jsx(
          Icon,
          {
            name: iconName || "Copy",
            width: lineHeight * 0.7,
            mr: lineHeight * 0.3,
            color: iconColor
          }
        ) : null,
        valueNode,
        icon && iconSide === "right" ? /* @__PURE__ */ jsx(
          Icon,
          {
            name: iconName || "Copy",
            width: lineHeight * 0.7,
            ml: lineHeight * 0.3,
            color: iconColor
          }
        ) : null
      ]
    })
  ) : /* @__PURE__ */ jsx(StyledClipboardTextField, __spreadProps(__spreadValues({}, commonProps), { children: valueNode }));
}
var StyledClipboardTextField = styled.span`
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  align-items: center;
  box-sizing: content-box;
  cursor: pointer;

  ${({ addLineClamp, maxLines }) => (
  /* keep the icon on the same line when addLineClamp: */
  addLineClamp || maxLines === 1 ? "display: inline-flex;" : ""
)}

  ${({ maxLines }) => maxLines === 1 ? "white-space: nowrap;" : ""}
`;
var ClipboardTextFieldValue = styled.span`
  flex: 1;
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  word-break: ${({ wordBreakAll }) => wordBreakAll ? "break-all" : "normal"};
  vertical-align: middle;

  ${({ addLineClamp, maxLines }) => addLineClamp && maxLines ? `
        ${lineClamp(maxLines).styles}
        align-self: baseline;
      ` : ""}

  ${({ theme, typography }) => applyTypography(
  theme,
  (typography == null ? void 0 : typography.type) || "Body",
  (typography == null ? void 0 : typography.size) || "ExtraSmall",
  (typography == null ? void 0 : typography.color) || "inherit"
)}
`;

export {
  ClipboardTextField
};
