@box/metadata-filter 2.6.22 → 2.6.23
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/esm/lib/components/metadata-filter-fields/components/metadata-taxonomy-field/legacy-metadata-taxonomy-field-advanced.js +1 -1
- package/dist/esm/lib/components/metadata-filter-fields/components/metadata-taxonomy-field/picker/metadata-taxonomy-picker-field-advanced.js +1 -1
- package/dist/esm/lib/components/metadata-filter-fields/components/metadata-taxonomy-field/utils.js +1 -1
- package/dist/types/lib/components/metadata-filter-fields/components/metadata-taxonomy-field/utils.d.ts +24 -0
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
import messages from"../../../../messages.js";import{t as AdvancedFilterSelect}from"../../../../../../chunks/advanced-filter-select.js";import{t as metadata_taxonomy_field_advanced_module_default}from"../../../../../../chunks/metadata-taxonomy-field-advanced.module.js";import{createFieldValue,getInitialAdvancedFilterValue,getInputValue,isBlankOption}from"./utils.js";import{ComboboxWithApiPagination,ComboboxWithApiTreeView}from"@box/combobox-with-api";import{Field,getIn,useFormikContext}from"formik";import{useCallback,useState}from"react";import{useIntl}from"react-intl";import clsx from"clsx";import{Fragment,jsx,jsxs}from"react/jsx-runtime";var LegacyMetadataTaxonomyFieldAdvanced=({className,disableForm,fieldNamePrefix,label,labelSubtitle,portalElement,taxonomyOptionsFetcher,isMultilevelTaxonomyFieldEnabled,hasAccordion,isAdvancedFilterEnabled,onAdvancedFilterOptionChange,fieldAdvancedFilterOptions,filterOptionsMap,isModified})=>{let{setFieldValue,values}=useFormikContext(),{metadata:{templateKey,scope}}=values,intl=useIntl(),fieldName=`${fieldNamePrefix}.value`,{key,optionsRules,levels}=getIn(values,fieldNamePrefix),
|
|
1
|
+
import messages from"../../../../messages.js";import{t as AdvancedFilterSelect}from"../../../../../../chunks/advanced-filter-select.js";import{t as metadata_taxonomy_field_advanced_module_default}from"../../../../../../chunks/metadata-taxonomy-field-advanced.module.js";import{createFieldValue,getInitialAdvancedFilterValue,getInputValue,getSelectableLevelsForAdvancedFilter,isAtOrWithinOption,isBlankOption,retainSelectableTaxonomyValues}from"./utils.js";import{ComboboxWithApiPagination,ComboboxWithApiTreeView}from"@box/combobox-with-api";import{Field,getIn,useFormikContext}from"formik";import{useCallback,useMemo,useRef,useState}from"react";import{useIntl}from"react-intl";import clsx from"clsx";import{Fragment,jsx,jsxs}from"react/jsx-runtime";var LegacyMetadataTaxonomyFieldAdvanced=({className,disableForm,fieldNamePrefix,label,labelSubtitle,portalElement,taxonomyOptionsFetcher,isMultilevelTaxonomyFieldEnabled,hasAccordion,isAdvancedFilterEnabled,onAdvancedFilterOptionChange,fieldAdvancedFilterOptions,filterOptionsMap,isModified})=>{let{setFieldValue,values}=useFormikContext(),{metadata:{templateKey,scope}}=values,intl=useIntl(),fieldName=`${fieldNamePrefix}.value`,{key,optionsRules,levels}=getIn(values,fieldNamePrefix),[advancedFilterOption,setAdvancedFilterOption]=useState(getInitialAdvancedFilterValue(fieldAdvancedFilterOptions,filterOptionsMap)),[isSelectOpen,setIsSelectOpen]=useState(!1),fetchedSelectableByIdRef=useRef(new Map),selectableLevels=useMemo(()=>getSelectableLevelsForAdvancedFilter({advancedFilterOption,selectableLevels:optionsRules?.selectableLevels,levels}),[advancedFilterOption,levels,optionsRules?.selectableLevels]),isMultilevelTaxonomy=isMultilevelTaxonomyFieldEnabled&&selectableLevels?.some(level=>level>1),defaultFetcher=useCallback(input=>taxonomyOptionsFetcher?taxonomyOptionsFetcher(scope,templateKey,key,selectableLevels?.[0]??0,input).then(response=>{if(!isAtOrWithinOption(advancedFilterOption)||!selectableLevels?.length)return response;let selectableLevelsSet=new Set(selectableLevels);return{...response,options:response.options?.map(option=>(typeof option.selectable==`boolean`&&fetchedSelectableByIdRef.current.set(option.value,option.selectable),{...option,selectable:option.selectable||selectableLevelsSet.has(option.level)}))}}):Promise.resolve({options:[]}),[advancedFilterOption,key,scope,selectableLevels,taxonomyOptionsFetcher,templateKey]),getPlaceholder=useCallback(selectedValues=>selectedValues?.length===0?intl.formatMessage(messages.multiselectPlaceholder):``,[intl]),handleAdvancedFilterOptionChange=useCallback((value,inputValue,form)=>{setAdvancedFilterOption(value),onAdvancedFilterOptionChange?.(fieldName,value);let newValue=createFieldValue(isBlankOption(value)?[]:retainSelectableTaxonomyValues(inputValue,value,optionsRules?.selectableLevels,fetchedSelectableByIdRef.current),value,isAdvancedFilterEnabled);form.setFieldValue(fieldName,newValue)},[fieldName,isAdvancedFilterEnabled,onAdvancedFilterOptionChange,optionsRules?.selectableLevels]),handleComboboxOpenChange=useCallback(open=>{open&&setIsSelectOpen(!1)},[]),handleValueChange=useCallback(value=>{setFieldValue(fieldName,createFieldValue(value,advancedFilterOption,isAdvancedFilterEnabled))},[advancedFilterOption,fieldName,isAdvancedFilterEnabled,setFieldValue]);return jsx(`div`,{"data-testid":`${label}-field`,children:jsx(Field,{name:fieldName,children:({field,form})=>{let inputValue=getInputValue(field.value,isAdvancedFilterEnabled);return jsxs(Fragment,{children:[jsx(AdvancedFilterSelect,{disableForm:disableForm??!1,fieldAdvancedFilterOptions,fieldNamePrefix,filterOptionsMap,isModified,label,labelSubtitle,onAdvancedFilterOptionChange,onOpenChange:setIsSelectOpen,onValueChange:value=>handleAdvancedFilterOptionChange(value,inputValue,form),open:isSelectOpen,portalElement,showLabel:!hasAccordion,value:advancedFilterOption}),!isBlankOption(advancedFilterOption)&&jsx(`div`,{className:clsx(metadata_taxonomy_field_advanced_module_default.comboboxWrapper,disableForm&&metadata_taxonomy_field_advanced_module_default.disabled),children:isMultilevelTaxonomy?jsx(ComboboxWithApiTreeView,{className:clsx(className,disableForm&&metadata_taxonomy_field_advanced_module_default.disabledTreeView),defaultFetcher,disabled:disableForm,hideLabel:!0,label,levels,multiselect:!0,onOpenChange:handleComboboxOpenChange,onValueChange:handleValueChange,placeholder:getPlaceholder(inputValue),portalElement,selectableLevels,value:inputValue}):jsx(ComboboxWithApiPagination,{className,defaultFetcher,disabled:disableForm,label:void 0,multiselect:!0,onOpenChange:handleComboboxOpenChange,onValueChange:handleValueChange,placeholder:getPlaceholder(inputValue),portalElement,value:inputValue})})]})}})})};export{LegacyMetadataTaxonomyFieldAdvanced,LegacyMetadataTaxonomyFieldAdvanced as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import messages from"../../../../../messages.js";import{t as AdvancedFilterSelect}from"../../../../../../../chunks/advanced-filter-select.js";import{getTaxonomyPickerMode,mapFormValueToTaxonomyValues,mapLevelsToTaxonomyLevels,mapTaxonomyValuesToFormValue}from"./value-mapping.js";import{t as metadata_taxonomy_field_advanced_module_default}from"../../../../../../../chunks/metadata-taxonomy-field-advanced.module.js";import{createFieldValue,getInitialAdvancedFilterValue,getInputValue,isBlankOption}from"../utils.js";import{Field,getIn,useFormikContext}from"formik";import{useCallback,useMemo,useRef,useState}from"react";import{useIntl}from"react-intl";import clsx from"clsx";import{Fragment,jsx,jsxs}from"react/jsx-runtime";import{MetadataTaxonomyPicker}from"@box/metadata-taxonomy-picker";var MetadataTaxonomyPickerFieldAdvanced=({className,disableForm,fieldNamePrefix,label,labelSubtitle,portalElement,isMultilevelTaxonomyFieldEnabled,hasAccordion,isAdvancedFilterEnabled,onAdvancedFilterOptionChange,fieldAdvancedFilterOptions,filterOptionsMap,isModified,createTaxonomyItemsService})=>{let{setFieldValue,values}=useFormikContext(),{metadata:{templateKey,scope}}=values,intl=useIntl(),fieldName=`${fieldNamePrefix}.value`,{key,optionsRules,levels}=getIn(values,fieldNamePrefix),
|
|
1
|
+
import messages from"../../../../../messages.js";import{t as AdvancedFilterSelect}from"../../../../../../../chunks/advanced-filter-select.js";import{getTaxonomyPickerMode,mapFormValueToTaxonomyValues,mapLevelsToTaxonomyLevels,mapTaxonomyValuesToFormValue}from"./value-mapping.js";import{t as metadata_taxonomy_field_advanced_module_default}from"../../../../../../../chunks/metadata-taxonomy-field-advanced.module.js";import{createFieldValue,getInitialAdvancedFilterValue,getInputValue,getSelectableLevelsForAdvancedFilter,isAtOrWithinOption,isBlankOption,retainSelectableTaxonomyValues}from"../utils.js";import{Field,getIn,useFormikContext}from"formik";import{useCallback,useMemo,useRef,useState}from"react";import{useIntl}from"react-intl";import clsx from"clsx";import{Fragment,jsx,jsxs}from"react/jsx-runtime";import{MetadataTaxonomyPicker}from"@box/metadata-taxonomy-picker";var MetadataTaxonomyPickerFieldAdvanced=({className,disableForm,fieldNamePrefix,label,labelSubtitle,portalElement,isMultilevelTaxonomyFieldEnabled,hasAccordion,isAdvancedFilterEnabled,onAdvancedFilterOptionChange,fieldAdvancedFilterOptions,filterOptionsMap,isModified,createTaxonomyItemsService})=>{let{setFieldValue,values}=useFormikContext(),{metadata:{templateKey,scope}}=values,intl=useIntl(),fieldName=`${fieldNamePrefix}.value`,{key,optionsRules,levels}=getIn(values,fieldNamePrefix),[advancedFilterOption,setAdvancedFilterOption]=useState(getInitialAdvancedFilterValue(fieldAdvancedFilterOptions,filterOptionsMap)),[isSelectOpen,setIsSelectOpen]=useState(!1),lastValuesRef=useRef([]),fetchedSelectableByIdRef=useRef(new Map),selectableLevels=useMemo(()=>getSelectableLevelsForAdvancedFilter({advancedFilterOption,selectableLevels:optionsRules?.selectableLevels,levels}),[advancedFilterOption,levels,optionsRules?.selectableLevels]),mode=getTaxonomyPickerMode(isMultilevelTaxonomyFieldEnabled,selectableLevels),baseItemsService=useMemo(()=>createTaxonomyItemsService({scope,templateKey,fieldKey:key}),[createTaxonomyItemsService,scope,templateKey,key]),itemsService=useMemo(()=>{if(!isAtOrWithinOption(advancedFilterOption)||!selectableLevels?.length)return baseItemsService;let selectableLevelsSet=new Set(selectableLevels);return{...baseItemsService,async getNodes(parentId,params){let response=await baseItemsService.getNodes(parentId,params);return{...response,entries:response.entries.map(entry=>(fetchedSelectableByIdRef.current.set(entry.id,entry.selectable),{...entry,selectable:entry.selectable||selectableLevelsSet.has(entry.level)}))}},async searchNodes(query,params){let response=await baseItemsService.searchNodes(query,params);return{...response,entries:response.entries.map(entry=>(fetchedSelectableByIdRef.current.set(entry.id,entry.selectable),{...entry,selectable:entry.selectable||selectableLevelsSet.has(entry.level)}))}}}},[advancedFilterOption,baseItemsService,selectableLevels]),pickerLevels=useMemo(()=>mapLevelsToTaxonomyLevels(levels,selectableLevels),[levels,selectableLevels]),getPlaceholder=useCallback(selectedValues=>selectedValues.length===0?intl.formatMessage(messages.multiselectPlaceholder):``,[intl]),handleAdvancedFilterOptionChange=useCallback((value,inputValue,form)=>{setAdvancedFilterOption(value),onAdvancedFilterOptionChange?.(fieldName,value);let valuesToUse=[];isBlankOption(value)||(valuesToUse=retainSelectableTaxonomyValues(inputValue.length?inputValue:lastValuesRef.current,value,optionsRules?.selectableLevels,fetchedSelectableByIdRef.current),lastValuesRef.current=valuesToUse);let newValue=createFieldValue(valuesToUse,value,isAdvancedFilterEnabled);form.setFieldValue(fieldName,newValue)},[fieldName,isAdvancedFilterEnabled,onAdvancedFilterOptionChange,optionsRules?.selectableLevels]),eventService=useMemo(()=>({onOpenChange:open=>{open&&setIsSelectOpen(!1)}}),[]),handleValueChange=useCallback(newValues=>{let mapped=mapTaxonomyValuesToFormValue(newValues,mode);lastValuesRef.current=mapped,setFieldValue(fieldName,createFieldValue(mapped,advancedFilterOption,isAdvancedFilterEnabled))},[advancedFilterOption,fieldName,isAdvancedFilterEnabled,mode,setFieldValue]);return jsx(`div`,{"data-testid":`${label}-field`,children:jsx(Field,{name:fieldName,children:({field,form})=>{let inputValue=getInputValue(field.value,isAdvancedFilterEnabled),pickerValue=mapFormValueToTaxonomyValues(inputValue);return jsxs(Fragment,{children:[jsx(AdvancedFilterSelect,{disableForm:disableForm??!1,fieldAdvancedFilterOptions,fieldNamePrefix,filterOptionsMap,isModified,label,labelSubtitle,onAdvancedFilterOptionChange,onOpenChange:setIsSelectOpen,onValueChange:value=>handleAdvancedFilterOptionChange(value,inputValue,form),open:isSelectOpen,portalElement,showLabel:!hasAccordion,value:advancedFilterOption}),!isBlankOption(advancedFilterOption)&&jsx(`div`,{className:clsx(metadata_taxonomy_field_advanced_module_default.comboboxWrapper,disableForm&&metadata_taxonomy_field_advanced_module_default.disabled),children:jsx(MetadataTaxonomyPicker,{containerClassName:className,disabled:disableForm,eventService,itemsService,levels:pickerLevels,mode,multiSelect:!0,onValueChange:handleValueChange,placeholder:getPlaceholder(pickerValue),portalElement,value:pickerValue})})]})}})})};export{MetadataTaxonomyPickerFieldAdvanced,MetadataTaxonomyPickerFieldAdvanced as default};
|
package/dist/esm/lib/components/metadata-filter-fields/components/metadata-taxonomy-field/utils.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as FilterKeyTypes}from"../../../../../../chunks/types.js";var TaxonomyAdvancedFilterOption=function(TaxonomyAdvancedFilterOption){return TaxonomyAdvancedFilterOption.MATCH_ANY=`matchAny`,TaxonomyAdvancedFilterOption.MATCH_ALL=`matchAll`,TaxonomyAdvancedFilterOption.IS_BLANK=`isBlank`,TaxonomyAdvancedFilterOption.IS_NOT_BLANK=`isNotBlank`,TaxonomyAdvancedFilterOption}({}),getInitialAdvancedFilterValue=(fieldAdvancedFilterOptions,filterOptionsMap)=>fieldAdvancedFilterOptions&&filterOptionsMap?.some(([key])=>key===fieldAdvancedFilterOptions)?fieldAdvancedFilterOptions:FilterKeyTypes.MATCH_ANY,isBlankOption=advancedFilterOption=>advancedFilterOption===FilterKeyTypes.IS_BLANK||advancedFilterOption===FilterKeyTypes.IS_NOT_BLANK,getInputValue=(fieldValue,isAdvancedFilterEnabled)=>Array.isArray(fieldValue)?fieldValue:isAdvancedFilterEnabled&&typeof fieldValue==`object`&&fieldValue&&fieldValue.value||[],createFieldValue=(inputValue,advancedFilterOption,isAdvancedFilterEnabled)=>isAdvancedFilterEnabled?{value:isBlankOption(advancedFilterOption)?[]:inputValue,advancedFilterOption}:inputValue;export{TaxonomyAdvancedFilterOption,createFieldValue,getInitialAdvancedFilterValue,getInputValue,isBlankOption};
|
|
1
|
+
import{t as FilterKeyTypes}from"../../../../../../chunks/types.js";var TaxonomyAdvancedFilterOption=function(TaxonomyAdvancedFilterOption){return TaxonomyAdvancedFilterOption.MATCH_ANY=`matchAny`,TaxonomyAdvancedFilterOption.MATCH_ALL=`matchAll`,TaxonomyAdvancedFilterOption.IS_BLANK=`isBlank`,TaxonomyAdvancedFilterOption.IS_NOT_BLANK=`isNotBlank`,TaxonomyAdvancedFilterOption}({}),getInitialAdvancedFilterValue=(fieldAdvancedFilterOptions,filterOptionsMap)=>fieldAdvancedFilterOptions&&filterOptionsMap?.some(([key])=>key===fieldAdvancedFilterOptions)?fieldAdvancedFilterOptions:FilterKeyTypes.MATCH_ANY,isBlankOption=advancedFilterOption=>advancedFilterOption===FilterKeyTypes.IS_BLANK||advancedFilterOption===FilterKeyTypes.IS_NOT_BLANK,isAtOrWithinOption=advancedFilterOption=>advancedFilterOption===FilterKeyTypes.MATCH_AT_OR_WITHIN||advancedFilterOption===FilterKeyTypes.IS_NOT_AT_OR_WITHIN,getInputValue=(fieldValue,isAdvancedFilterEnabled)=>Array.isArray(fieldValue)?fieldValue:isAdvancedFilterEnabled&&typeof fieldValue==`object`&&fieldValue&&fieldValue.value||[],createFieldValue=(inputValue,advancedFilterOption,isAdvancedFilterEnabled)=>isAdvancedFilterEnabled?{value:isBlankOption(advancedFilterOption)?[]:inputValue,advancedFilterOption}:inputValue,getSelectableLevelsForAdvancedFilter=({advancedFilterOption,selectableLevels,levels})=>{if(!isAtOrWithinOption(advancedFilterOption))return selectableLevels;let allLevels=levels?.map(levelOption=>levelOption.level);return allLevels?.length?allLevels:selectableLevels},retainSelectableTaxonomyValues=(values,advancedFilterOption,configuredSelectableLevels,fetchedSelectableById)=>{if(isAtOrWithinOption(advancedFilterOption))return values;let allowedLevels=configuredSelectableLevels?.length?new Set(configuredSelectableLevels):void 0;return values.filter(({value,level})=>{let isFetchedNonSelectable=fetchedSelectableById?.get(value)===!1,isLevelNotAllowed=allowedLevels!=null&&level!=null&&!allowedLevels.has(level);return!isFetchedNonSelectable&&!isLevelNotAllowed})};export{TaxonomyAdvancedFilterOption,createFieldValue,getInitialAdvancedFilterValue,getInputValue,getSelectableLevelsForAdvancedFilter,isAtOrWithinOption,isBlankOption,retainSelectableTaxonomyValues};
|
|
@@ -8,5 +8,29 @@ export declare enum TaxonomyAdvancedFilterOption {
|
|
|
8
8
|
}
|
|
9
9
|
export declare const getInitialAdvancedFilterValue: (fieldAdvancedFilterOptions?: FilterKey, filterOptionsMap?: Array<FilterOption>) => FilterKey;
|
|
10
10
|
export declare const isBlankOption: (advancedFilterOption: FilterKey) => boolean;
|
|
11
|
+
export declare const isAtOrWithinOption: (advancedFilterOption: FilterKey) => boolean;
|
|
11
12
|
export declare const getInputValue: <T>(fieldValue: unknown, isAdvancedFilterEnabled?: boolean) => T[];
|
|
12
13
|
export declare const createFieldValue: <T>(inputValue: T[], advancedFilterOption: FilterKey, isAdvancedFilterEnabled?: boolean) => T[] | TaxonomyFieldValue<T>;
|
|
14
|
+
export declare const getSelectableLevelsForAdvancedFilter: ({ advancedFilterOption, selectableLevels, levels, }: {
|
|
15
|
+
advancedFilterOption: FilterKey;
|
|
16
|
+
selectableLevels: number[] | undefined;
|
|
17
|
+
levels: Array<{
|
|
18
|
+
level: number;
|
|
19
|
+
}> | undefined;
|
|
20
|
+
}) => number[] | undefined;
|
|
21
|
+
type TaxonomySelection = {
|
|
22
|
+
value: string;
|
|
23
|
+
level?: number;
|
|
24
|
+
};
|
|
25
|
+
/**
|
|
26
|
+
* `matchAtOrWithin` / `isNotAtOrWithin` let the user select nodes the taxonomy
|
|
27
|
+
* config would otherwise reject. Switching to an operator that honors that config
|
|
28
|
+
* keeps selections the config allows and drops the rest.
|
|
29
|
+
*
|
|
30
|
+
* A node is dropped when its level is outside `configuredSelectableLevels`, or when
|
|
31
|
+
* the fetched taxonomy marked it non-selectable (`fetchedSelectableById`). Nodes
|
|
32
|
+
* without a level (single-level values) stay unless the fetch said they are not
|
|
33
|
+
* selectable.
|
|
34
|
+
*/
|
|
35
|
+
export declare const retainSelectableTaxonomyValues: <T extends TaxonomySelection>(values: T[], advancedFilterOption: FilterKey, configuredSelectableLevels: number[] | undefined, fetchedSelectableById?: ReadonlyMap<string, boolean>) => T[];
|
|
36
|
+
export {};
|