@box/metadata-taxonomy-picker 2.18.0

package/dist/chunks/metadata-taxonomy-picker-shell.js

@@ -0,0 +1,278 @@
+import { BREADCRUMB_ROOT_ID as e } from "../esm/lib/constants.js";
+import { useTaxonomyPickerController as t } from "../esm/lib/hooks/use-taxonomy-picker-controller.js";
+import { t as n } from "./taxonomy-items-list.js";
+import { t as r } from "./taxonomy-level-filter.js";
+import { messages as i } from "../esm/lib/components/metadata-taxonomy-picker-shell/messages.js";
+import { forwardRef as a, useCallback as o, useEffect as ee, useId as te, useLayoutEffect as s, useMemo as c, useRef as l, useState as ne } from "react";
+import { Breadcrumb as re, ChipsGroup as ie, IconButton as ae, InputChip as u, Popover as d, useForkRef as oe } from "@box/blueprint-web";
+import { Search as se, XMark as ce } from "@box/blueprint-web-assets/icons/Fill";
+import le from "clsx";
+import { useIntl as ue } from "react-intl";
+import { jsx as f, jsxs as p } from "react/jsx-runtime";
+import '../styles/metadata-taxonomy-picker-shell.css';var m = /* @__PURE__ */ function(e) {
+	return e.SingleLevel = "single-level", e.MultiLevel = "multi-level", e;
+}({}), h = {
+	container: "_container_1uu1w_1",
+	label: "_label_1uu1w_8",
+	trigger: "_trigger_1uu1w_16",
+	searchInput: "_searchInput_1uu1w_34",
+	chips: "_chips_1uu1w_47",
+	searchIcon: "_searchIcon_1uu1w_73",
+	emptyState: "_emptyState_1uu1w_81",
+	popover: "_popover_1uu1w_87",
+	clearButton: "_clearButton_1uu1w_92",
+	breadcrumbContainer: "_breadcrumbContainer_1uu1w_96"
+};
+function de(e) {
+	let t = null;
+	for (let n of e) n.selectable !== !1 && (t === null || n.level > t) && (t = n.level);
+	return t;
+}
+var fe = [];
+function pe(e) {
+	if (e != null) return typeof e == "function" ? e() : e;
+}
+var g = /* @__PURE__ */ a(function({ itemsService: a, eventService: g, levels: _ = fe, mode: me, multiSelect: v, value: y, onValueChange: b, placeholder: he, disabled: x = !1, label: S, containerClassName: ge, portalElement: _e }, ve) {
+	let { formatMessage: C } = ue(), w = te(), T = `${w}-listbox`, E = l(null), ye = oe(E, ve), D = l(null), O = l(null), k = l(0), A = l(!1), be = pe(_e), j = me === m.SingleLevel, { state: M, isOpen: N, handleOpenChange: P, handleInputValueChange: F, actions: I } = t(a, _, g), { items: L, levelStack: R } = M, { drillDown: z, navigateBack: B, loadMore: xe, setSearchScopeOverride: V } = I, H = M.searchInputValue !== "", U = c(() => de(M.availableLevels), [M.availableLevels]);
+	ee(() => {
+		V(j && U !== null ? {
+			parentId: null,
+			levelFilter: U
+		} : void 0);
+	}, [
+		j,
+		U,
+		V
+	]);
+	let [Se, W] = ne(""), G = l(!1), Ce = o(() => {
+		G.current = !0;
+	}, []), we = o((e) => {
+		G.current = !1, F(e.target.value);
+	}, [F]);
+	s(() => {
+		G.current ? M.searchInputValue === "" && (G.current = !1, W("")) : W(M.searchInputValue);
+	}, [M.searchInputValue]), s(() => {
+		let e;
+		return !H && A.current && (e = requestAnimationFrame(() => {
+			O.current?.scrollTo(k.current);
+		})), A.current = H, () => {
+			e !== void 0 && cancelAnimationFrame(e);
+		};
+	}, [H]);
+	let K = c(() => new Set(y.map((e) => e.id)), [y]), Te = c(() => !v && y.length === 1 ? y[0].id : "", [v, y]), q = o((e, t = !0) => {
+		let n = L.find((t) => t.id === e);
+		if (!n || !n.selectable) return;
+		let r = {
+			id: n.id,
+			displayName: n.displayName,
+			level: n.level,
+			ancestors: n.ancestors
+		};
+		v ? b(K.has(e) ? y.filter((t) => t.id !== e) : [...y, r]) : (b([r]), t && P(!1));
+	}, [
+		L,
+		v,
+		K,
+		y,
+		b,
+		P
+	]), J = o((e, t = !0) => {
+		let n = M.searchResults.find((t) => t.id === e);
+		if (!n || !n.selectable) return;
+		let r = {
+			id: n.id,
+			displayName: n.displayName,
+			level: n.level,
+			ancestors: n.ancestors
+		};
+		v ? b(K.has(e) ? y.filter((t) => t.id !== e) : [...y, r]) : (b([r]), t !== !1 && P(!1));
+	}, [
+		M.searchResults,
+		v,
+		K,
+		y,
+		b,
+		P
+	]), Y = o((e) => {
+		let t = M.searchResults.find((t) => t.id === e);
+		t && I.drillDown({
+			id: t.id,
+			displayName: t.displayName,
+			ancestors: t.ancestors
+		});
+	}, [M.searchResults, I]), X = o((e) => {
+		let t = M.items.find((t) => t.id === e);
+		t && z({
+			id: t.id,
+			displayName: t.displayName
+		});
+	}, [M.items, z]), Z = o((e) => !(!e.hasChildren || j && U !== null && e.level >= U), [j, U]), Ee = c(() => L.map((e) => ({
+		id: e.id,
+		displayName: e.displayName,
+		selectable: e.selectable,
+		multiSelect: v,
+		isSelected: K.has(e.id),
+		showDrillDown: Z(e),
+		ancestors: e.ancestors,
+		onSelect: q,
+		onDrillDown: X
+	})), [
+		L,
+		v,
+		K,
+		Z,
+		q,
+		X
+	]), Q = c(() => R.length === 0 ? [] : [{
+		id: e,
+		name: C(i.breadcrumbRootLabel)
+	}, ...R.map((e) => ({
+		id: e.id,
+		name: e.displayName
+	}))], [R, C]), De = o((e) => {
+		B(e === "__breadcrumb_root__" ? null : e);
+	}, [B]), Oe = !j && H && M.availableLevels.length > 1, ke = c(() => M.searchResults.map((e) => ({
+		id: e.id,
+		displayName: e.displayName,
+		selectable: e.selectable,
+		multiSelect: v,
+		isSelected: K.has(e.id),
+		showDrillDown: Z(e),
+		ancestors: e.ancestors,
+		onSelect: J,
+		onDrillDown: Y
+	})), [
+		M.searchResults,
+		v,
+		K,
+		Z,
+		J,
+		Y
+	]), Ae = o((e) => {
+		e.target === e.currentTarget && E.current?.focus();
+	}, [E]), $ = y.length > 0, je = he ?? C(i.placeholder), Me = (e) => {
+		!x && e.target === e.currentTarget && (e.preventDefault(), E.current?.focus());
+	}, Ne = () => {
+		!x && !N && P(!0);
+	}, Pe = o(() => {
+		x || (b([]), F(""));
+	}, [
+		x,
+		b,
+		F
+	]), Fe = (e) => {
+		!H && e.target.value && (k.current = O.current?.getScrollTop() ?? 0), W(e.target.value), G.current || F(e.target.value);
+	}, Ie = (e) => {
+		x || b(y.filter((t) => t.id !== e.id));
+	};
+	return /* @__PURE__ */ p(d.Root, {
+		modal: !1,
+		onOpenChange: P,
+		open: N,
+		children: [/* @__PURE__ */ f(d.Anchor, { children: /* @__PURE__ */ p("div", {
+			className: le(h.container, ge),
+			children: [S && /* @__PURE__ */ f("label", {
+				className: h.label,
+				htmlFor: w,
+				children: S
+			}), /* @__PURE__ */ p("div", {
+				className: h.trigger,
+				"data-disabled": x,
+				onMouseDown: Me,
+				ref: D,
+				children: [
+					v && $ && /* @__PURE__ */ f(ie, {
+						onClick: Ae,
+						children: y.map((e) => /* @__PURE__ */ f(u, {
+							label: e.displayName,
+							onDelete: () => Ie(e),
+							tabIndex: x ? -1 : void 0
+						}, e.id))
+					}),
+					!v && $ && /* @__PURE__ */ f(u, {
+						label: y[0].displayName,
+						tabIndex: x ? -1 : void 0
+					}),
+					/* @__PURE__ */ f("input", {
+						"aria-controls": T,
+						"aria-expanded": N,
+						"aria-haspopup": "listbox",
+						className: h.searchInput,
+						disabled: x,
+						id: w,
+						onChange: Fe,
+						onCompositionStart: Ce,
+						onCompositionEnd: we,
+						onFocus: Ne,
+						placeholder: $ ? void 0 : je,
+						ref: ye,
+						role: "combobox",
+						type: "text",
+						value: Se
+					}),
+					!v && $ && /* @__PURE__ */ f(ae, {
+						"aria-label": C(i.clearAriaLabel),
+						className: h.clearButton,
+						icon: ce,
+						size: "x-small",
+						tabIndex: x ? -1 : void 0,
+						onClick: Pe
+					}),
+					/* @__PURE__ */ f(se, {
+						"aria-hidden": "true",
+						className: h.searchIcon,
+						role: "presentation"
+					})
+				]
+			})]
+		}) }), /* @__PURE__ */ p(d.ContentContainer, {
+			align: "start",
+			className: h.popover,
+			container: be,
+			onInteractOutside: (e) => {
+				D.current?.contains(e.target) && e.preventDefault();
+			},
+			onOpenAutoFocus: (e) => e.preventDefault(),
+			children: [
+				Q.length > 0 && !H && /* @__PURE__ */ f("div", {
+					className: h.breadcrumbContainer,
+					children: /* @__PURE__ */ f(re, {
+						breadcrumbAriaLabel: C(i.breadcrumbAriaLabel),
+						crumbs: Q,
+						onPageLinkClick: De,
+						rootIconVariant: "taxonomy",
+						isInteractive: !x,
+						isResponsiveEnabled: !1,
+						size: "small",
+						truncatedLinksIconAriaLabel: C(i.breadcrumbTruncatedLinksLabel),
+						truncationMethod: "folder-tree"
+					})
+				}),
+				Oe && /* @__PURE__ */ f(r, {
+					availableLevels: _,
+					levelFilter: M.levelFilter,
+					onLevelFilterChange: I.setLevelFilter
+				}),
+				/* @__PURE__ */ f(n, {
+					error: H ? M.searchError : M.initialLoadError,
+					estimatedRowHeight: H ? 44 : void 0,
+					hasMore: H ? M.searchNextMarker !== void 0 : M.itemsNextMarker !== void 0,
+					hasVariableRowHeight: H,
+					isFetching: H ? M.isFetchingSearch : M.isFetching,
+					isFetchingMore: H ? M.isFetchingSearchMore : M.isFetchingMore,
+					isSearchMode: H,
+					items: H ? ke : Ee,
+					listboxId: T,
+					loadMoreError: H ? M.searchLoadMoreError : M.loadMoreError,
+					multiSelect: v,
+					onFocusExit: () => E.current?.focus(),
+					onLoadMore: H ? I.searchLoadMore : xe,
+					onRetry: I.retry,
+					ref: O,
+					selectedValue: Te
+				})
+			]
+		})]
+	});
+});
+export { m as n, g as t };

