@thebuoyant-tsdev/mui-ts-library 3.11.0 → 3.11.2

package/dist/components/password-strength-meter/PasswordStrengthMeter.js

@@ -1,49 +1,50 @@
-import { scorePassword as e } from "./util/password-strength.util.js";
-import { PasswordStrengthBar as t } from "./PasswordStrengthBar.js";
-import { DEFAULT_CHECK_COLORS as n, DEFAULT_METER_COLORS as r, DEFAULT_PASSWORD_TRANSLATIONS as i } from "./PasswordStrengthMeter.types.js";
-import { useId as a, useMemo as o, useState as s } from "react";
-import { Box as ee, Button as te, FormControl as c, FormHelperText as l, IconButton as u, InputAdornment as d, InputLabel as f, OutlinedInput as p, Stack as m, Tooltip as h, Typography as g } from "@mui/material";
-import { jsx as _, jsxs as v } from "react/jsx-runtime";
+import { useTimedFlag as e } from "../shared/useTimedFlag.js";
+import { scorePassword as t } from "./util/password-strength.util.js";
+import { PasswordStrengthBar as n } from "./PasswordStrengthBar.js";
+import { DEFAULT_CHECK_COLORS as r, DEFAULT_METER_COLORS as i, DEFAULT_PASSWORD_TRANSLATIONS as a } from "./PasswordStrengthMeter.types.js";
+import { useId as o, useMemo as s, useState as c } from "react";
+import { Box as ee, Button as te, FormControl as l, FormHelperText as u, IconButton as d, InputAdornment as f, InputLabel as p, OutlinedInput as m, Stack as h, Tooltip as g, Typography as _ } from "@mui/material";
+import { jsx as v, jsxs as y } from "react/jsx-runtime";
 import ne from "@mui/icons-material/ContentCopy";
 import re from "@mui/icons-material/Check";
 import ie from "@mui/icons-material/AutoFixHigh";
-import y from "@mui/icons-material/CheckCircleOutlined";
-import b from "@mui/icons-material/ErrorOutlined";
+import b from "@mui/icons-material/CheckCircleOutlined";
+import x from "@mui/icons-material/ErrorOutlined";
 import ae from "@mui/icons-material/CheckCircle";
 import oe from "@mui/icons-material/Cancel";
