@box/metadata-taxonomy-picker 3.2.15 → 3.3.0

package/dist/chunks/loading-state.js

@@ -1 +1 @@
-import"../esm/lib/constants.js";import{messages}from"../esm/lib/components/taxonomy-items-list/messages.js";import{useIntl}from"react-intl";import{Ghost}from"@box/blueprint-web";import{jsx}from"react/jsx-runtime";import '../styles/loading-state.css';var loading_state_module_default={root:`_root_t50cx_1`};function LoadingState(){let{formatMessage}=useIntl();return jsx(`div`,{"aria-busy":`true`,"aria-label":formatMessage(messages.loadingAriaLabel),className:loading_state_module_default.root,role:`status`,children:Array.from({length:9},(_,i)=>jsx(Ghost,{height:16},i))})}export{LoadingState as t};
+import"../esm/lib/constants.js";import{messages}from"../esm/lib/components/taxonomy-items-list/messages.js";import{forwardRef}from"react";import{useIntl}from"react-intl";import{Ghost}from"@box/blueprint-web";import{jsx}from"react/jsx-runtime";import '../styles/loading-state.css';var loading_state_module_default={root:`_root_bi5pr_1`},LoadingState=forwardRef(function(_props,ref){let{formatMessage}=useIntl();return jsx(`div`,{ref,"aria-busy":`true`,"aria-label":formatMessage(messages.loadingAriaLabel),className:loading_state_module_default.root,role:`status`,tabIndex:-1,children:Array.from({length:9},(_,i)=>jsx(Ghost,{height:16},i))})});export{LoadingState as t};

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