package/dist/chunks/taxonomy-ancestor-breadcrumb.js

@@ -0,0 +1,115 @@
+import "../esm/lib/constants.js";
+import { Fragment as e, memo as t, useCallback as n, useLayoutEffect as r, useRef as i, useState as a } from "react";
+import { Text as o, Tooltip as s } from "@box/blueprint-web";
+import { Ellipsis as c } from "@box/blueprint-web-assets/icons/Fill";
+import { Fragment as l, jsx as u, jsxs as d } from "react/jsx-runtime";
+import '../styles/taxonomy-ancestor-breadcrumb.css';var f = {
+	root: "_root_12bt1_2",
+	segment: "_segment_12bt1_15",
+	trail: "_trail_12bt1_30",
+	ellipsisIcon: "_ellipsisIcon_12bt1_39",
+	probe: "_probe_12bt1_48"
+}, p = (e) => {
+	let t = window.getComputedStyle(e), n = parseFloat(t.lineHeight);
+	return Number.isFinite(n) && n > 0 ? n : (parseFloat(t.fontSize) || 16) * 1.2;
+}, m = (e, t, n) => {
+	if (e.textContent = t, e.scrollWidth - e.clientWidth <= n) return !1;
+	let r = e.clientWidth, i = 0, a = t.length, o = "";
+	for (; i <= a;) {
+		let s = Math.floor((i + a) / 2), c = t.slice(0, s).trimEnd() + "…";
+		e.textContent = c, e.scrollWidth <= r + n ? (o = c, i = s + 1) : a = s - 1;
+	}
+	return e.textContent = o || "…", !0;
+}, h = ({ ancestor: e, bold: t, onMount: n }) => /* @__PURE__ */ u(o, {
+	as: "span",
+	className: f.segment,
+	color: "textOnLightSecondary",
+	ref: n ? ((t) => n(e, t)) : void 0,
+	variant: t ? "captionBold" : "caption",
+	children: e.displayName
+}), g = () => /* @__PURE__ */ u(o, {
+	"aria-hidden": "true",
+	as: "span",
+	color: "textOnLightSecondary",
+	variant: "caption",
+	children: " / "
+}), _ = ({ items: t, lastIndex: n, onSegmentMount: r }) => /* @__PURE__ */ u(l, { children: t.map((t, i) => /* @__PURE__ */ d(e, { children: [i > 0 && /* @__PURE__ */ u(g, {}), /* @__PURE__ */ u(h, {
+	ancestor: t,
+	bold: i === n,
+	onMount: r
+})] }, t.id)) }), v = /* @__PURE__ */ t(function({ ancestors: e }) {
+	let t = i(null), v = i(null), y = i(/* @__PURE__ */ new Map()), [b, x] = a(!1), [S, C] = a(!1), w = e.length - 1, T = e.length >= 3 && b, E = b || S, D = n((e, t) => {
+		t ? y.current.set(e.id, {
+			node: t,
+			fullText: e.displayName
+		}) : y.current.delete(e.id);
+	}, []);
+	r(() => {
+		let e = t.current, n = v.current;
+		if (!e || !n) return;
+		let r = p(n) * 2 + 2, i = () => {
+			let e = n.scrollHeight > r;
+			x((t) => t === e ? t : e);
+			let t = !1;
+			y.current.forEach(({ node: e, fullText: n }) => {
+				m(e, n, 2) && (t = !0);
+			}), C((e) => e === t ? e : t);
+		};
+		i();
+		let a = new ResizeObserver(i);
+		return a.observe(e), a.observe(n), () => {
+			a.disconnect();
+		};
+	}, [e, E]);
+	let O = e.map((e) => e.displayName).join(" / "), k = /* @__PURE__ */ d(o, {
+		as: "span",
+		className: f.root,
+		"data-testid": "taxonomy-ancestor-breadcrumb",
+		ref: t,
+		role: E ? "group" : void 0,
+		tabIndex: E ? 0 : void 0,
+		children: [/* @__PURE__ */ u(o, {
+			as: "span",
+			className: f.trail,
+			color: "textOnLightSecondary",
+			variant: "caption",
+			children: T ? /* @__PURE__ */ d(l, { children: [
+				/* @__PURE__ */ u(h, {
+					ancestor: e[0],
+					onMount: D
+				}),
+				/* @__PURE__ */ u(g, {}),
+				/* @__PURE__ */ u(c, {
+					"aria-hidden": !0,
+					className: f.ellipsisIcon,
+					color: "currentColor"
+				}),
+				/* @__PURE__ */ u(g, {}),
+				/* @__PURE__ */ u(h, {
+					ancestor: e[w],
+					bold: !0,
+					onMount: D
+				})
+			] }) : /* @__PURE__ */ u(_, {
+				items: e,
+				lastIndex: w,
+				onSegmentMount: D
+			})
+		}), /* @__PURE__ */ u(o, {
+			"aria-hidden": "true",
+			as: "span",
+			className: f.probe,
+			ref: v,
+			variant: "caption",
+			children: /* @__PURE__ */ u(_, {
+				items: e,
+				lastIndex: w
+			})
+		})]
+	});
+	return E ? /* @__PURE__ */ u(s, {
+		content: O,
+		children: k
+	}) : k;
+});
+export { v as t };

