@box/metadata-template-editor 2.2.24 → 2.2.25

package/dist/chunks/chip.js

@@ -1,22 +1 @@
-import e from "../esm/lib/components/metadata-field-configurator/messages/levels-chain-messages.js";
-import { Text as t } from "@box/blueprint-web";
-import { useIntl as n } from "react-intl";
-import { jsx as r } from "react/jsx-runtime";
-import i from "clsx";
-import '../styles/chip.css';var a = {
-	chip: "_chip_plmye_1",
-	selected: "_selected_plmye_8"
-}, o = /* @__PURE__ */ function(e) {
-	return e.Selected = "selected", e.Unselected = "unselected", e;
-}({}), s = ({ value: o, selected: s = !1 }) => {
-	let { formatMessage: c } = n(), l = c(s ? e.chipSelected : e.chipNotSelected);
-	return /* @__PURE__ */ r(t, {
-		as: "span",
-		className: i(a.chip, { [a.selected]: s }),
-		color: s ? "textOnDarkDefault" : "textOnLightDefault",
-		"data-state": s ? "selected" : "unselected",
-		"aria-label": `${o}: ${l}`,
-		children: o
-	});
-};
-export { o as n, s as t };
+import levels_chain_messages_default from"../esm/lib/components/metadata-field-configurator/messages/levels-chain-messages.js";import{Text}from"@box/blueprint-web";import{useIntl}from"react-intl";import{jsx}from"react/jsx-runtime";import clsx from"clsx";import '../styles/chip.css';var chip_module_default={chip:`_chip_plmye_1`,selected:`_selected_plmye_8`},ChipState=function(ChipState){return ChipState.Selected=`selected`,ChipState.Unselected=`unselected`,ChipState}({}),Chip=({value,selected=!1})=>{let{formatMessage}=useIntl(),selectedLabel=formatMessage(selected?levels_chain_messages_default.chipSelected:levels_chain_messages_default.chipNotSelected);return jsx(Text,{as:`span`,className:clsx(chip_module_default.chip,{[chip_module_default.selected]:selected}),color:selected?`textOnDarkDefault`:`textOnLightDefault`,"data-state":selected?`selected`:`unselected`,"aria-label":`${value}: ${selectedLabel}`,children:value})};export{ChipState as n,Chip as t};

package/dist/chunks/dropdown-field-configuration.js