@@ -1 +1 @@
-import{BREADCRUMB_ROOT_ID}from"../esm/lib/constants.js";import{useTaxonomyPickerController}from"../esm/lib/hooks/use-taxonomy-picker-controller.js";import{t as TaxonomyItemsList}from"./taxonomy-items-list.js";import{t as TaxonomyLevelFilter}from"./taxonomy-level-filter.js";import{messages}from"../esm/lib/components/metadata-taxonomy-picker-shell/messages.js";import{forwardRef,useCallback,useEffect,useId,useLayoutEffect,useMemo,useRef,useState}from"react";import clsx from"clsx";import{useIntl}from"react-intl";import{Breadcrumb,ChipsGroup,IconButton,InputChip,Popover,Text,useForkRef}from"@box/blueprint-web";import{Search,XMark}from"@box/blueprint-web-assets/icons/Fill";import{jsx,jsxs}from"react/jsx-runtime";import '../styles/metadata-taxonomy-picker-shell.css';var TaxonomyPickerMode=function(TaxonomyPickerMode){return TaxonomyPickerMode.SingleLevel=`single-level`,TaxonomyPickerMode.MultiLevel=`multi-level`,TaxonomyPickerMode}({}),metadata_taxonomy_picker_shell_module_default={container:`_container_1nb7h_27`,label:`_label_1nb7h_34`,trigger:`_trigger_1nb7h_38`,searchInput:`_searchInput_1nb7h_55`,chips:`_chips_1nb7h_67`,searchIcon:`_searchIcon_1nb7h_117`,popover:`_popover_1nb7h_126`,clearButton:`_clearButton_1nb7h_134`,breadcrumbContainer:`_breadcrumbContainer_1nb7h_138`};function getLatestSelectableLevel(levels){let latest=null;for(let level of levels)level.selectable!==!1&&(latest===null||level.level>latest)&&(latest=level.level);return latest}var EMPTY_LEVELS=[];function resolvePortalContainer(portalElement){if(portalElement!=null)return(typeof portalElement==`function`?portalElement():portalElement)??void 0}var MetadataTaxonomyPickerShell=forwardRef(function({itemsService,eventService,levels=EMPTY_LEVELS,mode,multiSelect,value,onValueChange,placeholder,disabled=!1,label,containerClassName,portalElement},forwardedRef){let{formatMessage}=useIntl(),inputId=useId(),listboxId=`${inputId}-listbox`,inputRef=useRef(null),mergedInputRef=useForkRef(inputRef,forwardedRef),triggerRef=useRef(null),listRef=useRef(null),[popoverContentElement,setPopoverContentElement]=useState(null),savedScrollTopRef=useRef(0),wasSearchModeRef=useRef(!1),portalContainer=resolvePortalContainer(portalElement),isSingleLevelMode=mode===TaxonomyPickerMode.SingleLevel,{state,isOpen,handleOpenChange,handleInputValueChange,actions}=useTaxonomyPickerController(itemsService,levels,eventService),{items,levelStack}=state,{drillDown,navigateBack,loadMore,setSearchScopeOverride}=actions,isSearchMode=state.searchInputValue!==``,latestSelectableLevel=useMemo(()=>getLatestSelectableLevel(state.availableLevels),[state.availableLevels]);useEffect(()=>{setSearchScopeOverride(isSingleLevelMode&&latestSelectableLevel!==null?{parentId:null,levelFilter:latestSelectableLevel}:void 0)},[isSingleLevelMode,latestSelectableLevel,setSearchScopeOverride]);let[inputDisplayValue,setInputDisplayValue]=useState(``),isComposingRef=useRef(!1),handleCompositionStart=useCallback(()=>{isComposingRef.current=!0},[]),handleCompositionEnd=useCallback(e=>{isComposingRef.current=!1,handleInputValueChange(e.target.value)},[handleInputValueChange]);useLayoutEffect(()=>{isComposingRef.current?state.searchInputValue===``&&(isComposingRef.current=!1,setInputDisplayValue(``)):setInputDisplayValue(state.searchInputValue)},[state.searchInputValue]),useLayoutEffect(()=>{let rafId;return!isSearchMode&&wasSearchModeRef.current&&(rafId=requestAnimationFrame(()=>{listRef.current?.scrollTo(savedScrollTopRef.current)})),wasSearchModeRef.current=isSearchMode,()=>{rafId!==void 0&&cancelAnimationFrame(rafId)}},[isSearchMode]);let selectedIds=useMemo(()=>new Set(value.map(v=>v.id)),[value]),singleSelectValue=useMemo(()=>!multiSelect&&value.length===1?value[0].id:``,[multiSelect,value]),handleSelect=useCallback((id,closeAfterSelect=!0)=>{let node=items.find(n=>n.id===id);if(!node||!node.selectable)return;let newValue={id:node.id,displayName:node.displayName,level:node.level,ancestors:node.ancestors};multiSelect?onValueChange(selectedIds.has(id)?value.filter(v=>v.id!==id):[...value,newValue]):(onValueChange([newValue]),closeAfterSelect&&handleOpenChange(!1))},[items,multiSelect,selectedIds,value,onValueChange,handleOpenChange]),handleSearchSelect=useCallback((id,closeOnSelection=!0)=>{let result=state.searchResults.find(r=>r.id===id);if(!result||!result.selectable)return;let newValue={id:result.id,displayName:result.displayName,level:result.level,ancestors:result.ancestors};multiSelect?onValueChange(selectedIds.has(id)?value.filter(v=>v.id!==id):[...value,newValue]):(onValueChange([newValue]),closeOnSelection!==!1&&handleOpenChange(!1))},[state.searchResults,multiSelect,selectedIds,value,onValueChange,handleOpenChange]),handleSearchDrillDown=useCallback(id=>{let result=state.searchResults.find(r=>r.id===id);result&&actions.drillDown({id:result.id,displayName:result.displayName,ancestors:result.ancestors})},[state.searchResults,actions]),handleDrillDown=useCallback(id=>{let node=state.items.find(n=>n.id===id);node&&drillDown({id:node.id,displayName:node.displayName})},[state.items,drillDown]),computeShowDrillDown=useCallback(node=>!(!node.hasChildren||isSingleLevelMode&&latestSelectableLevel!==null&&node.level>=latestSelectableLevel),[isSingleLevelMode,latestSelectableLevel]),menuItems=useMemo(()=>items.map(node=>({id:node.id,displayName:node.displayName,selectable:node.selectable,multiSelect,isSelected:selectedIds.has(node.id),showDrillDown:computeShowDrillDown(node),ancestors:node.ancestors,onSelect:handleSelect,onDrillDown:handleDrillDown})),[items,multiSelect,selectedIds,computeShowDrillDown,handleSelect,handleDrillDown]),breadcrumbCrumbs=useMemo(()=>levelStack.length===0?[]:[{id:BREADCRUMB_ROOT_ID,name:formatMessage(messages.breadcrumbRootLabel)},...levelStack.map(entry=>({id:entry.id,name:entry.displayName}))],[levelStack,formatMessage]),handleBreadcrumbClick=useCallback(crumbId=>{navigateBack(crumbId===`__breadcrumb_root__`?null:crumbId)},[navigateBack]),showLevelFilter=!isSingleLevelMode&&isSearchMode&&state.availableLevels.length>1,searchMenuItems=useMemo(()=>state.searchResults.map(result=>({id:result.id,displayName:result.displayName,selectable:result.selectable,multiSelect,isSelected:selectedIds.has(result.id),showDrillDown:computeShowDrillDown(result),ancestors:result.ancestors,onSelect:handleSearchSelect,onDrillDown:handleSearchDrillDown})),[state.searchResults,multiSelect,selectedIds,computeShowDrillDown,handleSearchSelect,handleSearchDrillDown]),handleContainerClick=useCallback(event=>{event.target===event.currentTarget&&inputRef.current?.focus()},[inputRef]),hasValues=value.length>0,placeholderText=placeholder??formatMessage(messages.placeholder),handleTriggerMouseDown=e=>{!disabled&&e.target===e.currentTarget&&(e.preventDefault(),inputRef.current?.focus())},handleInputFocus=()=>{!disabled&&!isOpen&&handleOpenChange(!0)},handleClearSingleSelect=useCallback(()=>{disabled||(onValueChange([]),handleInputValueChange(``))},[disabled,onValueChange,handleInputValueChange]),handleInputChange=e=>{!isSearchMode&&e.target.value&&(savedScrollTopRef.current=listRef.current?.getScrollTop()??0),setInputDisplayValue(e.target.value),isComposingRef.current||handleInputValueChange(e.target.value)},handleRemoveValue=removed=>{disabled||onValueChange(value.filter(v=>v.id!==removed.id))};return jsxs(Popover.Root,{modal:!1,onOpenChange:handleOpenChange,open:isOpen,children:[jsx(Popover.Anchor,{children:jsxs(`div`,{className:clsx(metadata_taxonomy_picker_shell_module_default.container,containerClassName),children:[label&&jsx(Text,{as:`label`,className:metadata_taxonomy_picker_shell_module_default.label,htmlFor:inputId,variant:`bodyDefaultBold`,children:label}),jsxs(`div`,{className:metadata_taxonomy_picker_shell_module_default.trigger,"data-disabled":disabled,onMouseDown:handleTriggerMouseDown,ref:triggerRef,children:[multiSelect&&hasValues&&jsx(ChipsGroup,{className:metadata_taxonomy_picker_shell_module_default.chips,onClick:handleContainerClick,children:value.map(v=>jsx(InputChip,{label:v.displayName,onDelete:()=>handleRemoveValue(v),tabIndex:disabled?-1:void 0},v.id))}),!multiSelect&&hasValues&&jsx(InputChip,{label:value[0].displayName,tabIndex:disabled?-1:void 0}),jsx(`input`,{"aria-controls":listboxId,"aria-expanded":isOpen,"aria-haspopup":`listbox`,className:metadata_taxonomy_picker_shell_module_default.searchInput,disabled,id:inputId,onChange:handleInputChange,onCompositionStart:handleCompositionStart,onCompositionEnd:handleCompositionEnd,onFocus:handleInputFocus,placeholder:hasValues?void 0:placeholderText,ref:mergedInputRef,role:`combobox`,type:`text`,value:inputDisplayValue}),!multiSelect&&hasValues&&jsx(IconButton,{"aria-label":formatMessage(messages.clearAriaLabel),className:metadata_taxonomy_picker_shell_module_default.clearButton,icon:XMark,size:`x-small`,tabIndex:disabled?-1:void 0,onClick:handleClearSingleSelect}),jsx(Search,{"aria-hidden":`true`,className:metadata_taxonomy_picker_shell_module_default.searchIcon,role:`presentation`})]})]})}),jsxs(Popover.ContentContainer,{align:`start`,className:metadata_taxonomy_picker_shell_module_default.popover,container:portalContainer,onInteractOutside:e=>{triggerRef.current?.contains(e.target)&&e.preventDefault()},onOpenAutoFocus:e=>e.preventDefault(),ref:setPopoverContentElement,children:[breadcrumbCrumbs.length>0&&!isSearchMode&&jsx(`div`,{className:metadata_taxonomy_picker_shell_module_default.breadcrumbContainer,children:jsx(Breadcrumb,{breadcrumbAriaLabel:formatMessage(messages.breadcrumbAriaLabel),crumbs:breadcrumbCrumbs,onPageLinkClick:handleBreadcrumbClick,rootIconVariant:`taxonomy`,isInteractive:!disabled,isResponsiveEnabled:!1,size:`small`,truncatedLinksIconAriaLabel:formatMessage(messages.breadcrumbTruncatedLinksLabel),truncationMethod:`folder-tree`})}),showLevelFilter&&jsx(TaxonomyLevelFilter,{availableLevels:levels,container:popoverContentElement,levelFilter:state.levelFilter,onLevelFilterChange:actions.setLevelFilter}),jsx(TaxonomyItemsList,{error:isSearchMode?state.searchError:state.initialLoadError,estimatedRowHeight:isSearchMode?44:void 0,hasMore:isSearchMode?state.searchNextMarker!==void 0:state.itemsNextMarker!==void 0,hasVariableRowHeight:isSearchMode,isFetching:isSearchMode?state.isFetchingSearch:state.isFetching,isFetchingMore:isSearchMode?state.isFetchingSearchMore:state.isFetchingMore,isSearchMode,items:isSearchMode?searchMenuItems:menuItems,listboxId,loadMoreError:isSearchMode?state.searchLoadMoreError:state.loadMoreError,multiSelect,onFocusExit:()=>inputRef.current?.focus(),onLoadMore:isSearchMode?actions.searchLoadMore:loadMore,onRetry:actions.retry,ref:listRef,selectedValue:singleSelectValue})]})]})});export{TaxonomyPickerMode as n,MetadataTaxonomyPickerShell as t};
+import{BREADCRUMB_ROOT_ID}from"../esm/lib/constants.js";import{useTaxonomyPickerController}from"../esm/lib/hooks/use-taxonomy-picker-controller.js";import{t as TaxonomyItemsList}from"./taxonomy-items-list.js";import{t as TaxonomyLevelFilter}from"./taxonomy-level-filter.js";import{messages}from"../esm/lib/components/metadata-taxonomy-picker-shell/messages.js";import{forwardRef,useCallback,useEffect,useId,useLayoutEffect,useMemo,useRef,useState}from"react";import clsx from"clsx";import{useIntl}from"react-intl";import{Breadcrumb,ChipsGroup,IconButton,InputChip,Popover,Text,useForkRef}from"@box/blueprint-web";import{Search,XMark}from"@box/blueprint-web-assets/icons/Fill";import{jsx,jsxs}from"react/jsx-runtime";import '../styles/metadata-taxonomy-picker-shell.css';var TaxonomyPickerMode=function(TaxonomyPickerMode){return TaxonomyPickerMode.SingleLevel=`single-level`,TaxonomyPickerMode.MultiLevel=`multi-level`,TaxonomyPickerMode}({}),metadata_taxonomy_picker_shell_module_default={container:`_container_b9ux1_27`,label:`_label_b9ux1_34`,trigger:`_trigger_b9ux1_38`,clearButton:`_clearButton_b9ux1_57`,searchInput:`_searchInput_b9ux1_63`,chips:`_chips_b9ux1_75`,endActions:`_endActions_b9ux1_125`,searchIcon:`_searchIcon_b9ux1_136`,popover:`_popover_b9ux1_144`,breadcrumbContainer:`_breadcrumbContainer_b9ux1_156`};function getLatestSelectableLevel(levels){let latest=null;for(let level of levels)level.selectable!==!1&&(latest===null||level.level>latest)&&(latest=level.level);return latest}var EMPTY_LEVELS=[];function resolvePortalContainer(portalElement){if(portalElement!=null)return(typeof portalElement==`function`?portalElement():portalElement)??void 0}var MetadataTaxonomyPickerShell=forwardRef(function({itemsService,eventService,levels=EMPTY_LEVELS,mode,multiSelect,value,onValueChange,placeholder,disabled=!1,label,containerClassName,portalElement},forwardedRef){let{formatMessage}=useIntl(),inputId=useId(),listboxId=`${inputId}-listbox`,inputRef=useRef(null),mergedInputRef=useForkRef(inputRef,forwardedRef),triggerRef=useRef(null),listRef=useRef(null),[popoverContentElement,setPopoverContentElement]=useState(null),savedScrollTopRef=useRef(0),wasSearchModeRef=useRef(!1),pendingListFocusRef=useRef(null),portalContainer=resolvePortalContainer(portalElement),isSingleLevelMode=mode===TaxonomyPickerMode.SingleLevel,{state,isOpen,handleOpenChange,handleInputValueChange,actions}=useTaxonomyPickerController(itemsService,levels,eventService),{items,levelStack}=state,{drillDown,navigateBack,loadMore,setSearchScopeOverride}=actions,isSearchMode=state.searchInputValue!==``,latestSelectableLevel=useMemo(()=>getLatestSelectableLevel(state.availableLevels),[state.availableLevels]);useEffect(()=>{setSearchScopeOverride(isSingleLevelMode&&latestSelectableLevel!==null?{parentId:null,levelFilter:latestSelectableLevel}:void 0)},[isSingleLevelMode,latestSelectableLevel,setSearchScopeOverride]);let[inputDisplayValue,setInputDisplayValue]=useState(``),isComposingRef=useRef(!1),handleCompositionStart=useCallback(()=>{isComposingRef.current=!0},[]),handleCompositionEnd=useCallback(e=>{isComposingRef.current=!1,handleInputValueChange(e.target.value)},[handleInputValueChange]);useLayoutEffect(()=>{isComposingRef.current?state.searchInputValue===``&&(isComposingRef.current=!1,setInputDisplayValue(``)):setInputDisplayValue(state.searchInputValue)},[state.searchInputValue]),useLayoutEffect(()=>{let rafId;return!isSearchMode&&wasSearchModeRef.current&&(rafId=requestAnimationFrame(()=>{listRef.current?.scrollTo(savedScrollTopRef.current)})),wasSearchModeRef.current=isSearchMode,()=>{rafId!==void 0&&cancelAnimationFrame(rafId)}},[isSearchMode]);let selectedIds=useMemo(()=>new Set(value.map(v=>v.id)),[value]),singleSelectValue=useMemo(()=>!multiSelect&&value.length===1?value[0].id:``,[multiSelect,value]),handleSelect=useCallback((id,closeAfterSelect=!0)=>{let node=items.find(n=>n.id===id);if(!node||!node.selectable)return;let newValue={id:node.id,displayName:node.displayName,level:node.level,ancestors:node.ancestors};multiSelect?onValueChange(selectedIds.has(id)?value.filter(v=>v.id!==id):[...value,newValue]):(onValueChange([newValue]),closeAfterSelect&&handleOpenChange(!1))},[items,multiSelect,selectedIds,value,onValueChange,handleOpenChange]),handleSearchSelect=useCallback((id,closeOnSelection=!0)=>{let result=state.searchResults.find(r=>r.id===id);if(!result||!result.selectable)return;let newValue={id:result.id,displayName:result.displayName,level:result.level,ancestors:result.ancestors};multiSelect?(onValueChange(selectedIds.has(id)?value.filter(v=>v.id!==id):[...value,newValue]),handleInputValueChange(``),inputRef.current?.focus()):(onValueChange([newValue]),closeOnSelection!==!1&&handleOpenChange(!1))},[state.searchResults,multiSelect,selectedIds,value,onValueChange,handleOpenChange,handleInputValueChange]),handleSearchDrillDown=useCallback(id=>{let result=state.searchResults.find(r=>r.id===id);result&&actions.drillDown({id:result.id,displayName:result.displayName,ancestors:result.ancestors})},[state.searchResults,actions]),handleDrillDown=useCallback(id=>{let node=state.items.find(n=>n.id===id);node&&drillDown({id:node.id,displayName:node.displayName})},[state.items,drillDown]),computeShowDrillDown=useCallback(node=>!(!node.hasChildren||isSingleLevelMode&&latestSelectableLevel!==null&&node.level>=latestSelectableLevel),[isSingleLevelMode,latestSelectableLevel]),menuItems=useMemo(()=>items.map(node=>({id:node.id,displayName:node.displayName,selectable:node.selectable,multiSelect,isSelected:selectedIds.has(node.id),showDrillDown:computeShowDrillDown(node),ancestors:node.ancestors,onSelect:handleSelect,onDrillDown:handleDrillDown})),[items,multiSelect,selectedIds,computeShowDrillDown,handleSelect,handleDrillDown]),breadcrumbCrumbs=useMemo(()=>levelStack.length===0?[]:[{id:BREADCRUMB_ROOT_ID,name:formatMessage(messages.breadcrumbRootLabel)},...levelStack.map(entry=>({id:entry.id,name:entry.displayName}))],[levelStack,formatMessage]),handleBreadcrumbClick=useCallback(crumbId=>{navigateBack(crumbId===`__breadcrumb_root__`?null:crumbId)},[navigateBack]),showLevelFilter=!isSingleLevelMode&&isSearchMode&&state.availableLevels.length>1,searchMenuItems=useMemo(()=>state.searchResults.map(result=>({id:result.id,displayName:result.displayName,selectable:result.selectable,multiSelect,isSelected:selectedIds.has(result.id),showDrillDown:computeShowDrillDown(result),ancestors:result.ancestors,onSelect:handleSearchSelect,onDrillDown:handleSearchDrillDown})),[state.searchResults,multiSelect,selectedIds,computeShowDrillDown,handleSearchSelect,handleSearchDrillDown]),handleContainerClick=useCallback(event=>{event.target===event.currentTarget&&inputRef.current?.focus()},[inputRef]),hasValues=value.length>0,placeholderText=placeholder??formatMessage(messages.placeholder),handleTriggerMouseDown=e=>{!disabled&&e.target===e.currentTarget&&(e.preventDefault(),inputRef.current?.focus())},cancelPendingListFocus=useCallback(()=>{pendingListFocusRef.current=null,listRef.current?.cancelPendingFocus()},[]),handleInputFocus=()=>{cancelPendingListFocus(),!disabled&&!isOpen&&handleOpenChange(!0)};useEffect(()=>{isOpen||(pendingListFocusRef.current=null)},[isOpen]);let handleClearSelection=useCallback(()=>{disabled||(onValueChange([]),handleInputValueChange(``))},[disabled,onValueChange,handleInputValueChange]),requestListFocus=useCallback(which=>listRef.current?.focusItem(which)??!1,[]),breadcrumbRegionRef=useRef(null),levelFilterRegionRef=useRef(null),getPopoverHeaderFocusables=useCallback(()=>{let root=breadcrumbRegionRef.current??levelFilterRegionRef.current;return root?Array.from(root.querySelectorAll(`button:not([disabled]), [href], input:not([disabled])`)).filter(el=>el.getAttribute(`aria-hidden`)!==`true`):[]},[]),handleFocusExitToHeaderOrInput=useCallback(()=>{let focusables=getPopoverHeaderFocusables();if(focusables.length>0){focusables[focusables.length-1].focus();return}inputRef.current?.focus()},[getPopoverHeaderFocusables]),moveFocusToListFirstRow=useCallback(()=>{requestListFocus(`first`)},[requestListFocus]),handlePopoverHeaderTabKey=useCallback(e=>{if(e.key!==`Tab`)return;let active=document.activeElement;if(!active)return;let focusables=getPopoverHeaderFocusables(),activeIndex=focusables.findIndex(el=>el===active||el.contains(active));if(e.shiftKey&&(activeIndex<=0||focusables.length===0)){e.preventDefault(),e.stopPropagation(),inputRef.current?.focus();return}!e.shiftKey&&(activeIndex===-1||activeIndex===focusables.length-1)&&(e.preventDefault(),e.stopPropagation(),moveFocusToListFirstRow())},[getPopoverHeaderFocusables,moveFocusToListFirstRow]),handleBreadcrumbKeyDown=useCallback(e=>{let root=breadcrumbRegionRef.current,active=document.activeElement;if(!(!root||!active||!root.contains(active))){if(e.key===`ArrowDown`){e.preventDefault(),e.stopPropagation(),moveFocusToListFirstRow();return}handlePopoverHeaderTabKey(e)}},[moveFocusToListFirstRow,handlePopoverHeaderTabKey]),handleLevelFilterKeyDown=useCallback(e=>{let root=levelFilterRegionRef.current,active=document.activeElement;!root||!active||!root.contains(active)||handlePopoverHeaderTabKey(e)},[handlePopoverHeaderTabKey]);useEffect(()=>{if(!isOpen)return;let pending=pendingListFocusRef.current;pending&&(pendingListFocusRef.current=null,requestListFocus(pending))},[isOpen,requestListFocus]);let levelFocusKey=state.currentParentId??`root`,previousLevelFocusKeyRef=useRef(levelFocusKey);useLayoutEffect(()=>{if(!isOpen){previousLevelFocusKeyRef.current=levelFocusKey;return}if(previousLevelFocusKeyRef.current!==levelFocusKey){if(previousLevelFocusKeyRef.current=levelFocusKey,document.activeElement===inputRef.current){cancelPendingListFocus();return}listRef.current?.holdFocusDuringLoad(),requestListFocus(`first`)}},[isOpen,levelFocusKey,requestListFocus,cancelPendingListFocus]);let handleInputKeyDown=useCallback(e=>{if(!disabled){if(e.key===`ArrowDown`||e.key===`ArrowUp`){e.preventDefault();let which=e.key===`ArrowDown`?`first`:`last`;if(!isOpen){pendingListFocusRef.current=which,handleOpenChange(!0);return}requestListFocus(which);return}if(e.key===`Tab`&&isOpen){handleOpenChange(!1);return}e.key===`Enter`&&!isOpen&&(e.preventDefault(),handleOpenChange(!0))}},[disabled,isOpen,handleOpenChange,requestListFocus]),handleInputChange=e=>{cancelPendingListFocus(),!isSearchMode&&e.target.value&&(savedScrollTopRef.current=listRef.current?.getScrollTop()??0),setInputDisplayValue(e.target.value),isComposingRef.current||handleInputValueChange(e.target.value)},handleRemoveValue=removed=>{disabled||onValueChange(value.filter(v=>v.id!==removed.id))};return jsxs(Popover.Root,{modal:!1,onOpenChange:handleOpenChange,open:isOpen,children:[jsx(Popover.Anchor,{children:jsxs(`div`,{className:clsx(metadata_taxonomy_picker_shell_module_default.container,containerClassName),children:[label&&jsx(Text,{as:`label`,className:metadata_taxonomy_picker_shell_module_default.label,htmlFor:inputId,variant:`bodyDefaultBold`,children:label}),jsxs(`div`,{className:metadata_taxonomy_picker_shell_module_default.trigger,"data-disabled":disabled,"data-taxonomy-picker-trigger":``,onMouseDown:handleTriggerMouseDown,ref:triggerRef,children:[multiSelect&&hasValues&&jsx(ChipsGroup,{className:metadata_taxonomy_picker_shell_module_default.chips,onClick:handleContainerClick,children:value.map(v=>jsx(InputChip,{label:v.displayName,onDelete:()=>handleRemoveValue(v),tabIndex:disabled?-1:void 0},v.id))}),!multiSelect&&hasValues&&jsx(InputChip,{label:value[0].displayName,tabIndex:disabled?-1:void 0}),jsx(`input`,{"aria-controls":listboxId,"aria-expanded":isOpen,"aria-haspopup":`listbox`,className:metadata_taxonomy_picker_shell_module_default.searchInput,disabled,id:inputId,onChange:handleInputChange,onCompositionStart:handleCompositionStart,onCompositionEnd:handleCompositionEnd,onFocus:handleInputFocus,onKeyDown:handleInputKeyDown,placeholder:hasValues?void 0:placeholderText,ref:mergedInputRef,role:`combobox`,type:`text`,value:inputDisplayValue}),jsxs(`div`,{className:metadata_taxonomy_picker_shell_module_default.endActions,children:[hasValues&&jsx(IconButton,{"aria-label":formatMessage(multiSelect?messages.clearAllAriaLabel:messages.clearAriaLabel),className:metadata_taxonomy_picker_shell_module_default.clearButton,icon:XMark,size:`x-small`,tabIndex:disabled?-1:void 0,onClick:handleClearSelection}),jsx(Search,{"aria-hidden":`true`,className:metadata_taxonomy_picker_shell_module_default.searchIcon,role:`presentation`})]})]})]})}),jsxs(Popover.ContentContainer,{align:`start`,className:metadata_taxonomy_picker_shell_module_default.popover,container:portalContainer,onInteractOutside:e=>{triggerRef.current?.contains(e.target)&&e.preventDefault()},onOpenAutoFocus:e=>e.preventDefault(),ref:setPopoverContentElement,children:[breadcrumbCrumbs.length>0&&!isSearchMode&&jsx(`div`,{className:metadata_taxonomy_picker_shell_module_default.breadcrumbContainer,onKeyDownCapture:handleBreadcrumbKeyDown,ref:breadcrumbRegionRef,children:jsx(Breadcrumb,{breadcrumbAriaLabel:formatMessage(messages.breadcrumbAriaLabel),crumbs:breadcrumbCrumbs,onPageLinkClick:handleBreadcrumbClick,rootIconVariant:`taxonomy`,isInteractive:!disabled,isResponsiveEnabled:!1,size:`small`,truncatedLinksIconAriaLabel:formatMessage(messages.breadcrumbTruncatedLinksLabel),truncationMethod:`folder-tree`})}),showLevelFilter&&jsx(`div`,{onKeyDownCapture:handleLevelFilterKeyDown,ref:levelFilterRegionRef,children:jsx(TaxonomyLevelFilter,{availableLevels:levels,container:popoverContentElement,levelFilter:state.levelFilter,onLevelFilterChange:actions.setLevelFilter})}),jsx(TaxonomyItemsList,{error:isSearchMode?state.searchError:state.initialLoadError,estimatedRowHeight:isSearchMode?44:void 0,hasMore:isSearchMode?state.searchNextMarker!==void 0:state.itemsNextMarker!==void 0,hasVariableRowHeight:isSearchMode,isFetching:isSearchMode?state.isFetchingSearch:state.isFetching,isFetchingMore:isSearchMode?state.isFetchingSearchMore:state.isFetchingMore,isSearchMode,items:isSearchMode?searchMenuItems:menuItems,listboxId,loadMoreError:isSearchMode?state.searchLoadMoreError:state.loadMoreError,multiSelect,onFocusExit:handleFocusExitToHeaderOrInput,onLoadMore:isSearchMode?actions.searchLoadMore:loadMore,onRetry:actions.retry,ref:listRef,selectedValue:singleSelectValue})]})]})});export{TaxonomyPickerMode as n,MetadataTaxonomyPickerShell as t};

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

