@tesouro/embedded-components-react 0.9.54 → 0.9.56

package/dist/libs/tesouro-embedded-components-react/shared/approval-policy/ui/dist/index12.js

@@ -41,23 +41,23 @@ function S({ option: e, isSelected: n, isDisabled: r, reason: i, onToggle: s })
 	})] }) : l;
 }
 var C = ({ value: t, options: C, onChange: w, lockedSections: T, lockedOptions: E, disabled: D, error: O, labels: k, testId: A }) => {
-	let [j, M] = m(!1), [N, P] = m(""), F = d(), I = p(null), L = p(null), R = f(() => new Set(t.map((e) => e.id)), [t]), z = f(() => {
+	let [j, M] = m(!1), [N, P] = m(""), F = d(), I = d(), L = p(null), R = p(null), z = f(() => new Set(t.map((e) => e.id)), [t]), B = f(() => {
 		let e = N.trim().toLowerCase();
 		return e ? C.filter((t) => t.label.toLowerCase().includes(e) || t.sublabel?.toLowerCase().includes(e)) : C;
-	}, [C, N]), B = z.filter((e) => e.section === "roles"), V = z.filter((e) => e.section === "teamMembers"), H = (e) => {
+	}, [C, N]), V = B.filter((e) => e.section === "roles"), H = B.filter((e) => e.section === "teamMembers"), U = (e) => {
 		let t = T?.[e.section], n = E?.[e.id];
 		return /* @__PURE__ */ g(S, {
 			option: e,
-			isSelected: R.has(e.id),
+			isSelected: z.has(e.id),
 			isDisabled: !!e.disabled || !!t || !!n,
 			reason: e.disabledReason ?? n ?? t,
-			onToggle: () => U(e)
+			onToggle: () => W(e)
 		}, e.id);
-	}, U = (e) => {
-		R.has(e.id) ? w(t.filter((t) => t.id !== e.id)) : w([...t, x(e)]), P(""), I.current?.focus();
 	}, W = (e) => {
+		z.has(e.id) ? w(t.filter((t) => t.id !== e.id)) : w([...t, x(e)]), P(""), L.current?.focus();
+	}, G = (e) => {
 		w(t.filter((t) => t.id !== e));
-	}, G = B.length > 0 && V.length > 0;
+	}, K = V.length > 0 && H.length > 0;
 	return /* @__PURE__ */ g(s, { children: /* @__PURE__ */ _(n, {
 		open: j,
 		onOpenChange: (e) => {
@@ -66,13 +66,7 @@ var C = ({ value: t, options: C, onChange: w, lockedSections: T, lockedOptions:
 		children: [/* @__PURE__ */ g(r, {
 			asChild: !0,
 			children: /* @__PURE__ */ _("div", {
-				ref: L,
-				onPointerDown: () => {
-					D || M(!0);
-				},
-				onClick: () => {
-					D || I.current?.focus();
-				},
+				ref: R,
 				className: `ttw:flex ttw:min-h-9 ttw:w-full ttw:cursor-text ttw:flex-wrap ttw:items-center ttw:gap-1.5 ttw:rounded-md ttw:border ttw:bg-transparent ttw:px-2.5 ttw:py-1.5 ttw:has-[:disabled]:cursor-not-allowed ttw:has-[:disabled]:opacity-60 ${O ? "ttw:border-destructive" : "ttw:border-input"}`,
 				children: [
 					t.map((t, n) => /* @__PURE__ */ _(u, { children: [n > 0 ? /* @__PURE__ */ g("span", {
@@ -85,28 +79,34 @@ var C = ({ value: t, options: C, onChange: w, lockedSections: T, lockedOptions:
 							type: "button",
 							"aria-label": k.RemoveApproverAriaLabel.replace("{name}", t.label),
 							onClick: (e) => {
-								e.stopPropagation(), W(t.id);
+								e.stopPropagation(), G(t.id);
 							},
 							disabled: D,
 							className: "ttw:inline-flex ttw:size-3.5 ttw:shrink-0 ttw:items-center ttw:justify-center ttw:rounded-sm ttw:opacity-70 ttw:disabled:cursor-not-allowed hover:ttw:opacity-100",
 							children: /* @__PURE__ */ g(b, { className: "ttw:size-3" })
 						})]
 					})] }, t.id)),
-					/* @__PURE__ */ g("input", {
-						ref: I,
-						type: "text",
-						value: N,
-						onChange: (e) => {
-							P(e.target.value), M(!0);
-						},
-						onFocus: () => M(!0),
-						disabled: D,
-						placeholder: t.length === 0 ? k.ChoosePlaceholder : "",
-						"aria-label": k.ChoosePlaceholder,
-						"aria-invalid": !!O,
-						"aria-describedby": O ? F : void 0,
-						"data-testid": A,
-						className: "ttw:min-w-16 ttw:flex-1 ttw:bg-transparent ttw:text-sm ttw:outline-none ttw:placeholder:text-muted-foreground ttw:disabled:cursor-not-allowed"
+					/* @__PURE__ */ g("label", {
+						htmlFor: I,
+						className: "ttw:flex ttw:min-w-16 ttw:flex-1 ttw:cursor-text ttw:self-stretch ttw:items-center",
+						children: /* @__PURE__ */ g("input", {
+							id: I,
+							ref: L,
+							type: "text",
+							value: N,
+							onChange: (e) => {
+								P(e.target.value), M(!0);
+							},
+							onFocus: () => M(!0),
+							onClick: () => M(!0),
+							disabled: D,
+							placeholder: t.length === 0 ? k.ChoosePlaceholder : "",
+							"aria-label": k.ChoosePlaceholder,
+							"aria-invalid": !!O,
+							"aria-describedby": O ? F : void 0,
+							"data-testid": A,
+							className: "ttw:w-full ttw:bg-transparent ttw:text-sm ttw:outline-none ttw:placeholder:text-muted-foreground ttw:disabled:cursor-not-allowed"
+						})
 					}),
 					O ? /* @__PURE__ */ _(h, { children: [/* @__PURE__ */ _(a, { children: [/* @__PURE__ */ g(c, {
 						asChild: !0,
@@ -137,18 +137,18 @@ var C = ({ value: t, options: C, onChange: w, lockedSections: T, lockedOptions:
 			sideOffset: 4,
 			onOpenAutoFocus: (e) => e.preventDefault(),
 			onInteractOutside: (e) => {
-				e.target instanceof Node && L.current?.contains(e.target) && e.preventDefault();
+				e.target instanceof Node && R.current?.contains(e.target) && e.preventDefault();
 			},
 			className: "ttw:w-[var(--radix-popover-trigger-width)] ttw:min-w-80 ttw:p-2",
 			children: /* @__PURE__ */ g("div", {
 				className: "ttw:max-h-64 ttw:overflow-y-auto",
-				children: z.length === 0 ? /* @__PURE__ */ g(l, {
+				children: B.length === 0 ? /* @__PURE__ */ g(l, {
 					variant: "body2",
 					color: "muted",
 					className: "ttw:px-2 ttw:py-1.5",
 					children: C.length === 0 ? k.NoOptionsMessage : k.NoResultsMessage
 				}) : /* @__PURE__ */ _(h, { children: [
-					B.length > 0 ? /* @__PURE__ */ _("div", {
+					V.length > 0 ? /* @__PURE__ */ _("div", {
 						role: "group",
 						"aria-label": k.RolesSectionHeading,
 						children: [/* @__PURE__ */ g(l, {
@@ -156,9 +156,9 @@ var C = ({ value: t, options: C, onChange: w, lockedSections: T, lockedOptions:
 							color: "muted",
 							className: "ttw:block ttw:px-2 ttw:py-1",
 							children: k.RolesSectionHeading
-						}), B.map(H)]
+						}), V.map(U)]
 					}) : null,
-					G ? /* @__PURE__ */ _("div", {
+					K ? /* @__PURE__ */ _("div", {
 						className: "ttw:my-1 ttw:flex ttw:items-center ttw:gap-2 ttw:px-2",
 						children: [
 							/* @__PURE__ */ g("div", { className: "ttw:h-px ttw:flex-1 ttw:bg-border" }),
@@ -170,7 +170,7 @@ var C = ({ value: t, options: C, onChange: w, lockedSections: T, lockedOptions:
 							/* @__PURE__ */ g("div", { className: "ttw:h-px ttw:flex-1 ttw:bg-border" })
 						]
 					}) : null,
-					V.length > 0 ? /* @__PURE__ */ _("div", {
+					H.length > 0 ? /* @__PURE__ */ _("div", {
 						role: "group",
 						"aria-label": k.TeamMembersSectionHeading,
 						children: [/* @__PURE__ */ g(l, {
@@ -178,7 +178,7 @@ var C = ({ value: t, options: C, onChange: w, lockedSections: T, lockedOptions:
 							color: "muted",
 							className: "ttw:block ttw:px-2 ttw:py-1",
 							children: k.TeamMembersSectionHeading
-						}), V.map(H)]
+						}), H.map(U)]
 					}) : null
 				] })
 			})