@@ -1,62 +1 @@
-import { useFieldConfigurator as e } from "../esm/lib/components/metadata-field-configurator/context/field-configurator-context.js";
-import t from "../esm/lib/components/metadata-field-configurator/messages/dropdown-messages.js";
-import { t as n } from "./sortable-option-list.js";
-import { InlineNotice as r, Switch as i, TextButton as a } from "@box/blueprint-web";
-import { useIntl as o } from "react-intl";
-import { jsx as s, jsxs as c } from "react/jsx-runtime";
-import { useCallback as l, useEffect as u, useState as d } from "react";
-import f from "lodash/uniqueId";
-import '../styles/dropdown-field-configuration.css';var p = {
-	dropdownFieldConfiguration: "_dropdownFieldConfiguration_rjv8w_1",
-	addOptionButton: "_addOptionButton_rjv8w_7"
-}, m = () => {
-	let { formatMessage: m } = o(), { values: h, errors: g, touched: _, setFieldValue: v } = e(), [y, b] = d(!1), x = h.dropdown.options.length > 0, S = g.dropdown, C = _.dropdown, w = S?.options?.some((e, t) => e?.key && C?.options?.[t]), T = l((e = !1) => {
-		v("dropdown", {
-			...h.dropdown,
-			options: [...h.dropdown.options, {
-				id: f(),
-				key: "",
-				isNew: !0
-			}]
-		}), b(e);
-	}, [h.dropdown, v]), E = l(() => {
-		T(!0);
-	}, [T]);
-	u(() => {
-		x || T(!1);
-	}, [x, T]);
-	let D = l(() => {
-		b(!1);
-	}, []);
-	return /* @__PURE__ */ c("div", {
-		className: p.dropdownFieldConfiguration,
-		children: [
-			w && /* @__PURE__ */ s(r, {
-				variant: "error",
-				variantIconAriaLabel: m(t.optionListValidationError),
-				children: m(t.optionListValidationError)
-			}),
-			x && /* @__PURE__ */ s(n, {
-				shouldFocusLastOption: y,
-				onFocusConsumed: D
-			}),
-			!h.isFieldReadOnly && /* @__PURE__ */ s(a, {
-				className: p.addOptionButton,
-				onClick: E,
-				children: m(t.addOption)
-			}),
-			/* @__PURE__ */ s(i.Item, {
-				name: "dropdown.allowMultipleSelections",
-				checked: h.dropdown.allowMultipleSelections,
-				disabled: !h.isFieldNew || h.isFieldReadOnly,
-				label: m(t.allowMultipleSelection),
-				onCheckedChange: (e) => v("dropdown", {
-					...h.dropdown,
-					allowMultipleSelections: e
-				}),
-				value: "true"
-			})
-		]
-	});
-};
-export { m as t };
+import{useFieldConfigurator}from"../esm/lib/components/metadata-field-configurator/context/field-configurator-context.js";import dropdown_messages_default from"../esm/lib/components/metadata-field-configurator/messages/dropdown-messages.js";import{t as SortableOptionList}from"./sortable-option-list.js";import{InlineNotice,Switch,TextButton}from"@box/blueprint-web";import{useIntl}from"react-intl";import{jsx,jsxs}from"react/jsx-runtime";import{useCallback,useEffect,useState}from"react";import uniqueId from"lodash/uniqueId";import '../styles/dropdown-field-configuration.css';var dropdown_field_configuration_module_default={dropdownFieldConfiguration:`_dropdownFieldConfiguration_rjv8w_1`,addOptionButton:`_addOptionButton_rjv8w_7`},DropdownFieldConfiguration=()=>{let{formatMessage}=useIntl(),{values,errors,touched,setFieldValue}=useFieldConfigurator(),[shouldFocusLastOption,setShouldFocusLastOption]=useState(!1),isAnyOptionDefined=values.dropdown.options.length>0,dropdownErrors=errors.dropdown,dropdownTouched=touched.dropdown,hasTouchedOptionErrors=dropdownErrors?.options?.some((opt,index)=>opt?.key&&dropdownTouched?.options?.[index]),handleAddOption=useCallback((shouldFocus=!1)=>{setFieldValue(`dropdown`,{...values.dropdown,options:[...values.dropdown.options,{id:uniqueId(),key:``,isNew:!0}]}),setShouldFocusLastOption(shouldFocus)},[values.dropdown,setFieldValue]),handleUserAddOption=useCallback(()=>{handleAddOption(!0)},[handleAddOption]);useEffect(()=>{isAnyOptionDefined||handleAddOption(!1)},[isAnyOptionDefined,handleAddOption]);let handleFocusConsumed=useCallback(()=>{setShouldFocusLastOption(!1)},[]);return jsxs(`div`,{className:dropdown_field_configuration_module_default.dropdownFieldConfiguration,children:[hasTouchedOptionErrors&&jsx(InlineNotice,{variant:`error`,variantIconAriaLabel:formatMessage(dropdown_messages_default.optionListValidationError),children:formatMessage(dropdown_messages_default.optionListValidationError)}),isAnyOptionDefined&&jsx(SortableOptionList,{shouldFocusLastOption,onFocusConsumed:handleFocusConsumed}),!values.isFieldReadOnly&&jsx(TextButton,{className:dropdown_field_configuration_module_default.addOptionButton,onClick:handleUserAddOption,children:formatMessage(dropdown_messages_default.addOption)}),jsx(Switch.Item,{name:`dropdown.allowMultipleSelections`,checked:values.dropdown.allowMultipleSelections,disabled:!values.isFieldNew||values.isFieldReadOnly,label:formatMessage(dropdown_messages_default.allowMultipleSelection),onCheckedChange:allowMultipleSelections=>setFieldValue(`dropdown`,{...values.dropdown,allowMultipleSelections}),value:`true`})]})};export{DropdownFieldConfiguration as t};

package/dist/chunks/field-context-menu.js