@@ -1 +1 @@
-import"../esm/lib/constants.js";import{t as EmptyListState}from"./empty-state.js";import{t as ErrorState}from"./error-state.js";import{t as LoadingState}from"./loading-state.js";import{t as TaxonomyMenuItem}from"./taxonomy-menu-item.js";import{t as LoadMoreErrorRow}from"./load-more-error-row.js";import{t as LoadMoreLoadingRow}from"./load-more-loading-row.js";import{forwardRef,memo,useCallback,useEffect,useImperativeHandle,useLayoutEffect,useRef}from"react";import{Radio}from"@box/blueprint-web";import{jsx,jsxs}from"react/jsx-runtime";import{Composite,CompositeProvider}from"@ariakit/react";import{useVirtualizer}from"@tanstack/react-virtual";import '../styles/taxonomy-items-list.css';var taxonomy_items_list_module_default={scrollContainer:`_scrollContainer_lky3p_1`,virtualContent:`_virtualContent_lky3p_11`,virtualRow:`_virtualRow_lky3p_23`},RadioGroupWrapper=memo(function({children,selectedValue,onValueChange}){let lastKeyRef=useRef(null),handleKeyDown=useCallback(e=>{lastKeyRef.current=e.key},[]),handleValueChange=useCallback(value=>{let isArrowNavigation=lastKeyRef.current===`ArrowUp`||lastKeyRef.current===`ArrowDown`;lastKeyRef.current=null,onValueChange(value,!isArrowNavigation)},[onValueChange]);return jsx(Radio.Group,{name:`taxonomy-picker`,onKeyDown:handleKeyDown,onValueChange:handleValueChange,value:selectedValue,children})}),measureElement=element=>element.getBoundingClientRect().height,LOAD_MORE_VIRTUAL_KEY=`__load-more-skeleton__`,TaxonomyItemsList=forwardRef(function({items,multiSelect,selectedValue,estimatedRowHeight=36,hasVariableRowHeight=!1,isSearchMode=!1,isFetching,error,loadMoreError=null,listboxId,onFocusExit,onRetry,hasMore=!1,isFetchingMore=!1,onLoadMore},ref){let scrollRef=useRef(null);useImperativeHandle(ref,()=>({getScrollTop:()=>scrollRef.current?.scrollTop??0,scrollTo:top=>{scrollRef.current&&(scrollRef.current.scrollTop=top)}}),[]);let showLoadingSlot=isFetchingMore,virtualCount=items.length+ +!!showLoadingSlot,estimateSize=useCallback(index=>index>=items.length?112:estimatedRowHeight,[estimatedRowHeight,items.length]),getItemKey=useCallback(index=>index>=items.length?LOAD_MORE_VIRTUAL_KEY:items[index].id,[items]),handleRadioGroupChange=useCallback((nextValue,closeAfterSelect)=>{let target=items.find(item=>item.id===nextValue);target?.selectable&&target.onSelect(nextValue,closeAfterSelect)},[items]),virtualizer=useVirtualizer({count:virtualCount,getScrollElement:()=>scrollRef.current,estimateSize,gap:1,overscan:20,getItemKey,measureElement}),previousItemsLengthRef=useRef(items.length),preCommitScrollTopRef=useRef(null);items.length!==previousItemsLengthRef.current&&(items.length>previousItemsLengthRef.current&&scrollRef.current&&(preCommitScrollTopRef.current=scrollRef.current.scrollTop),previousItemsLengthRef.current=items.length),useLayoutEffect(()=>{let targetScrollTop=preCommitScrollTopRef.current;if(preCommitScrollTopRef.current=null,targetScrollTop===null)return;let scrollContainer=scrollRef.current;scrollContainer&&scrollContainer.scrollTop!==targetScrollTop&&(scrollContainer.scrollTop=targetScrollTop)});let onLoadMoreRef=useRef(onLoadMore);onLoadMoreRef.current=onLoadMore;let canLoadMoreRef=useRef(!1);canLoadMoreRef.current=hasMore&&!isFetchingMore&&loadMoreError===null&&!!onLoadMore;let showSkeleton=isFetching&&items.length===0,showError=!isFetching&&error!==null,showEmpty=!isFetching&&error===null&&items.length===0;if(useEffect(()=>{let scrollContainer=scrollRef.current;if(!scrollContainer)return;let rafId=0,maybeLoadMore=()=>{canLoadMoreRef.current&&scrollContainer.scrollHeight-scrollContainer.scrollTop-scrollContainer.clientHeight<=200&&onLoadMoreRef.current?.()},handleScroll=()=>{cancelAnimationFrame(rafId),rafId=requestAnimationFrame(maybeLoadMore)};return scrollContainer.addEventListener(`scroll`,handleScroll,{passive:!0}),rafId=requestAnimationFrame(maybeLoadMore),()=>{scrollContainer.removeEventListener(`scroll`,handleScroll),cancelAnimationFrame(rafId)}},[items.length]),showSkeleton)return jsx(LoadingState,{});if(showError)return jsx(ErrorState,{onRetry});if(showEmpty)return jsx(EmptyListState,{isSearchMode});let compositeRows=jsx(CompositeProvider,{children:jsx(Composite,{children:jsx(`div`,{className:taxonomy_items_list_module_default.virtualContent,style:{height:virtualizer.getTotalSize()},children:virtualizer.getVirtualItems().map(virtualRow=>{if(virtualRow.index>=items.length)return jsx(`div`,{ref:virtualizer.measureElement,className:taxonomy_items_list_module_default.virtualRow,"data-index":virtualRow.index,style:{transform:`translateY(${virtualRow.start}px)`},children:jsx(LoadMoreLoadingRow,{})},virtualRow.key);let itemProps=items[virtualRow.index];return jsx(`div`,{ref:hasVariableRowHeight?virtualizer.measureElement:void 0,className:taxonomy_items_list_module_default.virtualRow,"data-index":virtualRow.index,style:{transform:`translateY(${virtualRow.start}px)`},children:jsx(TaxonomyMenuItem,{...itemProps,onFocusExit:virtualRow.index===0?onFocusExit:void 0,isSearchMode})},virtualRow.key)})})})});return jsxs(`div`,{ref:scrollRef,"aria-multiselectable":multiSelect||void 0,className:taxonomy_items_list_module_default.scrollContainer,id:listboxId,role:`listbox`,children:[multiSelect?compositeRows:jsx(RadioGroupWrapper,{onValueChange:handleRadioGroupChange,selectedValue,children:compositeRows}),loadMoreError!==null&&!isFetchingMore&&jsx(LoadMoreErrorRow,{onRetry})]})});export{TaxonomyItemsList as t};
+import"../esm/lib/constants.js";import{t as EmptyListState}from"./empty-state.js";import{t as ErrorState}from"./error-state.js";import{t as LoadingState}from"./loading-state.js";import{t as TaxonomyMenuItem}from"./taxonomy-menu-item.js";import{t as LoadMoreErrorRow}from"./load-more-error-row.js";import{t as LoadMoreLoadingRow}from"./load-more-loading-row.js";import{useTaxonomyItemsListFocus}from"../esm/lib/components/taxonomy-items-list/use-taxonomy-items-list-focus.js";import{forwardRef,memo,useCallback,useEffect,useImperativeHandle,useLayoutEffect,useRef}from"react";import{Radio}from"@box/blueprint-web";import{jsx,jsxs}from"react/jsx-runtime";import{Composite,CompositeProvider}from"@ariakit/react";import{useVirtualizer}from"@tanstack/react-virtual";import '../styles/taxonomy-items-list.css';var taxonomy_items_list_module_default={scrollContainer:`_scrollContainer_lky3p_1`,virtualContent:`_virtualContent_lky3p_11`,virtualRow:`_virtualRow_lky3p_23`},RadioGroupWrapper=memo(function({children,selectedValue,onValueChange}){let lastKeyRef=useRef(null),handleKeyDown=useCallback(e=>{lastKeyRef.current=e.key},[]),handleValueChange=useCallback(value=>{let isArrowNavigation=lastKeyRef.current===`ArrowUp`||lastKeyRef.current===`ArrowDown`;lastKeyRef.current=null,onValueChange(value,!isArrowNavigation)},[onValueChange]);return jsx(Radio.Group,{name:`taxonomy-picker`,onKeyDown:handleKeyDown,onValueChange:handleValueChange,value:selectedValue,children})}),measureElement=element=>element.getBoundingClientRect().height,LOAD_MORE_VIRTUAL_KEY=`__load-more-skeleton__`,TaxonomyItemsList=forwardRef(function({items,multiSelect,selectedValue,estimatedRowHeight=36,hasVariableRowHeight=!1,isSearchMode=!1,isFetching,error,loadMoreError=null,listboxId,onFocusExit,onRetry,hasMore=!1,isFetchingMore=!1,onLoadMore},ref){let scrollRef=useRef(null),loadingRef=useRef(null),virtualCount=items.length+ +!!isFetchingMore,estimateSize=useCallback(index=>index>=items.length?112:estimatedRowHeight,[estimatedRowHeight,items.length]),getItemKey=useCallback(index=>index>=items.length?LOAD_MORE_VIRTUAL_KEY:items[index].id,[items]),handleRadioGroupChange=useCallback((nextValue,closeAfterSelect)=>{let target=items.find(item=>item.id===nextValue);target?.selectable&&target.onSelect(nextValue,closeAfterSelect)},[items]),virtualizer=useVirtualizer({count:virtualCount,getScrollElement:()=>scrollRef.current,estimateSize,gap:1,overscan:20,getItemKey,measureElement});useLayoutEffect(()=>{virtualizer.measure()},[hasVariableRowHeight,estimatedRowHeight]);let showSkeleton=isFetching&&items.length===0,showError=!isFetching&&error!==null,showEmpty=!isFetching&&error===null&&items.length===0,{autoFocusFirst,focusItem,holdFocusDuringLoad,cancelPendingFocus}=useTaxonomyItemsListFocus({scrollRef,loadingRef,items,showSkeleton,isFetching,virtualizer});useImperativeHandle(ref,()=>({getScrollTop:()=>scrollRef.current?.scrollTop??0,scrollTo:top=>{scrollRef.current&&(scrollRef.current.scrollTop=top)},focusItem,holdFocusDuringLoad,cancelPendingFocus}),[focusItem,holdFocusDuringLoad,cancelPendingFocus]);let previousItemsLengthRef=useRef(items.length),preCommitScrollTopRef=useRef(null);items.length!==previousItemsLengthRef.current&&(items.length>previousItemsLengthRef.current&&scrollRef.current&&(preCommitScrollTopRef.current=scrollRef.current.scrollTop),previousItemsLengthRef.current=items.length),useLayoutEffect(()=>{let targetScrollTop=preCommitScrollTopRef.current;if(preCommitScrollTopRef.current=null,targetScrollTop===null)return;let scrollContainer=scrollRef.current;scrollContainer&&scrollContainer.scrollTop!==targetScrollTop&&(scrollContainer.scrollTop=targetScrollTop)});let onLoadMoreRef=useRef(onLoadMore);onLoadMoreRef.current=onLoadMore;let canLoadMoreRef=useRef(!1);if(canLoadMoreRef.current=hasMore&&!isFetchingMore&&loadMoreError===null&&!!onLoadMore,useEffect(()=>{let scrollContainer=scrollRef.current;if(!scrollContainer)return;let rafId=0,maybeLoadMore=()=>{canLoadMoreRef.current&&scrollContainer.scrollHeight-scrollContainer.scrollTop-scrollContainer.clientHeight<=200&&onLoadMoreRef.current?.()},handleScroll=()=>{cancelAnimationFrame(rafId),rafId=requestAnimationFrame(maybeLoadMore)};return scrollContainer.addEventListener(`scroll`,handleScroll,{passive:!0}),rafId=requestAnimationFrame(maybeLoadMore),()=>{scrollContainer.removeEventListener(`scroll`,handleScroll),cancelAnimationFrame(rafId)}},[items.length]),showSkeleton)return jsx(LoadingState,{ref:loadingRef});if(showError)return jsx(ErrorState,{onRetry});if(showEmpty)return jsx(EmptyListState,{isSearchMode});let compositeRows=jsx(CompositeProvider,{children:jsx(Composite,{children:jsx(`div`,{className:taxonomy_items_list_module_default.virtualContent,style:{height:virtualizer.getTotalSize()},children:virtualizer.getVirtualItems().map(virtualRow=>{if(virtualRow.index>=items.length)return jsx(`div`,{ref:virtualizer.measureElement,className:taxonomy_items_list_module_default.virtualRow,"data-index":virtualRow.index,style:{transform:`translateY(${virtualRow.start}px)`},children:jsx(LoadMoreLoadingRow,{})},virtualRow.key);let itemProps=items[virtualRow.index];return jsx(`div`,{ref:hasVariableRowHeight?virtualizer.measureElement:void 0,className:taxonomy_items_list_module_default.virtualRow,"data-index":virtualRow.index,style:{transform:`translateY(${virtualRow.start}px)`},children:jsx(TaxonomyMenuItem,{...itemProps,autoFocus:autoFocusFirst&&virtualRow.index===0,onFocusExit:virtualRow.index===0?onFocusExit:void 0,isSearchMode})},virtualRow.key)})})})});return jsxs(`div`,{ref:scrollRef,"aria-multiselectable":multiSelect||void 0,className:taxonomy_items_list_module_default.scrollContainer,id:listboxId,role:`listbox`,children:[multiSelect?compositeRows:jsx(RadioGroupWrapper,{onValueChange:handleRadioGroupChange,selectedValue,children:compositeRows}),loadMoreError!==null&&!isFetchingMore&&jsx(LoadMoreErrorRow,{onRetry})]})});export{TaxonomyItemsList as t};

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