package/dist/chunks/taxonomy-items-list.js

@@ -0,0 +1,114 @@
+import "../esm/lib/constants.js";
+import { t as e } from "./empty-state.js";
+import { t } from "./error-state.js";
+import { t as n } from "./loading-state.js";
+import { t as r } from "./taxonomy-menu-item.js";
+import { t as i } from "./load-more-error-row.js";
+import { t as a } from "./load-more-loading-row.js";
+import { forwardRef as o, memo as s, useCallback as c, useEffect as l, useImperativeHandle as u, useLayoutEffect as d, useRef as f } from "react";
+import { Radio as p } from "@box/blueprint-web";
+import { jsx as m, jsxs as h } from "react/jsx-runtime";
+import { Composite as g, CompositeProvider as _ } from "@ariakit/react";
+import { useVirtualizer as v } from "@tanstack/react-virtual";
+import '../styles/taxonomy-items-list.css';var y = {
+	scrollContainer: "_scrollContainer_lky3p_1",
+	virtualContent: "_virtualContent_lky3p_11",
+	virtualRow: "_virtualRow_lky3p_23"
+}, b = /* @__PURE__ */ s(function({ children: e, selectedValue: t, onValueChange: n }) {
+	let r = f(null), i = c((e) => {
+		r.current = e.key;
+	}, []), a = c((e) => {
+		let t = r.current === "ArrowUp" || r.current === "ArrowDown";
+		r.current = null, n(e, !t);
+	}, [n]);
+	return /* @__PURE__ */ m(p.Group, {
+		name: "taxonomy-picker",
+		onKeyDown: i,
+		onValueChange: a,
+		value: t,
+		children: e
+	});
+}), x = (e) => e.getBoundingClientRect().height, S = "__load-more-skeleton__", C = /* @__PURE__ */ o(function({ items: o, multiSelect: s, selectedValue: p, estimatedRowHeight: C = 36, hasVariableRowHeight: w = !1, isSearchMode: T = !1, isFetching: E, error: D, loadMoreError: O = null, listboxId: k, onFocusExit: A, onRetry: j, hasMore: M = !1, isFetchingMore: N = !1, onLoadMore: P }, F) {
+	let I = f(null);
+	u(F, () => ({
+		getScrollTop: () => I.current?.scrollTop ?? 0,
+		scrollTo: (e) => {
+			I.current && (I.current.scrollTop = e);
+		}
+	}), []);
+	let L = N, R = o.length + +!!L, z = c((e) => e >= o.length ? 112 : C, [C, o.length]), B = c((e) => e >= o.length ? S : o[e].id, [o]), V = c((e, t) => {
+		let n = o.find((t) => t.id === e);
+		n?.selectable && n.onSelect(e, t);
+	}, [o]), H = v({
+		count: R,
+		getScrollElement: () => I.current,
+		estimateSize: z,
+		gap: 1,
+		overscan: 20,
+		getItemKey: B,
+		measureElement: x
+	}), U = f(o.length), W = f(null);
+	o.length !== U.current && (o.length > U.current && I.current && (W.current = I.current.scrollTop), U.current = o.length), d(() => {
+		let e = W.current;
+		if (W.current = null, e === null) return;
+		let t = I.current;
+		t && t.scrollTop !== e && (t.scrollTop = e);
+	});
+	let G = f(P);
+	G.current = P;
+	let K = f(!1);
+	K.current = M && !N && O === null && !!P;
+	let q = E && o.length === 0, J = !E && D !== null, Y = !E && D === null && o.length === 0;
+	if (l(() => {
+		let e = I.current;
+		if (!e) return;
+		let t = 0, n = () => {
+			K.current && e.scrollHeight - e.scrollTop - e.clientHeight <= 200 && G.current?.();
+		}, r = () => {
+			cancelAnimationFrame(t), t = requestAnimationFrame(n);
+		};
+		return e.addEventListener("scroll", r, { passive: !0 }), t = requestAnimationFrame(n), () => {
+			e.removeEventListener("scroll", r), cancelAnimationFrame(t);
+		};
+	}, [o.length]), q) return /* @__PURE__ */ m(n, {});
+	if (J) return /* @__PURE__ */ m(t, { onRetry: j });
+	if (Y) return /* @__PURE__ */ m(e, { isSearchMode: T });
+	let X = /* @__PURE__ */ m(_, { children: /* @__PURE__ */ m(g, { children: /* @__PURE__ */ m("div", {
+		className: y.virtualContent,
+		style: { height: H.getTotalSize() },
+		children: H.getVirtualItems().map((e) => {
+			if (e.index >= o.length) return /* @__PURE__ */ m("div", {
+				ref: H.measureElement,
+				className: y.virtualRow,
+				"data-index": e.index,
+				style: { transform: `translateY(${e.start}px)` },
+				children: /* @__PURE__ */ m(a, {})
+			}, e.key);
+			let t = o[e.index];
+			return /* @__PURE__ */ m("div", {
+				ref: w ? H.measureElement : void 0,
+				className: y.virtualRow,
+				"data-index": e.index,
+				style: { transform: `translateY(${e.start}px)` },
+				children: /* @__PURE__ */ m(r, {
+					...t,
+					onFocusExit: e.index === 0 ? A : void 0,
+					isSearchMode: T
+				})
+			}, e.key);
+		})
+	}) }) });
+	return /* @__PURE__ */ h("div", {
+		ref: I,
+		"aria-multiselectable": s || void 0,
+		className: y.scrollContainer,
+		id: k,
+		role: "listbox",
+		children: [s ? X : /* @__PURE__ */ m(b, {
+			onValueChange: V,
+			selectedValue: p,
+			children: X
+		}), O !== null && !N && /* @__PURE__ */ m(i, { onRetry: j })]
+	});
+});
+export { C as t };