@@ -1,91 +1 @@
-import { general as e } from "../esm/lib/components/metadata-field-configurator/messages/configurator-messages.js";
-import { Divider as t, DropdownMenu as n, IconButton as r, Text as i } from "@box/blueprint-web";
-import { FormattedMessage as a, useIntl as o } from "react-intl";
-import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";
-import { Ellipsis as u } from "@box/blueprint-web-assets/icons/Fill";
-import d from "react";
-import { IconIconErrorOnLight as f } from "@box/blueprint-web-assets/tokens/tokens";
-import { ArrowDown as p, ArrowUp as m, Hidden as h, Trash as g, TwoFiles as _, Visible as v } from "@box/blueprint-web-assets/icons/Line";
-import y from "clsx";
-import '../styles/field-context-menu.css';var b = {
-	contextMenuTrigger: "_contextMenuTrigger_102vn_1",
-	menuItem: "_menuItem_102vn_5",
-	contextMenu: "_contextMenu_102vn_1",
-	divider: "_divider_102vn_14"
-}, x = ({ className: x, index: S, maxIndex: C, isHidden: w = !1, onReorderFields: T, onToggleVisibility: E, onRequestDelete: D, onRequestDuplicate: O, onOpenChange: k }) => {
-	let A = o(), [j, M] = d.useState(!1), N = d.useRef(null), P = (e) => {
-		M(e), k?.(e);
-	}, F = () => {
-		S > 0 && T?.(S, S - 1);
-	}, I = () => {
-		T?.(S, S + 1);
-	}, L = !!(T || O || E);
-	return /* @__PURE__ */ l(n.Root, {
-		open: j,
-		onOpenChange: P,
-		modal: !1,
-		children: [/* @__PURE__ */ c(n.Trigger, {
-			className: y(b.contextMenuTrigger, x),
-			children: /* @__PURE__ */ c(r, {
-				icon: u,
-				"aria-label": A.formatMessage(e.contextMenuAriaLabel),
-				size: "large"
-			})
-		}), /* @__PURE__ */ l(n.Content, {
-			ref: N,
-			align: "end",
-			className: b.contextMenu,
-			children: [
-				T && /* @__PURE__ */ l(s, { children: [/* @__PURE__ */ c(n.Item, {
-					disabled: S === 0,
-					onClick: F,
-					"aria-label": A.formatMessage(e.moveUpAriaLabel),
-					children: /* @__PURE__ */ l("div", {
-						className: b.menuItem,
-						children: [/* @__PURE__ */ c(m, { "aria-hidden": "true" }), /* @__PURE__ */ c(a, { ...e.moveUp })]
-					})
-				}), /* @__PURE__ */ c(n.Item, {
-					disabled: S === C,
-					onClick: I,
-					"aria-label": A.formatMessage(e.moveDownAriaLabel),
-					children: /* @__PURE__ */ l("div", {
-						className: b.menuItem,
-						children: [/* @__PURE__ */ c(p, { "aria-hidden": "true" }), /* @__PURE__ */ c(a, { ...e.moveDown })]
-					})
-				})] }),
-				O && /* @__PURE__ */ c(n.Item, {
-					onClick: O,
-					"aria-label": A.formatMessage(e.duplicateFieldAriaLabel),
-					children: /* @__PURE__ */ l("div", {
-						className: b.menuItem,
-						children: [/* @__PURE__ */ c(_, { "aria-hidden": "true" }), /* @__PURE__ */ c(a, { ...e.duplicateField })]
-					})
-				}),
-				E && /* @__PURE__ */ c(n.Item, {
-					onClick: () => E(!w),
-					"aria-label": A.formatMessage(w ? e.showField : e.hideField),
-					children: /* @__PURE__ */ l("div", {
-						className: b.menuItem,
-						children: [c(w ? v : h, { "aria-hidden": "true" }), /* @__PURE__ */ c(a, { ...w ? e.showField : e.hideField })]
-					})
-				}),
-				D && /* @__PURE__ */ l(s, { children: [L && /* @__PURE__ */ c(t, { className: b.divider }), /* @__PURE__ */ c(n.Item, {
-					onClick: D,
-					"aria-label": A.formatMessage(e.deleteFieldAriaLabel),
-					children: /* @__PURE__ */ l("div", {
-						className: b.menuItem,
-						children: [/* @__PURE__ */ c(g, {
-							color: f,
-							"aria-hidden": "true"
-						}), /* @__PURE__ */ c(i, {
-							as: "span",
-							color: "textOnLightError",
-							children: /* @__PURE__ */ c(a, { ...e.deleteField })
-						})]
-					})
-				})] })
-			]
-		})]
-	});
-};
-export { x as t };
+import{general}from"../esm/lib/components/metadata-field-configurator/messages/configurator-messages.js";import{Divider,DropdownMenu,IconButton,Text}from"@box/blueprint-web";import{FormattedMessage,useIntl}from"react-intl";import{Fragment,jsx,jsxs}from"react/jsx-runtime";import{Ellipsis}from"@box/blueprint-web-assets/icons/Fill";import React from"react";import{IconIconErrorOnLight}from"@box/blueprint-web-assets/tokens/tokens";import{ArrowDown,ArrowUp,Hidden,Trash,TwoFiles,Visible}from"@box/blueprint-web-assets/icons/Line";import clsx from"clsx";import '../styles/field-context-menu.css';var field_context_menu_module_default={contextMenuTrigger:`_contextMenuTrigger_102vn_1`,menuItem:`_menuItem_102vn_5`,contextMenu:`_contextMenu_102vn_1`,divider:`_divider_102vn_14`},FieldContextMenu=({className,index,maxIndex,isHidden=!1,onReorderFields,onToggleVisibility,onRequestDelete,onRequestDuplicate,onOpenChange})=>{let intl=useIntl(),[contextMenuOpen,setContextMenuOpen]=React.useState(!1),contextMenuRef=React.useRef(null),handleOpenChange=open=>{setContextMenuOpen(open),onOpenChange?.(open)},handleMoveUp=()=>{index>0&&onReorderFields?.(index,index-1)},handleMoveDown=()=>{onReorderFields?.(index,index+1)},hasItemsAboveDelete=!!(onReorderFields||onRequestDuplicate||onToggleVisibility);return jsxs(DropdownMenu.Root,{open:contextMenuOpen,onOpenChange:handleOpenChange,modal:!1,children:[jsx(DropdownMenu.Trigger,{className:clsx(field_context_menu_module_default.contextMenuTrigger,className),children:jsx(IconButton,{icon:Ellipsis,"aria-label":intl.formatMessage(general.contextMenuAriaLabel),size:`large`})}),jsxs(DropdownMenu.Content,{ref:contextMenuRef,align:`end`,className:field_context_menu_module_default.contextMenu,children:[onReorderFields&&jsxs(Fragment,{children:[jsx(DropdownMenu.Item,{disabled:index===0,onClick:handleMoveUp,"aria-label":intl.formatMessage(general.moveUpAriaLabel),children:jsxs(`div`,{className:field_context_menu_module_default.menuItem,children:[jsx(ArrowUp,{"aria-hidden":`true`}),jsx(FormattedMessage,{...general.moveUp})]})}),jsx(DropdownMenu.Item,{disabled:index===maxIndex,onClick:handleMoveDown,"aria-label":intl.formatMessage(general.moveDownAriaLabel),children:jsxs(`div`,{className:field_context_menu_module_default.menuItem,children:[jsx(ArrowDown,{"aria-hidden":`true`}),jsx(FormattedMessage,{...general.moveDown})]})})]}),onRequestDuplicate&&jsx(DropdownMenu.Item,{onClick:onRequestDuplicate,"aria-label":intl.formatMessage(general.duplicateFieldAriaLabel),children:jsxs(`div`,{className:field_context_menu_module_default.menuItem,children:[jsx(TwoFiles,{"aria-hidden":`true`}),jsx(FormattedMessage,{...general.duplicateField})]})}),onToggleVisibility&&jsx(DropdownMenu.Item,{onClick:()=>onToggleVisibility(!isHidden),"aria-label":intl.formatMessage(isHidden?general.showField:general.hideField),children:jsxs(`div`,{className:field_context_menu_module_default.menuItem,children:[jsx(isHidden?Visible:Hidden,{"aria-hidden":`true`}),jsx(FormattedMessage,{...isHidden?general.showField:general.hideField})]})}),onRequestDelete&&jsxs(Fragment,{children:[hasItemsAboveDelete&&jsx(Divider,{className:field_context_menu_module_default.divider}),jsx(DropdownMenu.Item,{onClick:onRequestDelete,"aria-label":intl.formatMessage(general.deleteFieldAriaLabel),children:jsxs(`div`,{className:field_context_menu_module_default.menuItem,children:[jsx(Trash,{color:IconIconErrorOnLight,"aria-hidden":`true`}),jsx(Text,{as:`span`,color:`textOnLightError`,children:jsx(FormattedMessage,{...general.deleteField})})]})})]})]})]})};export{FieldContextMenu as t};