@@ -1 +1 @@
-import{t as TaxonomyAncestorBreadcrumb}from"./taxonomy-ancestor-breadcrumb.js";import{messages}from"../esm/lib/components/taxonomy-menu-item/messages.js";import{useTaxonomyMenuItemKeyboard}from"../esm/lib/components/taxonomy-menu-item/use-taxonomy-menu-item-keyboard.js";import{memo,useCallback,useRef}from"react";import clsx from"clsx";import{useIntl}from"react-intl";import{Checkbox,EllipsizableText,IconButton,Radio}from"@box/blueprint-web";import{jsx,jsxs}from"react/jsx-runtime";import{CompositeItem}from"@ariakit/react";import{ChevronRight}from"@box/blueprint-web-assets/icons/Medium";import '../styles/taxonomy-menu-item.css';var taxonomy_menu_item_module_default={row:`_row_1a4ve_2`,rowWithAncestors:`_rowWithAncestors_1a4ve_19`,nonSelectable:`_nonSelectable_1a4ve_24`,selectionControl:`_selectionControl_1a4ve_31`,content:`_content_1a4ve_41`,drillDown:`_drillDown_1a4ve_48`},TaxonomyMenuItem=memo(function({id,displayName,isSearchMode=!1,selectable,multiSelect,isSelected,showDrillDown,ancestors,onSelect,onDrillDown,onFocusExit}){let{formatMessage}=useIntl(),showAncestors=ancestors!=null&&ancestors.length>0&&isSearchMode,rowRef=useRef(null),selectionControlRef=useRef(null),drillDownRef=useRef(null),{handleSelectionControlFocus,handleRowKeyDown,handleRowKeyDownCapture,handleSelectionControlKeyDown,handleDrillDownKeyDown}=useTaxonomyMenuItemKeyboard({id,multiSelect,onSelect,onFocusExit,rowRef,selectionControlRef,drillDownRef}),handleRowClick=useCallback(event=>{event?.target?.tagName!==`INPUT`&&(selectable?onSelect(id):showDrillDown&&onDrillDown?.(id))},[selectable,showDrillDown,onSelect,onDrillDown,id]),handleDrillDownClick=useCallback(event=>{event.stopPropagation(),onDrillDown?.(id)},[onDrillDown,id]);return jsxs(CompositeItem,{ref:rowRef,render:jsx(`div`,{role:`option`,"aria-selected":isSelected}),className:clsx(taxonomy_menu_item_module_default.row,{[taxonomy_menu_item_module_default.rowWithAncestors]:showAncestors,[taxonomy_menu_item_module_default.nonSelectable]:!selectable}),"data-testid":`taxonomy-menu-item-${id}`,onClick:handleRowClick,onKeyDown:handleRowKeyDown,onKeyDownCapture:handleRowKeyDownCapture,children:[selectable&&multiSelect&&jsx(Checkbox.Item,{ref:selectionControlRef,"aria-label":displayName,checked:isSelected,className:taxonomy_menu_item_module_default.selectionControl,label:``,tabIndex:-1,onClick:event=>event.stopPropagation(),onCheckedChange:()=>onSelect(id),onKeyDown:handleSelectionControlKeyDown,value:id}),selectable&&!multiSelect&&jsx(Radio.Item,{ref:selectionControlRef,"aria-label":displayName,className:taxonomy_menu_item_module_default.selectionControl,label:``,tabIndex:-1,onClick:event=>event.stopPropagation(),onFocus:handleSelectionControlFocus,onKeyDown:handleSelectionControlKeyDown,value:id}),jsxs(`div`,{className:taxonomy_menu_item_module_default.content,children:[jsx(EllipsizableText,{as:`span`,lineClamp:1,variant:showAncestors?`bodyDefaultBold`:`bodyDefault`,children:displayName}),showAncestors&&jsx(TaxonomyAncestorBreadcrumb,{ancestors})]}),showDrillDown&&jsx(IconButton,{ref:drillDownRef,"aria-label":formatMessage(messages.drillDownAriaLabel,{name:displayName}),className:taxonomy_menu_item_module_default.drillDown,"data-testid":`taxonomy-menu-item-drill-down-${id}`,icon:ChevronRight,tabIndex:-1,onClick:handleDrillDownClick,onKeyDown:handleDrillDownKeyDown,size:`x-small`})]})});export{TaxonomyMenuItem as t};
+import{t as TaxonomyAncestorBreadcrumb}from"./taxonomy-ancestor-breadcrumb.js";import{messages}from"../esm/lib/components/taxonomy-menu-item/messages.js";import{useTaxonomyMenuItemKeyboard}from"../esm/lib/components/taxonomy-menu-item/use-taxonomy-menu-item-keyboard.js";import{memo,useCallback,useRef}from"react";import clsx from"clsx";import{useIntl}from"react-intl";import{Checkbox,EllipsizableText,IconButton,Radio}from"@box/blueprint-web";import{jsx,jsxs}from"react/jsx-runtime";import{CompositeItem}from"@ariakit/react";import{ChevronRight}from"@box/blueprint-web-assets/icons/Medium";import '../styles/taxonomy-menu-item.css';var taxonomy_menu_item_module_default={row:`_row_1a4ve_2`,rowWithAncestors:`_rowWithAncestors_1a4ve_19`,nonSelectable:`_nonSelectable_1a4ve_24`,selectionControl:`_selectionControl_1a4ve_31`,content:`_content_1a4ve_41`,drillDown:`_drillDown_1a4ve_48`},TaxonomyMenuItem=memo(function({id,displayName,isSearchMode=!1,selectable,multiSelect,isSelected,showDrillDown,ancestors,onSelect,onDrillDown,onFocusExit,autoFocus=!1}){let{formatMessage}=useIntl(),showAncestors=ancestors!=null&&ancestors.length>0&&isSearchMode,rowRef=useRef(null),selectionControlRef=useRef(null),drillDownRef=useRef(null),{handleSelectionControlFocus,handleRowKeyDown,handleRowKeyDownCapture,handleSelectionControlKeyDown,handleDrillDownKeyDown}=useTaxonomyMenuItemKeyboard({id,multiSelect,onSelect,onFocusExit,rowRef,selectionControlRef,drillDownRef}),handleRowClick=useCallback(event=>{event?.target?.tagName!==`INPUT`&&(selectable?onSelect(id):showDrillDown&&onDrillDown?.(id))},[selectable,showDrillDown,onSelect,onDrillDown,id]),handleDrillDownClick=useCallback(event=>{event.stopPropagation(),onDrillDown?.(id)},[onDrillDown,id]);return jsxs(CompositeItem,{ref:rowRef,autoFocus,render:jsx(`div`,{role:`option`,"aria-selected":isSelected}),className:clsx(taxonomy_menu_item_module_default.row,{[taxonomy_menu_item_module_default.rowWithAncestors]:showAncestors,[taxonomy_menu_item_module_default.nonSelectable]:!selectable}),"data-testid":`taxonomy-menu-item-${id}`,onClick:handleRowClick,onKeyDown:handleRowKeyDown,onKeyDownCapture:handleRowKeyDownCapture,children:[selectable&&multiSelect&&jsx(Checkbox.Item,{ref:selectionControlRef,"aria-label":displayName,checked:isSelected,className:taxonomy_menu_item_module_default.selectionControl,label:``,tabIndex:-1,onClick:event=>event.stopPropagation(),onCheckedChange:()=>onSelect(id),onKeyDown:handleSelectionControlKeyDown,value:id}),selectable&&!multiSelect&&jsx(Radio.Item,{ref:selectionControlRef,"aria-label":displayName,className:taxonomy_menu_item_module_default.selectionControl,label:``,tabIndex:-1,onClick:event=>event.stopPropagation(),onFocus:handleSelectionControlFocus,onKeyDown:handleSelectionControlKeyDown,value:id}),jsxs(`div`,{className:taxonomy_menu_item_module_default.content,children:[jsx(EllipsizableText,{as:`span`,lineClamp:1,variant:showAncestors?`bodyDefaultBold`:`bodyDefault`,children:displayName}),showAncestors&&jsx(TaxonomyAncestorBreadcrumb,{ancestors})]}),showDrillDown&&jsx(IconButton,{ref:drillDownRef,"aria-label":formatMessage(messages.drillDownAriaLabel,{name:displayName}),className:taxonomy_menu_item_module_default.drillDown,"data-testid":`taxonomy-menu-item-drill-down-${id}`,icon:ChevronRight,tabIndex:-1,onClick:handleDrillDownClick,onKeyDown:handleDrillDownKeyDown,size:`x-small`})]})});export{TaxonomyMenuItem as t};

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