package/dist/chunks/taxonomy-level-filter.js

@@ -0,0 +1,47 @@
+import { messages as e } from "../esm/lib/components/taxonomy-level-filter/messages.js";
+import { DropdownMenu as t, TextButton as n } from "@box/blueprint-web";
+import { useIntl as r } from "react-intl";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { Checkmark as o, ChevronDown as s } from "@box/blueprint-web-assets/icons/Medium";
+import '../styles/taxonomy-level-filter.css';var c = {
+	container: "_container_mbgfz_2",
+	popoverContent: "_popoverContent_mbgfz_10",
+	itemStartElement: "_itemStartElement_mbgfz_16",
+	levelFilterButton: "_levelFilterButton_mbgfz_26"
+};
+function l({ availableLevels: l, levelFilter: u, onLevelFilterChange: d }) {
+	let { formatMessage: f } = r(), p = f(e.allOption), m = u === null ? p : l.find((e) => e.level === u)?.displayName ?? p;
+	return /* @__PURE__ */ i("div", {
+		className: c.container,
+		children: /* @__PURE__ */ a(t.Root, {
+			modal: !1,
+			children: [/* @__PURE__ */ i(t.Trigger, { children: /* @__PURE__ */ i(n, {
+				className: c.levelFilterButton,
+				icon: s,
+				variant: "bodyDefault",
+				children: m
+			}) }), /* @__PURE__ */ a(t.Content, {
+				className: c.popoverContent,
+				align: "start",
+				children: [
+					/* @__PURE__ */ a(t.Item, {
+						onClick: () => d(null),
+						children: [/* @__PURE__ */ i(t.Item.StartElement, {
+							className: c.itemStartElement,
+							icon: u === null ? o : void 0
+						}), /* @__PURE__ */ i(t.Item.MainContent, { label: p })]
+					}),
+					/* @__PURE__ */ i(t.Separator, {}),
+					l.map((e) => /* @__PURE__ */ a(t.Item, {
+						onClick: () => d(e.level),
+						children: [/* @__PURE__ */ i(t.Item.StartElement, {
+							className: c.itemStartElement,
+							icon: u === e.level ? o : void 0
+						}), /* @__PURE__ */ i(t.Item.MainContent, { label: e.displayName })]
+					}, e.level))
+				]
+			})]
+		})
+	});
+}
+export { l as t };

