@mortenbrudvik/waveui 0.11.0 → 0.13.0

package/dist/components/data-display/Tag.mjs

@@ -12,16 +12,16 @@ import { focusRing as h, forcedColors as g } from "../../lib/styles.mjs";
 import { Button as _ } from "../button/Button.mjs";
 import { BUTTON_OWN_PROP_KEYS as v, MERGED_DISABLED_FOCUSABLE_PROPS as y, placeButtonIcon as b } from "../button/Button.slots.mjs";
 import { DismissIcon as x } from "../../lib/icons.mjs";
-import { mergeProps as S } from "../../lib/mergeProps.mjs";
-import { hasRenderedTextLabel as C, hasTextLabel as w, observeTextLabel as T } from "../../lib/labelInName.mjs";
-import { isEditableTarget as ee, isOwnEvent as E } from "../../lib/events.mjs";
-import { TagHostContext as D, isDismissKey as O, isRepeatedActivation as te, useDismissControlFocus as ne, useHeldFocus as re, useTagGroupContext as ie, useTagGroupItem as ae } from "./TagGroup.context.mjs";
-import { AvatarSizeContext as oe } from "./Avatar.context.mjs";
-import { TAG_AVATAR_SIZE as se, TAG_DISMISS_BASE_CLASSES as ce, TAG_DISMISS_GLYPH_SIZE as le, TAG_ROOT_BASE_CLASSES as ue, TAG_SECONDARY_TEXT_CLASSES as de, TAG_SELECTED_CLASSES as fe, TAG_TEXT_COLUMN_CLASSES as pe, tagAppearanceClasses as me, tagDismissRingClasses as he, tagDismissSizeClasses as ge, tagDismissStateClasses as _e, tagEndInsetClasses as ve, tagIconClasses as ye, tagMediaClasses as be, tagShapeClasses as xe, tagSizeClasses as Se, tagStartInsetClasses as Ce } from "./tagStyles.mjs";
-import * as k from "react";
-import { jsx as A, jsxs as j } from "react/jsx-runtime";
+import { mergeProps as ee } from "../../lib/mergeProps.mjs";
+import { hasRenderedTextLabel as S, hasTextLabel as C, observeTextLabel as w } from "../../lib/labelInName.mjs";
+import { isEditableTarget as te, isOwnEvent as T } from "../../lib/events.mjs";
+import { TagHostContext as E, isDismissKey as D, isRepeatedActivation as ne, useDismissControlFocus as re, useHeldFocus as ie, useTagGroupContext as ae, useTagGroupItem as oe } from "./TagGroup.context.mjs";
+import { AvatarSizeContext as se } from "./Avatar.context.mjs";
+import { TAG_AVATAR_SIZE as ce, TAG_DISMISS_BASE_CLASSES as le, TAG_DISMISS_GLYPH_SIZE as ue, TAG_ROOT_BASE_CLASSES as de, TAG_SECONDARY_TEXT_CLASSES as fe, TAG_SELECTED_CLASSES as pe, TAG_TEXT_COLUMN_CLASSES as me, tagAppearanceClasses as he, tagDismissRingClasses as ge, tagDismissSizeClasses as _e, tagDismissStateClasses as ve, tagEndInsetClasses as ye, tagIconClasses as be, tagMediaClasses as xe, tagShapeClasses as Se, tagSizeClasses as Ce, tagStartInsetClasses as we } from "./tagStyles.mjs";
+import * as O from "react";
+import { jsx as k, jsxs as A } from "react/jsx-runtime";
 //#region src/components/data-display/Tag.tsx