@@ -1 +1 @@
-import{defineMessages}from"react-intl";var messages=defineMessages({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{messages};
+import{defineMessages}from"react-intl";var messages=defineMessages({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`},clearAllAriaLabel:{id:`groupSharedFeatures.metadataTaxonomyPicker.shell.clearAllAriaLabel`,defaultMessage:`Clear all selected values`}});export{messages};

package/dist/esm/lib/components/taxonomy-items-list/use-taxonomy-items-list-focus.js

@@ -0,0 +1 @@
+import{useCallback,useEffect,useLayoutEffect,useRef,useState}from"react";function useTaxonomyItemsListFocus({scrollRef,loadingRef,items,showSkeleton,isFetching,virtualizer}){let itemsRef=useRef(items);itemsRef.current=items;let virtualizerRef=useRef(virtualizer);virtualizerRef.current=virtualizer;let pendingFocusRef=useRef(null),[autoFocusFirst,setAutoFocusFirst]=useState(!1),itemsFocusKey=items.length===0?``:`${items[0].id}:${items[items.length-1].id}:${items.length}`,clearPendingFocus=useCallback(()=>{pendingFocusRef.current=null,setAutoFocusFirst(!1)},[]),focusRowNow=useCallback(which=>{let currentItems=itemsRef.current;if(currentItems.length===0||!scrollRef.current)return!1;let index=which===`first`?0:currentItems.length-1;virtualizerRef.current.scrollToIndex(index,{align:`auto`});let row=scrollRef.current.querySelector(`[data-index="${index}"]`)?.querySelector(`[role="option"]`)??(which===`first`?scrollRef.current.querySelector(`[role="option"]`):null);if(!row)return!1;row.tabIndex<0&&(row.tabIndex=0),row.focus({preventScroll:!0});let focused=document.activeElement===row||row.contains(document.activeElement)||scrollRef.current.contains(document.activeElement)&&document.activeElement?.getAttribute(`role`)===`option`;return focused&&clearPendingFocus(),!!focused},[clearPendingFocus,scrollRef]),focusItem=useCallback(which=>(pendingFocusRef.current=which,which===`first`&&setAutoFocusFirst(!0),focusRowNow(which)),[focusRowNow]),holdFocusDuringLoad=useCallback(()=>{pendingFocusRef.current=`first`,setAutoFocusFirst(!0),loadingRef.current?.focus({preventScroll:!0})},[loadingRef]),cancelPendingFocus=clearPendingFocus;return useLayoutEffect(()=>{!showSkeleton||!pendingFocusRef.current||document.activeElement?.getAttribute(`role`)!==`combobox`&&loadingRef.current?.focus({preventScroll:!0})},[showSkeleton,loadingRef]),useLayoutEffect(()=>{showSkeleton||items.length===0||pendingFocusRef.current!==`first`||setAutoFocusFirst(!0)},[showSkeleton,itemsFocusKey,items.length]),useEffect(()=>{let which=pendingFocusRef.current;if(!which||showSkeleton||items.length===0)return;let attempts=0,rafId=0,cancelled=!1,attempt=()=>{cancelled||pendingFocusRef.current!==which||focusRowNow(which)||(attempts+=1,attempts<20?rafId=requestAnimationFrame(attempt):clearPendingFocus())};return rafId=requestAnimationFrame(attempt),()=>{cancelled=!0,cancelAnimationFrame(rafId)}},[showSkeleton,itemsFocusKey,isFetching,items.length,focusRowNow,clearPendingFocus]),useEffect(()=>{if(!autoFocusFirst||showSkeleton||items.length===0)return;let rafId=requestAnimationFrame(()=>{setAutoFocusFirst(!1)});return()=>{cancelAnimationFrame(rafId)}},[autoFocusFirst,showSkeleton,itemsFocusKey,items.length]),{autoFocusFirst,focusItem,holdFocusDuringLoad,cancelPendingFocus}}export{useTaxonomyItemsListFocus};

package/dist/esm/lib/components/taxonomy-menu-item/use-taxonomy-menu-item-keyboard.js

@@ -1 +1 @@
-import{useCallback,useRef}from"react";import{useCompositeContext}from"@ariakit/react";function useTaxonomyMenuItemKeyboard({id,multiSelect,onSelect,onFocusExit,rowRef,selectionControlRef,drillDownRef}){let compositeStore=useCompositeContext(),isProgrammaticSelectionFocusRef=useRef(!1),moveToAdjacentRow=useCallback(direction=>{if(!compositeStore)return!1;let{activeId,items}=compositeStore.getState(),currentIndex=items.findIndex(item=>item.id===activeId);if(currentIndex===-1)return!1;let targetIndex=direction===`ArrowDown`?currentIndex+1:currentIndex-1;if(targetIndex<0||targetIndex>=items.length)return!1;let targetElement=items[targetIndex].element;return targetElement?(targetElement.focus(),!0):!1},[compositeStore]),focusSelectionControl=useCallback(()=>{isProgrammaticSelectionFocusRef.current=!0,selectionControlRef.current?.focus()},[selectionControlRef]);return{handleSelectionControlFocus:useCallback(()=>{isProgrammaticSelectionFocusRef.current||rowRef.current?.focus(),isProgrammaticSelectionFocusRef.current=!1},[rowRef]),handleRowKeyDown:useCallback(event=>{switch(event.key){case`Tab`:moveToAdjacentRow(event.shiftKey?`ArrowUp`:`ArrowDown`)?event.preventDefault():event.shiftKey&&onFocusExit&&(event.preventDefault(),onFocusExit());break;case`ArrowLeft`:event.preventDefault(),event.stopPropagation(),focusSelectionControl();break;case`ArrowRight`:event.preventDefault(),event.stopPropagation(),drillDownRef.current?.focus();break}},[focusSelectionControl,moveToAdjacentRow,onFocusExit,drillDownRef]),handleRowKeyDownCapture:useCallback(event=>{let target=event.target;if(!target||target===event.currentTarget)return;let isFromSelectionControl=selectionControlRef.current!=null&&(selectionControlRef.current===target||selectionControlRef.current.contains(target)),isFromDrillDown=drillDownRef.current!=null&&(drillDownRef.current===target||drillDownRef.current.contains(target));if(!(!isFromSelectionControl&&!isFromDrillDown)){switch(event.key){case`ArrowUp`:case`ArrowDown`:moveToAdjacentRow(event.key)&&(event.preventDefault(),event.stopPropagation());break;case`Tab`:moveToAdjacentRow(event.shiftKey?`ArrowUp`:`ArrowDown`)?(event.preventDefault(),event.stopPropagation()):event.shiftKey&&onFocusExit&&(event.preventDefault(),event.stopPropagation(),onFocusExit());break}if(isFromSelectionControl)switch(event.key){case`ArrowRight`:event.preventDefault(),event.stopPropagation(),drillDownRef.current?.focus();break;case`ArrowLeft`:event.preventDefault(),event.stopPropagation(),rowRef.current?.focus();break}}},[moveToAdjacentRow,onFocusExit,selectionControlRef,drillDownRef,rowRef]),handleSelectionControlKeyDown:useCallback(event=>{switch(event.key){case`Enter`:multiSelect||(event.preventDefault(),onSelect(id));break}},[multiSelect,onSelect,id]),handleDrillDownKeyDown:useCallback(event=>{switch(event.key){case`Tab`:moveToAdjacentRow(event.shiftKey?`ArrowUp`:`ArrowDown`)?event.preventDefault():event.shiftKey&&onFocusExit&&(event.preventDefault(),onFocusExit());break;case`Enter`:case` `:event.stopPropagation();break;case`ArrowLeft`:event.preventDefault(),selectionControlRef.current?focusSelectionControl():rowRef.current?.focus();break}},[moveToAdjacentRow,onFocusExit,focusSelectionControl,selectionControlRef,rowRef])}}export{useTaxonomyMenuItemKeyboard};
+import{useCallback,useRef}from"react";import{useCompositeContext}from"@ariakit/react";function useTaxonomyMenuItemKeyboard({id,multiSelect,onSelect,onFocusExit,rowRef,selectionControlRef,drillDownRef}){let compositeStore=useCompositeContext(),isProgrammaticSelectionFocusRef=useRef(!1),moveToAdjacentRow=useCallback(direction=>{if(!compositeStore)return!1;let{activeId,items}=compositeStore.getState(),currentIndex=items.findIndex(item=>item.id===activeId);if(currentIndex===-1)return!1;let targetIndex=direction===`ArrowDown`?currentIndex+1:currentIndex-1;if(targetIndex<0||targetIndex>=items.length)return!1;let targetElement=items[targetIndex].element;return targetElement?(targetElement.focus(),!0):!1},[compositeStore]),focusSelectionControl=useCallback(()=>{isProgrammaticSelectionFocusRef.current=!0,selectionControlRef.current?.focus()},[selectionControlRef]);return{handleSelectionControlFocus:useCallback(()=>{isProgrammaticSelectionFocusRef.current||rowRef.current?.focus(),isProgrammaticSelectionFocusRef.current=!1},[rowRef]),handleRowKeyDown:useCallback(event=>{switch(event.key){case`Tab`:moveToAdjacentRow(event.shiftKey?`ArrowUp`:`ArrowDown`)&&(event.preventDefault(),event.stopPropagation());break;case`ArrowUp`:moveToAdjacentRow(`ArrowUp`)&&(event.preventDefault(),event.stopPropagation());break;case`ArrowLeft`:event.preventDefault(),event.stopPropagation(),focusSelectionControl();break;case`ArrowRight`:event.preventDefault(),event.stopPropagation(),drillDownRef.current?.focus();break}},[focusSelectionControl,moveToAdjacentRow,drillDownRef]),handleRowKeyDownCapture:useCallback(event=>{let target=event.target;if(!target)return;let isOnRow=target===event.currentTarget,isFromSelectionControl=selectionControlRef.current!=null&&(selectionControlRef.current===target||selectionControlRef.current.contains(target)),isFromDrillDown=drillDownRef.current!=null&&(drillDownRef.current===target||drillDownRef.current.contains(target));if(!(!isOnRow&&!isFromSelectionControl&&!isFromDrillDown)){if(isOnRow&&onFocusExit&&(event.key===`ArrowUp`||event.key===`Tab`&&event.shiftKey)&&!moveToAdjacentRow(`ArrowUp`)){event.preventDefault(),event.stopPropagation(),onFocusExit();return}if(!isOnRow){switch(event.key){case`ArrowUp`:moveToAdjacentRow(`ArrowUp`)?(event.preventDefault(),event.stopPropagation()):onFocusExit&&(event.preventDefault(),event.stopPropagation(),onFocusExit());break;case`ArrowDown`:moveToAdjacentRow(`ArrowDown`)&&(event.preventDefault(),event.stopPropagation());break;case`Tab`:moveToAdjacentRow(event.shiftKey?`ArrowUp`:`ArrowDown`)?(event.preventDefault(),event.stopPropagation()):event.shiftKey&&onFocusExit&&(event.preventDefault(),event.stopPropagation(),onFocusExit());break}if(isFromSelectionControl)switch(event.key){case`ArrowRight`:event.preventDefault(),event.stopPropagation(),drillDownRef.current?.focus();break;case`ArrowLeft`:event.preventDefault(),event.stopPropagation(),rowRef.current?.focus();break}}}},[moveToAdjacentRow,onFocusExit,selectionControlRef,drillDownRef,rowRef]),handleSelectionControlKeyDown:useCallback(event=>{switch(event.key){case`Enter`:multiSelect||(event.preventDefault(),onSelect(id));break}},[multiSelect,onSelect,id]),handleDrillDownKeyDown:useCallback(event=>{switch(event.key){case`Enter`:case` `:event.stopPropagation();break;case`ArrowLeft`:event.preventDefault(),selectionControlRef.current?focusSelectionControl():rowRef.current?.focus();break}},[focusSelectionControl,selectionControlRef,rowRef])}}export{useTaxonomyMenuItemKeyboard};

package/dist/i18n/en-US.js

@@ -20,6 +20,7 @@ export default {
     "groupSharedFeatures.metadataTaxonomyPicker.shell.breadcrumbAriaLabel": "Taxonomy navigation",
     "groupSharedFeatures.metadataTaxonomyPicker.shell.breadcrumbRootLabel": "All",
     "groupSharedFeatures.metadataTaxonomyPicker.shell.breadcrumbTruncatedLinksLabel": "Show hidden parent levels",
+    "groupSharedFeatures.metadataTaxonomyPicker.shell.clearAllAriaLabel": "Clear all selected values",
     "groupSharedFeatures.metadataTaxonomyPicker.shell.clearAriaLabel": "Clear selection",
     "groupSharedFeatures.metadataTaxonomyPicker.shell.placeholder": "Select an Option"
 };

package/dist/styles/loading-state.css

@@ -1 +1 @@
-._root_t50cx_1{box-sizing:border-box;min-height:21rem;padding-inline:var(--bp-space-030,.75rem);flex-direction:column;flex:1;justify-content:space-evenly;display:flex;overflow:hidden}._root_t50cx_1>*{flex-shrink:0}
+._root_bi5pr_1{box-sizing:border-box;min-height:21rem;padding-inline:var(--bp-space-030,.75rem);outline:none;flex-direction:column;flex:1;justify-content:space-evenly;display:flex;overflow:hidden}._root_bi5pr_1>*{flex-shrink:0}

package/dist/styles/metadata-taxonomy-picker-shell.css

@@ -1 +1 @@
-._container_1nb7h_27{gap:var(--bp-space-020,.5rem);flex-direction:column;width:100%;display:flex}._label_1nb7h_34{cursor:pointer}._trigger_1nb7h_38{box-sizing:border-box;align-items:center;gap:var(--space-2);width:100%;min-height:var(--bp-size-100,2.5rem);padding-block:var(--bp-space-020,.5rem);padding-inline:var(--bp-space-030,.75rem);color:var(--bp-text-text-on-light);background-color:var(--surface-dropdown-surface);border:var(--bp-border-01,.0625rem) solid var(--bp-border-input-border);border-radius:var(--bp-radius-06,.75rem);cursor:pointer;outline:none;flex-wrap:wrap;display:flex}._trigger_1nb7h_38:has(._searchInput_1nb7h_55:focus){background-color:var(--surface-dropdown-surface-focus);border-color:var(--outline-focus-on-light);border-width:var(--bp-border-02,.125rem)}._trigger_1nb7h_38[data-disabled=true]{opacity:.6;cursor:not-allowed}._trigger_1nb7h_38[data-disabled=true] button{pointer-events:none}._trigger_1nb7h_38 ._chips_1nb7h_67{display:contents}._trigger_1nb7h_38[data-disabled=true] ._chips_1nb7h_67>*{pointer-events:none}input[type=text]._searchInput_1nb7h_55{font-weight:var(--bp-font-weight-regular);font-size:var(--bp-font-size-05);font-family:var(--bp-font-font-family), -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto, "Helvetica Neue", sans-serif;font-style:normal;line-height:var(--bp-font-line-height-04);letter-spacing:var(--bp-font-letter-spacing-01)}:where(body.is-inter-font) input[type=text]._searchInput_1nb7h_55{letter-spacing:.00625rem;text-transform:none;font-family:Inter Variable,-apple-system,BlinkMacSystemFont,San Francisco,Segoe UI,Roboto,Helvetica Neue,sans-serif;font-size:.875rem;font-style:normal;font-weight:450;line-height:1.375rem;text-decoration:none}input[type=text]._searchInput_1nb7h_55{width:auto;min-width:var(--size-12);color:var(--bp-text-text-on-light);box-shadow:none;cursor:inherit;background:0 0;border:none;border-radius:0;outline:none;flex:1;padding:0}input[type=text]._searchInput_1nb7h_55:hover,input[type=text]._searchInput_1nb7h_55:focus,input[type=text]._searchInput_1nb7h_55:disabled{box-shadow:none;background:0 0;border:none;border-radius:0;outline:none}input[type=text]._searchInput_1nb7h_55::placeholder{color:var(--bp-text-text-on-light-secondary)}._searchIcon_1nb7h_117{width:var(--bp-size-040,1rem);height:var(--bp-size-040,1rem);color:var(--bp-icon-icon-on-light-secondary);pointer-events:none;flex-shrink:0;margin-inline-start:auto}._popover_1nb7h_126{width:var(--radix-popover-trigger-width);max-width:none}._popover_1nb7h_126 div[data-radix-popper-content-wrapper]:has([role=menu]){background-color:var(--bp-surface-menu-surface-dropdown)}._clearButton_1nb7h_134{flex-shrink:0}._breadcrumbContainer_1nb7h_138{min-width:0;padding-block:var(--bp-space-020,.5rem);padding-inline:var(--bp-space-020,.5rem);border-bottom:var(--bp-border-01,.0625rem) solid var(--bp-border-divider);align-items:center;display:flex}._breadcrumbContainer_1nb7h_138 li:first-child:has(button){margin-inline-start:calc(-1 * var(--bp-space-010,.25rem))}
+._container_b9ux1_27{gap:var(--bp-space-020,.5rem);flex-direction:column;width:100%;display:flex}._label_b9ux1_34{cursor:pointer}._trigger_b9ux1_38{box-sizing:border-box;align-items:center;gap:var(--bp-space-020,.5rem);width:100%;min-height:var(--bp-size-100,2.5rem);padding-block:var(--bp-space-020,.5rem);padding-inline:var(--bp-space-030,.75rem);color:var(--bp-text-text-on-light);background-color:var(--surface-dropdown-surface);border:var(--bp-border-01,.0625rem) solid var(--bp-border-input-border);border-radius:var(--bp-radius-06,.75rem);cursor:pointer;outline:none;flex-wrap:wrap;padding-inline-end:calc(var(--bp-space-030,.75rem) + var(--bp-size-040,1rem) + var(--bp-space-020,.5rem));display:flex;position:relative}._trigger_b9ux1_38:has(._clearButton_b9ux1_57){--trigger-end-actions-width:calc(var(--bp-size-060,1.5rem) + var(--bp-size-040,1rem) + (2 * var(--bp-space-020,.5rem)));padding-inline-end:calc(var(--bp-space-030,.75rem) + var(--trigger-end-actions-width))}._trigger_b9ux1_38:has(._searchInput_b9ux1_63:focus){background-color:var(--surface-dropdown-surface-focus);border-color:var(--outline-focus-on-light);border-width:var(--bp-border-02,.125rem)}._trigger_b9ux1_38[data-disabled=true]{opacity:.6;cursor:not-allowed}._trigger_b9ux1_38[data-disabled=true] button{pointer-events:none}._trigger_b9ux1_38 ._chips_b9ux1_75{display:contents}._trigger_b9ux1_38[data-disabled=true] ._chips_b9ux1_75>*{pointer-events:none}input[type=text]._searchInput_b9ux1_63{font-weight:var(--bp-font-weight-regular);font-size:var(--bp-font-size-05);font-family:var(--bp-font-font-family), -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto, "Helvetica Neue", sans-serif;font-style:normal;line-height:var(--bp-font-line-height-04);letter-spacing:var(--bp-font-letter-spacing-01)}:where(body.is-inter-font) input[type=text]._searchInput_b9ux1_63{letter-spacing:.00625rem;text-transform:none;font-family:Inter Variable,-apple-system,BlinkMacSystemFont,San Francisco,Segoe UI,Roboto,Helvetica Neue,sans-serif;font-size:.875rem;font-style:normal;font-weight:450;line-height:1.375rem;text-decoration:none}input[type=text]._searchInput_b9ux1_63{width:auto;min-width:var(--bp-size-120,3rem);color:var(--bp-text-text-on-light);box-shadow:none;cursor:inherit;background:0 0;border:none;border-radius:0;outline:none;flex:1;padding:0}input[type=text]._searchInput_b9ux1_63:hover,input[type=text]._searchInput_b9ux1_63:focus,input[type=text]._searchInput_b9ux1_63:disabled{box-shadow:none;background:0 0;border:none;border-radius:0;outline:none}input[type=text]._searchInput_b9ux1_63::placeholder{color:var(--bp-text-text-on-light-secondary)}._endActions_b9ux1_125{inset-block:var(--bp-space-020,.5rem);gap:var(--bp-space-020,.5rem);flex-flow:column wrap;place-content:center;align-items:center;display:flex;position:absolute;inset-inline-end:var(--bp-space-030,.75rem)}._searchIcon_b9ux1_136{width:var(--bp-size-040,1rem);height:var(--bp-size-040,1rem);color:var(--bp-icon-icon-on-light-secondary);pointer-events:none;flex-shrink:0}._popover_b9ux1_144{width:var(--radix-popover-trigger-width);max-width:none}._popover_b9ux1_144 div[data-radix-popper-content-wrapper]:has([role=menu]){background-color:var(--bp-surface-menu-surface-dropdown)}._clearButton_b9ux1_57{flex-shrink:0}._breadcrumbContainer_b9ux1_156{min-width:0;padding-block:var(--bp-space-020,.5rem);padding-inline:var(--bp-space-020,.5rem);border-bottom:var(--bp-border-01,.0625rem) solid var(--bp-border-divider);align-items:center;display:flex}._breadcrumbContainer_b9ux1_156 li:first-child:has(button){margin-inline-start:calc(-1 * var(--bp-space-010,.25rem))}

package/dist/types/lib/components/metadata-taxonomy-picker-shell/messages.d.ts

@@ -24,4 +24,9 @@ export declare const messages: {
         description: string;
         id: string;
     };
+    clearAllAriaLabel: {
+        defaultMessage: string;
+        description: string;
+        id: string;
+    };
 };

package/dist/types/lib/components/taxonomy-items-list/loading-state/loading-state.d.ts

@@ -1,6 +1,2 @@
-/**
- * Shown by `TaxonomyItemsList` while the initial load is in flight.
- * Renders a stack of `Ghost` placeholders sized to roughly match a
- * page of rows, with an `aria-busy` live region for screen readers.
- */
-export declare function LoadingState(): import("react/jsx-runtime").JSX.Element;
+/** Initial-load skeleton. `tabIndex={-1}` parks focus during level fetches. */
+export declare const LoadingState: import('react').ForwardRefExoticComponent<import('react').RefAttributes<HTMLDivElement>>;

package/dist/types/lib/components/taxonomy-items-list/taxonomy-items-list.d.ts

@@ -41,7 +41,7 @@ export interface TaxonomyItemsListProps {
      * Must match the `listboxId` threaded down from `MetadataTaxonomyPickerShell`.
      */
     listboxId?: string;
-    /** Called when the user Shift+Tabs from the first row to return focus to the main input. */
+    /** Shift+Tab / ArrowUp from the first row → breadcrumb or input. */
     onFocusExit?: () => void;
     /**
      * `true` when another page of items is available to be loaded.
@@ -54,10 +54,15 @@ export interface TaxonomyItemsListProps {
     /** Called when the user has scrolled within `LOAD_MORE_ROOT_MARGIN_PX` of the bottom of the list. */
     onLoadMore?: () => void;
 }
-/** Imperative handle exposed via `ref` for scroll position save/restore. */
 export interface TaxonomyItemsListRef {
     getScrollTop: () => number;
     scrollTo: (top: number) => void;
+    /** Focus first/last row; true once focus has landed. */
+    focusItem: (which: 'first' | 'last') => boolean;
+    /** Park focus on the skeleton; restore to the first row when items arrive. */
+    holdFocusDuringLoad: () => void;
+    /** Drop any in-flight list focus (e.g. user returned to the combobox). */
+    cancelPendingFocus: () => void;
 }
 /**
  * Virtualized list of taxonomy rows.
@@ -75,8 +80,7 @@ export interface TaxonomyItemsListRef {
  * Browse rows are CSS-locked to a fixed height; search/ancestor rows can
  * vary, in which case `hasVariableRowHeight` opts into per-row measurement.
  *
- * The component exposes a `TaxonomyItemsListRef` imperative handle for
- * saving and restoring the scroll position when toggling between browse
- * and search modes.
+ * Imperative scroll/focus handle: `TaxonomyItemsListRef`.
+ * Focus orchestration: `useTaxonomyItemsListFocus`.
  */
 export declare const TaxonomyItemsList: import('react').ForwardRefExoticComponent<TaxonomyItemsListProps & import('react').RefAttributes<TaxonomyItemsListRef>>;

package/dist/types/lib/components/taxonomy-items-list/use-taxonomy-items-list-focus.d.ts

@@ -0,0 +1,34 @@
+import { Virtualizer } from '@tanstack/react-virtual';
+import { RefObject } from 'react';
+export type TaxonomyListFocusTarget = 'first' | 'last';
+export interface UseTaxonomyItemsListFocusOptions {
+    scrollRef: RefObject<HTMLDivElement | null>;
+    loadingRef: RefObject<HTMLDivElement | null>;
+    items: ReadonlyArray<{
+        id: string;
+    }>;
+    showSkeleton: boolean;
+    isFetching: boolean;
+    virtualizer: Virtualizer<HTMLDivElement, Element>;
+}
+export interface UseTaxonomyItemsListFocusResult {
+    /**
+     * One-shot Composite `autoFocus` on the first row so Ariakit's activeId
+     * stays in sync (needed for Tab / ArrowUp exit).
+     */
+    autoFocusFirst: boolean;
+    /** Focus first/last row; true once focus has landed. */
+    focusItem: (which: TaxonomyListFocusTarget) => boolean;
+    /** Park focus on the skeleton; restore to the first row when items arrive. */
+    holdFocusDuringLoad: () => void;
+    /** Drop any in-flight list focus (e.g. user returned to the combobox). */
+    cancelPendingFocus: () => void;
+}
+/**
+ * Pending focus into virtualized rows after drill-down / ArrowDown.
+ *
+ * Uses one-shot Composite `autoFocus` for the first row (keeps Ariakit activeId
+ * correct) plus a short rAF retry. Avoids layout-phase focus loops that fight
+ * Radix Popover FocusScope.
+ */
+export declare function useTaxonomyItemsListFocus({ scrollRef, loadingRef, items, showSkeleton, isFetching, virtualizer, }: UseTaxonomyItemsListFocusOptions): UseTaxonomyItemsListFocusResult;

package/dist/types/lib/components/taxonomy-menu-item/taxonomy-menu-item.d.ts

@@ -10,8 +10,10 @@ export interface TaxonomyMenuItemProps {
     ancestors?: TaxonomyAncestor[];
     onSelect: (id: string, closeAfterSelect?: boolean) => void;
     onDrillDown?: (id: string) => void;
-    /** Called when Shift+Tab is pressed while this is the first row, to return focus to the main input. */
+    /** First-row Shift+Tab / ArrowUp → breadcrumb or input. */
     onFocusExit?: () => void;
+    /** Focus on mount after drill-down / navigate-back. */
+    autoFocus?: boolean;
 }
 /**
  * Row component for browse and search lists.

package/dist/types/lib/components/taxonomy-menu-item/use-taxonomy-menu-item-keyboard.d.ts

@@ -3,7 +3,7 @@ export interface UseTaxonomyMenuItemKeyboardOptions {
     id: string;
     multiSelect: boolean;
     onSelect: (id: string, closeAfterSelect?: boolean) => void;
-    /** Called when focus exits the top of the list (e.g. Shift+Tab on the first row). */
+    /** Called when focus exits the top of the list (Shift+Tab or ArrowUp on the first row). */
     onFocusExit?: () => void;
     rowRef: React.RefObject<HTMLButtonElement>;
     selectionControlRef: React.RefObject<HTMLButtonElement>;
@@ -27,21 +27,8 @@ export interface UseTaxonomyMenuItemKeyboardResult {
     handleDrillDownKeyDown: (event: KeyboardEvent<HTMLButtonElement>) => void;
 }
 /**
- * Encapsulates all keyboard (and radio-focus-redirect) logic for a single
- * TaxonomyMenuItem row.
- *
- * Keyboard model (requires an ancestor CompositeProvider + Composite):
- * - Tab / Shift+Tab anywhere in the row  → next / previous row.
- *   At a list boundary Tab exits the popup naturally.
- * - ArrowUp / ArrowDown anywhere in the row → next / previous row.
- * - ArrowLeft from row → selection control.
- * - ArrowRight from row → drill-down.
- * - ArrowLeft from selection control → row.
- * - ArrowRight from selection control → drill-down.
- * - ArrowLeft from drill-down → selection control (or row if none).
- * - Enter on radio → select (Radix blocks the native Enter event on buttons).
- * - Enter / Space on drill-down → drill-down action.
- * - Arrow keys from the selection control are intercepted in the capture phase
- *   so Radix's RovingFocusGroup never navigates between radios.
+ * Row keyboard model (needs CompositeProvider):
+ * Tab/arrows move between rows; first-row Shift+Tab/ArrowUp → `onFocusExit`;
+ * Left/Right move to selection control / drill-down; Enter/Space activate.
  */
 export declare function useTaxonomyMenuItemKeyboard({ id, multiSelect, onSelect, onFocusExit, rowRef, selectionControlRef, drillDownRef, }: UseTaxonomyMenuItemKeyboardOptions): UseTaxonomyMenuItemKeyboardResult;

package/dist/types/lib/stories/taxonomy-menu-item.stories.d.ts

@@ -26,6 +26,7 @@ declare const _default: {
         onSelect: (id: string, closeAfterSelect?: boolean) => void;
         onDrillDown?: ((id: string) => void) | undefined;
         onFocusExit?: (() => void) | undefined;
+        autoFocus?: boolean | undefined;
     }>) => import("react/jsx-runtime").JSX.Element)[];
     parameters: {
         docs: {

package/dist/types/lib/stories/tests/level-filter.interaction-tests.stories.d.ts

@@ -105,6 +105,12 @@ export declare const LevelFilterTriggerReflectsActiveSelection: Story;
  * must not silently apply a synthetic filter — results span every level.
  */
 export declare const SearchAfterDrillDownWithNoAvailableLevelsIsUnfiltered: Story;
+/**
+ * ArrowDown on the breadcrumb jumps into the list, but the level-filter trigger
+ * keeps its own ArrowDown binding: it opens the menu instead of skipping to the
+ * results list.
+ */
+export declare const LevelFilterTriggerArrowDownOpensDropdown: Story;
 /**
  * Selecting "All levels" removes the level restriction, causing results from
  * every level to appear again.

package/dist/types/lib/stories/tests/navigation.interaction-tests.stories.d.ts

@@ -36,6 +36,17 @@ type Story = StoryObj<typeof MetadataTaxonomyPicker>;
  * children of the chosen row; repeating it walks the user further down the tree.
  */
 export declare const DrillsDownMultipleLevels: Story;
+/**
+ * After drill-down the Composite list remounts (skeleton → rows). Focus must
+ * stay inside the picker during the skeleton (parked on the loading status)
+ * and then land on the first child row — never fall to the document body.
+ */
+export declare const FocusMovesToFirstRowAfterDrillDown: Story;
+/**
+ * Ancestor crumbs are native buttons. Reach them from the list (Shift+Tab / ArrowUp);
+ * Tab from the combobox closes the popup (standard combobox pattern).
+ */
+export declare const BreadcrumbAncestorsAreKeyboardAccessible: Story;
 /**
  * While a drill-down request is in flight the items list is replaced by the
  * loading skeleton so the user knows the previous level's items are no longer
@@ -119,6 +130,18 @@ export declare const DropsStaleFetchResponseAfterRapidDrillDown: Story;
  * target the right operation.
  */
 export declare const SurfacesFetchErrorForCurrentLevel: Story;
+/**
+ * ArrowDown from the breadcrumb fires while the list is still showing the
+ * loading skeleton. Focus lands on the first row once the child rows mount,
+ * without the user pressing another key.
+ */
+export declare const RetriesBreadcrumbToListFocusWhileListIsLoading: Story;
+/**
+ * If the user returns focus to the combobox before the retry lands, the
+ * pending list focus is cancelled and the retry does not steal the caret once
+ * rows finally mount.
+ */
+export declare const CancelsBreadcrumbToListFocusRetryWhenReturningToInput: Story;
 /**
  * Stale-response guard for errors: drilling into a slow-failing level and
  * immediately navigating back must NOT pollute the root level with the late

package/dist/types/lib/stories/tests/search.interaction-tests.stories.d.ts

@@ -90,11 +90,12 @@ export declare const ClearingBeforeDebounceFiresNeverShowsSearchResults: Story;
  */
 export declare const SingleSelectSearchResultEmitsValueWithAncestors: Story;
 /**
- * In multi-select mode, selecting a search result adds it to the value and
- * keeps the popover open with search results still visible — the user stays
- * in search mode to allow further selections.
+ * In multi-select mode, selecting a search result adds it to the value, clears
+ * the search string (exits search mode back to browse), and keeps the popover
+ * open. Focus moves to the combobox input, since the row that owned it unmounts
+ * and focus would otherwise fall to `document.body`.
  */
-export declare const MultiSelectSearchResultTogglesWithoutExitingSearch: Story;
+export declare const MultiSelectSearchResultClearsSearchAndKeepsPopoverOpen: Story;
 /**
  * Selecting a search result in multi-select mode emits the full `TaxonomyValue`
  * shape including ancestor information.

package/dist/types/lib/stories/tests/selection.interaction-tests.stories.d.ts

@@ -61,7 +61,20 @@ export declare const SingleSelectShowsClearButtonForSelectedValue: Story;
 export declare const SingleSelectClearButtonClearsValue: Story;
 export declare const SingleSelectClearButtonDoesNothingWhenDisabled: Story;
 export declare const SingleSelectChipHasNoDeleteButton: Story;
-export declare const MultiSelectDoesNotShowSingleClearButton: Story;
+export declare const MultiSelectShowsClearAllButton: Story;
+export declare const MultiSelectClearAllButtonClearsAllValues: Story;
+export declare const MultiSelectClearAllButtonDoesNothingWhenDisabled: Story;
+/**
+ * ArrowDown from the focused combobox input moves focus into the list so
+ * keyboard users can enter the popover without using the mouse.
+ */
+export declare const ArrowDownFromInputFocusesFirstListItem: Story;
+/**
+ * Enter on a focused, closed combobox opens the popover so keyboard users can
+ * enter without a mouse. Focus opens on focus today; Escape closes while
+ * keeping focus on the input, then Enter re-opens.
+ */
+export declare const EnterOnClosedInputOpensPopover: Story;
 export declare const MultiSelectChipDismissRemovesValue: Story;
 export declare const NonSelectableRowRendersWithoutSelectionControl: Story;
 export declare const TypingInTriggerUpdatesControlledValue: Story;

package/dist/types/lib/stories/tests/taxonomy-menu-item.interaction-tests.stories.d.ts

@@ -34,6 +34,7 @@ declare const _default: {
         onSelect: (id: string, closeAfterSelect?: boolean) => void;
         onDrillDown?: ((id: string) => void) | undefined;
         onFocusExit?: (() => void) | undefined;
+        autoFocus?: boolean | undefined;
     }>) => import("react/jsx-runtime").JSX.Element)[];
 };
 export default _default;
@@ -63,3 +64,15 @@ export declare const ShiftTabOnRowMovesToPrevRow: Story;
 export declare const ArrowDownFromSelectionControlFocusesNextRow: Story;
 export declare const ArrowUpFromSelectionControlFocusesPrevRow: Story;
 export declare const ShiftTabOnFirstRowFocusesInput: Story;
+export declare const ArrowUpOnFirstRowFocusesInput: Story;
+export declare const ArrowUpOnSecondRowFocusesPrevRow: Story;
+export declare const ArrowUpFromSelectionControlOnFirstRowFocusesInput: Story;
+export declare const ShiftTabFromSelectionControlOnFirstRowFocusesInput: Story;
+export declare const ShiftTabFromSelectionControlFocusesPrevRow: Story;
+export declare const TabOnDrillDownNavigatesToNextRow: Story;
+export declare const ShiftTabOnDrillDownNavigatesToPrevRow: Story;
+export declare const ArrowUpOnDrillDownFocusesPrevRow: Story;
+export declare const ArrowUpOnFirstRowDrillDownFocusesInput: Story;
+export declare const ShiftTabOnFirstRowDrillDownFocusesInput: Story;
+/** Non-selectable rows have no radio/checkbox; ArrowLeft from drill-down falls back to the row. */
+export declare const ArrowLeftFromDrillDownWithoutSelectionControlFocusesRow: Story;

package/package.json

@@ -1,11 +1,11 @@
 {
     "name": "@box/metadata-taxonomy-picker",
-    "version": "3.2.15",
+    "version": "3.3.0",
     "license": "SEE LICENSE IN LICENSE",
     "peerDependencies": {
         "@ariakit/react": "^0.4.21",
-        "@box/blueprint-web": "^16.19.2",
-        "@box/blueprint-web-assets": "^5.7.6",
+        "@box/blueprint-web": "^16.20.1",
+        "@box/blueprint-web-assets": "^5.7.8",
         "@tanstack/react-virtual": "^3.10.8",
         "react": "^18.0.0",
         "react-dom": "^18.0.0",
@@ -13,10 +13,10 @@
     },
     "devDependencies": {
         "@ariakit/react": "^0.4.21",
-        "@box/blueprint-web": "^16.19.2",
-        "@box/blueprint-web-assets": "^5.7.6",
-        "@box/eslint-plugin-blueprint": "2.2.3",
-        "@box/storybook-utils": "1.2.15",
+        "@box/blueprint-web": "^16.20.1",
+        "@box/blueprint-web-assets": "^5.7.8",
+        "@box/eslint-plugin-blueprint": "2.2.4",
+        "@box/storybook-utils": "1.2.17",
         "@tanstack/react-virtual": "^3.10.8",
         "react-intl": "^6.4.2"
     },