package/dist/chunks/field-selector.js

@@ -1,23 +1 @@
-import e from "../esm/lib/components/field-selector/messages.js";
-import { DropdownMenu as t, TextButton as n } from "@box/blueprint-web";
-import { useIntl as r } from "react-intl";
-import { ChevronDown as i } from "@box/blueprint-web-assets/icons/Medium";
-import { jsx as a, jsxs as o } from "react/jsx-runtime";
-import '../styles/field-selector.css';var s = { fieldSelectorTrigger: "_fieldSelectorTrigger_cj5ij_1" };
-function c({ fields: c, onSelect: l }) {
-	let { formatMessage: u } = r();
-	return /* @__PURE__ */ o(t.Root, {
-		modal: !1,
-		children: [/* @__PURE__ */ a(t.Trigger, { children: /* @__PURE__ */ a(n, {
-			icon: i,
-			className: s.fieldSelectorTrigger,
-			variant: "bodyDefaultSemibold",
-			color: "textOnLightSecondary",
-			children: u(e.selectField)
-		}) }), /* @__PURE__ */ a(t.Content, { children: c.map((n) => /* @__PURE__ */ a(t.Item, {
-			onClick: () => l(n.id),
-			children: /* @__PURE__ */ a(t.Item.MainContent, { label: n.name || u(e.unnamedField) })
-		}, n.id)) })]
-	});
-}
-export { c as t };
+import messages_default from"../esm/lib/components/field-selector/messages.js";import{DropdownMenu,TextButton}from"@box/blueprint-web";import{useIntl}from"react-intl";import{ChevronDown}from"@box/blueprint-web-assets/icons/Medium";import{jsx,jsxs}from"react/jsx-runtime";import '../styles/field-selector.css';var field_selector_module_default={fieldSelectorTrigger:`_fieldSelectorTrigger_cj5ij_1`};function FieldSelector({fields,onSelect}){let{formatMessage}=useIntl();return jsxs(DropdownMenu.Root,{modal:!1,children:[jsx(DropdownMenu.Trigger,{children:jsx(TextButton,{icon:ChevronDown,className:field_selector_module_default.fieldSelectorTrigger,variant:`bodyDefaultSemibold`,color:`textOnLightSecondary`,children:formatMessage(messages_default.selectField)})}),jsx(DropdownMenu.Content,{children:fields.map(field=>jsx(DropdownMenu.Item,{onClick:()=>onSelect(field.id),children:jsx(DropdownMenu.Item.MainContent,{label:field.name||formatMessage(messages_default.unnamedField)})},field.id))})]})}export{FieldSelector as t};

