@progress/kendo-react-inputs
Version:
React Inputs offer a customizable interface for users to enter and pick different information. KendoReact Input package
33 lines (32 loc) • 2.62 kB
JavaScript
/**
* @license
*-------------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the package root for more information
*-------------------------------------------------------------------------------------------
*/
import * as e from "react";
import { provideLocalizationService as N, registerForLocalization as S } from "@progress/kendo-react-intl";
import { colorGradientContrastRatio as i, messages as o, colorGradientAALevel as l, colorGradientAAALevel as m, colorGradientPass as g, colorGradientFail as d } from "../messages/index.mjs";
import { getContrastFromTwoRGBAs as F } from "./utils/color-parser.mjs";
import { IconWrap as n } from "@progress/kendo-react-common";
import { checkIcon as r, xIcon as p } from "@progress/kendo-svg-icons";
class G extends e.Component {
render() {
const t = N(this), x = t.toLanguageString(
i,
o[i]
), k = t.toLanguageString(
l,
o[l]
), v = t.toLanguageString(
m,
o[m]
), A = t.toLanguageString(g, o[g]), E = t.toLanguageString(d, o[d]), a = F(this.props.rgba, this.props.bgColor), u = 4.5.toFixed(1), L = 7 .toFixed(1), C = `${x}: ${a.toFixed(2)}`, f = `${k}: ${u}`, h = `${v}: ${L}`, s = /* @__PURE__ */ e.createElement("span", { className: "k-contrast-validation k-text-success" }, A, " ", /* @__PURE__ */ e.createElement(n, { name: "check", icon: r })), c = /* @__PURE__ */ e.createElement("span", { className: "k-contrast-validation k-text-error" }, E, " ", /* @__PURE__ */ e.createElement(n, { name: "x", icon: p }));
return /* @__PURE__ */ e.createElement("div", { className: "k-vbox k-colorgradient-color-contrast" }, /* @__PURE__ */ e.createElement("div", { className: "k-contrast-ratio" }, /* @__PURE__ */ e.createElement("span", { className: "k-contrast-ratio-text" }, C), a >= 4.5 ? /* @__PURE__ */ e.createElement("span", { className: "k-contrast-validation k-text-success" }, /* @__PURE__ */ e.createElement(n, { name: "check", icon: r }), a >= 7 && /* @__PURE__ */ e.createElement(n, { name: "check", icon: r })) : /* @__PURE__ */ e.createElement("span", { className: "k-contrast-validation k-text-error" }, /* @__PURE__ */ e.createElement(n, { name: "x", icon: p }))), /* @__PURE__ */ e.createElement("div", null, /* @__PURE__ */ e.createElement("span", null, f), a >= 4.5 ? s : c), /* @__PURE__ */ e.createElement("div", null, /* @__PURE__ */ e.createElement("span", null, h), a >= 7 ? s : c));
}
}
S(G);
export {
G as ColorContrastLabels
};