@payfit/unity-components
Version:
41 lines (40 loc) • 1.34 kB
JavaScript
import { useMemo as e } from "react";
import { uyTv as t } from "@payfit/unity-themes";
import { jsx as n, jsxs as r } from "react/jsx-runtime";
import { useIntl as i } from "react-intl";
import { Icon as a } from "@payfit/unity-icons";
//#region src/components/password-field/parts/ValidationRuleItem.tsx
var o = t({ slots: {
root: ["uy:flex uy:items-center uy:gap-50 uy:typography-body-small"],
label: ["uy:text-content-neutral"]
} });
function s({ id: t, label: s, status: c }) {
let l = i(), u = c === "checked", d = e(() => u ? /* @__PURE__ */ n(a, {
src: "CheckCircleFilled",
color: "content.success",
size: 20
}) : /* @__PURE__ */ n(a, {
src: "CheckCircleOutlined",
color: "content.neutral",
size: 20
}), [u]), f = u ? l.formatMessage({
id: "unity:component:password-field:rule-status:passed",
defaultMessage: "Passed"
}) : l.formatMessage({
id: "unity:component:password-field:rule-status:not-passed",
defaultMessage: "Not passed"
}), { root: p, label: m } = o();
return /* @__PURE__ */ r("li", {
className: p(),
"aria-label": `${f}: ${typeof s == "string" ? s : ""}`,
children: [d, /* @__PURE__ */ r("span", {
className: m(),
children: [/* @__PURE__ */ r("span", {
className: "uy:sr-only",
children: [f, ": "]
}), s]
})]
}, t);
}
//#endregion
export { s as ValidationRuleItem };