package/dist/chunks/taxonomy-menu-item.js

@@ -0,0 +1,99 @@
+import { t as e } from "./taxonomy-ancestor-breadcrumb.js";
+import { messages as t } from "../esm/lib/components/taxonomy-menu-item/messages.js";
+import { useTaxonomyMenuItemKeyboard as n } from "../esm/lib/components/taxonomy-menu-item/use-taxonomy-menu-item-keyboard.js";
+import { memo as r, useCallback as i, useRef as a } from "react";
+import { Checkbox as o, EllipsizableText as s, IconButton as c, Radio as l } from "@box/blueprint-web";
+import u from "clsx";
+import { useIntl as d } from "react-intl";
+import { jsx as f, jsxs as p } from "react/jsx-runtime";
+import { CompositeItem as m } from "@ariakit/react";
+import { ChevronRight as h } from "@box/blueprint-web-assets/icons/Medium";
+import '../styles/taxonomy-menu-item.css';var g = {
+	row: "_row_1y44c_2",
+	rowWithAncestors: "_rowWithAncestors_1y44c_19",
+	nonSelectable: "_nonSelectable_1y44c_24",
+	selectionControl: "_selectionControl_1y44c_31",
+	content: "_content_1y44c_41",
+	drillDown: "_drillDown_1y44c_48"
+}, _ = /* @__PURE__ */ r(function({ id: r, displayName: _, isSearchMode: v = !1, selectable: y, multiSelect: b, isSelected: x, showDrillDown: S, ancestors: C, onSelect: w, onDrillDown: T, onFocusExit: E }) {
+	let { formatMessage: D } = d(), O = C != null && C.length > 0 && v, k = a(null), A = a(null), j = a(null), { handleSelectionControlFocus: M, handleRowKeyDown: N, handleRowKeyDownCapture: P, handleSelectionControlKeyDown: F, handleDrillDownKeyDown: I } = n({
+		id: r,
+		multiSelect: b,
+		onSelect: w,
+		onFocusExit: E,
+		rowRef: k,
+		selectionControlRef: A,
+		drillDownRef: j
+	}), L = i(() => {
+		y ? w(r) : S && T?.(r);
+	}, [
+		y,
+		S,
+		w,
+		T,
+		r
+	]), R = i((e) => {
+		e.stopPropagation(), T?.(r);
+	}, [T, r]);
+	return /* @__PURE__ */ p(m, {
+		ref: k,
+		render: /* @__PURE__ */ f("div", {
+			role: "option",
+			"aria-selected": x
+		}),
+		className: u(g.row, {
+			[g.rowWithAncestors]: O,
+			[g.nonSelectable]: !y
+		}),
+		"data-testid": `taxonomy-menu-item-${r}`,
+		onClick: L,
+		onKeyDown: N,
+		onKeyDownCapture: P,
+		children: [
+			y && b && /* @__PURE__ */ f(o.Item, {
+				ref: A,
+				"aria-label": _,
+				checked: x,
+				className: g.selectionControl,
+				label: "",
+				tabIndex: -1,
+				onClick: (e) => e.stopPropagation(),
+				onCheckedChange: () => w(r),
+				onKeyDown: F,
+				value: r
+			}),
+			y && !b && /* @__PURE__ */ f(l.Item, {
+				ref: A,
+				"aria-label": _,
+				className: g.selectionControl,
+				label: "",
+				tabIndex: -1,
+				onClick: (e) => e.stopPropagation(),
+				onFocus: M,
+				onKeyDown: F,
+				value: r
+			}),
+			/* @__PURE__ */ p("div", {
+				className: g.content,
+				children: [/* @__PURE__ */ f(s, {
+					as: "span",
+					lineClamp: 1,
+					variant: O ? "bodyDefaultBold" : "bodyDefault",
+					children: _
+				}), O && /* @__PURE__ */ f(e, { ancestors: C })]
+			}),
+			S && /* @__PURE__ */ f(c, {
+				ref: j,
+				"aria-label": D(t.drillDownAriaLabel, { name: _ }),
+				className: g.drillDown,
+				"data-testid": `taxonomy-menu-item-drill-down-${r}`,
+				icon: h,
+				tabIndex: -1,
+				onClick: R,
+				onKeyDown: I,
+				size: "x-small"
+			})
+		]
+	});
+});
+export { _ as t };