package/dist/chunks/field-type-dropdown.js

@@ -1,31 +1 @@
-import { useFieldOptions as e } from "../esm/lib/utils/field-options/useFieldOptions.js";
-import { fieldTypeDropdownMessages as t } from "../esm/lib/components/field-type-dropdown/messages.js";
-import { Button as n, DropdownMenu as r } from "@box/blueprint-web";
-import { useIntl as i } from "react-intl";
-import { jsx as a, jsxs as o } from "react/jsx-runtime";
-import { Plus as s } from "@box/blueprint-web-assets/icons/Fill";
-import '../styles/field-type-dropdown.css';var c = { addField: "_addField_1bl6g_1" };
-function l({ onFieldAdd: l, trigger: u }) {
-	let { formatMessage: d } = i(), f = e();
-	return /* @__PURE__ */ o(r.Root, {
-		modal: !1,
-		children: [/* @__PURE__ */ a(r.Trigger, { children: u ?? /* @__PURE__ */ a(n, {
-			className: c.addField,
-			variant: "secondary",
-			size: "large",
-			startIcon: s,
-			"aria-label": d(t.addFieldAriaLabel),
-			children: d(t.addField)
-		}) }), /* @__PURE__ */ a(r.Content, { children: f.availableFieldTypes.map((e) => /* @__PURE__ */ o(r.Item, {
-			onClick: () => l(e),
-			children: [/* @__PURE__ */ a(r.Item.StartElement, { children: /* @__PURE__ */ a(e.Icon, {
-				fontSize: "15px",
-				"aria-hidden": "true"
-			}) }), /* @__PURE__ */ a(r.Item.MainContent, {
-				caption: e.description,
-				label: String(e.label)
-			})]
-		}, e.type)) })]
-	});
-}
-export { l as t };
+import{useFieldOptions}from"../esm/lib/utils/field-options/useFieldOptions.js";import{fieldTypeDropdownMessages}from"../esm/lib/components/field-type-dropdown/messages.js";import{Button,DropdownMenu}from"@box/blueprint-web";import{useIntl}from"react-intl";import{jsx,jsxs}from"react/jsx-runtime";import{Plus}from"@box/blueprint-web-assets/icons/Fill";import '../styles/field-type-dropdown.css';var field_type_dropdown_module_default={addField:`_addField_1bl6g_1`};function FieldTypeDropdown({onFieldAdd,trigger}){let{formatMessage}=useIntl(),fieldTypes=useFieldOptions();return jsxs(DropdownMenu.Root,{modal:!1,children:[jsx(DropdownMenu.Trigger,{children:trigger??jsx(Button,{className:field_type_dropdown_module_default.addField,variant:`secondary`,size:`large`,startIcon:Plus,"aria-label":formatMessage(fieldTypeDropdownMessages.addFieldAriaLabel),children:formatMessage(fieldTypeDropdownMessages.addField)})}),jsx(DropdownMenu.Content,{children:fieldTypes.availableFieldTypes.map(fieldType=>jsxs(DropdownMenu.Item,{onClick:()=>onFieldAdd(fieldType),children:[jsx(DropdownMenu.Item.StartElement,{children:jsx(fieldType.Icon,{fontSize:`15px`,"aria-hidden":`true`})}),jsx(DropdownMenu.Item.MainContent,{caption:fieldType.description,label:String(fieldType.label)})]},fieldType.type))})]})}export{FieldTypeDropdown as t};