-var M = /* @__PURE__ */ new Set([
+var j = /* @__PURE__ */ new Set([
 	"type",
 	"disabled",
 	"autoFocus",
@@ -33,31 +33,31 @@ var M = /* @__PURE__ */ new Set([
 	"formTarget",
 	"name",
 	"value"
-]), N = /^on[A-Z]/, P = /* @__PURE__ */ new Set(["aria-label", "aria-labelledby"]), we = () => {};
-function Te(e) {
+]), M = /^on[A-Z]/, N = /* @__PURE__ */ new Set(["aria-label", "aria-labelledby"]), Te = () => {};
+function Ee(e) {
 	let t = {}, n = !1;
-	for (let [r, i] of Object.entries(e)) P.has(r) ? i !== void 0 && (n = !0) : t[r] = i;
+	for (let [r, i] of Object.entries(e)) N.has(r) ? i !== void 0 && (n = !0) : t[r] = i;
 	return {
 		props: t,
 		ignoredName: n
 	};
 }
-var F = "inline-flex items-center justify-center";
-function Ee(e) {
-	if (typeof e != "object" || !e || k.isValidElement(e) || Symbol.iterator in e) return !1;
+var P = "inline-flex items-center justify-center";
+function De(e) {
+	if (typeof e != "object" || !e || O.isValidElement(e) || Symbol.iterator in e) return !1;
 	let t = Object.getPrototypeOf(e);
 	return t === null || t === Object.prototype;
 }
-function I(e, t) {
-	return /* @__PURE__ */ A(x, {
+function F(e, t) {
+	return /* @__PURE__ */ k(x, {
 		size: e,
 		className: t
 	});
 }
-function De(n, r) {
+function Oe(n, r) {
 	if (!c(n)) return {
 		buttonProps: null,
-		content: I(r, d.dismissIcon),
+		content: F(r, d.dismissIcon),
 		warning: null,
 		ignoredName: !1,
 		contentMayName: !1,
@@ -65,33 +65,33 @@ function De(n, r) {
 		disabledFocusable: !1
 	};
 	let i = t(n);
-	if (k.isValidElement(n) && (i === "button" || i === _)) {
+	if (O.isValidElement(n) && (i === "button" || i === _)) {
 		let { children: t, dangerouslySetInnerHTML: a, ...l } = n.props, u = i === _, f = l;
 		if (u) {
 			f = {};
 			for (let [e, t] of Object.entries(l)) v.has(e) || (f[e] = t);
 		}
-		let p = u ? l.icon : void 0, { props: m, ignoredName: h } = Te(f), g = c(p) ? s(p, "span", e(d.dismissIcon, F), { "aria-hidden": !0 }) : null, y = a == null ? o(t) : /* @__PURE__ */ A("span", {
-			className: F,
+		let p = u ? l.icon : void 0, { props: m, ignoredName: h } = Ee(f), g = c(p) ? s(p, "span", e(d.dismissIcon, P), { "aria-hidden": !0 }) : null, y = a == null ? o(t) : /* @__PURE__ */ k("span", {
+			className: P,
 			dangerouslySetInnerHTML: a
 		});
 		return {
 			buttonProps: m,
-			content: g || c(y) ? b(g, y, u && l.iconPosition) : I(r, d.dismissIcon),
+			content: g || c(y) ? b(g, y, u && l.iconPosition) : F(r, d.dismissIcon),
 			warning: "button-element",
 			ignoredName: h,
 			contentMayName: !0,
-			literalTextLabel: w(y),
+			literalTextLabel: C(y),
 			disabledFocusable: u && !!l.disabledFocusable
 		};
 	}
-	if (Ee(n)) {
-		let t = n.as === _, i = n.as === "button" || t || Object.keys(n).some((e) => M.has(e) || N.test(e)), a = {}, u = {}, f = {}, p = !1;
-		for (let [e, r] of Object.entries(n)) e === "as" ? r !== "button" && !t && (u.as = r) : t && v.has(e) ? f[e] = r : P.has(e) ? r !== void 0 && (p = !0) : e === "children" || e === "dangerouslySetInnerHTML" ? u[e] = r : i || e.startsWith("aria-") && e !== "aria-hidden" ? a[e] = r : u[e] = r;
+	if (De(n)) {
+		let t = n.as === _, i = n.as === "button" || t || Object.keys(n).some((e) => j.has(e) || M.test(e)), a = {}, u = {}, f = {}, p = !1;
+		for (let [e, r] of Object.entries(n)) e === "as" ? r !== "button" && !t && (u.as = r) : t && v.has(e) ? f[e] = r : N.has(e) ? r !== void 0 && (p = !0) : e === "children" || e === "dangerouslySetInnerHTML" ? u[e] = r : i || e.startsWith("aria-") && e !== "aria-hidden" ? a[e] = r : u[e] = r;
 		let m = c(f.icon);
-		return m ? u.children = b(s(f.icon, "span", e(d.dismissIcon, F)), o(u.children), f.iconPosition) : l(u.as ?? "span", u) && (u.children = I(r)), {
+		return m ? u.children = b(s(f.icon, "span", e(d.dismissIcon, P)), o(u.children), f.iconPosition) : l(u.as ?? "span", u) && (u.children = F(r)), {
 			buttonProps: i || Object.keys(a).length > 0 ? a : null,
-			content: s(u, "span", e(!m && d.dismissIcon, F), { "aria-hidden": !0 }),
+			content: s(u, "span", e(!m && d.dismissIcon, P), { "aria-hidden": !0 }),
 			warning: i ? "button-object" : null,
 			ignoredName: p,
 			contentMayName: !1,
@@ -101,7 +101,7 @@ function De(n, r) {
 	}
 	return {
 		buttonProps: null,
-		content: s(n, "span", e(d.dismissIcon, F), { "aria-hidden": !0 }),
+		content: s(n, "span", e(d.dismissIcon, P), { "aria-hidden": !0 }),
 		warning: null,
 		ignoredName: !1,
 		contentMayName: !1,
@@ -109,7 +109,7 @@ function De(n, r) {
 		disabledFocusable: !1
 	};
 }
-var Oe = /* @__PURE__ */ new Set([
+var ke = /* @__PURE__ */ new Set([
 	"button",
 	"fieldset",
 	"input",
@@ -117,7 +117,7 @@ var Oe = /* @__PURE__ */ new Set([
 	"option",
 	"select",
 	"textarea"
-]), ke = /* @__PURE__ */ new Set([
+]), Ae = /* @__PURE__ */ new Set([
 	"button",
 	"data",
 	"input",
@@ -127,36 +127,36 @@ var Oe = /* @__PURE__ */ new Set([
 	"progress",
 	"select",
 	"textarea"
-]), L = {
+]), I = {
 	disabled: !0,
 	"aria-disabled": void 0,
 	"data-disabled": void 0,
 	"data-disabled-focusable": void 0
 };
-function R(e, t) {
+function L(e, t) {
 	return typeof e == "string" && Object.hasOwn(t, e);
 }
-function Ae(e) {
+function je(e) {
 	e.preventDefault(), e.stopPropagation();
 }
-function je({ buttonProps: e, content: t, contentMayName: n, literalTextLabel: r, disabledFocusable: i, disabled: a, dismissLabel: o, contentId: s, dismissName: c, buttonRef: l }) {
-	let d = p("tag-dismiss"), f = p("tag-dismiss-text"), { ref: h, ...g } = e, _ = k.useRef(null), v = m(_, l, h);
-	ne(_);
-	let [b, x] = k.useState(null), S = k.useCallback((e) => b ? T(b, e) : we, [b]), w = k.useSyncExternalStore(S, () => b ? C(b) : r, () => r), ee = n && w, E = re(a), D = a ? E.held ? y : L : i ? y : void 0, O = c !== void 0;
-	return /* @__PURE__ */ j("button", {
+function Me({ buttonProps: e, content: t, contentMayName: n, literalTextLabel: r, disabledFocusable: i, disabled: a, dismissLabel: o, contentId: s, dismissName: c, buttonRef: l }) {
+	let d = p("tag-dismiss"), f = p("tag-dismiss-text"), { ref: h, ...g } = e, _ = O.useRef(null), v = m(_, l, h);
+	re(_);
+	let [b, x] = O.useState(null), ee = O.useCallback((e) => b ? w(b, e) : Te, [b]), C = O.useSyncExternalStore(ee, () => b ? S(b) : r, () => r), te = n && C, T = ie(a), E = a ? T.held ? y : I : i ? y : void 0, D = c !== void 0;
+	return /* @__PURE__ */ A("button", {
 		...g,
 		ref: v,
 		type: g.type ?? "button",
-		...D,
-		"aria-label": O ? c : void 0,
-		"aria-labelledby": O ? void 0 : `${ee ? f : d} ${s}`,
-		onFocus: u(g.onFocus, E.onFocus, { checkDefaultPrevented: !1 }),
-		onBlur: u(g.onBlur, E.onBlur, { checkDefaultPrevented: !1 }),
-		children: [!O && /* @__PURE__ */ A("span", {
+		...E,
+		"aria-label": D ? c : void 0,
+		"aria-labelledby": D ? void 0 : `${te ? f : d} ${s}`,
+		onFocus: u(g.onFocus, T.onFocus, { checkDefaultPrevented: !1 }),
+		onBlur: u(g.onBlur, T.onBlur, { checkDefaultPrevented: !1 }),
+		children: [!D && /* @__PURE__ */ k("span", {
 			id: d,
 			className: "sr-only",
 			children: o
-		}), n ? /* @__PURE__ */ A("span", {
+		}), n ? /* @__PURE__ */ k("span", {
 			id: f,
 			ref: x,
 			className: "inline-flex items-center justify-center gap-[inherit]",
@@ -164,121 +164,124 @@ function je({ buttonProps: e, content: t, contentMayName: n, literalTextLabel: r
 		}) : t]
 	});
 }
-je.displayName = "TagDismissButton";
-var Me = /* @__PURE__ */ new Set([
+Me.displayName = "TagDismissButton";
+var Ne = /* @__PURE__ */ new Set([
 	"a",
 	"button",
 	"input",
 	"select",
 	"textarea",
 	"li"
-]), Ne = "Tag: `as=\"button\"` with `dismissible` puts the Dismiss button inside a button. Use InteractionTag instead: `InteractionTag.Primary` for the action, `InteractionTag.Secondary` for Dismiss.", Pe = "Tag: a dismissible tag rendered as a link (`as=\"a\"` or a link component) puts the Dismiss button inside the link. Put the link in the tag's content: `<Tag dismissible><a href>…</a></Tag>`.", Fe = "TagGroup: a tag in a `role=\"list\"` group is not a list item (its element is a link, a button or a component). Put a link in the tag's content (`<Tag><a href>…</a></Tag>`), or wrap the tag in an element with `role=\"listitem\"`.";
-function Ie(e) {
+]), Pe = "Tag: `as=\"button\"` with `dismissible` puts the Dismiss button inside a button. Use InteractionTag instead: `InteractionTag.Primary` for the action, `InteractionTag.Secondary` for Dismiss.", Fe = "Tag: a dismissible tag rendered as a link (`as=\"a\"` or a link component) puts the Dismiss button inside the link. Put the link in the tag's content: `<Tag dismissible><a href>…</a></Tag>`.", Ie = "TagGroup: a tag in a `role=\"list\"` group is not a list item (its element is a link, a button or a component). Put a link in the tag's content (`<Tag><a href>…</a></Tag>`), or wrap the tag in an element with `role=\"listitem\"`.";
+function Le(e) {
 	for (let t = e; t && !t.matches("[data-wave-tag-group]"); t = t.parentElement) if (t.getAttribute("role") === "listitem" || t.localName === "li") return !0;
 	return !1;
 }
-var z = (t) => {
-	let { as: l, appearance: _, size: v, shape: y, disabled: b, selected: x = !1, value: C, media: w, icon: T, secondaryText: ne, dismissible: M, onDismiss: N, dismissIcon: P, dismissLabel: we = "Dismiss", className: Te, children: F, role: Ee, hidden: I, onClick: L, onFocus: z, onBlur: Le, onKeyDown: Re, ref: ze, ...Be } = t, B = l ?? "span", Ve = p("tag-content"), V = ie(), He = k.useContext(D), H = k.useRef(null), Ue = m(H, ze), We = k.useRef(null), Ge = k.useRef(null), U = R(v, Se) ? v : V?.size ?? "medium", W = R(_, me) ? _ : V?.appearance ?? "filled", Ke = R(y, xe) ? y : V?.shape ?? "circular", G = (V?.disabled ?? !1) || b === !0, K = M ?? V?.dismissible ?? !1, q = x && !G ? "selected" : W, qe = V?.dimDisabled ?? !0, Je = ae(H, C, { reported: K && (V?.reportsDismissals ?? !1) }), Ye = B === "a", Xe = Ye && G, Ze = B === "button", J = re((Ye || Ze) && G), Y = Ze && J.held, { buttonProps: Qe, content: $e, warning: X, ignoredName: et, contentMayName: tt, literalTextLabel: nt, disabledFocusable: rt } = De(K ? P : void 0, le[U]);
-	k.useEffect(() => {
+var R = (t) => {
+	let { as: l, appearance: _, size: v, shape: y, disabled: b, selected: x = !1, value: S, media: C, icon: w, secondaryText: re, dismissible: j, onDismiss: M, dismissIcon: N, dismissLabel: Te = "Dismiss", className: Ee, children: P, role: De, hidden: F, onClick: I, onFocus: R, onBlur: Re, onKeyDown: ze, ref: Be, ...Ve } = t, z = l ?? "span", He = p("tag-content"), B = ae(), Ue = O.useContext(E), V = O.useRef(null), We = m(V, Be), Ge = O.useRef(null), Ke = O.useRef(null), H = L(v, Ce) ? v : B?.size ?? "medium", U = L(_, he) ? _ : B?.appearance ?? "filled", W = L(y, Se) ? y : B?.shape ?? "circular", G = (B?.disabled ?? !1) || b === !0, K = j ?? B?.dismissible ?? !1, q = x && !G ? "selected" : U, qe = B?.dimDisabled ?? !0, Je = oe(V, S, { reported: K && (B?.reportsDismissals ?? !1) }), Ye = z === "a", Xe = Ye && G, Ze = z === "button", J = ie((Ye || Ze) && G), Y = Ze && J.held, { buttonProps: Qe, content: $e, warning: X, ignoredName: et, contentMayName: tt, literalTextLabel: nt, disabledFocusable: rt } = Oe(K ? N : void 0, ue[H]);
+	O.useEffect(() => {
 		X === "button-element" ? a("Tag:dismissIcon-button", "Tag: `dismissIcon` received a button. Its props were merged into the built-in dismiss button (a button cannot contain another button), which is named by its text label (or `dismissLabel`) and the tag content. Pass icon content instead, e.g. `dismissIcon={<CloseIcon />}`, and handle the dismissal in `onDismiss`.") : X === "button-object" && i("Tag", "dismissIcon={{ onClick, type, disabled, … }} (button props on the slot object)", "onDismiss and icon content in dismissIcon", "Its props are merged onto the built-in dismiss button, which is named by `dismissLabel` and the tag content.");
 	}, [X]);
-	let Z = M === void 0 && !(V?.dismissible ?? !1) && (N !== void 0 || P !== void 0);
-	k.useEffect(() => {
+	let Z = j === void 0 && !(B?.dismissible ?? !1) && (M !== void 0 || N !== void 0);
+	O.useEffect(() => {
 		Z && a("Tag:dismiss-without-dismissible", "Tag: `onDismiss` and `dismissIcon` take effect only with `dismissible`; no dismiss button was rendered. Add `dismissible` to render it.");
-	}, [Z]), k.useEffect(() => {
+	}, [Z]), O.useEffect(() => {
 		et && a("Tag:dismissIcon-name", "Tag: `aria-label`/`aria-labelledby` on `dismissIcon` are ignored. The dismiss button is named by `dismissLabel` (default \"Dismiss\") and the tag content, e.g. \"Dismiss Cherry\"; set `dismissLabel` to change or localise it.");
-	}, [et]), k.useEffect(() => {
+	}, [et]), O.useEffect(() => {
 		if (!K || !r || n("Tag:nested-button")) return;
-		let e = H.current?.localName;
-		e === "button" ? a("Tag:nested-button", Ne) : e === "a" && a("Tag:nested-button", Pe);
+		let e = V.current?.localName;
+		e === "button" ? a("Tag:nested-button", Pe) : e === "a" && a("Tag:nested-button", Fe);
 	});
-	let it = V?.mode === "list";
-	k.useEffect(() => {
+	let it = B?.mode === "list";
+	O.useEffect(() => {
 		if (!it || !r || n("TagGroup:list-item")) return;
-		let e = H.current;
-		e && !Ie(e) && a("TagGroup:list-item", Fe);
+		let e = V.current;
+		e && !Le(e) && a("TagGroup:list-item", Ie);
 	});
-	let at = c(w), ot = c(T), st = o(ne), ct = c(st), lt = k.useMemo(() => ({ size: se[U] }), [U]), ut = (e) => typeof B != "string" || e.has(B), Q = {};
-	ut(Oe) && (G || b !== void 0) && (Q.disabled = G && !Y), Y && (Q["aria-disabled"] = !0, Q["data-disabled-focusable"] = ""), C !== void 0 && ut(ke) && (Q.value = C), Xe && (Q["aria-disabled"] = !0, J.held ? Q["data-disabled-focusable"] = "" : (Q.href = void 0, Q.role = "link"));
-	let dt = it && typeof B == "string" && !Me.has(B) ? "listitem" : void 0, ft = C !== void 0 && (V?.hiddenValues?.has(C) ?? !1), pt = Xe || Y ? (e) => {
-		E(e) ? Ae(e) : L?.(e);
-	} : L, mt = f((e) => {
-		let t = We.current, n = Ge.current;
-		t && n && O(e) && t.contains(e.target) && !ee(e.target) && (e.preventDefault(), n.click());
+	let at = c(C), ot = c(w), st = o(re), ct = c(st), lt = O.useMemo(() => ({
+		size: ce[H],
+		shape: W === "rounded" ? "square" : "circular"
+	}), [H, W]), ut = (e) => typeof z != "string" || e.has(z), Q = {};
+	ut(ke) && (G || b !== void 0) && (Q.disabled = G && !Y), Y && (Q["aria-disabled"] = !0, Q["data-disabled-focusable"] = ""), S !== void 0 && ut(Ae) && (Q.value = S), Xe && (Q["aria-disabled"] = !0, J.held ? Q["data-disabled-focusable"] = "" : (Q.href = void 0, Q.role = "link"));
+	let dt = it && typeof z == "string" && !Ne.has(z) ? "listitem" : void 0, ft = S !== void 0 && (B?.hiddenValues?.has(S) ?? !1), pt = Xe || Y ? (e) => {
+		T(e) ? je(e) : I?.(e);
+	} : I, mt = f((e) => {
+		let t = Ge.current, n = Ke.current;
+		t && n && D(e) && t.contains(e.target) && !te(e.target) && (e.preventDefault(), n.click());
 	}), $ = {
 		type: "button",
 		"data-wave-tag-dismiss": "",
-		className: e(d.dismissButton, ce, ge[U], !G && [
+		className: e(d.dismissButton, le, _e[H], !G && [
 			"disabled:opacity-50",
 			"aria-disabled:cursor-not-allowed aria-disabled:opacity-50 aria-disabled:focus-visible:opacity-100",
-			_e[q]
-		], h, he[U], q === "selected" && "focus-visible:outline-primary-foreground", He?.dismissButtonClassName),
+			ve[q]
+		], h, ge[H], q === "selected" && "focus-visible:outline-primary-foreground", Ue?.dismissButtonClassName),
 		onKeyDown: (e) => {
 			if (e.target === e.currentTarget) {
-				if (te(e)) {
+				if (ne(e)) {
 					e.preventDefault();
 					return;
 				}
-				O(e) && (e.preventDefault(), e.currentTarget.click());
+				D(e) && (e.preventDefault(), e.currentTarget.click());
 			}
 		}
 	};
-	(N || V) && ($.onClick = (e) => {
-		E(e) && (N?.(), V?.dismiss(Je));
+	(M || B) && ($.onClick = (e) => {
+		T(e) && (M?.(), B?.dismiss(Je));
 	});
-	let ht = Qe ? S($, Qe) : $, gt = /* @__PURE__ */ A("span", {
-		id: Ve,
-		ref: We,
+	let ht = Qe ? ee($, Qe) : $, gt = /* @__PURE__ */ k("span", {
+		id: He,
+		ref: Ge,
 		className: e(d.primaryText, "inline-flex items-center gap-1", ct && "text-caption-1 leading-3.5"),
-		children: F
+		children: P
 	});
-	return /* @__PURE__ */ j(B, {
-		"data-size": U,
-		"data-appearance": W,
-		"data-shape": Ke,
+	return /* @__PURE__ */ A(z, {
+		"data-size": H,
+		"data-appearance": U,
+		"data-shape": W,
 		"data-selected": x ? "" : void 0,
 		"data-disabled": G ? "" : void 0,
 		"data-wave-tag-item": "",
-		role: Ee ?? dt,
-		hidden: ft || I,
-		...Be,
+		role: De ?? dt,
+		hidden: ft || F,
+		...Ve,
 		...Q,
-		ref: Ue,
-		className: e(d.root, ue, Se[U], Ce[U][at ? "media" : ot ? "icon" : "text"], ve[U][K ? "dismiss" : "text"], q === "selected" ? [fe, g.selectedContainer] : me[W], G && [qe && "opacity-50 focus-visible:opacity-100 has-focus-visible:opacity-100", g.disabled], xe[Ke], Te),
+		ref: We,
+		className: e(d.root, de, Ce[H], we[H][at ? "media" : ot ? "icon" : "text"], ye[H][K ? "dismiss" : "text"], q === "selected" ? [pe, g.selectedContainer] : he[U], G && [qe && "opacity-50 focus-visible:opacity-100 has-focus-visible:opacity-100", g.disabled], Se[W], Ee),
 		onClick: pt,
-		onKeyDown: u(Re, mt),
-		onFocus: u(z, J.onFocus, { checkDefaultPrevented: !1 }),
-		onBlur: u(Le, J.onBlur, { checkDefaultPrevented: !1 }),
+		onKeyDown: u(ze, mt),
+		onFocus: u(R, J.onFocus, { checkDefaultPrevented: !1 }),
+		onBlur: u(Re, J.onBlur, { checkDefaultPrevented: !1 }),
 		children: [
-			at && /* @__PURE__ */ A(oe.Provider, {
+			at && /* @__PURE__ */ k(se.Provider, {
 				value: lt,
-				children: s(w, "span", e(d.media, be[U]))
+				children: s(C, "span", e(d.media, xe[H]))
 			}),
-			ot && s(T, "span", e(d.icon, ye[U]), { "aria-hidden": !0 }),
-			ct ? /* @__PURE__ */ j("span", {
-				className: pe,
-				children: [gt, /* @__PURE__ */ A("span", {
-					className: e(d.secondaryText, de),
+			ot && s(w, "span", e(d.icon, be[H]), { "aria-hidden": !0 }),
+			ct ? /* @__PURE__ */ A("span", {
+				className: me,
+				children: [gt, /* @__PURE__ */ k("span", {
+					className: e(d.secondaryText, fe),
 					children: st
 				})]
 			}) : gt,
-			K && /* @__PURE__ */ A(je, {
+			K && /* @__PURE__ */ k(Me, {
 				buttonProps: ht,
 				content: $e,
 				contentMayName: tt,
 				literalTextLabel: nt,
 				disabledFocusable: rt,
 				disabled: G,
-				dismissLabel: we,
-				contentId: Ve,
-				dismissName: He?.dismissName,
-				buttonRef: Ge
+				dismissLabel: Te,
+				contentId: He,
+				dismissName: Ue?.dismissName,
+				buttonRef: Ke
 			})
 		]
 	});
 };
-z.displayName = "Tag";
+R.displayName = "Tag";
 //#endregion
-export { z as Tag };
+export { R as Tag };
 
 //# sourceMappingURL=Tag.mjs.map