package/dist/esm/index.js

@@ -0,0 +1,3 @@
+import { n as e } from "../chunks/metadata-taxonomy-picker-shell.js";
+import { MetadataTaxonomyPicker as t } from "./lib/metadata-taxonomy-picker.js";
+export { t as MetadataTaxonomyPicker, e as TaxonomyPickerMode };

package/dist/esm/lib/components/metadata-taxonomy-picker-shell/index.js

@@ -0,0 +1,2 @@
+import { t as e } from "../../../../chunks/metadata-taxonomy-picker-shell.js";
+export { e as MetadataTaxonomyPickerShell };

package/dist/esm/lib/components/metadata-taxonomy-picker-shell/messages.js

@@ -0,0 +1,24 @@
+import { defineMessages as e } from "react-intl";
+var t = e({
+	placeholder: {
+		id: "groupSharedFeatures.metadataTaxonomyPicker.shell.placeholder",
+		defaultMessage: "Select an Option"
+	},
+	breadcrumbAriaLabel: {
+		id: "groupSharedFeatures.metadataTaxonomyPicker.shell.breadcrumbAriaLabel",
+		defaultMessage: "Taxonomy navigation"
+	},
+	breadcrumbRootLabel: {
+		id: "groupSharedFeatures.metadataTaxonomyPicker.shell.breadcrumbRootLabel",
+		defaultMessage: "All"
+	},
+	breadcrumbTruncatedLinksLabel: {
+		id: "groupSharedFeatures.metadataTaxonomyPicker.shell.breadcrumbTruncatedLinksLabel",
+		defaultMessage: "Show hidden parent levels"
+	},
+	clearAriaLabel: {
+		id: "groupSharedFeatures.metadataTaxonomyPicker.shell.clearAriaLabel",
+		defaultMessage: "Clear selection"
+	}
+});
+export { t as messages };

package/dist/esm/lib/components/metadata-taxonomy-picker-shell/metadata-taxonomy-picker-shell.js

@@ -0,0 +1,2 @@
+import { t as e } from "../../../../chunks/metadata-taxonomy-picker-shell.js";
+export { e as MetadataTaxonomyPickerShell };