/**
 * Copyright IBM Corp. 2020, 2026
 *
 * This source code is licensed under the Apache-2.0 license found in the
 * LICENSE file in the root directory of this source tree.
 */

import { __toESM } from "../../_virtual/_rolldown/runtime.js";
import { require_classnames } from "../../node_modules/classnames/index.js";
import { pkg } from "../../settings.js";
import { getMagnitude, truncate } from "./utils.js";
import { DecoratorIcon } from "./DecoratorIcon.js";
import React from "react";
import PropTypes from "prop-types";

//#region src/components/DecoratorBase/DecoratorBase.jsx
/**
* Copyright IBM Corp. 2024, 2024
*
* This source code is licensed under the Apache-2.0 license found in the
* LICENSE file in the root directory of this source tree.
*/
var import_classnames = /* @__PURE__ */ __toESM(require_classnames());
const blockClass = `${pkg.prefix}--decorator`;
const componentName = "DecoratorBase";
const defaults = {
	onClick: () => {},
	onClickLabel: () => {},
	onClickValue: () => {},
	onContextMenu: () => {},
	onContextMenuLabel: () => {},
	onContextMenuValue: () => {},
	scoreThresholds: [
		0,
		4,
		7,
		10
	]
};
/**
* The DecoratorBase groups a key/value pair to look and behave like a single UI element.
*
* DecoratorBase is for internal use only. Refer to the other Decorator types as components for your app.
*/
let DecoratorBase = React.forwardRef(({ className, disabled, hideIcon, href, kind, label, setLabelTitle, onClick = defaults.onClick, onClickLabel = defaults.onClickLabel, onClickValue = defaults.onClickValue, onContextMenu = defaults.onContextMenu, onContextMenuLabel = defaults.onContextMenuLabel, onContextMenuValue = defaults.onContextMenuValue, score, scoreThresholds = defaults.scoreThresholds, small, theme, truncateValue, value, valueTitle, ...rest }, ref) => {
	const magnitude = getMagnitude(score, scoreThresholds);
	const _labelTitle = setLabelTitle && setLabelTitle(score, scoreThresholds, magnitude);
	const _value = truncate(value, truncateValue);
	const classNames = (0, import_classnames.default)(blockClass, className, {
		[`${blockClass}--${theme}`]: theme,
		[`${blockClass}--sm`]: small,
		[`${blockClass}--truncate-end`]: truncateValue === "end",
		[`${blockClass}--truncate-start`]: truncateValue === "start",
		[`${blockClass}--truncate-midline`]: truncateValue?.maxLength
	});
	const decoratorIconsProps = {
		className: `${blockClass}__icon`,
		magnitude: magnitude.toLowerCase(),
		small
	};
	const handleOnClick = (event) => {
		onClick(event, {
			score,
			label,
			value,
			magnitude
		});
	};
	const handleOnContextMenu = (event) => {
		onContextMenu(event, {
			score,
			label,
			value,
			magnitude
		});
	};
	if (kind === "dual-button") {
		const handleOnClickLabel = (event) => {
			onClickLabel(event, {
				score,
				label,
				value,
				magnitude
			});
		};
		const handleOnClickValue = (event) => {
			onClickValue(event, {
				score,
				label,
				value,
				magnitude
			});
		};
		const handleOnContextMenuLabel = (event) => {
			onContextMenuLabel(event, {
				score,
				label,
				value,
				magnitude
			});
		};
		const handleOnContextMenuValue = (event) => {
			onContextMenuValue(event, {
				score,
				label,
				value,
				magnitude
			});
		};
		return /* @__PURE__ */ React.createElement("span", {
			...rest,
			className: (0, import_classnames.default)(classNames, `${blockClass}--dual-button`, { [`${blockClass}-disabled`]: disabled }),
			ref
		}, /* @__PURE__ */ React.createElement("button", {
			className: `${blockClass}__label`,
			disabled,
			onClick: !disabled && handleOnClickLabel,
			onContextMenu: !disabled && handleOnContextMenuLabel,
			title: _labelTitle || label,
			type: "button"
		}, !hideIcon && /* @__PURE__ */ React.createElement(DecoratorIcon, decoratorIconsProps), !!label && label), /* @__PURE__ */ React.createElement("button", {
			className: `${blockClass}__value`,
			disabled,
			onClick: !disabled && handleOnClickValue,
			onContextMenu: !disabled && handleOnContextMenuValue,
			title: valueTitle || value,
			type: "button"
		}, _value));
	}
	if (kind === "single-button") return /* @__PURE__ */ React.createElement("button", {
		...rest,
		className: (0, import_classnames.default)(classNames, `${blockClass}--single-button`, { [`${blockClass}-disabled`]: disabled }),
		disabled,
		onClick: !disabled && handleOnClick,
		onContextMenu: !disabled && handleOnContextMenu,
		ref,
		type: "button"
	}, /* @__PURE__ */ React.createElement("span", {
		className: `${blockClass}__label`,
		title: _labelTitle || label
	}, !hideIcon && /* @__PURE__ */ React.createElement(DecoratorIcon, decoratorIconsProps), !!label && label), /* @__PURE__ */ React.createElement("span", {
		className: `${blockClass}__value`,
		title: valueTitle || value
	}, _value));
	if (kind === "link") return /* @__PURE__ */ React.createElement("a", {
		...rest,
		href,
		className: (0, import_classnames.default)(classNames, `${blockClass}--link`),
		onClick: handleOnClick,
		onContextMenu: handleOnContextMenu,
		ref
	}, /* @__PURE__ */ React.createElement("span", {
		className: `${blockClass}__label`,
		title: _labelTitle || label
	}, !hideIcon && /* @__PURE__ */ React.createElement(DecoratorIcon, decoratorIconsProps), !!label && label), /* @__PURE__ */ React.createElement("span", {
		className: `${blockClass}__value`,
		title: valueTitle || value
	}, _value));
	return /* @__PURE__ */ React.createElement("span", {
		...rest,
		className: (0, import_classnames.default)(classNames, `${blockClass}--default`),
		ref
	}, /* @__PURE__ */ React.createElement("span", {
		className: `${blockClass}__label`,
		title: _labelTitle || label
	}, !hideIcon && /* @__PURE__ */ React.createElement(DecoratorIcon, decoratorIconsProps), !!label && label), /* @__PURE__ */ React.createElement("span", {
		className: `${blockClass}__value`,
		title: valueTitle || value
	}, _value));
});
DecoratorBase.displayName = componentName;
DecoratorBase.propTypes = {
	className: PropTypes.string,
	disabled: PropTypes.bool,
	hideIcon: PropTypes.bool,
	href: PropTypes.string,
	kind: PropTypes.oneOf([
		"default",
		"link",
		"single-button",
		"dual-button"
	]),
	label: PropTypes.string,
	onClick: PropTypes.func,
	onClickLabel: PropTypes.func,
	onClickValue: PropTypes.func,
	onContextMenu: PropTypes.func,
	onContextMenuLabel: PropTypes.func,
	onContextMenuValue: PropTypes.func,
	score: PropTypes.number,
	scoreThresholds: PropTypes.arrayOf(PropTypes.number),
	setLabelTitle: PropTypes.func,
	small: PropTypes.bool,
	theme: PropTypes.oneOf(["light", "dark"]),
	truncateValue: PropTypes.oneOfType([PropTypes.oneOf(["end", "start"]), PropTypes.shape({
		maxLength: PropTypes.number,
		front: PropTypes.number,
		back: PropTypes.number
	})]),
	value: PropTypes.string.isRequired,
	valueTitle: PropTypes.string
};

//#endregion
export { DecoratorBase };