Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const require_chunk = require("../chunk-BN4qSVkS.cjs");
const require_styles_tokens_typography = require("../styles/tokens/typography.cjs");
const require_styles_typography = require("../styles/typography.cjs");
const require_utils_strings = require("../utils/strings.cjs");
const require_components_Icon_Icon = require("./Icon/Icon.cjs");
const require_hooks_useClipboard = require("../hooks/useClipboard.cjs");
const require_styles_utils = require("../styles/utils.cjs");
let _emotion_styled = require("@emotion/styled");
_emotion_styled = require_chunk.__toESM(_emotion_styled);
let react = require("react");
let _emotion_react = require("@emotion/react");
let _emotion_react_jsx_runtime = require("@emotion/react/jsx-runtime");
//#region src/components/ClipboardTextField.tsx
function ClipboardTextField({ value, icon, iconName, id, stopPropagation, maxLines, elide: elideArgs, wordBreakAll = false, tag = "span", iconSide = "left", iconColor: iconColorProp, typography, clipboardCallbacks }) {
	const theme = (0, _emotion_react.useTheme)();
	const { canWriteToClipboard, writeTextToClipboard } = require_hooks_useClipboard.useClipboard(clipboardCallbacks);
	const addLineClamp = Boolean(maxLines && maxLines > 1);
	const valueNode = /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)(ClipboardTextFieldValue, {
		wordBreakAll,
		typography,
		addLineClamp,
		maxLines,
		children: elideArgs ? require_utils_strings.elide(value, elideArgs) : value
	});
	const onClick = (0, react.useCallback)((event) => {
		if (stopPropagation) event.stopPropagation();
		writeTextToClipboard(value);
	}, [
		stopPropagation,
		value,
		writeTextToClipboard
	]);
	function onKeyDown(event) {
		if (event.key === "Enter" || event.key === " ") {
			if (stopPropagation) event.stopPropagation();
			writeTextToClipboard(value);
		}
	}
	const commonProps = {
		as: tag,
		id,
		addLineClamp,
		maxLines
	};
	const lineHeight = require_styles_tokens_typography.getLineHeightNumberForTypographyType(typography?.type || "Body", typography?.size || "ExtraSmall", theme);
	const iconColor = iconColorProp || typography?.color || "inherit";
	return canWriteToClipboard && value ? /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsxs)(StyledClipboardTextField, {
		onClick,
		role: "button",
		tabIndex: 0,
		onKeyDown,
		...commonProps,
		children: [
			icon && iconSide === "left" ? /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)(require_components_Icon_Icon.Icon, {
				name: iconName || "Copy",
				width: lineHeight * .7,
				mr: lineHeight * .3,
				color: iconColor
			}) : null,
			valueNode,
			icon && iconSide === "right" ? /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)(require_components_Icon_Icon.Icon, {
				name: iconName || "Copy",
				width: lineHeight * .7,
				ml: lineHeight * .3,
				color: iconColor
			}) : null
		]
	}) : /* @__PURE__ */ (0, _emotion_react_jsx_runtime.jsx)(StyledClipboardTextField, {
		...commonProps,
		children: valueNode
	});
}
const StyledClipboardTextField = _emotion_styled.default.span`
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  align-items: center;
  box-sizing: content-box;
  cursor: pointer;

  ${({ addLineClamp, maxLines }) => addLineClamp || maxLines === 1 ? "display: inline-flex;" : ""}

  ${({ maxLines }) => maxLines === 1 ? "white-space: nowrap;" : ""}
`;
const ClipboardTextFieldValue = _emotion_styled.default.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 ? `
        ${require_styles_utils.lineClamp(maxLines).styles}
        align-self: baseline;
      ` : ""}

  ${({ theme, typography }) => require_styles_typography.applyTypography(theme, typography?.type || "Body", typography?.size || "ExtraSmall", typography?.color || "inherit")}
`;
//#endregion
exports.ClipboardTextField = ClipboardTextField;