package/dist/chunks/levels-chain.js

@@ -1,120 +1 @@
-import e from "../esm/lib/components/metadata-field-configurator/messages/levels-chain-messages.js";
-import { t } from "./chip.js";
-import { getHideCounts as n } from "../esm/lib/components/metadata-field-configurator/components/levels-chain/utils.js";
-import { Text as r, Tooltip as i } from "@box/blueprint-web";
-import { FormattedMessage as a } from "react-intl";
-import { jsx as o, jsxs as s } from "react/jsx-runtime";
-import { useEffect as c, useLayoutEffect as l, useMemo as u, useRef as d, useState as f } from "react";
-import { IconIconOnLightSecondary as p } from "@box/blueprint-web-assets/tokens/tokens";
-import { ArrowRight as m } from "@box/blueprint-web-assets/icons/Line";
-import '../styles/levels-chain.css';var h = { levelsChain: "_levelsChain_bbgph_1" };
-function g(e) {
-	let t = Math.ceil(e.length / 2);
-	return [e.slice(0, t), e.slice(t)];
-}
-var _ = ({ levels: _ = [], selectedLevels: v = [] }) => {
-	let [y, b] = g(_), [x, S] = f(!1), [C, w] = f([]), [T, E] = f([]), [D, O] = f(0), [k, A] = f(0), j = d(null), M = d(null), N = u(() => {
-		let e = j.current ? window.getComputedStyle(j.current) : { gap: "11px" };
-		return parseInt(e.gap, 10);
-	}, [j.current]), P = /* @__PURE__ */ o(m, {
-		color: p,
-		"aria-hidden": "true"
-	});
-	c(() => {
-		S(!1);
-	}, [_]), l(() => {
-		if (j.current && !x && _.length > 0) {
-			let e = j.current;
-			A(e.clientWidth);
-			let t = e.querySelectorAll("li"), n = Array.from(t).slice(0, y.length), r = Array.from(t).slice(y.length + 1);
-			w(n.map((e) => e.getBoundingClientRect().width)), E(r.map((e) => e.getBoundingClientRect().width)), M.current && O(M.current.getBoundingClientRect().width), S(!0);
-		}
-	}, [
-		y,
-		b,
-		x,
-		_.length
-	]), c(() => {
-		let e = () => {
-			j.current && A(j.current.clientWidth);
-		};
-		return window.addEventListener("resize", e), () => {
-			window.removeEventListener("resize", e);
-		};
-	}, []);
-	let [F, I] = u(() => n({
-		isMeasured: x,
-		leftLevelWidths: C,
-		rightLevelWidths: T,
-		containerWidthPx: k,
-		buttonWidthPx: D,
-		gapBetweenItems: N
-	}), [
-		x,
-		C,
-		T,
-		k,
-		D,
-		N
-	]), L = u(() => {
-		let e = y.slice(y.length - F), t = b.slice(0, I);
-		return [...e, ...t];
-	}, [
-		F,
-		I,
-		y,
-		b
-	]), R = L.some((e) => v.includes(e.level));
-	return _.length === 0 ? /* @__PURE__ */ o("div", {
-		role: "alert",
-		children: /* @__PURE__ */ o(a, { ...e.noLevels })
-	}) : /* @__PURE__ */ s("ul", {
-		ref: j,
-		className: h.levelsChain,
-		"data-testid": "taxonomy-levels-chain",
-		children: [
-			y.map((e, n) => {
-				let r = x && n >= y.length - F;
-				return /* @__PURE__ */ s("li", {
-					"aria-hidden": r,
-					style: { display: r ? "none" : void 0 },
-					children: [/* @__PURE__ */ o(t, {
-						value: e.name,
-						selected: v.includes(e.level)
-					}), y.length + b.length > 1 ? P : null]
-				}, e.level);
-			}),
-			/* @__PURE__ */ s("li", {
-				ref: M,
-				style: x ? F > 0 || I > 0 ? {} : { display: "none" } : {
-					position: "absolute",
-					visibility: "hidden"
-				},
-				"aria-hidden": !(F > 0 || I > 0),
-				tabIndex: x && (F > 0 || I > 0) ? 0 : -1,
-				children: [/* @__PURE__ */ o(i, {
-					content: L.map((e) => e.name).join(" > "),
-					children: /* @__PURE__ */ o(r, {
-						as: "span",
-						children: /* @__PURE__ */ o(t, {
-							value: `+${F + I}`,
-							selected: R
-						})
-					})
-				}), P]
-			}),
-			b.map((e, n) => {
-				let r = x && n < I;
-				return /* @__PURE__ */ s("li", {
-					"aria-hidden": r,
-					style: { display: r ? "none" : void 0 },
-					children: [/* @__PURE__ */ o(t, {
-						value: e.name,
-						selected: v.includes(e.level)
-					}), n < b.length - 1 && P]
-				}, e.level);
-			})
-		]
-	});
-};
-export { _ as t };
+import levels_chain_messages_default from"../esm/lib/components/metadata-field-configurator/messages/levels-chain-messages.js";import{t as Chip}from"./chip.js";import{getHideCounts}from"../esm/lib/components/metadata-field-configurator/components/levels-chain/utils.js";import{Text,Tooltip}from"@box/blueprint-web";import{FormattedMessage}from"react-intl";import{jsx,jsxs}from"react/jsx-runtime";import{useEffect,useLayoutEffect,useMemo,useRef,useState}from"react";import{IconIconOnLightSecondary}from"@box/blueprint-web-assets/tokens/tokens";import{ArrowRight}from"@box/blueprint-web-assets/icons/Line";import '../styles/levels-chain.css';var levels_chain_module_default={levelsChain:`_levelsChain_bbgph_1`};function divideIntoTwo(levels){let half=Math.ceil(levels.length/2);return[levels.slice(0,half),levels.slice(half)]}var LevelsChain=({levels=[],selectedLevels=[]})=>{let[levelsLeft,levelsRight]=divideIntoTwo(levels),[isMeasured,setIsMeasured]=useState(!1),[leftLevelWidths,setLeftLevelWidths]=useState([]),[rightLevelWidths,setRightLevelWidths]=useState([]),[toggleButtonWidth,setToggleButtonWidth]=useState(0),[containerWidthPx,setContainerWidthPx]=useState(0),ulRef=useRef(null),buttonRef=useRef(null),gap=useMemo(()=>{let computedStyle=ulRef.current?window.getComputedStyle(ulRef.current):{gap:`11px`};return parseInt(computedStyle.gap,10)},[ulRef.current]),arrowRight=jsx(ArrowRight,{color:IconIconOnLightSecondary,"aria-hidden":`true`});useEffect(()=>{setIsMeasured(!1)},[levels]),useLayoutEffect(()=>{if(ulRef.current&&!isMeasured&&levels.length>0){let ulElement=ulRef.current;setContainerWidthPx(ulElement.clientWidth);let allLi=ulElement.querySelectorAll(`li`),leftLis=Array.from(allLi).slice(0,levelsLeft.length),rightLis=Array.from(allLi).slice(levelsLeft.length+1);setLeftLevelWidths(leftLis.map(li=>li.getBoundingClientRect().width)),setRightLevelWidths(rightLis.map(li=>li.getBoundingClientRect().width)),buttonRef.current&&setToggleButtonWidth(buttonRef.current.getBoundingClientRect().width),setIsMeasured(!0)}},[levelsLeft,levelsRight,isMeasured,levels.length]),useEffect(()=>{let handleResize=()=>{ulRef.current&&setContainerWidthPx(ulRef.current.clientWidth)};return window.addEventListener(`resize`,handleResize),()=>{window.removeEventListener(`resize`,handleResize)}},[]);let[hideLeftCount,hideRightCount]=useMemo(()=>getHideCounts({isMeasured,leftLevelWidths,rightLevelWidths,containerWidthPx,buttonWidthPx:toggleButtonWidth,gapBetweenItems:gap}),[isMeasured,leftLevelWidths,rightLevelWidths,containerWidthPx,toggleButtonWidth,gap]),hiddenLevelsList=useMemo(()=>{let hiddenLeft=levelsLeft.slice(levelsLeft.length-hideLeftCount),hiddenRight=levelsRight.slice(0,hideRightCount);return[...hiddenLeft,...hiddenRight]},[hideLeftCount,hideRightCount,levelsLeft,levelsRight]),isAnyHiddenLevelSelected=hiddenLevelsList.some(level=>selectedLevels.includes(level.level));return levels.length===0?jsx(`div`,{role:`alert`,children:jsx(FormattedMessage,{...levels_chain_messages_default.noLevels})}):jsxs(`ul`,{ref:ulRef,className:levels_chain_module_default.levelsChain,"data-testid":`taxonomy-levels-chain`,children:[levelsLeft.map((level,index)=>{let isHidden=isMeasured&&index>=levelsLeft.length-hideLeftCount;return jsxs(`li`,{"aria-hidden":isHidden,style:{display:isHidden?`none`:void 0},children:[jsx(Chip,{value:level.name,selected:selectedLevels.includes(level.level)}),levelsLeft.length+levelsRight.length>1?arrowRight:null]},level.level)}),jsxs(`li`,{ref:buttonRef,style:isMeasured?hideLeftCount>0||hideRightCount>0?{}:{display:`none`}:{position:`absolute`,visibility:`hidden`},"aria-hidden":!(hideLeftCount>0||hideRightCount>0),tabIndex:isMeasured&&(hideLeftCount>0||hideRightCount>0)?0:-1,children:[jsx(Tooltip,{content:hiddenLevelsList.map(level=>level.name).join(` > `),children:jsx(Text,{as:`span`,children:jsx(Chip,{value:`+${hideLeftCount+hideRightCount}`,selected:isAnyHiddenLevelSelected})})}),arrowRight]}),levelsRight.map((level,index)=>{let isHidden=isMeasured&&index<hideRightCount;return jsxs(`li`,{"aria-hidden":isHidden,style:{display:isHidden?`none`:void 0},children:[jsx(Chip,{value:level.name,selected:selectedLevels.includes(level.level)}),index<levelsRight.length-1&&arrowRight]},level.level)})]})};export{LevelsChain as t};

