@lobehub/ui/es/color/ColorScales/ScaleRow.mjs

Lobe UI is an open-source UI component library for building AIGC web apps

import FlexBasic_default from "../../Flex/FlexBasic.mjs";
import { copyToClipboard } from "../../utils/copyToClipboard.mjs";
import { toast } from "../../base-ui/Toast/imperative.mjs";
import { alphaBg, styles } from "./style.mjs";
import { memo } from "react";
import { jsx, jsxs } from "react/jsx-runtime";
//#region src/color/ColorScales/ScaleRow.tsx
const ScaleRow = memo(({ name, title, scale }) => {
	let style = {};
	let isAlpha = false;
	switch (title) {
		case "lightA":
			style = {
				background: alphaBg.light,
				backgroundColor: "#fff"
			};
			isAlpha = true;
			break;
		case "darkA":
			style = {
				background: alphaBg.dark,
				backgroundColor: "#000"
			};
			isAlpha = true;
	}
	return /* @__PURE__ */ jsxs(FlexBasic_default, {
		horizontal: true,
		align: "center",
		gap: 2,
		children: [/* @__PURE__ */ jsx("div", {
			className: styles.scaleRowTitle,
			children: /* @__PURE__ */ jsx("div", {
				className: styles.text,
				children: title
			})
		}, title), scale.map((color, index) => {
			if (index === 0 || index === 12) return false;
			return /* @__PURE__ */ jsx("div", {
				className: styles.scaleBox,
				style,
				title: color,
				onClick: async () => {
					const content = `token.${name}${index}${isAlpha ? "A" : ""} /* ${color} */`;
					await copyToClipboard(content);
					toast.success(content);
				},
				children: /* @__PURE__ */ jsx(FlexBasic_default, {
					horizontal: true,
					align: "center",
					className: styles.scaleItem,
					justify: "center",
					style: { backgroundColor: color }
				})
			}, index);
		})]
	});
});
//#endregion
export { ScaleRow as default };

//# sourceMappingURL=ScaleRow.mjs.map