-import x from "@mui/icons-material/Visibility";
-import S from "@mui/icons-material/VisibilityOff";
+import S from "@mui/icons-material/Visibility";
+import C from "@mui/icons-material/VisibilityOff";
 //#region src/components/password-strength-meter/PasswordStrengthMeter.tsx
 function se(e) {
 	let t = [];
 	e.upper && t.push("ABCDEFGHIJKLMNOPQRSTUVWXYZ"), e.lower && t.push("abcdefghijklmnopqrstuvwxyz"), e.numbers && t.push("0123456789"), e.symbols && t.push("!@#$%^&*()-_=+[]{}|;:,.<>?"), t.length === 0 && t.push("abcdefghijklmnopqrstuvwxyz");
-	let n = t.join(""), r = new Uint32Array(e.length);
-	crypto.getRandomValues(r);
-	let i = t.map((e) => e[crypto.getRandomValues(new Uint32Array(1))[0] % e.length]), a = Array.from(r.slice(i.length)).map((e) => n[e % n.length]), o = [...i, ...a];
-	for (let e = o.length - 1; e > 0; e--) {
+	let n = t.join(""), r = Math.max(e.length, t.length), i = new Uint32Array(Math.max(0, r - t.length));
+	crypto.getRandomValues(i);
+	let a = t.map((e) => e[crypto.getRandomValues(new Uint32Array(1))[0] % e.length]), o = Array.from(i).map((e) => n[e % n.length]), s = [...a, ...o];
+	for (let e = s.length - 1; e > 0; e--) {
 		let t = crypto.getRandomValues(new Uint32Array(1))[0] % (e + 1);
-		[o[e], o[t]] = [o[t], o[e]];
+		[s[e], s[t]] = [s[t], s[e]];
 	}
-	return o.join("");
+	return s.join("");
 }
-function C({ label: e, fulfilled: t, checkColors: n }) {
-	return /* @__PURE__ */ v(m, {
+function w({ label: e, fulfilled: t, checkColors: n }) {
+	return /* @__PURE__ */ y(h, {
 		direction: "row",
 		sx: {
 			alignItems: "center",
 			mb: .25
 		},
 		spacing: .5,
-		children: [/* @__PURE__ */ _(g, {
+		children: [/* @__PURE__ */ v(_, {
 			variant: "caption",
 			children: e
-		}), t ? /* @__PURE__ */ _(y, {
+		}), t ? /* @__PURE__ */ v(b, {
 			"data-testid": "psm-req-success",
 			style: {
 				fontSize: 16,
 				color: n.success
 			}
-		}) : /* @__PURE__ */ _(b, {
+		}) : /* @__PURE__ */ v(x, {
 			"data-testid": "psm-req-failure",
 			style: {
 				fontSize: 16,
@@ -52,237 +53,237 @@ function C({ label: e, fulfilled: t, checkColors: n }) {
 		})]
 	});
 }
-function w({ value: y, confirmValue: b, name: w, inputRef: ce, disabled: T = !1, error: le = !1, helperText: E, autoComplete: ue, customRequirements: de, generatorOptions: D, showConfirmField: O = !1, showPasswordAdornment: k = !0, showMeter: fe = !0, showPasswordGenerator: pe = !1, showSegmentedBar: me = !1, showSummary: he = !0, showCopyButton: A = !1, inputSize: j = "medium", translation: ge, meterColors: _e, passwordMinLength: M = 8, checkColors: N = n, onPasswordChange: P, onConfirmChange: ve, onPasswordGenerated: ye }) {
-	let F = {
+function T({ value: b, confirmValue: x, name: T, inputRef: ce, disabled: E = !1, error: le = !1, helperText: D, autoComplete: ue, customRequirements: de, generatorOptions: O, showConfirmField: k = !1, showPasswordAdornment: A = !0, showMeter: j = !0, showPasswordGenerator: fe = !1, showSegmentedBar: pe = !1, showSummary: me = !0, showCopyButton: M = !1, inputSize: N = "medium", translation: he, meterColors: ge, passwordMinLength: P = 8, checkColors: F = r, onPasswordChange: I, onConfirmChange: _e, onPasswordGenerated: ve }) {
+	let L = {
+		...a,
+		...he
+	}, R = {
 		...i,
 		...ge
-	}, I = {
-		...r,
-		..._e
-	}, L = a(), R = `${L}-password`, [z, B] = s(!1), [V, be] = s(!1), [xe, H] = s(""), [U, W] = s(""), [G, K] = s(!1), q = y === void 0 ? xe : y, J = b === void 0 ? U : b, Y = O && J.length > 0, X = Y && q === J, Z = o(() => e(q, M), [q, M]), Se = () => {
-		B((e) => !e);
+	}, z = o(), B = `${z}-password`, [V, H] = c(!1), [U, ye] = c(!1), [be, W] = c(""), [xe, G] = c(""), [K, Se] = e(), q = b === void 0 ? be : b, J = x === void 0 ? xe : x, Y = k && J.length > 0, X = Y && q === J, Z = s(() => t(q, P), [q, P]), Ce = () => {
+		H((e) => !e);
 	}, Q = (e) => {
 		e.preventDefault();
 	}, $ = (e) => {
 		e.preventDefault();
 	};
-	return /* @__PURE__ */ v(m, { children: [
-		/* @__PURE__ */ v(c, {
+	return /* @__PURE__ */ y(h, { children: [
+		/* @__PURE__ */ y(l, {
 			variant: "outlined",
 			fullWidth: !0,
 			error: le,
 			children: [
-				/* @__PURE__ */ _(f, {
-					htmlFor: R,
-					size: j,
-					children: F.label
+				/* @__PURE__ */ v(p, {
+					htmlFor: B,
+					size: N,
+					children: L.label
 				}),
-				/* @__PURE__ */ _(p, {
-					id: R,
-					type: z ? "text" : "password",
+				/* @__PURE__ */ v(m, {
+					id: B,
+					type: V ? "text" : "password",
 					fullWidth: !0,
-					size: j,
+					size: N,
 					value: q,
-					onChange: (t) => {
-						let n = t.target.value;
-						y === void 0 && H(n), P && P(n, e(n, M));
+					onChange: (e) => {
+						let n = e.target.value;
+						b === void 0 && W(n), I && I(n, t(n, P));
 					},
-					disabled: T,
+					disabled: E,
 					inputRef: ce,
 					inputProps: {
 						"data-testid": "psm-input",
-						name: w,
+						name: T,
 						autoComplete: ue
 					},
-					endAdornment: k || A && q.length > 0 ? /* @__PURE__ */ v(d, {
+					endAdornment: A || M && q.length > 0 ? /* @__PURE__ */ y(f, {
 						position: "end",
-						children: [A && q.length > 0 && /* @__PURE__ */ _(h, {
-							title: G ? F.copiedLabel : F.copyPasswordLabel,
+						children: [M && q.length > 0 && /* @__PURE__ */ v(g, {
+							title: K ? L.copiedLabel : L.copyPasswordLabel,
 							arrow: !0,
-							children: /* @__PURE__ */ _("span", { children: /* @__PURE__ */ _(u, {
+							children: /* @__PURE__ */ v("span", { children: /* @__PURE__ */ v(d, {
 								"data-testid": "psm-copy",
-								disabled: T,
-								"aria-label": G ? F.copiedLabel : F.copyPasswordLabel,
+								disabled: E,
+								"aria-label": K ? L.copiedLabel : L.copyPasswordLabel,
 								onClick: () => {
 									navigator.clipboard.writeText(q).then(() => {
-										K(!0), setTimeout(() => K(!1), 2e3);
+										Se();
 									});
 								},
 								onMouseDown: Q,
 								onMouseUp: $,
-								edge: k ? !1 : "end",
-								children: G ? /* @__PURE__ */ _(re, {
+								edge: A ? !1 : "end",
+								children: K ? /* @__PURE__ */ v(re, {
 									fontSize: "small",
 									color: "success"
-								}) : /* @__PURE__ */ _(ne, { fontSize: "small" })
+								}) : /* @__PURE__ */ v(ne, { fontSize: "small" })
 							}) })
-						}), k && /* @__PURE__ */ _(u, {
+						}), A && /* @__PURE__ */ v(d, {
 							"data-testid": "psm-toggle",
-							disabled: T,
-							"aria-label": z ? F.hidePasswordLabel : F.showPasswordLabel,
-							onClick: Se,
+							disabled: E,
+							"aria-label": V ? L.hidePasswordLabel : L.showPasswordLabel,
+							onClick: Ce,
 							onMouseDown: Q,
 							onMouseUp: $,
 							edge: "end",
-							children: _(z ? S : x, {})
+							children: v(V ? C : S, {})
 						})]
 					}) : null,
-					label: F.label
+					label: L.label
 				}),
-				E && /* @__PURE__ */ _(l, { children: E })
+				D && /* @__PURE__ */ v(u, { children: D })
 			]
 		}),
-		pe && /* @__PURE__ */ _(h, {
-			title: F.generatePasswordLabel,
+		fe && /* @__PURE__ */ v(g, {
+			title: L.generatePasswordLabel,
 			arrow: !0,
-			children: /* @__PURE__ */ _("span", { children: /* @__PURE__ */ _(te, {
+			children: /* @__PURE__ */ v("span", { children: /* @__PURE__ */ v(te, {
 				"data-testid": "psm-generate",
 				size: "small",
 				variant: "text",
-				startIcon: /* @__PURE__ */ _(ie, { fontSize: "small" }),
-				disabled: T,
+				startIcon: /* @__PURE__ */ v(ie, { fontSize: "small" }),
+				disabled: E,
 				onClick: () => {
-					let t = se({
-						length: D?.length ?? Math.max(16, M),
-						upper: D?.upper ?? !0,
-						lower: D?.lower ?? !0,
-						numbers: D?.numbers ?? !0,
-						symbols: D?.symbols ?? !0
+					let e = se({
+						length: O?.length ?? Math.max(16, P),
+						upper: O?.upper ?? !0,
+						lower: O?.lower ?? !0,
+						numbers: O?.numbers ?? !0,
+						symbols: O?.symbols ?? !0
 					});
-					y === void 0 && H(t), b === void 0 && W(""), P?.(t, e(t, M)), ye?.(t), B(!0);
+					b === void 0 && W(e), x === void 0 && G(""), I?.(e, t(e, P)), ve?.(e), H(!0);
 				},
 				sx: {
 					mt: .5,
 					alignSelf: "flex-start",
 					textTransform: "none"
 				},
-				children: F.generatePasswordLabel
+				children: L.generatePasswordLabel
 			}) })
 		}),
-		O && /* @__PURE__ */ v(c, {
+		k && /* @__PURE__ */ y(l, {
 			variant: "outlined",
 			fullWidth: !0,
 			error: Y && !X,
 			sx: { mt: 1 },
 			children: [
-				/* @__PURE__ */ _(f, {
-					htmlFor: `${L}-confirm`,
-					size: j,
-					children: F.confirmLabel
+				/* @__PURE__ */ v(p, {
+					htmlFor: `${z}-confirm`,
+					size: N,
+					children: L.confirmLabel
 				}),
-				/* @__PURE__ */ _(p, {
-					id: `${L}-confirm`,
-					type: V ? "text" : "password",
+				/* @__PURE__ */ v(m, {
+					id: `${z}-confirm`,
+					type: U ? "text" : "password",
 					fullWidth: !0,
-					size: j,
+					size: N,
 					value: J,
 					onChange: (e) => {
 						let t = e.target.value;
-						b === void 0 && W(t), ve?.(t, t === q);
+						x === void 0 && G(t), _e?.(t, t === q);
 					},
-					disabled: T,
+					disabled: E,
 					inputProps: { "data-testid": "psm-confirm-input" },
-					endAdornment: /* @__PURE__ */ v(d, {
+					endAdornment: /* @__PURE__ */ y(f, {
 						position: "end",
-						children: [Y && (X ? /* @__PURE__ */ _(ae, {
+						children: [Y && (X ? /* @__PURE__ */ v(ae, {
 							"data-testid": "psm-confirm-match",
 							sx: {
-								color: N.success,
+								color: F.success,
 								mr: .5
 							},
 							fontSize: "small"
-						}) : /* @__PURE__ */ _(oe, {
+						}) : /* @__PURE__ */ v(oe, {
 							"data-testid": "psm-confirm-mismatch",
 							sx: {
-								color: N.failure,
+								color: F.failure,
 								mr: .5
 							},
 							fontSize: "small"
-						})), /* @__PURE__ */ _(u, {
+						})), /* @__PURE__ */ v(d, {
 							size: "small",
-							disabled: T,
-							onClick: () => be((e) => !e),
+							disabled: E,
+							onClick: () => ye((e) => !e),
 							onMouseDown: (e) => e.preventDefault(),
 							edge: "end",
-							"aria-label": V ? F.hidePasswordLabel : F.showPasswordLabel,
-							children: _(V ? S : x, {})
+							"aria-label": U ? L.hidePasswordLabel : L.showPasswordLabel,
+							children: v(U ? C : S, {})
 						})]
 					}),
-					label: F.confirmLabel
+					label: L.confirmLabel
 				}),
-				Y && /* @__PURE__ */ _(l, {
-					sx: { color: X ? N.success : N.failure },
-					children: X ? F.confirmMatchLabel : F.confirmMismatchLabel
+				Y && /* @__PURE__ */ v(u, {
+					sx: { color: X ? F.success : F.failure },
+					children: X ? L.confirmMatchLabel : L.confirmMismatchLabel
 				})
 			]
 		}),
-		fe && /* @__PURE__ */ _(t, {
+		j && /* @__PURE__ */ v(n, {
 			percent: Z.percent,
 			color: ((e) => {
 				switch (e.meterStatus) {
-					case "weak": return I.weak;
-					case "ok": return I.ok;
-					case "good": return I.good;
-					case "very good": return I.veryGood;
+					case "weak": return R.weak;
+					case "ok": return R.ok;
+					case "good": return R.good;
+					case "very good": return R.veryGood;
 					default: return "transparent";
 				}
 			})(Z),
-			ariaLabel: F.meterAriaLabel,
-			segments: me
+			ariaLabel: L.meterAriaLabel,
+			segments: pe
 		}),
-		he && /* @__PURE__ */ v(ee, {
+		me && /* @__PURE__ */ y(ee, {
 			"data-testid": "psm-summary",
 			sx: {
 				mt: .5,
 				p: .5
 			},
-			children: [/* @__PURE__ */ _(g, {
+			children: [/* @__PURE__ */ v(_, {
 				variant: "caption",
 				gutterBottom: !0,
 				sx: {
 					display: "block",
 					fontSize: 14
 				},
-				children: F.summaryHeaderLabel
-			}), /* @__PURE__ */ v(m, {
+				children: L.summaryHeaderLabel
+			}), /* @__PURE__ */ y(h, {
 				direction: "row",
 				spacing: 6,
-				children: [/* @__PURE__ */ v(m, {
+				children: [/* @__PURE__ */ y(h, {
 					direction: "column",
 					children: [
-						/* @__PURE__ */ _(C, {
-							label: F.summaryMinChars.replace("{n}", String(M)),
-							fulfilled: Z.length >= M,
-							checkColors: N
+						/* @__PURE__ */ v(w, {
+							label: L.summaryMinChars.replace("{n}", String(P)),
+							fulfilled: Z.length >= P,
+							checkColors: F
 						}),
-						/* @__PURE__ */ _(C, {
-							label: F.summaryCapitalLetter,
+						/* @__PURE__ */ v(w, {
+							label: L.summaryCapitalLetter,
 							fulfilled: Z.hasUpper,
-							checkColors: N
+							checkColors: F
 						}),
-						/* @__PURE__ */ _(C, {
-							label: F.summaryLowerCaseLetter,
+						/* @__PURE__ */ v(w, {
+							label: L.summaryLowerCaseLetter,
 							fulfilled: Z.hasLower,
-							checkColors: N
+							checkColors: F
 						})
 					]
-				}), /* @__PURE__ */ v(m, {
+				}), /* @__PURE__ */ y(h, {
 					direction: "column",
 					children: [
-						/* @__PURE__ */ _(C, {
-							label: F.summaryNumber,
+						/* @__PURE__ */ v(w, {
+							label: L.summaryNumber,
 							fulfilled: Z.hasDigit,
-							checkColors: N
+							checkColors: F
 						}),
-						/* @__PURE__ */ _(C, {
-							label: F.summarySpecialChar,
+						/* @__PURE__ */ v(w, {
+							label: L.summarySpecialChar,
 							fulfilled: Z.hasSymbol,
-							checkColors: N
+							checkColors: F
 						}),
-						de?.map((e, t) => /* @__PURE__ */ _(C, {
+						de?.map((e, t) => /* @__PURE__ */ v(w, {
 							label: e.label,
 							fulfilled: typeof e.fulfilled == "function" ? e.fulfilled(q) : e.fulfilled,
-							checkColors: N
+							checkColors: F
 						}, t))
 					]
 				})]
@@ -291,4 +292,4 @@ function w({ value: y, confirmValue: b, name: w, inputRef: ce, disabled: T = !1,
 	] });
 }
 //#endregion
-export { w as PasswordStrengthMeter };
+export { T as PasswordStrengthMeter };