package/dist/chunks/metadata-field-configurator.module.js

@@ -1,21 +1 @@
-import '../styles/metadata-field-configurator.css';var e = {
-	fieldset: "_fieldset_vz23z_1",
-	expandedContent: "_expandedContent_vz23z_7",
-	basic: "_basic_vz23z_13",
-	fieldTypeSelect: "_fieldTypeSelect_vz23z_18",
-	typeSpecific: "_typeSpecific_vz23z_22",
-	description: "_description_vz23z_29",
-	labelWithTooltip: "_labelWithTooltip_vz23z_34",
-	fieldActionSlot: "_fieldActionSlot_vz23z_39",
-	expandedToolbarActions: "_expandedToolbarActions_vz23z_46",
-	extensionTabsContainer: "_extensionTabsContainer_vz23z_52",
-	extensionContent: "_extensionContent_vz23z_58",
-	fieldCollapsedText: "_fieldCollapsedText_vz23z_62",
-	expanded: "_expanded_vz23z_7",
-	contextMenuWithCollapsedText: "_contextMenuWithCollapsedText_vz23z_71",
-	fieldAccordionItem: "_fieldAccordionItem_vz23z_77",
-	fieldContextMenu: "_fieldContextMenu_vz23z_84",
-	menuOpen: "_menuOpen_vz23z_87",
-	hiddenBadge: "_hiddenBadge_vz23z_106"
-};
-export { e as t };
+import '../styles/metadata-field-configurator.css';var metadata_field_configurator_module_default={fieldset:`_fieldset_vz23z_1`,expandedContent:`_expandedContent_vz23z_7`,basic:`_basic_vz23z_13`,fieldTypeSelect:`_fieldTypeSelect_vz23z_18`,typeSpecific:`_typeSpecific_vz23z_22`,description:`_description_vz23z_29`,labelWithTooltip:`_labelWithTooltip_vz23z_34`,fieldActionSlot:`_fieldActionSlot_vz23z_39`,expandedToolbarActions:`_expandedToolbarActions_vz23z_46`,extensionTabsContainer:`_extensionTabsContainer_vz23z_52`,extensionContent:`_extensionContent_vz23z_58`,fieldCollapsedText:`_fieldCollapsedText_vz23z_62`,expanded:`_expanded_vz23z_7`,contextMenuWithCollapsedText:`_contextMenuWithCollapsedText_vz23z_71`,fieldAccordionItem:`_fieldAccordionItem_vz23z_77`,fieldContextMenu:`_fieldContextMenu_vz23z_84`,menuOpen:`_menuOpen_vz23z_87`,hiddenBadge:`_hiddenBadge_vz23z_106`};export{metadata_field_configurator_module_default as t};