dinocollab-core 2.2.39 → 2.2.40

package/dist/src/filter-bar/menu/create-form-field-select-multiple.js

@@ -1,2 +1,2 @@
-import{slicedToArray as l,toConsumableArray as e,defineProperty as n}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as o,jsxs as i}from"react/jsx-runtime";import{useMemo as r,useState as t,useRef as a,useEffect as u}from"react";import{styled as c,Typography as s,Box as d,CircularProgress as v,Button as m,FormGroup as f,FormControlLabel as p,Checkbox as b}from"@mui/material";import g from"@mui/icons-material/Info";import{createChipViewers as h}from"../components/chip-viewer.js";import{PopperContent as x,PopperBody as y,PopperFooter as C}from"../components/popper-custom.js";import{ButtonBack as A,ChipDark as V,FilterLogicToggle as k}from"../components/ui.units.js";import{getErrorMessage as z}from"../../form/helpers.js";function j(c){var j=h(),O=(c||{}).options,L=void 0===O?[]:O;return function(h){var O,w,I,R=r(function(){return Object.assign({},h.currentConfig,null==c?void 0:c.config)},[null==c?void 0:c.config,h.currentConfig]),B=h.value,E=void 0===B?{values:[],logic:null!==(O=null==R?void 0:R.defaultLogic)&&void 0!==O?O:"or"}:B,F=t(E.logic),N=l(F,2),T=N[0],D=N[1],M=null!==(w=null==c?void 0:c.forceLogic)&&void 0!==w?w:T,P=null!==(I=null==R?void 0:R.label)&&void 0!==I?I:R.field.toString(),_=t([]),H=l(_,2),U=H[0],q=H[1],G=t(null!=c&&c.fetchOptions?"loading":"loaded"),J=l(G,2),K=J[0],Q=J[1],W=a(null),X=function(){var l;if(null!=c&&c.fetchOptions){null===(l=W.current)||void 0===l||l.abort();var e=new AbortController;W.current=e,Q("loading"),c.fetchOptions(e.signal).then(function(l){q(l),Q("loaded")}).catch(function(l){var e;null===(e=h.onError)||void 0===e||e.call(h),"AbortError"!==(null==l?void 0:l.name)&&Q("error")})}};u(function(){return X(),function(){var l;return null===(l=W.current)||void 0===l?void 0:l.abort()}},[]);var Y=null!=c&&c.fetchOptions?U:L,Z=t(function(){return Array.isArray(E.values)?e(E.values):[]}),$=l(Z,2),ll=$[0],el=$[1],nl=Array.isArray(E.values)?E.values:[],ol=T!==E.logic,il=ll.length!==nl.length||ll.some(function(l){return!nl.includes(l)}),rl=!il&&!ol,tl=t({}),al=l(tl,2),ul=al[0],cl=al[1],sl=function(l){h.onSubmit(R.field,l,R)},dl=z(ul,R.field),vl=r(function(){var l=Array.isArray(E.values)?E.values:[E.values];return{field:R.field,items:l.map(function(l){var e;return{value:l,label:null===(e=Y.find(function(e){return e.value===l}))||void 0===e?void 0:e.label}})}},[R.field,E]),ml=null!=(null==c?void 0:c.maxValueCount)&&ll.length>c.maxValueCount,fl=null!=(null==c?void 0:c.maxValueCount)&&ll.length>=c.maxValueCount,pl=[];return(h.isLoading||"loading"===K)&&pl.push("disabled"),o(S,{className:pl.join(" "),noValidate:!0,onSubmit:function(l){var e;if(l.preventDefault(),il){if(!ml){var o=n({},R.field,ll),i=null===(e=h.validator)||void 0===e?void 0:e.run(o);if(cl(i||{}),!i||0===Object.keys(i).length)sl({values:ll,logic:M})}}else ol&&sl({values:E.values,logic:M})},children:i(x,{title:"Filter by ".concat(P),onClose:h.onClose,slots:{beforeTitle:o(A,{size:"small",onClick:h.onBack}),afterTitle:null!=c&&c.forceLogic?null:R.singleValue?o(V,{sx:{ml:1.5},size:"small",label:"Last value only"}):o(k,{sx:{ml:1},value:M,onChange:function(l,e){D(e)}})},children:[i(y,{children:[R.description&&o(s,{variant:"caption",color:"text.secondary",sx:{mb:1,display:"block"},children:R.description}),null!=(null==c?void 0:c.maxValueCount)&&o(s,{variant:"caption",color:ml?"warning.main":"text.secondary",sx:{mb:.5,display:"block"},children:null!=c&&c.maxValueCount?ml?"Maximum ".concat(c.maxValueCount," value").concat(c.maxValueCount>1?"s":""," selected (limit reached)"):"Up to ".concat(c.maxValueCount," value").concat(c.maxValueCount>1?"s":""," can be selected"):""}),o(j,{sx:{mb:1,borderBottom:"none!important"},label:"Applied",placement:"horizontal",enableMinimalesticView:!0,value:vl,onRemove:h.onRemove}),"loading"===K&&o(d,{sx:{display:"flex",justifyContent:"center",mt:2},children:o(v,{size:20})}),"error"===K&&i(d,{sx:{display:"flex",flexDirection:"column",alignItems:"center",mt:2,mb:3,gap:1},children:[o(g,{color:"error",fontSize:"large"}),o(s,{variant:"body2",color:"error",children:"Failed to load options"}),o(m,{size:"small",variant:"outlined",color:"error",onClick:X,children:"Retry"})]}),0===Y.length&&"loaded"===K&&o(s,{variant:"body2",color:"text.secondary",sx:{mt:2},children:"No options available"}),o(f,{className:dl.error?"error":"",children:Y.map(function(l,n){var i,r=ll.includes(l.value),t=vl.items.some(function(e){return e.value===l.value})&&!0===(null==c?void 0:c.disabledAfterSubmit),a=!r&&fl;return o(p,{value:l.value,disabled:t||a,label:null!==(i=l.label)&&void 0!==i?i:l.value,control:o(b,{name:R.field.toString(),checked:r,onChange:function(n){return o=l.value,i=n.target.checked,void el(function(l){return i?[].concat(e(l),[o]):l.filter(function(l){return l!==o})});var o,i}})},l.value.toString()+n)})})]}),i(C,{children:[o(m,{size:"small",color:"error",variant:"text",disabled:!E.values||0===E.values.length,onClick:function(){var l,e;null===(l=h.onRemoveField)||void 0===l||l.call(h,R.field),!1!==(null==c||null===(e=c.config)||void 0===e?void 0:e.closeAfterClear)&&h.onClose()},children:"Clear All"}),o(d,{sx:{flex:1}}),o(m,{size:"small",color:"inherit",variant:"text",onClick:h.onClose,children:"Cancel"}),o(m,{size:"small",type:"submit",color:"primary",variant:"contained",disabled:rl,children:"Apply"})]})]})})}}var S=c("form")({position:"relative","&::after":{content:'""',display:"block",position:"absolute",inset:0,backgroundColor:"rgba(0, 0, 0, 0.12)",filter:"blur(2px)",zIndex:-1,opacity:0,transition:"opacity 0.3s",visibility:"hidden"},"&.disabled":{pointerEvents:"none","&::after":{zIndex:1,opacity:1,visibility:"visible"}}});export{j as default};
+import{slicedToArray as l,toConsumableArray as e,defineProperty as n}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as o,jsxs as i}from"react/jsx-runtime";import{useMemo as r,useState as t,useRef as a,useEffect as u}from"react";import{styled as c,Box as s,Typography as d,CircularProgress as v,Button as m,FormGroup as f,FormControlLabel as p,Checkbox as b}from"@mui/material";import g from"@mui/icons-material/Info";import{createChipViewers as h}from"../components/chip-viewer.js";import{PopperContent as x,PopperBody as y,PopperFooter as C}from"../components/popper-custom.js";import{ButtonBack as A,ChipDark as V,FilterLogicToggle as k}from"../components/ui.units.js";import{getErrorMessage as z}from"../../form/helpers.js";function j(c){var j=h(),O=(c||{}).options,L=void 0===O?[]:O;return function(h){var O,w,I,R=r(function(){return Object.assign({},h.currentConfig,null==c?void 0:c.config)},[null==c?void 0:c.config,h.currentConfig]),B=h.value,E=void 0===B?{values:[],logic:null!==(O=null==R?void 0:R.defaultLogic)&&void 0!==O?O:"or"}:B,F=t(E.logic),N=l(F,2),T=N[0],D=N[1],M=null!==(w=null==c?void 0:c.forceLogic)&&void 0!==w?w:T,P=null!==(I=null==R?void 0:R.label)&&void 0!==I?I:R.field.toString(),_=t([]),H=l(_,2),U=H[0],q=H[1],G=t(null!=c&&c.fetchOptions?"loading":"loaded"),J=l(G,2),K=J[0],Q=J[1],W=a(null),X=function(){var l;if(null!=c&&c.fetchOptions){null===(l=W.current)||void 0===l||l.abort();var e=new AbortController;W.current=e,Q("loading"),c.fetchOptions(e.signal).then(function(l){q(l),Q("loaded")}).catch(function(l){var e;null===(e=h.onError)||void 0===e||e.call(h),"AbortError"!==(null==l?void 0:l.name)&&Q("error")})}};u(function(){return X(),function(){var l;return null===(l=W.current)||void 0===l?void 0:l.abort()}},[]);var Y=null!=c&&c.fetchOptions?U:L,Z=t(function(){return Array.isArray(E.values)?e(E.values):[]}),$=l(Z,2),ll=$[0],el=$[1],nl=Array.isArray(E.values)?E.values:[],ol=T!==E.logic,il=ll.length!==nl.length||ll.some(function(l){return!nl.includes(l)}),rl=!il&&!ol,tl=t({}),al=l(tl,2),ul=al[0],cl=al[1],sl=function(l){h.onSubmit(R.field,l,R)},dl=z(ul,R.field),vl=r(function(){var l=Array.isArray(E.values)?E.values:[E.values];return{field:R.field,items:l.map(function(l){var e;return{value:l,label:null===(e=Y.find(function(e){return e.value===l}))||void 0===e?void 0:e.label}})}},[R.field,E]),ml=null!=(null==c?void 0:c.maxValueCount)&&ll.length>c.maxValueCount,fl=null!=(null==c?void 0:c.maxValueCount)&&ll.length>=c.maxValueCount;r(function(){var l=(null==c?void 0:c.top)||h.top;return l?o(s,{sx:{mb:1},children:l}):null},[null==c?void 0:c.top,h.top]);var pl=[];return(h.isLoading||"loading"===K)&&pl.push("disabled"),o(S,{className:pl.join(" "),noValidate:!0,onSubmit:function(l){var e;if(l.preventDefault(),il){if(!ml){var o=n({},R.field,ll),i=null===(e=h.validator)||void 0===e?void 0:e.run(o);if(cl(i||{}),!i||0===Object.keys(i).length)sl({values:ll,logic:M})}}else ol&&sl({values:E.values,logic:M})},children:i(x,{title:"Filter by ".concat(P),onClose:h.onClose,slots:{beforeTitle:o(A,{size:"small",onClick:h.onBack}),afterTitle:null!=c&&c.forceLogic?null:R.singleValue?o(V,{sx:{ml:1.5},size:"small",label:"Last value only"}):o(k,{sx:{ml:1},value:M,onChange:function(l,e){D(e)}})},children:[i(y,{children:[R.description&&o(d,{variant:"caption",color:"text.secondary",sx:{mb:1,display:"block"},children:R.description}),null!=(null==c?void 0:c.maxValueCount)&&o(d,{variant:"caption",color:ml?"warning.main":"text.secondary",sx:{mb:.5,display:"block"},children:null!=c&&c.maxValueCount?ml?"Maximum ".concat(c.maxValueCount," value").concat(c.maxValueCount>1?"s":""," selected (limit reached)"):"Up to ".concat(c.maxValueCount," value").concat(c.maxValueCount>1?"s":""," can be selected"):""}),o(j,{sx:{mb:1,borderBottom:"none!important"},label:"Applied",placement:"horizontal",enableMinimalesticView:!0,value:vl,onRemove:h.onRemove}),"loading"===K&&o(s,{sx:{display:"flex",justifyContent:"center",mt:2},children:o(v,{size:20})}),"error"===K&&i(s,{sx:{display:"flex",flexDirection:"column",alignItems:"center",mt:2,mb:3,gap:1},children:[o(g,{color:"error",fontSize:"large"}),o(d,{variant:"body2",color:"error",children:"Failed to load options"}),o(m,{size:"small",variant:"outlined",color:"error",onClick:X,children:"Retry"})]}),0===Y.length&&"loaded"===K&&o(d,{variant:"body2",color:"text.secondary",sx:{mt:2},children:"No options available"}),o(f,{className:dl.error?"error":"",children:Y.map(function(l,n){var i,r=ll.includes(l.value),t=vl.items.some(function(e){return e.value===l.value})&&!0===(null==c?void 0:c.disabledAfterSubmit),a=!r&&fl;return o(p,{value:l.value,disabled:t||a,label:null!==(i=l.label)&&void 0!==i?i:l.value,control:o(b,{name:R.field.toString(),checked:r,onChange:function(n){return o=l.value,i=n.target.checked,void el(function(l){return i?[].concat(e(l),[o]):l.filter(function(l){return l!==o})});var o,i}})},l.value.toString()+n)})})]}),i(C,{children:[o(m,{size:"small",color:"error",variant:"text",disabled:!E.values||0===E.values.length,onClick:function(){var l,e;null===(l=h.onRemoveField)||void 0===l||l.call(h,R.field),!1!==(null==c||null===(e=c.config)||void 0===e?void 0:e.closeAfterClear)&&h.onClose()},children:"Clear All"}),o(s,{sx:{flex:1}}),o(m,{size:"small",color:"inherit",variant:"text",onClick:h.onClose,children:"Cancel"}),o(m,{size:"small",type:"submit",color:"primary",variant:"contained",disabled:rl,children:"Apply"})]})]})})}}var S=c("form")({position:"relative","&::after":{content:'""',display:"block",position:"absolute",inset:0,backgroundColor:"rgba(0, 0, 0, 0.12)",filter:"blur(2px)",zIndex:-1,opacity:0,transition:"opacity 0.3s",visibility:"hidden"},"&.disabled":{pointerEvents:"none","&::after":{zIndex:1,opacity:1,visibility:"visible"}}});export{j as default};
 //# sourceMappingURL=create-form-field-select-multiple.js.map

package/dist/src/filter-bar/menu/create-form-field-select-multiple.js.map

@@ -1 +1 @@
-{"version":3,"file":"create-form-field-select-multiple.js","sources":["../../../../src/filter-bar/menu/create-form-field-select-multiple.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { useEffect, useMemo, useRef, useState } from 'react'\r\nimport { Box, Button, Checkbox, CircularProgress, FormControlLabel, FormGroup, formGroupClasses, styled, Typography } from '@mui/material'\r\nimport InfoIcon from '@mui/icons-material/Info'\r\nimport { getErrorMessage } from '../../form'\r\nimport { createChipViewers, TChipViewerGroup } from '../components/chip-viewer'\r\nimport { PopperBody, PopperContent, PopperFooter } from '../components/popper-custom'\r\nimport { ButtonBack, ChipDark, FilterLogicToggle } from '../components/ui.units'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { IPartialError } from '../../form/validator'\r\nimport type { IFieldSelectOption } from './create-form-field-select'\r\nimport type { TFieldModelValid, TFieldValid, TFieldValue, TLogic } from '../types'\r\nimport type { IFieldMenuConfig, IFilterMenuFormProps, TFetchStatus } from './types'\r\n\r\n/** Props for the `FormFieldSelectMultiple` component returned by `createFormFieldSelectMultiple`. Extends the base filter-menu form props. */\r\nexport interface IFormFieldSelectMultipleProps<T> extends IFilterMenuFormProps<T> {\r\n  onError?: () => void\r\n}\r\n\r\n/** Parameters passed to `createFormFieldSelectMultiple` to configure the generated component. */\r\nexport interface IFormFieldSelectMultipleParam<T> {\r\n  /** Optional configuration for the form field */\r\n  config?: IFieldMenuConfig<T>\r\n  /** List of options for the select field */\r\n  options?: IFieldSelectOption[]\r\n  /** Function to fetch options asynchronously */\r\n  fetchOptions?: (signal?: AbortSignal) => Promise<IFieldSelectOption[]>\r\n  /** If true, disables the field after submission. @default false */\r\n  disabledAfterSubmit?: boolean\r\n  /** Force a fixed logic value, hiding the logic toggle */\r\n  forceLogic?: TLogic\r\n  /** Maximum number of values that can be selected */\r\n  maxValueCount?: number\r\n}\r\n\r\n/**\r\n * Factory function that creates a `FormFieldSelectMultiple` filter-menu component.\r\n *\r\n * The generated component renders a checkbox list of options inside a\r\n * popper/menu panel, allowing the user to select **multiple values** at once.\r\n * It supports:\r\n * - Controlled checkbox state to prevent uncontrolled→controlled React warnings\r\n * - OR / AND logic toggle when more than one value is applied\r\n * - Chip viewers showing the currently applied values\r\n * - Built-in validation via an optional `validator` prop\r\n * - A loading overlay that disables interaction while `isLoading` is true\r\n *\r\n * @param params - Static configuration (option list, optional field config override)\r\n * @returns A React FC ready to be used as a multi-select filter-menu field component\r\n */\r\nfunction createFormFieldSelectMultiple<T>(params?: IFormFieldSelectMultipleParam<T>) {\r\n  const ChipViewers = createChipViewers<T>()\r\n  const { options: staticOptions = [] } = params || {}\r\n\r\n  const FormFieldSelectMultiple: FC<IFormFieldSelectMultipleProps<T>> = (props) => {\r\n    /** Merge `props.currentConfig` with `params.config` (if provided).\r\n     * Fields from `params.config` override the corresponding keys in `props.currentConfig`.\r\n     * Any keys not present in `params.config` are preserved from `props.currentConfig`.\r\n     */\r\n    const mergedConfig = useMemo(() => Object.assign({}, props.currentConfig, params?.config), [params?.config, props.currentConfig])\r\n\r\n    const { value = { values: [], logic: mergedConfig?.defaultLogic ?? 'or' } } = props\r\n    const [filterLogic, setFilterLogic] = useState<TLogic>(value.logic!)\r\n    const effectiveLogic = params?.forceLogic ?? filterLogic\r\n\r\n    const label = mergedConfig?.label ?? mergedConfig.field.toString()\r\n\r\n    const [fetchedOptions, setFetchedOptions] = useState<IFieldSelectOption[]>([])\r\n    const [fetchStatus, setFetchStatus] = useState<TFetchStatus>(params?.fetchOptions ? 'loading' : 'loaded')\r\n    const abortRef = useRef<AbortController | null>(null)\r\n\r\n    const runFetch = () => {\r\n      if (!params?.fetchOptions) return\r\n      abortRef.current?.abort()\r\n      const controller = new AbortController()\r\n      abortRef.current = controller\r\n      setFetchStatus('loading')\r\n      params\r\n        .fetchOptions(controller.signal)\r\n        .then((data) => {\r\n          setFetchedOptions(data)\r\n          setFetchStatus('loaded')\r\n        })\r\n        .catch((err) => {\r\n          props.onError?.()\r\n          if (err?.name !== 'AbortError') setFetchStatus('error')\r\n        })\r\n    }\r\n\r\n    useEffect(() => {\r\n      runFetch()\r\n      return () => abortRef.current?.abort()\r\n    }, [])\r\n\r\n    const options = params?.fetchOptions ? fetchedOptions : staticOptions\r\n\r\n    // Track checked values as controlled state to avoid the uncontrolled→controlled MUI warning\r\n    // Initialize directly from value.values so pre-selected values are visible even before fetchOptions resolves\r\n    const [checkedValues, setCheckedValues] = useState<TFieldValid[]>(() => {\r\n      return Array.isArray(value.values) ? [...value.values] : []\r\n    })\r\n\r\n    const appliedValues = Array.isArray(value.values) ? value.values : []\r\n    const hasLogicChange = filterLogic !== value.logic\r\n    const hasDataChange = checkedValues.length !== appliedValues.length || checkedValues.some((v) => !appliedValues.includes(v))\r\n    const isApplyDisabled = !hasDataChange && !hasLogicChange\r\n\r\n    const [errorData, setErrorData] = useState<IPartialError<TFieldModelValid<T>>>({})\r\n\r\n    const handleCheckboxChange = (optionValue: TFieldValid, checked: boolean) => {\r\n      setCheckedValues((prev) => (checked ? [...prev, optionValue] : prev.filter((v) => v !== optionValue)))\r\n    }\r\n\r\n    const handleSubmit = (newValue: TFieldValue) => {\r\n      props.onSubmit(mergedConfig.field, newValue, mergedConfig)\r\n    }\r\n\r\n    const handleSubmitForm = (event: React.FormEvent<HTMLFormElement>) => {\r\n      event.preventDefault()\r\n\r\n      if (!hasDataChange) {\r\n        if (hasLogicChange) handleSubmit({ values: value.values, logic: effectiveLogic })\r\n        return\r\n      }\r\n\r\n      if (isMaxReached) return\r\n\r\n      const obj = { [mergedConfig.field]: checkedValues } as Partial<TFieldModelValid<T>>\r\n      let errorData = props.validator?.run(obj) as IPartialError<TFieldModelValid<T>>\r\n\r\n      setErrorData(errorData || {})\r\n\r\n      if (!errorData || Object.keys(errorData).length === 0) {\r\n        const newValue: TFieldValue = { values: checkedValues, logic: effectiveLogic }\r\n        handleSubmit(newValue)\r\n      }\r\n    }\r\n\r\n    const errorResult = getErrorMessage(errorData, mergedConfig.field)\r\n    const filterViewerValue = useMemo<TChipViewerGroup<T>>(() => {\r\n      const items = Array.isArray(value.values) ? value.values : [value.values]\r\n      return {\r\n        field: mergedConfig.field,\r\n        items: items.map((v) => ({ value: v, label: options.find((o) => o.value === v)?.label }))\r\n      }\r\n    }, [mergedConfig.field, value])\r\n\r\n    const isMaxReached = params?.maxValueCount != null && checkedValues.length > params.maxValueCount\r\n    const isMaxReachedValid = params?.maxValueCount != null && checkedValues.length >= params.maxValueCount\r\n\r\n    const handleChangeLogic = (newLogic: TLogic) => {\r\n      setFilterLogic(newLogic)\r\n    }\r\n\r\n    const handleClearAll = () => {\r\n      props.onRemoveField?.(mergedConfig.field)\r\n      if (params?.config?.closeAfterClear !== false) props.onClose()\r\n    }\r\n\r\n    const getMaxReachedText = () => {\r\n      if (!params?.maxValueCount) return ''\r\n      if (isMaxReached) {\r\n        return `Maximum ${params.maxValueCount} value${params.maxValueCount > 1 ? 's' : ''} selected (limit reached)`\r\n      } else {\r\n        return `Up to ${params.maxValueCount} value${params.maxValueCount > 1 ? 's' : ''} can be selected`\r\n      }\r\n    }\r\n\r\n    const renderAfterTitle = () => {\r\n      if (params?.forceLogic) return null\r\n      if (mergedConfig.singleValue) return <ChipDark sx={{ ml: 1.5 }} size='small' label='Last value only' />\r\n      return <FilterLogicToggle sx={{ ml: 1 }} value={effectiveLogic} onChange={(_, nVal) => handleChangeLogic(nVal)} />\r\n    }\r\n\r\n    const rootClasses: string[] = []\r\n    if (props.isLoading || fetchStatus === 'loading') rootClasses.push('disabled')\r\n\r\n    return (\r\n      <RootStyled className={rootClasses.join(' ')} noValidate onSubmit={handleSubmitForm}>\r\n        <PopperContent\r\n          title={`Filter by ${label}`}\r\n          onClose={props.onClose}\r\n          slots={{\r\n            beforeTitle: <ButtonBack size='small' onClick={props.onBack} />,\r\n            afterTitle: renderAfterTitle()\r\n          }}\r\n        >\r\n          <PopperBody>\r\n            {mergedConfig.description && (\r\n              <Typography variant='caption' color='text.secondary' sx={{ mb: 1, display: 'block' }}>\r\n                {mergedConfig.description}\r\n              </Typography>\r\n            )}\r\n            {params?.maxValueCount != null && (\r\n              <Typography variant='caption' color={isMaxReached ? 'warning.main' : 'text.secondary'} sx={{ mb: 0.5, display: 'block' }}>\r\n                {getMaxReachedText()}\r\n              </Typography>\r\n            )}\r\n            <ChipViewers\r\n              sx={{ mb: 1, borderBottom: 'none!important' }}\r\n              label='Applied'\r\n              placement='horizontal'\r\n              enableMinimalesticView\r\n              value={filterViewerValue}\r\n              onRemove={props.onRemove}\r\n            />\r\n            {fetchStatus === 'loading' && (\r\n              <Box sx={{ display: 'flex', justifyContent: 'center', mt: 2 }}>\r\n                <CircularProgress size={20} />\r\n              </Box>\r\n            )}\r\n            {fetchStatus === 'error' && (\r\n              <Box sx={{ display: 'flex', flexDirection: 'column', alignItems: 'center', mt: 2, mb: 3, gap: 1 }}>\r\n                <InfoIcon color='error' fontSize='large' />\r\n                <Typography variant='body2' color='error'>\r\n                  Failed to load options\r\n                </Typography>\r\n                <Button size='small' variant='outlined' color='error' onClick={runFetch}>\r\n                  Retry\r\n                </Button>\r\n              </Box>\r\n            )}\r\n            {options.length === 0 && fetchStatus === 'loaded' && (\r\n              <Typography variant='body2' color='text.secondary' sx={{ mt: 2 }}>\r\n                No options available\r\n              </Typography>\r\n            )}\r\n            <FormGroup className={errorResult.error ? 'error' : ''}>\r\n              {options.map((x, i) => {\r\n                const isChecked = checkedValues.includes(x.value as TFieldValid)\r\n                const isSelected = filterViewerValue.items.some((item) => item.value === x.value)\r\n                const disabled = isSelected && params?.disabledAfterSubmit === true\r\n                const disableDueToMax = !isChecked && isMaxReachedValid\r\n                return (\r\n                  <FormControlLabel\r\n                    key={x.value.toString() + i}\r\n                    value={x.value}\r\n                    disabled={disabled || disableDueToMax}\r\n                    label={x.label ?? x.value}\r\n                    control={\r\n                      <Checkbox\r\n                        name={mergedConfig.field.toString()}\r\n                        checked={isChecked}\r\n                        onChange={(e) => handleCheckboxChange(x.value as TFieldValid, e.target.checked)}\r\n                      />\r\n                    }\r\n                  />\r\n                )\r\n              })}\r\n            </FormGroup>\r\n          </PopperBody>\r\n          <PopperFooter>\r\n            <Button size='small' color='error' variant='text' disabled={!value.values || value.values.length === 0} onClick={handleClearAll}>\r\n              Clear All\r\n            </Button>\r\n            <Box sx={{ flex: 1 }} />\r\n            <Button size='small' color='inherit' variant='text' onClick={props.onClose}>\r\n              Cancel\r\n            </Button>\r\n            <Button size='small' type='submit' color='primary' variant='contained' disabled={isApplyDisabled}>\r\n              Apply\r\n            </Button>\r\n          </PopperFooter>\r\n        </PopperContent>\r\n      </RootStyled>\r\n    )\r\n  }\r\n\r\n  return FormFieldSelectMultiple\r\n}\r\n\r\nexport default createFormFieldSelectMultiple\r\n\r\nconst RootStyled = styled('form')({\r\n  position: 'relative',\r\n  '&::after': {\r\n    content: '\"\"',\r\n    display: 'block',\r\n    position: 'absolute',\r\n    inset: 0, // top: 0, left: 0, right: 0, bottom: 0\r\n    backgroundColor: 'rgba(0, 0, 0, 0.12)',\r\n    filter: 'blur(2px)',\r\n    zIndex: -1,\r\n    opacity: 0,\r\n    transition: 'opacity 0.3s',\r\n    visibility: 'hidden'\r\n  },\r\n  '&.disabled': {\r\n    pointerEvents: 'none',\r\n    '&::after': {\r\n      zIndex: 1,\r\n      opacity: 1,\r\n      visibility: 'visible'\r\n    }\r\n  }\r\n  // [`.${formGroupClasses.root}`]: {}\r\n})\r\n"],"names":["createFormFieldSelectMultiple","params","ChipViewers","createChipViewers","_ref$options","options","staticOptions","props","_mergedConfig$default","_params$forceLogic","_mergedConfig$label","mergedConfig","useMemo","Object","assign","currentConfig","config","_props$value","value","values","logic","defaultLogic","_useState","useState","_useState2","_slicedToArray","filterLogic","setFilterLogic","effectiveLogic","forceLogic","label","field","toString","_useState3","_useState4","fetchedOptions","setFetchedOptions","_useState5","fetchOptions","_useState6","fetchStatus","setFetchStatus","abortRef","useRef","runFetch","_abortRef$current","current","abort","controller","AbortController","signal","then","data","err","_props$onError","onError","call","name","useEffect","_abortRef$current2","_useState7","Array","isArray","_toConsumableArray","_useState8","checkedValues","setCheckedValues","appliedValues","hasLogicChange","hasDataChange","length","some","v","includes","isApplyDisabled","_useState9","_useState0","errorData","setErrorData","handleSubmit","newValue","onSubmit","errorResult","getErrorMessage","filterViewerValue","items","map","_options$find","find","o","isMaxReached","maxValueCount","isMaxReachedValid","rootClasses","isLoading","push","_jsx","RootStyled","className","join","noValidate","event","_props$validator","preventDefault","obj","_defineProperty","validator","run","keys","children","_jsxs","PopperContent","title","concat","onClose","slots","beforeTitle","ButtonBack","size","onClick","onBack","afterTitle","singleValue","ChipDark","sx","ml","FilterLogicToggle","onChange","_","nVal","PopperBody","description","Typography","variant","color","mb","display","borderBottom","placement","enableMinimalesticView","onRemove","Box","justifyContent","mt","CircularProgress","flexDirection","alignItems","gap","InfoIcon","fontSize","Button","FormGroup","error","x","i","_x$label","isChecked","disabled","item","disabledAfterSubmit","disableDueToMax","FormControlLabel","control","Checkbox","checked","e","optionValue","target","prev","filter","PopperFooter","_props$onRemoveField","_params$config","onRemoveField","closeAfterClear","flex","type","styled","position","content","inset","backgroundColor","zIndex","opacity","transition","visibility","pointerEvents"],"mappings":"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"}
+{"version":3,"file":"create-form-field-select-multiple.js","sources":["../../../../src/filter-bar/menu/create-form-field-select-multiple.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { useEffect, useMemo, useRef, useState } from 'react'\r\nimport { Box, Button, Checkbox, CircularProgress, FormControlLabel, FormGroup, formGroupClasses, styled, Typography } from '@mui/material'\r\nimport InfoIcon from '@mui/icons-material/Info'\r\nimport { getErrorMessage } from '../../form'\r\nimport { createChipViewers, TChipViewerGroup } from '../components/chip-viewer'\r\nimport { PopperBody, PopperContent, PopperFooter } from '../components/popper-custom'\r\nimport { ButtonBack, ChipDark, FilterLogicToggle } from '../components/ui.units'\r\n// types\r\nimport type { FC, ReactNode } from 'react'\r\nimport type { IPartialError } from '../../form/validator'\r\nimport type { IFieldSelectOption } from './create-form-field-select'\r\nimport type { TFieldModelValid, TFieldValid, TFieldValue, TLogic } from '../types'\r\nimport type { IFieldMenuConfig, IFilterMenuFormProps, TFetchStatus } from './types'\r\n\r\n/** Props for the `FormFieldSelectMultiple` component returned by `createFormFieldSelectMultiple`. Extends the base filter-menu form props. */\r\nexport interface IFormFieldSelectMultipleProps<T> extends IFilterMenuFormProps<T> {\r\n  /** Callback function to handle errors */\r\n  onError?: () => void\r\n  /** Optional content to render at the top of the form */\r\n  top?: ReactNode\r\n}\r\n\r\n/** Parameters passed to `createFormFieldSelectMultiple` to configure the generated component. */\r\nexport interface IFormFieldSelectMultipleParam<T> {\r\n  /** Optional configuration for the form field */\r\n  config?: IFieldMenuConfig<T>\r\n  /** List of options for the select field */\r\n  options?: IFieldSelectOption[]\r\n  /** Function to fetch options asynchronously */\r\n  fetchOptions?: (signal?: AbortSignal) => Promise<IFieldSelectOption[]>\r\n  /** If true, disables the field after submission. @default false */\r\n  disabledAfterSubmit?: boolean\r\n  /** Force a fixed logic value, hiding the logic toggle */\r\n  forceLogic?: TLogic\r\n  /** Maximum number of values that can be selected */\r\n  maxValueCount?: number\r\n  /** Optional content to render at the top of the form */\r\n  top?: ReactNode\r\n}\r\n\r\n/**\r\n * Factory function that creates a `FormFieldSelectMultiple` filter-menu component.\r\n *\r\n * The generated component renders a checkbox list of options inside a\r\n * popper/menu panel, allowing the user to select **multiple values** at once.\r\n * It supports:\r\n * - Controlled checkbox state to prevent uncontrolled→controlled React warnings\r\n * - OR / AND logic toggle when more than one value is applied\r\n * - Chip viewers showing the currently applied values\r\n * - Built-in validation via an optional `validator` prop\r\n * - A loading overlay that disables interaction while `isLoading` is true\r\n *\r\n * @param params - Static configuration (option list, optional field config override)\r\n * @returns A React FC ready to be used as a multi-select filter-menu field component\r\n */\r\nfunction createFormFieldSelectMultiple<T>(params?: IFormFieldSelectMultipleParam<T>) {\r\n  const ChipViewers = createChipViewers<T>()\r\n  const { options: staticOptions = [] } = params || {}\r\n\r\n  const FormFieldSelectMultiple: FC<IFormFieldSelectMultipleProps<T>> = (props) => {\r\n    /** Merge `props.currentConfig` with `params.config` (if provided).\r\n     * Fields from `params.config` override the corresponding keys in `props.currentConfig`.\r\n     * Any keys not present in `params.config` are preserved from `props.currentConfig`.\r\n     */\r\n    const mergedConfig = useMemo(() => Object.assign({}, props.currentConfig, params?.config), [params?.config, props.currentConfig])\r\n\r\n    const { value = { values: [], logic: mergedConfig?.defaultLogic ?? 'or' } } = props\r\n    const [filterLogic, setFilterLogic] = useState<TLogic>(value.logic!)\r\n    const effectiveLogic = params?.forceLogic ?? filterLogic\r\n\r\n    const label = mergedConfig?.label ?? mergedConfig.field.toString()\r\n\r\n    const [fetchedOptions, setFetchedOptions] = useState<IFieldSelectOption[]>([])\r\n    const [fetchStatus, setFetchStatus] = useState<TFetchStatus>(params?.fetchOptions ? 'loading' : 'loaded')\r\n    const abortRef = useRef<AbortController | null>(null)\r\n\r\n    const runFetch = () => {\r\n      if (!params?.fetchOptions) return\r\n      abortRef.current?.abort()\r\n      const controller = new AbortController()\r\n      abortRef.current = controller\r\n      setFetchStatus('loading')\r\n      params\r\n        .fetchOptions(controller.signal)\r\n        .then((data) => {\r\n          setFetchedOptions(data)\r\n          setFetchStatus('loaded')\r\n        })\r\n        .catch((err) => {\r\n          props.onError?.()\r\n          if (err?.name !== 'AbortError') setFetchStatus('error')\r\n        })\r\n    }\r\n\r\n    useEffect(() => {\r\n      runFetch()\r\n      return () => abortRef.current?.abort()\r\n    }, [])\r\n\r\n    const options = params?.fetchOptions ? fetchedOptions : staticOptions\r\n\r\n    // Track checked values as controlled state to avoid the uncontrolled→controlled MUI warning\r\n    // Initialize directly from value.values so pre-selected values are visible even before fetchOptions resolves\r\n    const [checkedValues, setCheckedValues] = useState<TFieldValid[]>(() => {\r\n      return Array.isArray(value.values) ? [...value.values] : []\r\n    })\r\n\r\n    const appliedValues = Array.isArray(value.values) ? value.values : []\r\n    const hasLogicChange = filterLogic !== value.logic\r\n    const hasDataChange = checkedValues.length !== appliedValues.length || checkedValues.some((v) => !appliedValues.includes(v))\r\n    const isApplyDisabled = !hasDataChange && !hasLogicChange\r\n\r\n    const [errorData, setErrorData] = useState<IPartialError<TFieldModelValid<T>>>({})\r\n\r\n    const handleCheckboxChange = (optionValue: TFieldValid, checked: boolean) => {\r\n      setCheckedValues((prev) => (checked ? [...prev, optionValue] : prev.filter((v) => v !== optionValue)))\r\n    }\r\n\r\n    const handleSubmit = (newValue: TFieldValue) => {\r\n      props.onSubmit(mergedConfig.field, newValue, mergedConfig)\r\n    }\r\n\r\n    const handleSubmitForm = (event: React.FormEvent<HTMLFormElement>) => {\r\n      event.preventDefault()\r\n\r\n      if (!hasDataChange) {\r\n        if (hasLogicChange) handleSubmit({ values: value.values, logic: effectiveLogic })\r\n        return\r\n      }\r\n\r\n      if (isMaxReached) return\r\n\r\n      const obj = { [mergedConfig.field]: checkedValues } as Partial<TFieldModelValid<T>>\r\n      let errorData = props.validator?.run(obj) as IPartialError<TFieldModelValid<T>>\r\n\r\n      setErrorData(errorData || {})\r\n\r\n      if (!errorData || Object.keys(errorData).length === 0) {\r\n        const newValue: TFieldValue = { values: checkedValues, logic: effectiveLogic }\r\n        handleSubmit(newValue)\r\n      }\r\n    }\r\n\r\n    const errorResult = getErrorMessage(errorData, mergedConfig.field)\r\n    const filterViewerValue = useMemo<TChipViewerGroup<T>>(() => {\r\n      const items = Array.isArray(value.values) ? value.values : [value.values]\r\n      return {\r\n        field: mergedConfig.field,\r\n        items: items.map((v) => ({ value: v, label: options.find((o) => o.value === v)?.label }))\r\n      }\r\n    }, [mergedConfig.field, value])\r\n\r\n    const isMaxReached = params?.maxValueCount != null && checkedValues.length > params.maxValueCount\r\n    const isMaxReachedValid = params?.maxValueCount != null && checkedValues.length >= params.maxValueCount\r\n\r\n    const handleChangeLogic = (newLogic: TLogic) => {\r\n      setFilterLogic(newLogic)\r\n    }\r\n\r\n    const handleClearAll = () => {\r\n      props.onRemoveField?.(mergedConfig.field)\r\n      if (params?.config?.closeAfterClear !== false) props.onClose()\r\n    }\r\n\r\n    const getMaxReachedText = () => {\r\n      if (!params?.maxValueCount) return ''\r\n      if (isMaxReached) {\r\n        return `Maximum ${params.maxValueCount} value${params.maxValueCount > 1 ? 's' : ''} selected (limit reached)`\r\n      } else {\r\n        return `Up to ${params.maxValueCount} value${params.maxValueCount > 1 ? 's' : ''} can be selected`\r\n      }\r\n    }\r\n\r\n    const renderAfterTitle = () => {\r\n      if (params?.forceLogic) return null\r\n      if (mergedConfig.singleValue) return <ChipDark sx={{ ml: 1.5 }} size='small' label='Last value only' />\r\n      return <FilterLogicToggle sx={{ ml: 1 }} value={effectiveLogic} onChange={(_, nVal) => handleChangeLogic(nVal)} />\r\n    }\r\n\r\n    const renderTop = useMemo(() => {\r\n      const topContent = params?.top || props.top\r\n      if (topContent) return <Box sx={{ mb: 1 }}>{topContent}</Box>\r\n      return null\r\n    }, [params?.top, props.top])\r\n\r\n    const rootClasses: string[] = []\r\n    if (props.isLoading || fetchStatus === 'loading') rootClasses.push('disabled')\r\n\r\n    return (\r\n      <RootStyled className={rootClasses.join(' ')} noValidate onSubmit={handleSubmitForm}>\r\n        <PopperContent\r\n          title={`Filter by ${label}`}\r\n          onClose={props.onClose}\r\n          slots={{\r\n            beforeTitle: <ButtonBack size='small' onClick={props.onBack} />,\r\n            afterTitle: renderAfterTitle()\r\n          }}\r\n        >\r\n          <PopperBody>\r\n            {mergedConfig.description && (\r\n              <Typography variant='caption' color='text.secondary' sx={{ mb: 1, display: 'block' }}>\r\n                {mergedConfig.description}\r\n              </Typography>\r\n            )}\r\n            {params?.maxValueCount != null && (\r\n              <Typography variant='caption' color={isMaxReached ? 'warning.main' : 'text.secondary'} sx={{ mb: 0.5, display: 'block' }}>\r\n                {getMaxReachedText()}\r\n              </Typography>\r\n            )}\r\n            <ChipViewers\r\n              sx={{ mb: 1, borderBottom: 'none!important' }}\r\n              label='Applied'\r\n              placement='horizontal'\r\n              enableMinimalesticView\r\n              value={filterViewerValue}\r\n              onRemove={props.onRemove}\r\n            />\r\n            {fetchStatus === 'loading' && (\r\n              <Box sx={{ display: 'flex', justifyContent: 'center', mt: 2 }}>\r\n                <CircularProgress size={20} />\r\n              </Box>\r\n            )}\r\n            {fetchStatus === 'error' && (\r\n              <Box sx={{ display: 'flex', flexDirection: 'column', alignItems: 'center', mt: 2, mb: 3, gap: 1 }}>\r\n                <InfoIcon color='error' fontSize='large' />\r\n                <Typography variant='body2' color='error'>\r\n                  Failed to load options\r\n                </Typography>\r\n                <Button size='small' variant='outlined' color='error' onClick={runFetch}>\r\n                  Retry\r\n                </Button>\r\n              </Box>\r\n            )}\r\n            {options.length === 0 && fetchStatus === 'loaded' && (\r\n              <Typography variant='body2' color='text.secondary' sx={{ mt: 2 }}>\r\n                No options available\r\n              </Typography>\r\n            )}\r\n            <FormGroup className={errorResult.error ? 'error' : ''}>\r\n              {options.map((x, i) => {\r\n                const isChecked = checkedValues.includes(x.value as TFieldValid)\r\n                const isSelected = filterViewerValue.items.some((item) => item.value === x.value)\r\n                const disabled = isSelected && params?.disabledAfterSubmit === true\r\n                const disableDueToMax = !isChecked && isMaxReachedValid\r\n                return (\r\n                  <FormControlLabel\r\n                    key={x.value.toString() + i}\r\n                    value={x.value}\r\n                    disabled={disabled || disableDueToMax}\r\n                    label={x.label ?? x.value}\r\n                    control={\r\n                      <Checkbox\r\n                        name={mergedConfig.field.toString()}\r\n                        checked={isChecked}\r\n                        onChange={(e) => handleCheckboxChange(x.value as TFieldValid, e.target.checked)}\r\n                      />\r\n                    }\r\n                  />\r\n                )\r\n              })}\r\n            </FormGroup>\r\n          </PopperBody>\r\n          <PopperFooter>\r\n            <Button size='small' color='error' variant='text' disabled={!value.values || value.values.length === 0} onClick={handleClearAll}>\r\n              Clear All\r\n            </Button>\r\n            <Box sx={{ flex: 1 }} />\r\n            <Button size='small' color='inherit' variant='text' onClick={props.onClose}>\r\n              Cancel\r\n            </Button>\r\n            <Button size='small' type='submit' color='primary' variant='contained' disabled={isApplyDisabled}>\r\n              Apply\r\n            </Button>\r\n          </PopperFooter>\r\n        </PopperContent>\r\n      </RootStyled>\r\n    )\r\n  }\r\n\r\n  return FormFieldSelectMultiple\r\n}\r\n\r\nexport default createFormFieldSelectMultiple\r\n\r\nconst RootStyled = styled('form')({\r\n  position: 'relative',\r\n  '&::after': {\r\n    content: '\"\"',\r\n    display: 'block',\r\n    position: 'absolute',\r\n    inset: 0, // top: 0, left: 0, right: 0, bottom: 0\r\n    backgroundColor: 'rgba(0, 0, 0, 0.12)',\r\n    filter: 'blur(2px)',\r\n    zIndex: -1,\r\n    opacity: 0,\r\n    transition: 'opacity 0.3s',\r\n    visibility: 'hidden'\r\n  },\r\n  '&.disabled': {\r\n    pointerEvents: 'none',\r\n    '&::after': {\r\n      zIndex: 1,\r\n      opacity: 1,\r\n      visibility: 'visible'\r\n    }\r\n  }\r\n  // [`.${formGroupClasses.root}`]: {}\r\n})\r\n"],"names":["createFormFieldSelectMultiple","params","ChipViewers","createChipViewers","_ref$options","options","staticOptions","props","_mergedConfig$default","_params$forceLogic","_mergedConfig$label","mergedConfig","useMemo","Object","assign","currentConfig","config","_props$value","value","values","logic","defaultLogic","_useState","useState","_useState2","_slicedToArray","filterLogic","setFilterLogic","effectiveLogic","forceLogic","label","field","toString","_useState3","_useState4","fetchedOptions","setFetchedOptions","_useState5","fetchOptions","_useState6","fetchStatus","setFetchStatus","abortRef","useRef","runFetch","_abortRef$current","current","abort","controller","AbortController","signal","then","data","err","_props$onError","onError","call","name","useEffect","_abortRef$current2","_useState7","Array","isArray","_toConsumableArray","_useState8","checkedValues","setCheckedValues","appliedValues","hasLogicChange","hasDataChange","length","some","v","includes","isApplyDisabled","_useState9","_useState0","errorData","setErrorData","handleSubmit","newValue","onSubmit","errorResult","getErrorMessage","filterViewerValue","items","map","_options$find","find","o","isMaxReached","maxValueCount","isMaxReachedValid","topContent","top","_jsx","Box","sx","mb","children","rootClasses","isLoading","push","RootStyled","className","join","noValidate","event","_props$validator","preventDefault","obj","_defineProperty","validator","run","keys","_jsxs","PopperContent","title","concat","onClose","slots","beforeTitle","ButtonBack","size","onClick","onBack","afterTitle","singleValue","ChipDark","ml","FilterLogicToggle","onChange","_","nVal","PopperBody","description","Typography","variant","color","display","borderBottom","placement","enableMinimalesticView","onRemove","justifyContent","mt","CircularProgress","flexDirection","alignItems","gap","InfoIcon","fontSize","Button","FormGroup","error","x","i","_x$label","isChecked","disabled","item","disabledAfterSubmit","disableDueToMax","FormControlLabel","control","Checkbox","checked","e","optionValue","target","prev","filter","PopperFooter","_props$onRemoveField","_params$config","onRemoveField","closeAfterClear","flex","type","styled","position","content","inset","backgroundColor","zIndex","opacity","transition","visibility","pointerEvents"],"mappings":"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"}

package/dist/src/filter-bar/menu/create-form-field-select.fallback.js

@@ -1,2 +1,2 @@
-import{slicedToArray as r,objectSpread2 as o}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as t}from"react/jsx-runtime";import{useState as e}from"react";import{ErrorPannel as i}from"./ui.units.js";import n from"./create-form-field-select.js";import f from"./create-form-field-select-multiple.js";import a from"./create-form-field-string.js";function c(f){var c=n(f),m=a({config:f.config,top:t(i,{})});return function(i){var n=e("loading"),f=r(n,2),a=f[0],u=f[1];return"loading"===a?t(c,o(o({},i),{},{onError:function(){return u("error")}})):t(m,o({},i))}}function m(n){var c=f(n),m=a({config:n.config,top:t(i,{})});return function(i){var n=e("loading"),f=r(n,2),a=f[0],u=f[1];return"loading"===a?t(c,o(o({},i),{},{onError:function(){return u("error")}})):t(m,o({},i))}}export{m as createFormFieldSelectMultipleWithFallback,c as createFormFieldSelectWithFallback};
+import{slicedToArray as r,objectSpread2 as o}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as n}from"react/jsx-runtime";import{useState as t,useMemo as e}from"react";import{ErrorPannel as i}from"./ui.units.js";import u from"./create-form-field-select.js";import f from"./create-form-field-select-multiple.js";import a from"./create-form-field-string.js";function l(f){var l=u(f),c=a({config:f.config});return function(u){var a=t("loading"),s=r(a,2),p=s[0],m=s[1],d=e(function(){return f.renderTop?f.renderTop({setStatus:m,status:p}):"error"===p?n(i,{onRetry:function(){return m("loading")}}):null},[f.renderTop,p]);return"loading"===p?n(l,o(o({},u),{},{onError:function(){return m("error")}})):n(c,o(o({},u),{},{top:d}))}}function c(u){var l=f(u),c=a({config:u.config});return function(f){var a=t("loading"),s=r(a,2),p=s[0],m=s[1],d=e(function(){return u.renderTop?u.renderTop({setStatus:m,status:p}):"error"===p?n(i,{onRetry:function(){return m("loading")}}):null},[u.renderTop,p]);return"loading"===p?n(l,o(o({},f),{},{onError:function(){return m("error")}})):n(c,o(o({},f),{},{top:d}))}}export{c as createFormFieldSelectMultipleWithFallback,l as createFormFieldSelectWithFallback};
 //# sourceMappingURL=create-form-field-select.fallback.js.map

package/dist/src/filter-bar/menu/create-form-field-select.fallback.js.map

@@ -1 +1 @@
-{"version":3,"file":"create-form-field-select.fallback.js","sources":["../../../../src/filter-bar/menu/create-form-field-select.fallback.tsx"],"sourcesContent":["import { FC, useState } from 'react'\r\nimport { TFetchStatus } from './types'\r\nimport { ErrorPannel } from './ui.units'\r\nimport createFormFieldSelect, { IFormFieldSelectParam } from './create-form-field-select'\r\nimport createFormFieldSelectMultiple, { IFormFieldSelectMultipleParam } from './create-form-field-select-multiple'\r\nimport createFormFieldString from './create-form-field-string'\r\n\r\nexport function createFormFieldSelectWithFallback<T>(params: IFormFieldSelectParam<T>) {\r\n  const NormalComponent = createFormFieldSelect<T>(params)\r\n  const DefaultComponent = createFormFieldString<T>({ config: params.config, top: <ErrorPannel /> })\r\n\r\n  const FormFieldSelectWithFallback: FC<any> = (props) => {\r\n    const [status, setStatus] = useState<TFetchStatus>('loading')\r\n    if (status === 'loading') {\r\n      return <NormalComponent {...props} onError={() => setStatus('error')} />\r\n    } else {\r\n      return <DefaultComponent {...props} />\r\n    }\r\n  }\r\n\r\n  return FormFieldSelectWithFallback\r\n}\r\n\r\nexport function createFormFieldSelectMultipleWithFallback<T>(params: IFormFieldSelectMultipleParam<T>) {\r\n  const NormalComponent = createFormFieldSelectMultiple<T>(params)\r\n  const DefaultComponent = createFormFieldString<T>({ config: params.config, top: <ErrorPannel /> })\r\n\r\n  const FormFieldSelectMultipleWithFallback: FC<any> = (props) => {\r\n    const [status, setStatus] = useState<TFetchStatus>('loading')\r\n    if (status === 'loading') {\r\n      return <NormalComponent {...props} onError={() => setStatus('error')} />\r\n    } else {\r\n      return <DefaultComponent {...props} />\r\n    }\r\n  }\r\n\r\n  return FormFieldSelectMultipleWithFallback\r\n}\r\n"],"names":["createFormFieldSelectWithFallback","params","NormalComponent","createFormFieldSelect","DefaultComponent","createFormFieldString","config","top","_jsx","ErrorPannel","props","_useState","useState","_useState2","_slicedToArray","status","setStatus","_objectSpread","onError","createFormFieldSelectMultipleWithFallback","createFormFieldSelectMultiple","_useState3","_useState4"],"mappings":"uWAOM,SAAUA,EAAqCC,GACnD,IAAMC,EAAkBC,EAAyBF,GAC3CG,EAAmBC,EAAyB,CAAEC,OAAQL,EAAOK,OAAQC,IAAKC,EAACC,EAAc,CAAA,KAW/F,OAT6C,SAACC,GAC5C,IAAAC,EAA4BC,EAAuB,WAAUC,EAAAC,EAAAH,EAAA,GAAtDI,EAAMF,EAAA,GAAEG,EAASH,EAAA,GACxB,MAAe,YAAXE,EACKP,EAACN,EAAee,EAAAA,KAAKP,GAAK,GAAA,CAAEQ,QAAS,WAAF,OAAQF,EAAU,QAAQ,KAE7DR,EAACJ,EAAgBa,EAAKP,CAAAA,EAAAA,GAEhC,CAGH,CAEM,SAAUS,EAA6ClB,GAC3D,IAAMC,EAAkBkB,EAAiCnB,GACnDG,EAAmBC,EAAyB,CAAEC,OAAQL,EAAOK,OAAQC,IAAKC,EAACC,EAAc,CAAA,KAW/F,OATqD,SAACC,GACpD,IAAAW,EAA4BT,EAAuB,WAAUU,EAAAR,EAAAO,EAAA,GAAtDN,EAAMO,EAAA,GAAEN,EAASM,EAAA,GACxB,MAAe,YAAXP,EACKP,EAACN,EAAee,EAAAA,KAAKP,GAAK,GAAA,CAAEQ,QAAS,WAAF,OAAQF,EAAU,QAAQ,KAE7DR,EAACJ,EAAgBa,EAAKP,CAAAA,EAAAA,GAEhC,CAGH"}
+{"version":3,"file":"create-form-field-select.fallback.js","sources":["../../../../src/filter-bar/menu/create-form-field-select.fallback.tsx"],"sourcesContent":["import { Dispatch, FC, ReactNode, SetStateAction, useMemo, useState } from 'react'\r\nimport { TFetchStatus } from './types'\r\nimport { ErrorPannel } from './ui.units'\r\nimport createFormFieldSelect, { IFormFieldSelectParam, IFormFieldSelectProps } from './create-form-field-select'\r\nimport createFormFieldSelectMultiple, { IFormFieldSelectMultipleParam, IFormFieldSelectMultipleProps } from './create-form-field-select-multiple'\r\nimport createFormFieldString from './create-form-field-string'\r\n\r\ntype IFallbackPropsBase = {\r\n  renderTop?: (param?: { setStatus: Dispatch<SetStateAction<TFetchStatus>>; status: TFetchStatus }) => ReactNode\r\n}\r\n\r\nexport function createFormFieldSelectWithFallback<T>(params: IFormFieldSelectParam<T> & IFallbackPropsBase) {\r\n  const NormalComponent = createFormFieldSelect<T>(params)\r\n  const DefaultComponent = createFormFieldString<T>({ config: params.config })\r\n\r\n  const FormFieldSelectWithFallback: FC<IFormFieldSelectProps<T>> = (props) => {\r\n    const [status, setStatus] = useState<TFetchStatus>('loading')\r\n\r\n    const renderTop = useMemo(() => {\r\n      if (params.renderTop) {\r\n        return params.renderTop({ setStatus, status })\r\n      } else if (status === 'error') {\r\n        return <ErrorPannel onRetry={() => setStatus('loading')} />\r\n      }\r\n      return null\r\n    }, [params.renderTop, status])\r\n\r\n    if (status === 'loading') {\r\n      return <NormalComponent {...props} onError={() => setStatus('error')} />\r\n    } else {\r\n      return <DefaultComponent {...props} top={renderTop} />\r\n    }\r\n  }\r\n\r\n  return FormFieldSelectWithFallback\r\n}\r\n\r\nexport function createFormFieldSelectMultipleWithFallback<T>(params: IFormFieldSelectMultipleParam<T> & IFallbackPropsBase) {\r\n  const NormalComponent = createFormFieldSelectMultiple<T>(params)\r\n  const DefaultComponent = createFormFieldString<T>({ config: params.config })\r\n\r\n  const FormFieldSelectMultipleWithFallback: FC<IFormFieldSelectMultipleProps<T>> = (props) => {\r\n    const [status, setStatus] = useState<TFetchStatus>('loading')\r\n\r\n    const renderTop = useMemo(() => {\r\n      if (params.renderTop) {\r\n        return params.renderTop({ setStatus, status })\r\n      } else if (status === 'error') {\r\n        return <ErrorPannel onRetry={() => setStatus('loading')} />\r\n      }\r\n      return null\r\n    }, [params.renderTop, status])\r\n\r\n    if (status === 'loading') {\r\n      return <NormalComponent {...props} onError={() => setStatus('error')} />\r\n    } else {\r\n      return <DefaultComponent {...props} top={renderTop} />\r\n    }\r\n  }\r\n\r\n  return FormFieldSelectMultipleWithFallback\r\n}\r\n"],"names":["createFormFieldSelectWithFallback","params","NormalComponent","createFormFieldSelect","DefaultComponent","createFormFieldString","config","props","_useState","useState","_useState2","_slicedToArray","status","setStatus","renderTop","useMemo","_jsx","ErrorPannel","onRetry","_objectSpread","onError","top","createFormFieldSelectMultipleWithFallback","createFormFieldSelectMultiple","_useState3","_useState4"],"mappings":"oXAWM,SAAUA,EAAqCC,GACnD,IAAMC,EAAkBC,EAAyBF,GAC3CG,EAAmBC,EAAyB,CAAEC,OAAQL,EAAOK,SAqBnE,OAnBkE,SAACC,GACjE,IAAAC,EAA4BC,EAAuB,WAAUC,EAAAC,EAAAH,EAAA,GAAtDI,EAAMF,EAAA,GAAEG,EAASH,EAAA,GAElBI,EAAYC,EAAQ,WACxB,OAAId,EAAOa,UACFb,EAAOa,UAAU,CAAED,UAAAA,EAAWD,OAAAA,IACjB,UAAXA,EACFI,EAACC,EAAY,CAAAC,QAAS,WAAF,OAAQL,EAAU,UAAU,IAElD,IACR,EAAE,CAACZ,EAAOa,UAAWF,IAEtB,MAAe,YAAXA,EACKI,EAACd,EAAeiB,EAAAA,KAAKZ,GAAK,GAAA,CAAEa,QAAS,WAAF,OAAQP,EAAU,QAAQ,KAE7DG,EAACZ,EAAgBe,EAAAA,KAAKZ,GAAK,GAAA,CAAEc,IAAKP,IAE5C,CAGH,CAEM,SAAUQ,EAA6CrB,GAC3D,IAAMC,EAAkBqB,EAAiCtB,GACnDG,EAAmBC,EAAyB,CAAEC,OAAQL,EAAOK,SAqBnE,OAnBkF,SAACC,GACjF,IAAAiB,EAA4Bf,EAAuB,WAAUgB,EAAAd,EAAAa,EAAA,GAAtDZ,EAAMa,EAAA,GAAEZ,EAASY,EAAA,GAElBX,EAAYC,EAAQ,WACxB,OAAId,EAAOa,UACFb,EAAOa,UAAU,CAAED,UAAAA,EAAWD,OAAAA,IACjB,UAAXA,EACFI,EAACC,EAAY,CAAAC,QAAS,WAAF,OAAQL,EAAU,UAAU,IAElD,IACR,EAAE,CAACZ,EAAOa,UAAWF,IAEtB,MAAe,YAAXA,EACKI,EAACd,EAAeiB,EAAAA,KAAKZ,GAAK,GAAA,CAAEa,QAAS,WAAF,OAAQP,EAAU,QAAQ,KAE7DG,EAACZ,EAAgBe,EAAAA,KAAKZ,GAAK,GAAA,CAAEc,IAAKP,IAE5C,CAGH"}

package/dist/src/filter-bar/menu/create-form-field-select.js

@@ -1,2 +1,2 @@
-import{defineProperty as l,slicedToArray as o}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as e,jsxs as n}from"react/jsx-runtime";import{useMemo as i,useState as r,useRef as t,useEffect as a}from"react";import{styled as c,radioGroupClasses as u,Typography as s,Box as d,CircularProgress as m,Button as v,RadioGroup as f,FormControlLabel as p,Radio as b}from"@mui/material";import g from"@mui/icons-material/Info";import{getErrorMessage as h}from"../../form/helpers.js";import{createChipViewers as x}from"../components/chip-viewer.js";import{ButtonBack as C,ChipDark as y,FilterLogicToggle as z}from"../components/ui.units.js";import{PopperContent as k,PopperBody as V,PopperFooter as j}from"../components/popper-custom.js";function A(c){var u=x(),A=c.options;return function(x){var O,S,F,M=i(function(){return Object.assign({},x.currentConfig,null==c?void 0:c.config)},[null==c?void 0:c.config,x.currentConfig]),R=x.value,w=void 0===R?{values:[],logic:null!==(O=null==M?void 0:M.defaultLogic)&&void 0!==O?O:"or"}:R,I=r(w.logic),B=o(I,2),E=B[0],N=B[1],T=null!==(S=c.forceLogic)&&void 0!==S?S:E,D=r(null),P=o(D,2),_=P[0],H=P[1],U=r([]),q=o(U,2),G=q[0],J=q[1],K=r(c.fetchOptions?"loading":"loaded"),Q=o(K,2),W=Q[0],X=Q[1],Y=t(null),Z=function(){var l;if(c.fetchOptions){null===(l=Y.current)||void 0===l||l.abort();var o=new AbortController;Y.current=o,X("loading"),c.fetchOptions(o.signal).then(function(l){J(l),X("loaded")}).catch(function(l){var o;null===(o=x.onError)||void 0===o||o.call(x),"AbortError"!==(null==l?void 0:l.name)&&X("error")})}};a(function(){return Z(),function(){var l;return null===(l=Y.current)||void 0===l?void 0:l.abort()}},[]);var $=c.fetchOptions?G:null!=A?A:[],ll=E!==w.logic,ol=null!==_,el=!ol&&!ll,nl=null!==(F=null==M?void 0:M.label)&&void 0!==F?F:M.field.toString(),il=r({}),rl=o(il,2),tl=rl[0],al=rl[1],cl=function(l){x.onSubmit(M.field,l,M)},ul=h(tl,M.field),sl=i(function(){var l=Array.isArray(w.values)?w.values:[w.values];return{field:M.field,items:l.map(function(l){var o;return{value:l,label:null===(o=$.find(function(o){return o.value===l}))||void 0===o?void 0:o.label}})}},[M.field,w,$]),dl=null!=c.maxValueCount&&sl.items.length>=c.maxValueCount,ml=[];return(x.isLoading||"loading"===W)&&ml.push("disabled"),e(L,{className:ml.join(" "),noValidate:!0,onSubmit:function(o){var e;if(o.preventDefault(),ol){if(!dl){var n=l({},M.field,_),i=null===(e=x.validator)||void 0===e?void 0:e.run(n);if(al(i||{}),!i||0===Object.keys(i).length)cl({values:[_],logic:T}),H(null)}}else ll&&cl({values:w.values,logic:T})},children:n(k,{title:"Filter by ".concat(nl),onClose:x.onClose,slots:{beforeTitle:e(C,{size:"small",onClick:x.onBack}),afterTitle:c.forceLogic?null:M.singleValue?e(y,{sx:{ml:1.5},size:"small",label:"Last value only"}):e(z,{sx:{ml:1},value:T,onChange:function(l,o){N(o)}})},children:[n(V,{children:[M.description&&e(s,{variant:"caption",color:"text.secondary",sx:{mb:1,display:"block"},children:M.description}),null!=c.maxValueCount&&e(s,{variant:"caption",color:dl?"warning.main":"text.secondary",sx:{mb:.5,display:"block"},children:c.maxValueCount?dl?"Maximum ".concat(c.maxValueCount," value").concat(c.maxValueCount>1?"s":""," selected (limit reached)"):"Up to ".concat(c.maxValueCount," value").concat(c.maxValueCount>1?"s":""," can be selected"):""}),e(u,{sx:{mb:1,borderBottom:"none!important"},label:"Applied",placement:"horizontal",enableMinimalesticView:!0,value:sl,onRemove:x.onRemove}),"loading"===W&&e(d,{sx:{display:"flex",justifyContent:"center",mt:2},children:e(m,{size:20})}),"error"===W&&n(d,{sx:{display:"flex",flexDirection:"column",alignItems:"center",mt:2,mb:3,gap:1},children:[e(g,{color:"error",fontSize:"large"}),e(s,{variant:"body2",color:"error",children:"Failed to load options"}),e(v,{size:"small",variant:"outlined",color:"error",onClick:Z,children:"Retry"})]}),0===$.length&&"loaded"===W&&e(s,{variant:"body2",color:"text.secondary",sx:{mt:2},children:"No options available"}),e(f,{sx:{mx:-1},name:M.field.toString(),value:null!=_?_:"",onChange:function(l){return H(l.target.value)},className:ul.error?"error":"",children:$.map(function(l,o){var n,i=sl.items.some(function(o){return o.value===l.value});return e(p,{disabled:i||dl,value:l.value,control:e(b,{size:"small"}),label:e(s,{variant:"body2",children:null!==(n=l.label)&&void 0!==n?n:l.value})},l.value.toString()+o)})}),ul.error&&e(s,{variant:"caption",color:"error",sx:{mt:.5},children:ul.message})]}),n(j,{children:[e(v,{size:"small",color:"error",variant:"text",disabled:!w.values||0===w.values.length,onClick:function(){var l,o;null===(l=x.onRemoveField)||void 0===l||l.call(x,M.field),!1!==(null==c||null===(o=c.config)||void 0===o?void 0:o.closeAfterClear)&&x.onClose()},children:"Clear All"}),e(d,{sx:{flex:1}}),e(v,{size:"small",color:"inherit",variant:"text",onClick:x.onClose,children:"Cancel"}),e(v,{size:"small",type:"submit",color:"primary",variant:"contained",disabled:el,children:"Apply"})]})]})})}}var L=c("form")(l({position:"relative","&::after":{content:'""',display:"block",position:"absolute",inset:0,backgroundColor:"rgba(0, 0, 0, 0.12)",filter:"blur(2px)",zIndex:-1,opacity:0,transition:"opacity 0.3s",visibility:"hidden"},"&.disabled":{pointerEvents:"none","&::after":{zIndex:1,opacity:1,visibility:"visible"}}},".".concat(u.root),{"&.error .MuiRadio-root":{color:"#d32f2f"},".MuiFormControlLabel-root":{margin:0},".MuiFormControlLabel-root:hover":{backgroundColor:"rgba(25, 118, 210, 0.04)"}}));export{A as default};
+import{defineProperty as l,slicedToArray as o}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as e,jsxs as n}from"react/jsx-runtime";import{useMemo as i,useState as r,useRef as t,useEffect as a}from"react";import{styled as c,radioGroupClasses as u,Box as s,Typography as d,CircularProgress as m,Button as v,RadioGroup as f,FormControlLabel as p,Radio as b}from"@mui/material";import g from"@mui/icons-material/Info";import{getErrorMessage as h}from"../../form/helpers.js";import{createChipViewers as x}from"../components/chip-viewer.js";import{ButtonBack as C,ChipDark as y,FilterLogicToggle as z}from"../components/ui.units.js";import{PopperContent as k,PopperBody as V,PopperFooter as j}from"../components/popper-custom.js";function A(c){var u=x(),A=c.options;return function(x){var O,S,F,M=i(function(){return Object.assign({},x.currentConfig,null==c?void 0:c.config)},[null==c?void 0:c.config,x.currentConfig]),R=x.value,w=void 0===R?{values:[],logic:null!==(O=null==M?void 0:M.defaultLogic)&&void 0!==O?O:"or"}:R,I=r(w.logic),B=o(I,2),E=B[0],N=B[1],T=null!==(S=c.forceLogic)&&void 0!==S?S:E,D=r(null),P=o(D,2),_=P[0],H=P[1],U=r([]),q=o(U,2),G=q[0],J=q[1],K=r(c.fetchOptions?"loading":"loaded"),Q=o(K,2),W=Q[0],X=Q[1],Y=t(null),Z=function(){var l;if(c.fetchOptions){null===(l=Y.current)||void 0===l||l.abort();var o=new AbortController;Y.current=o,X("loading"),c.fetchOptions(o.signal).then(function(l){J(l),X("loaded")}).catch(function(l){var o;null===(o=x.onError)||void 0===o||o.call(x),"AbortError"!==(null==l?void 0:l.name)&&X("error")})}};a(function(){return Z(),function(){var l;return null===(l=Y.current)||void 0===l?void 0:l.abort()}},[]);var $=c.fetchOptions?G:null!=A?A:[],ll=E!==w.logic,ol=null!==_,el=!ol&&!ll,nl=null!==(F=null==M?void 0:M.label)&&void 0!==F?F:M.field.toString(),il=r({}),rl=o(il,2),tl=rl[0],al=rl[1],cl=function(l){x.onSubmit(M.field,l,M)},ul=h(tl,M.field),sl=i(function(){var l=Array.isArray(w.values)?w.values:[w.values];return{field:M.field,items:l.map(function(l){var o;return{value:l,label:null===(o=$.find(function(o){return o.value===l}))||void 0===o?void 0:o.label}})}},[M.field,w,$]),dl=null!=c.maxValueCount&&sl.items.length>=c.maxValueCount,ml=i(function(){var l=(null==c?void 0:c.top)||x.top;return l?e(s,{sx:{mb:1},children:l}):null},[null==c?void 0:c.top,x.top]),vl=[];return(x.isLoading||"loading"===W)&&vl.push("disabled"),e(L,{className:vl.join(" "),noValidate:!0,onSubmit:function(o){var e;if(o.preventDefault(),ol){if(!dl){var n=l({},M.field,_),i=null===(e=x.validator)||void 0===e?void 0:e.run(n);if(al(i||{}),!i||0===Object.keys(i).length)cl({values:[_],logic:T}),H(null)}}else ll&&cl({values:w.values,logic:T})},children:n(k,{title:"Filter by ".concat(nl),onClose:x.onClose,slots:{beforeTitle:e(C,{size:"small",onClick:x.onBack}),afterTitle:c.forceLogic?null:M.singleValue?e(y,{sx:{ml:1.5},size:"small",label:"Last value only"}):e(z,{sx:{ml:1},value:T,onChange:function(l,o){N(o)}})},children:[n(V,{children:[ml,M.description&&e(d,{variant:"caption",color:"text.secondary",sx:{mb:1,display:"block"},children:M.description}),null!=c.maxValueCount&&e(d,{variant:"caption",color:dl?"warning.main":"text.secondary",sx:{mb:.5,display:"block"},children:c.maxValueCount?dl?"Maximum ".concat(c.maxValueCount," value").concat(c.maxValueCount>1?"s":""," selected (limit reached)"):"Up to ".concat(c.maxValueCount," value").concat(c.maxValueCount>1?"s":""," can be selected"):""}),e(u,{sx:{mb:1,borderBottom:"none!important"},label:"Applied",placement:"horizontal",enableMinimalesticView:!0,value:sl,onRemove:x.onRemove}),"loading"===W&&e(s,{sx:{display:"flex",justifyContent:"center",mt:2},children:e(m,{size:20})}),"error"===W&&n(s,{sx:{display:"flex",flexDirection:"column",alignItems:"center",mt:2,mb:3,gap:1},children:[e(g,{color:"error",fontSize:"large"}),e(d,{variant:"body2",color:"error",children:"Failed to load options"}),e(v,{size:"small",variant:"outlined",color:"error",onClick:Z,children:"Retry"})]}),0===$.length&&"loaded"===W&&e(d,{variant:"body2",color:"text.secondary",sx:{mt:2},children:"No options available"}),e(f,{sx:{mx:-1},name:M.field.toString(),value:null!=_?_:"",onChange:function(l){return H(l.target.value)},className:ul.error?"error":"",children:$.map(function(l,o){var n,i=sl.items.some(function(o){return o.value===l.value});return e(p,{disabled:i||dl,value:l.value,control:e(b,{size:"small"}),label:e(d,{variant:"body2",children:null!==(n=l.label)&&void 0!==n?n:l.value})},l.value.toString()+o)})}),ul.error&&e(d,{variant:"caption",color:"error",sx:{mt:.5},children:ul.message})]}),n(j,{children:[e(v,{size:"small",color:"error",variant:"text",disabled:!w.values||0===w.values.length,onClick:function(){var l,o;null===(l=x.onRemoveField)||void 0===l||l.call(x,M.field),!1!==(null==c||null===(o=c.config)||void 0===o?void 0:o.closeAfterClear)&&x.onClose()},children:"Clear All"}),e(s,{sx:{flex:1}}),e(v,{size:"small",color:"inherit",variant:"text",onClick:x.onClose,children:"Cancel"}),e(v,{size:"small",type:"submit",color:"primary",variant:"contained",disabled:el,children:"Apply"})]})]})})}}var L=c("form")(l({position:"relative","&::after":{content:'""',display:"block",position:"absolute",inset:0,backgroundColor:"rgba(0, 0, 0, 0.12)",filter:"blur(2px)",zIndex:-1,opacity:0,transition:"opacity 0.3s",visibility:"hidden"},"&.disabled":{pointerEvents:"none","&::after":{zIndex:1,opacity:1,visibility:"visible"}}},".".concat(u.root),{"&.error .MuiRadio-root":{color:"#d32f2f"},".MuiFormControlLabel-root":{margin:0},".MuiFormControlLabel-root:hover":{backgroundColor:"rgba(25, 118, 210, 0.04)"}}));export{A as default};
 //# sourceMappingURL=create-form-field-select.js.map

package/dist/src/filter-bar/menu/create-form-field-select.js.map

@@ -1 +1 @@
-{"version":3,"file":"create-form-field-select.js","sources":["../../../../src/filter-bar/menu/create-form-field-select.tsx"],"sourcesContent":["import { FC, useEffect, useMemo, useRef, useState } from 'react'\r\nimport { Box, Button, CircularProgress, FormControlLabel, Radio, RadioGroup, radioGroupClasses, styled, Typography } from '@mui/material'\r\nimport InfoIcon from '@mui/icons-material/Info'\r\nimport { getErrorMessage } from '../../form/helpers'\r\nimport { createChipViewers, TChipViewerGroup } from '../components/chip-viewer'\r\nimport { ButtonBack, ChipDark, FilterLogicToggle } from '../components/ui.units'\r\nimport { PopperBody, PopperContent, PopperFooter } from '../components/popper-custom'\r\nimport type { IPartialError } from '../../form/validator'\r\nimport type { TFieldModelValid, TFieldValid, TFieldValue, TLogic } from '../types'\r\nimport type { IFieldMenuConfig, IFilterMenuFormProps, TFetchStatus } from './types'\r\n\r\n/** Props for the `FormFieldSelect` component returned by `createFormFieldSelect`. Extends the base filter-menu form props. */\r\nexport interface IFormFieldSelectProps<T> extends IFilterMenuFormProps<T> {\r\n  onError?: () => void\r\n}\r\n\r\n/** A single option item rendered as a radio button inside the select filter menu. */\r\nexport interface IFieldSelectOption {\r\n  value: TFieldValid\r\n  label?: string\r\n}\r\n\r\n/** Parameters passed to `createFormFieldSelect` to configure the generated component. */\r\nexport interface IFormFieldSelectParam<T> {\r\n  /** Optional configuration for the form field */\r\n  config?: IFieldMenuConfig<T>\r\n  /** List of options for the select field */\r\n  options?: IFieldSelectOption[]\r\n  /** Function to fetch options asynchronously based on user input */\r\n  fetchOptions?: (signal?: AbortSignal) => Promise<IFieldSelectOption[]>\r\n  /** Force a specific logic (and/or) for this field, overriding the default or user-selected logic */\r\n  forceLogic?: TLogic\r\n  /** Maximum number of values that can be selected for this field */\r\n  maxValueCount?: number\r\n}\r\n\r\n/**\r\n * Factory function that creates a `FormFieldSelect` filter-menu component.\r\n *\r\n * The generated component renders a radio-button list of options inside a\r\n * popper/menu panel. It supports:\r\n * - Single or multi-value selection (controlled by `config.singleValue`)\r\n * - OR / AND logic toggle when more than one value is selected\r\n * - Chip viewers showing the currently applied values\r\n * - Built-in validation via an optional `validator` prop\r\n * - A loading overlay that disables interaction while `isLoading` is true\r\n *\r\n * @param params - Static configuration (option list, optional field config override)\r\n * @returns A React FC ready to be used as a filter-menu field component\r\n */\r\nfunction createFormFieldSelect<T>(params: IFormFieldSelectParam<T>) {\r\n  const ChipViewers = createChipViewers<T>()\r\n  const { options } = params\r\n\r\n  const FormFieldSelect: FC<IFormFieldSelectProps<T>> = (props) => {\r\n    /** Merge `props.currentConfig` with `params.config` (if provided).\r\n     * Fields from `params.config` override the corresponding keys in `props.currentConfig`.\r\n     * Any keys not present in `params.config` are preserved from `props.currentConfig`.\r\n     */\r\n    const mergedConfig = useMemo(() => Object.assign({}, props.currentConfig, params?.config), [params?.config, props.currentConfig])\r\n\r\n    const { value = { values: [], logic: mergedConfig?.defaultLogic ?? 'or' } } = props\r\n    const [filterLogic, setFilterLogic] = useState<TLogic>(value.logic!)\r\n    const effectiveLogic = params.forceLogic ?? filterLogic\r\n    const [selectedValue, setSelectedValue] = useState<TFieldValid | null>(null)\r\n    const [fetchedOptions, setFetchedOptions] = useState<IFieldSelectOption[]>([])\r\n    const [fetchStatus, setFetchStatus] = useState<TFetchStatus>(params.fetchOptions ? 'loading' : 'loaded')\r\n    const abortRef = useRef<AbortController | null>(null)\r\n\r\n    const runFetch = () => {\r\n      if (!params.fetchOptions) return\r\n      abortRef.current?.abort()\r\n      const controller = new AbortController()\r\n      abortRef.current = controller\r\n      setFetchStatus('loading')\r\n      params\r\n        .fetchOptions(controller.signal)\r\n        .then((data) => {\r\n          setFetchedOptions(data)\r\n          setFetchStatus('loaded')\r\n        })\r\n        .catch((err) => {\r\n          props.onError?.()\r\n          if (err?.name !== 'AbortError') setFetchStatus('error')\r\n        })\r\n    }\r\n\r\n    useEffect(() => {\r\n      runFetch()\r\n      return () => abortRef.current?.abort()\r\n    }, [])\r\n\r\n    const effectiveOptions = params.fetchOptions ? fetchedOptions : (options ?? [])\r\n    const hasLogicChange = filterLogic !== value.logic\r\n    const hasDataChange = selectedValue !== null\r\n    const isApplyDisabled = !hasDataChange && !hasLogicChange\r\n\r\n    const label = mergedConfig?.label ?? mergedConfig.field.toString()\r\n\r\n    const [errorData, setErrorData] = useState<IPartialError<TFieldModelValid<T>>>({})\r\n    const handleSubmit = (newValue: TFieldValue) => {\r\n      props.onSubmit(mergedConfig.field, newValue, mergedConfig)\r\n    }\r\n\r\n    const handleSubmitForm = (event: React.FormEvent<HTMLFormElement>) => {\r\n      event.preventDefault()\r\n\r\n      if (!hasDataChange) {\r\n        if (hasLogicChange) {\r\n          handleSubmit({ values: value.values, logic: effectiveLogic })\r\n        }\r\n        return\r\n      }\r\n\r\n      if (isMaxReached) return\r\n\r\n      const obj = { [mergedConfig.field]: selectedValue } as Partial<TFieldModelValid<T>>\r\n      let errorData = props.validator?.run(obj) as IPartialError<TFieldModelValid<T>>\r\n\r\n      setErrorData(errorData || {})\r\n\r\n      if (!errorData || Object.keys(errorData).length === 0) {\r\n        const newValue: TFieldValue = { values: [selectedValue!] as TFieldValid[], logic: effectiveLogic }\r\n        handleSubmit(newValue)\r\n        setSelectedValue(null)\r\n      }\r\n    }\r\n\r\n    const errorResult = getErrorMessage(errorData, mergedConfig.field)\r\n    const filterViewerValue = useMemo<TChipViewerGroup<T>>(() => {\r\n      const items = Array.isArray(value.values) ? value.values : [value.values]\r\n      return {\r\n        field: mergedConfig.field,\r\n        items: items.map((v) => ({ value: v, label: effectiveOptions.find((o) => o.value === v)?.label }))\r\n      }\r\n    }, [mergedConfig.field, value, effectiveOptions])\r\n\r\n    const isMaxReached = params.maxValueCount != null && filterViewerValue.items.length >= params.maxValueCount\r\n\r\n    const handleChangeLogic = (newLogic: TLogic) => {\r\n      setFilterLogic(newLogic)\r\n    }\r\n\r\n    const handleClearAll = () => {\r\n      props.onRemoveField?.(mergedConfig.field)\r\n      if (params?.config?.closeAfterClear !== false) props.onClose()\r\n    }\r\n\r\n    const renderAfterTitle = () => {\r\n      if (params.forceLogic) return null\r\n      if (mergedConfig.singleValue) return <ChipDark sx={{ ml: 1.5 }} size='small' label='Last value only' />\r\n      return <FilterLogicToggle sx={{ ml: 1 }} value={effectiveLogic} onChange={(_, nVal) => handleChangeLogic(nVal)} />\r\n    }\r\n\r\n    const getMaxReachedText = () => {\r\n      if (!params.maxValueCount) return ''\r\n      if (isMaxReached) {\r\n        return `Maximum ${params.maxValueCount} value${params.maxValueCount > 1 ? 's' : ''} selected (limit reached)`\r\n      } else {\r\n        return `Up to ${params.maxValueCount} value${params.maxValueCount > 1 ? 's' : ''} can be selected`\r\n      }\r\n    }\r\n\r\n    const rootClasses: string[] = []\r\n    if (props.isLoading || fetchStatus === 'loading') rootClasses.push('disabled')\r\n\r\n    return (\r\n      <RootStyled className={rootClasses.join(' ')} noValidate onSubmit={handleSubmitForm}>\r\n        <PopperContent\r\n          title={`Filter by ${label}`}\r\n          onClose={props.onClose}\r\n          slots={{\r\n            beforeTitle: <ButtonBack size='small' onClick={props.onBack} />,\r\n            afterTitle: renderAfterTitle()\r\n          }}\r\n        >\r\n          <PopperBody>\r\n            {mergedConfig.description && (\r\n              <Typography variant='caption' color='text.secondary' sx={{ mb: 1, display: 'block' }}>\r\n                {mergedConfig.description}\r\n              </Typography>\r\n            )}\r\n            {params.maxValueCount != null && (\r\n              <Typography variant='caption' color={isMaxReached ? 'warning.main' : 'text.secondary'} sx={{ mb: 0.5, display: 'block' }}>\r\n                {getMaxReachedText()}\r\n              </Typography>\r\n            )}\r\n            <ChipViewers\r\n              sx={{ mb: 1, borderBottom: 'none!important' }}\r\n              label='Applied'\r\n              placement='horizontal'\r\n              enableMinimalesticView\r\n              value={filterViewerValue}\r\n              onRemove={props.onRemove}\r\n            />\r\n            {fetchStatus === 'loading' && (\r\n              <Box sx={{ display: 'flex', justifyContent: 'center', mt: 2 }}>\r\n                <CircularProgress size={20} />\r\n              </Box>\r\n            )}\r\n            {fetchStatus === 'error' && (\r\n              <Box sx={{ display: 'flex', flexDirection: 'column', alignItems: 'center', mt: 2, mb: 3, gap: 1 }}>\r\n                <InfoIcon color='error' fontSize='large' />\r\n                <Typography variant='body2' color='error'>\r\n                  Failed to load options\r\n                </Typography>\r\n                <Button size='small' variant='outlined' color='error' onClick={runFetch}>\r\n                  Retry\r\n                </Button>\r\n              </Box>\r\n            )}\r\n            {effectiveOptions.length === 0 && fetchStatus === 'loaded' && (\r\n              <Typography variant='body2' color='text.secondary' sx={{ mt: 2 }}>\r\n                No options available\r\n              </Typography>\r\n            )}\r\n            <RadioGroup\r\n              sx={{ mx: -1 }}\r\n              name={mergedConfig.field.toString()}\r\n              value={selectedValue ?? ''}\r\n              onChange={(e) => setSelectedValue(e.target.value as TFieldValid)}\r\n              className={errorResult.error ? 'error' : ''}\r\n            >\r\n              {effectiveOptions.map((x, i) => {\r\n                const isSelected = filterViewerValue.items.some((item) => item.value === x.value)\r\n                const disabled = isSelected || isMaxReached\r\n                return (\r\n                  <FormControlLabel\r\n                    disabled={disabled}\r\n                    key={x.value.toString() + i}\r\n                    value={x.value}\r\n                    control={<Radio size='small' />}\r\n                    label={<Typography variant='body2'>{x.label ?? x.value}</Typography>}\r\n                  />\r\n                )\r\n              })}\r\n            </RadioGroup>\r\n            {errorResult.error && (\r\n              <Typography variant='caption' color='error' sx={{ mt: 0.5 }}>\r\n                {errorResult.message}\r\n              </Typography>\r\n            )}\r\n          </PopperBody>\r\n          <PopperFooter>\r\n            <Button size='small' color='error' variant='text' disabled={!value.values || value.values.length === 0} onClick={handleClearAll}>\r\n              Clear All\r\n            </Button>\r\n            <Box sx={{ flex: 1 }} />\r\n            <Button size='small' color='inherit' variant='text' onClick={props.onClose}>\r\n              Cancel\r\n            </Button>\r\n            <Button size='small' type='submit' color='primary' variant='contained' disabled={isApplyDisabled}>\r\n              Apply\r\n            </Button>\r\n          </PopperFooter>\r\n        </PopperContent>\r\n      </RootStyled>\r\n    )\r\n  }\r\n\r\n  return FormFieldSelect\r\n}\r\n\r\nexport default createFormFieldSelect\r\n\r\nconst RootStyled = styled('form')({\r\n  position: 'relative',\r\n  '&::after': {\r\n    content: '\"\"',\r\n    display: 'block',\r\n    position: 'absolute',\r\n    inset: 0, // top: 0, left: 0, right: 0, bottom: 0\r\n    backgroundColor: 'rgba(0, 0, 0, 0.12)',\r\n    filter: 'blur(2px)',\r\n    zIndex: -1,\r\n    opacity: 0,\r\n    transition: 'opacity 0.3s',\r\n    visibility: 'hidden'\r\n  },\r\n  '&.disabled': {\r\n    pointerEvents: 'none',\r\n    '&::after': {\r\n      zIndex: 1,\r\n      opacity: 1,\r\n      visibility: 'visible'\r\n    }\r\n  },\r\n  [`.${radioGroupClasses.root}`]: {\r\n    '&.error .MuiRadio-root': { color: '#d32f2f' },\r\n    '.MuiFormControlLabel-root': { margin: 0 },\r\n    '.MuiFormControlLabel-root:hover': { backgroundColor: 'rgba(25, 118, 210, 0.04)' }\r\n  }\r\n})\r\n"],"names":["createFormFieldSelect","params","ChipViewers","createChipViewers","options","props","_mergedConfig$default","_params$forceLogic","_mergedConfig$label","mergedConfig","useMemo","Object","assign","currentConfig","config","_props$value","value","values","logic","defaultLogic","_useState","useState","_useState2","_slicedToArray","filterLogic","setFilterLogic","effectiveLogic","forceLogic","_useState3","_useState4","selectedValue","setSelectedValue","_useState5","_useState6","fetchedOptions","setFetchedOptions","_useState7","fetchOptions","_useState8","fetchStatus","setFetchStatus","abortRef","useRef","runFetch","_abortRef$current","current","abort","controller","AbortController","signal","then","data","err","_props$onError","onError","call","name","useEffect","_abortRef$current2","effectiveOptions","hasLogicChange","hasDataChange","isApplyDisabled","label","field","toString","_useState9","_useState0","errorData","setErrorData","handleSubmit","newValue","onSubmit","errorResult","getErrorMessage","filterViewerValue","items","Array","isArray","map","v","_effectiveOptions$fin","find","o","isMaxReached","maxValueCount","length","rootClasses","isLoading","push","_jsx","RootStyled","className","join","noValidate","event","_props$validator","preventDefault","obj","_defineProperty","validator","run","keys","children","_jsxs","PopperContent","title","concat","onClose","slots","beforeTitle","ButtonBack","size","onClick","onBack","afterTitle","singleValue","ChipDark","sx","ml","FilterLogicToggle","onChange","_","nVal","PopperBody","description","Typography","variant","color","mb","display","borderBottom","placement","enableMinimalesticView","onRemove","Box","justifyContent","mt","CircularProgress","flexDirection","alignItems","gap","InfoIcon","fontSize","Button","RadioGroup","mx","e","target","error","x","i","_x$label","isSelected","some","item","FormControlLabel","disabled","control","Radio","message","PopperFooter","_props$onRemoveField","_params$config","onRemoveField","closeAfterClear","flex","type","styled","position","content","inset","backgroundColor","filter","zIndex","opacity","transition","visibility","pointerEvents","radioGroupClasses","root","margin"],"mappings":"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"}
+{"version":3,"file":"create-form-field-select.js","sources":["../../../../src/filter-bar/menu/create-form-field-select.tsx"],"sourcesContent":["import { FC, ReactNode, useEffect, useMemo, useRef, useState } from 'react'\r\nimport { Box, Button, CircularProgress, FormControlLabel, Radio, RadioGroup, radioGroupClasses, styled, Typography } from '@mui/material'\r\nimport InfoIcon from '@mui/icons-material/Info'\r\nimport { getErrorMessage } from '../../form/helpers'\r\nimport { createChipViewers, TChipViewerGroup } from '../components/chip-viewer'\r\nimport { ButtonBack, ChipDark, FilterLogicToggle } from '../components/ui.units'\r\nimport { PopperBody, PopperContent, PopperFooter } from '../components/popper-custom'\r\nimport type { IPartialError } from '../../form/validator'\r\nimport type { TFieldModelValid, TFieldValid, TFieldValue, TLogic } from '../types'\r\nimport type { IFieldMenuConfig, IFilterMenuFormProps, TFetchStatus } from './types'\r\n\r\n/** Props for the `FormFieldSelect` component returned by `createFormFieldSelect`. Extends the base filter-menu form props. */\r\nexport interface IFormFieldSelectProps<T> extends IFilterMenuFormProps<T> {\r\n  /** Callback function to handle errors */\r\n  onError?: () => void\r\n  /** Optional content to render at the top of the form */\r\n  top?: ReactNode\r\n}\r\n\r\n/** A single option item rendered as a radio button inside the select filter menu. */\r\nexport interface IFieldSelectOption {\r\n  value: TFieldValid\r\n  label?: string\r\n}\r\n\r\n/** Parameters passed to `createFormFieldSelect` to configure the generated component. */\r\nexport interface IFormFieldSelectParam<T> {\r\n  /** Optional configuration for the form field */\r\n  config?: IFieldMenuConfig<T>\r\n  /** List of options for the select field */\r\n  options?: IFieldSelectOption[]\r\n  /** Function to fetch options asynchronously based on user input */\r\n  fetchOptions?: (signal?: AbortSignal) => Promise<IFieldSelectOption[]>\r\n  /** Force a specific logic (and/or) for this field, overriding the default or user-selected logic */\r\n  forceLogic?: TLogic\r\n  /** Maximum number of values that can be selected for this field */\r\n  maxValueCount?: number\r\n  /** Optional content to render at the top of the form */\r\n  top?: ReactNode\r\n}\r\n\r\n/**\r\n * Factory function that creates a `FormFieldSelect` filter-menu component.\r\n *\r\n * The generated component renders a radio-button list of options inside a\r\n * popper/menu panel. It supports:\r\n * - Single or multi-value selection (controlled by `config.singleValue`)\r\n * - OR / AND logic toggle when more than one value is selected\r\n * - Chip viewers showing the currently applied values\r\n * - Built-in validation via an optional `validator` prop\r\n * - A loading overlay that disables interaction while `isLoading` is true\r\n *\r\n * @param params - Static configuration (option list, optional field config override)\r\n * @returns A React FC ready to be used as a filter-menu field component\r\n */\r\nfunction createFormFieldSelect<T>(params: IFormFieldSelectParam<T>) {\r\n  const ChipViewers = createChipViewers<T>()\r\n  const { options } = params\r\n\r\n  const FormFieldSelect: FC<IFormFieldSelectProps<T>> = (props) => {\r\n    /** Merge `props.currentConfig` with `params.config` (if provided).\r\n     * Fields from `params.config` override the corresponding keys in `props.currentConfig`.\r\n     * Any keys not present in `params.config` are preserved from `props.currentConfig`.\r\n     */\r\n    const mergedConfig = useMemo(() => Object.assign({}, props.currentConfig, params?.config), [params?.config, props.currentConfig])\r\n\r\n    const { value = { values: [], logic: mergedConfig?.defaultLogic ?? 'or' } } = props\r\n    const [filterLogic, setFilterLogic] = useState<TLogic>(value.logic!)\r\n    const effectiveLogic = params.forceLogic ?? filterLogic\r\n    const [selectedValue, setSelectedValue] = useState<TFieldValid | null>(null)\r\n    const [fetchedOptions, setFetchedOptions] = useState<IFieldSelectOption[]>([])\r\n    const [fetchStatus, setFetchStatus] = useState<TFetchStatus>(params.fetchOptions ? 'loading' : 'loaded')\r\n    const abortRef = useRef<AbortController | null>(null)\r\n\r\n    const runFetch = () => {\r\n      if (!params.fetchOptions) return\r\n      abortRef.current?.abort()\r\n      const controller = new AbortController()\r\n      abortRef.current = controller\r\n      setFetchStatus('loading')\r\n      params\r\n        .fetchOptions(controller.signal)\r\n        .then((data) => {\r\n          setFetchedOptions(data)\r\n          setFetchStatus('loaded')\r\n        })\r\n        .catch((err) => {\r\n          props.onError?.()\r\n          if (err?.name !== 'AbortError') setFetchStatus('error')\r\n        })\r\n    }\r\n\r\n    useEffect(() => {\r\n      runFetch()\r\n      return () => abortRef.current?.abort()\r\n    }, [])\r\n\r\n    const effectiveOptions = params.fetchOptions ? fetchedOptions : (options ?? [])\r\n    const hasLogicChange = filterLogic !== value.logic\r\n    const hasDataChange = selectedValue !== null\r\n    const isApplyDisabled = !hasDataChange && !hasLogicChange\r\n\r\n    const label = mergedConfig?.label ?? mergedConfig.field.toString()\r\n\r\n    const [errorData, setErrorData] = useState<IPartialError<TFieldModelValid<T>>>({})\r\n    const handleSubmit = (newValue: TFieldValue) => {\r\n      props.onSubmit(mergedConfig.field, newValue, mergedConfig)\r\n    }\r\n\r\n    const handleSubmitForm = (event: React.FormEvent<HTMLFormElement>) => {\r\n      event.preventDefault()\r\n\r\n      if (!hasDataChange) {\r\n        if (hasLogicChange) {\r\n          handleSubmit({ values: value.values, logic: effectiveLogic })\r\n        }\r\n        return\r\n      }\r\n\r\n      if (isMaxReached) return\r\n\r\n      const obj = { [mergedConfig.field]: selectedValue } as Partial<TFieldModelValid<T>>\r\n      let errorData = props.validator?.run(obj) as IPartialError<TFieldModelValid<T>>\r\n\r\n      setErrorData(errorData || {})\r\n\r\n      if (!errorData || Object.keys(errorData).length === 0) {\r\n        const newValue: TFieldValue = { values: [selectedValue!] as TFieldValid[], logic: effectiveLogic }\r\n        handleSubmit(newValue)\r\n        setSelectedValue(null)\r\n      }\r\n    }\r\n\r\n    const errorResult = getErrorMessage(errorData, mergedConfig.field)\r\n    const filterViewerValue = useMemo<TChipViewerGroup<T>>(() => {\r\n      const items = Array.isArray(value.values) ? value.values : [value.values]\r\n      return {\r\n        field: mergedConfig.field,\r\n        items: items.map((v) => ({ value: v, label: effectiveOptions.find((o) => o.value === v)?.label }))\r\n      }\r\n    }, [mergedConfig.field, value, effectiveOptions])\r\n\r\n    const isMaxReached = params.maxValueCount != null && filterViewerValue.items.length >= params.maxValueCount\r\n\r\n    const handleChangeLogic = (newLogic: TLogic) => {\r\n      setFilterLogic(newLogic)\r\n    }\r\n\r\n    const handleClearAll = () => {\r\n      props.onRemoveField?.(mergedConfig.field)\r\n      if (params?.config?.closeAfterClear !== false) props.onClose()\r\n    }\r\n\r\n    const renderAfterTitle = () => {\r\n      if (params.forceLogic) return null\r\n      if (mergedConfig.singleValue) return <ChipDark sx={{ ml: 1.5 }} size='small' label='Last value only' />\r\n      return <FilterLogicToggle sx={{ ml: 1 }} value={effectiveLogic} onChange={(_, nVal) => handleChangeLogic(nVal)} />\r\n    }\r\n\r\n    const getMaxReachedText = () => {\r\n      if (!params.maxValueCount) return ''\r\n      if (isMaxReached) {\r\n        return `Maximum ${params.maxValueCount} value${params.maxValueCount > 1 ? 's' : ''} selected (limit reached)`\r\n      } else {\r\n        return `Up to ${params.maxValueCount} value${params.maxValueCount > 1 ? 's' : ''} can be selected`\r\n      }\r\n    }\r\n\r\n    const renderTop = useMemo(() => {\r\n      const topContent = params?.top || props.top\r\n      if (topContent) return <Box sx={{ mb: 1 }}>{topContent}</Box>\r\n      return null\r\n    }, [params?.top, props.top])\r\n\r\n    const rootClasses: string[] = []\r\n    if (props.isLoading || fetchStatus === 'loading') rootClasses.push('disabled')\r\n\r\n    return (\r\n      <RootStyled className={rootClasses.join(' ')} noValidate onSubmit={handleSubmitForm}>\r\n        <PopperContent\r\n          title={`Filter by ${label}`}\r\n          onClose={props.onClose}\r\n          slots={{\r\n            beforeTitle: <ButtonBack size='small' onClick={props.onBack} />,\r\n            afterTitle: renderAfterTitle()\r\n          }}\r\n        >\r\n          <PopperBody>\r\n            {renderTop}\r\n            {mergedConfig.description && (\r\n              <Typography variant='caption' color='text.secondary' sx={{ mb: 1, display: 'block' }}>\r\n                {mergedConfig.description}\r\n              </Typography>\r\n            )}\r\n            {params.maxValueCount != null && (\r\n              <Typography variant='caption' color={isMaxReached ? 'warning.main' : 'text.secondary'} sx={{ mb: 0.5, display: 'block' }}>\r\n                {getMaxReachedText()}\r\n              </Typography>\r\n            )}\r\n            <ChipViewers\r\n              sx={{ mb: 1, borderBottom: 'none!important' }}\r\n              label='Applied'\r\n              placement='horizontal'\r\n              enableMinimalesticView\r\n              value={filterViewerValue}\r\n              onRemove={props.onRemove}\r\n            />\r\n            {fetchStatus === 'loading' && (\r\n              <Box sx={{ display: 'flex', justifyContent: 'center', mt: 2 }}>\r\n                <CircularProgress size={20} />\r\n              </Box>\r\n            )}\r\n            {fetchStatus === 'error' && (\r\n              <Box sx={{ display: 'flex', flexDirection: 'column', alignItems: 'center', mt: 2, mb: 3, gap: 1 }}>\r\n                <InfoIcon color='error' fontSize='large' />\r\n                <Typography variant='body2' color='error'>\r\n                  Failed to load options\r\n                </Typography>\r\n                <Button size='small' variant='outlined' color='error' onClick={runFetch}>\r\n                  Retry\r\n                </Button>\r\n              </Box>\r\n            )}\r\n            {effectiveOptions.length === 0 && fetchStatus === 'loaded' && (\r\n              <Typography variant='body2' color='text.secondary' sx={{ mt: 2 }}>\r\n                No options available\r\n              </Typography>\r\n            )}\r\n            <RadioGroup\r\n              sx={{ mx: -1 }}\r\n              name={mergedConfig.field.toString()}\r\n              value={selectedValue ?? ''}\r\n              onChange={(e) => setSelectedValue(e.target.value as TFieldValid)}\r\n              className={errorResult.error ? 'error' : ''}\r\n            >\r\n              {effectiveOptions.map((x, i) => {\r\n                const isSelected = filterViewerValue.items.some((item) => item.value === x.value)\r\n                const disabled = isSelected || isMaxReached\r\n                return (\r\n                  <FormControlLabel\r\n                    disabled={disabled}\r\n                    key={x.value.toString() + i}\r\n                    value={x.value}\r\n                    control={<Radio size='small' />}\r\n                    label={<Typography variant='body2'>{x.label ?? x.value}</Typography>}\r\n                  />\r\n                )\r\n              })}\r\n            </RadioGroup>\r\n            {errorResult.error && (\r\n              <Typography variant='caption' color='error' sx={{ mt: 0.5 }}>\r\n                {errorResult.message}\r\n              </Typography>\r\n            )}\r\n          </PopperBody>\r\n          <PopperFooter>\r\n            <Button size='small' color='error' variant='text' disabled={!value.values || value.values.length === 0} onClick={handleClearAll}>\r\n              Clear All\r\n            </Button>\r\n            <Box sx={{ flex: 1 }} />\r\n            <Button size='small' color='inherit' variant='text' onClick={props.onClose}>\r\n              Cancel\r\n            </Button>\r\n            <Button size='small' type='submit' color='primary' variant='contained' disabled={isApplyDisabled}>\r\n              Apply\r\n            </Button>\r\n          </PopperFooter>\r\n        </PopperContent>\r\n      </RootStyled>\r\n    )\r\n  }\r\n\r\n  return FormFieldSelect\r\n}\r\n\r\nexport default createFormFieldSelect\r\n\r\nconst RootStyled = styled('form')({\r\n  position: 'relative',\r\n  '&::after': {\r\n    content: '\"\"',\r\n    display: 'block',\r\n    position: 'absolute',\r\n    inset: 0, // top: 0, left: 0, right: 0, bottom: 0\r\n    backgroundColor: 'rgba(0, 0, 0, 0.12)',\r\n    filter: 'blur(2px)',\r\n    zIndex: -1,\r\n    opacity: 0,\r\n    transition: 'opacity 0.3s',\r\n    visibility: 'hidden'\r\n  },\r\n  '&.disabled': {\r\n    pointerEvents: 'none',\r\n    '&::after': {\r\n      zIndex: 1,\r\n      opacity: 1,\r\n      visibility: 'visible'\r\n    }\r\n  },\r\n  [`.${radioGroupClasses.root}`]: {\r\n    '&.error .MuiRadio-root': { color: '#d32f2f' },\r\n    '.MuiFormControlLabel-root': { margin: 0 },\r\n    '.MuiFormControlLabel-root:hover': { backgroundColor: 'rgba(25, 118, 210, 0.04)' }\r\n  }\r\n})\r\n"],"names":["createFormFieldSelect","params","ChipViewers","createChipViewers","options","props","_mergedConfig$default","_params$forceLogic","_mergedConfig$label","mergedConfig","useMemo","Object","assign","currentConfig","config","_props$value","value","values","logic","defaultLogic","_useState","useState","_useState2","_slicedToArray","filterLogic","setFilterLogic","effectiveLogic","forceLogic","_useState3","_useState4","selectedValue","setSelectedValue","_useState5","_useState6","fetchedOptions","setFetchedOptions","_useState7","fetchOptions","_useState8","fetchStatus","setFetchStatus","abortRef","useRef","runFetch","_abortRef$current","current","abort","controller","AbortController","signal","then","data","err","_props$onError","onError","call","name","useEffect","_abortRef$current2","effectiveOptions","hasLogicChange","hasDataChange","isApplyDisabled","label","field","toString","_useState9","_useState0","errorData","setErrorData","handleSubmit","newValue","onSubmit","errorResult","getErrorMessage","filterViewerValue","items","Array","isArray","map","v","_effectiveOptions$fin","find","o","isMaxReached","maxValueCount","length","renderTop","topContent","top","_jsx","Box","sx","mb","children","rootClasses","isLoading","push","RootStyled","className","join","noValidate","event","_props$validator","preventDefault","obj","_defineProperty","validator","run","keys","_jsxs","PopperContent","title","concat","onClose","slots","beforeTitle","ButtonBack","size","onClick","onBack","afterTitle","singleValue","ChipDark","ml","FilterLogicToggle","onChange","_","nVal","PopperBody","description","Typography","variant","color","display","borderBottom","placement","enableMinimalesticView","onRemove","justifyContent","mt","CircularProgress","flexDirection","alignItems","gap","InfoIcon","fontSize","Button","RadioGroup","mx","e","target","error","x","i","_x$label","isSelected","some","item","FormControlLabel","disabled","control","Radio","message","PopperFooter","_props$onRemoveField","_params$config","onRemoveField","closeAfterClear","flex","type","styled","position","content","inset","backgroundColor","filter","zIndex","opacity","transition","visibility","pointerEvents","radioGroupClasses","root","margin"],"mappings":"suBAuDA,SAASA,EAAyBC,GAChC,IAAMC,EAAcC,IACZC,EAAYH,EAAZG,QAuNR,OArNsD,SAACC,GAAS,IAAAC,EAAAC,EAAAC,EAKxDC,EAAeC,EAAQ,WAAA,OAAMC,OAAOC,OAAO,GAAIP,EAAMQ,cAAeZ,eAAAA,EAAQa,OAAO,EAAE,CAACb,aAAAA,EAAAA,EAAQa,OAAQT,EAAMQ,gBAElHE,EAA8EV,EAAtEW,MAAAA,OAAQ,IAAHD,EAAG,CAAEE,OAAQ,GAAIC,MAAiC,QAA5BZ,EAAEG,aAAY,EAAZA,EAAcU,oBAAY,IAAAb,EAAAA,EAAI,MAAMS,EACzEK,EAAsCC,EAAiBL,EAAME,OAAOI,EAAAC,EAAAH,EAAA,GAA7DI,EAAWF,EAAA,GAAEG,EAAcH,EAAA,GAC5BI,EAAkC,QAApBnB,EAAGN,EAAO0B,kBAAU,IAAApB,EAAAA,EAAIiB,EAC5CI,EAA0CP,EAA6B,MAAKQ,EAAAN,EAAAK,EAAA,GAArEE,EAAaD,EAAA,GAAEE,EAAgBF,EAAA,GACtCG,EAA4CX,EAA+B,IAAGY,EAAAV,EAAAS,EAAA,GAAvEE,EAAcD,EAAA,GAAEE,EAAiBF,EAAA,GACxCG,EAAsCf,EAAuBpB,EAAOoC,aAAe,UAAY,UAASC,EAAAf,EAAAa,EAAA,GAAjGG,EAAWD,EAAA,GAAEE,EAAcF,EAAA,GAC5BG,EAAWC,EAA+B,MAE1CC,EAAW,WAAK,IAAAC,EACpB,GAAK3C,EAAOoC,aAAZ,CACgB,QAAhBO,EAAAH,EAASI,eAAO,IAAAD,GAAhBA,EAAkBE,QAClB,IAAMC,EAAa,IAAIC,gBACvBP,EAASI,QAAUE,EACnBP,EAAe,WACfvC,EACGoC,aAAaU,EAAWE,QACxBC,KAAK,SAACC,GACLhB,EAAkBgB,GAClBX,EAAe,SACjB,GAAE,MACK,SAACY,GAAO,IAAAC,EACA,QAAbA,EAAAhD,EAAMiD,eAAO,IAAAD,GAAbA,EAAAE,KAAAlD,GACkB,gBAAd+C,eAAAA,EAAKI,OAAuBhB,EAAe,QACjD,EAdwB,CAe3B,EAEDiB,EAAU,WAER,OADAd,IACO,WAAA,IAAAe,EAAA,OAAsB,QAAtBA,EAAMjB,EAASI,eAAO,IAAAa,OAAA,EAAhBA,EAAkBZ,OAAO,CACvC,EAAE,IAEH,IAAMa,EAAmB1D,EAAOoC,aAAeH,EAAkB9B,QAAAA,EAAW,GACtEwD,GAAiBpC,IAAgBR,EAAME,MACvC2C,GAAkC,OAAlB/B,EAChBgC,IAAmBD,KAAkBD,GAErCG,WAAKvD,EAAGC,aAAAA,EAAAA,EAAcsD,aAAK,IAAAvD,EAAAA,EAAIC,EAAauD,MAAMC,WAExDC,GAAkC7C,EAA6C,IAAG8C,GAAA5C,EAAA2C,GAAA,GAA3EE,GAASD,GAAA,GAAEE,GAAYF,GAAA,GACxBG,GAAe,SAACC,GACpBlE,EAAMmE,SAAS/D,EAAauD,MAAOO,EAAU9D,EAC9C,EA0BKgE,GAAcC,EAAgBN,GAAW3D,EAAauD,OACtDW,GAAoBjE,EAA6B,WACrD,IAAMkE,EAAQC,MAAMC,QAAQ9D,EAAMC,QAAUD,EAAMC,OAAS,CAACD,EAAMC,QAClE,MAAO,CACL+C,MAAOvD,EAAauD,MACpBY,MAAOA,EAAMG,IAAI,SAACC,GAAC,IAAAC,EAAA,MAAM,CAAEjE,MAAOgE,EAAGjB,MAAkDkB,QAA7CA,EAAEtB,EAAiBuB,KAAK,SAACC,GAAC,OAAKA,EAAEnE,QAAUgE,CAAC,UAA1CC,IAA2CA,OAA3CA,EAAAA,EAA6ClB,MAAQ,GAEpG,EAAE,CAACtD,EAAauD,MAAOhD,EAAO2C,IAEzByB,GAAuC,MAAxBnF,EAAOoF,eAAyBV,GAAkBC,MAAMU,QAAUrF,EAAOoF,cA0BxFE,GAAY7E,EAAQ,WACxB,IAAM8E,GAAavF,aAAAA,EAAAA,EAAQwF,MAAOpF,EAAMoF,IACxC,OAAID,EAAmBE,EAACC,EAAI,CAAAC,GAAI,CAAEC,GAAI,GAAMC,SAAAN,IACrC,IACR,EAAE,CAACvF,aAAAA,EAAAA,EAAQwF,IAAKpF,EAAMoF,MAEjBM,GAAwB,GAG9B,OAFI1F,EAAM2F,WAA6B,YAAhBzD,IAA2BwD,GAAYE,KAAK,YAGjEP,EAACQ,EAAU,CAACC,UAAWJ,GAAYK,KAAK,KAAMC,cAAW7B,SArElC,SAAC8B,GAA2C,IAAAC,EAGnE,GAFAD,EAAME,iBAED3C,IAOL,IAAIuB,GAAJ,CAEA,IAAMqB,EAAGC,EAAA,CAAA,EAAMjG,EAAauD,MAAQlC,GAChCsC,EAA2BmC,QAAlBA,EAAGlG,EAAMsG,qBAASJ,SAAfA,EAAiBK,IAAIH,GAIrC,GAFApC,GAAaD,GAAa,KAErBA,GAA+C,IAAlCzD,OAAOkG,KAAKzC,GAAWkB,OAEvChB,GAD8B,CAAErD,OAAQ,CAACa,GAAkCZ,MAAOQ,IAElFK,EAAiB,KAVD,OANZ6B,IACFU,GAAa,CAAErD,OAAQD,EAAMC,OAAQC,MAAOQ,GAiBjD,EA+CoFoE,SACjFgB,EAACC,EAAa,CACZC,MAAKC,aAAAA,OAAelD,IACpBmD,QAAS7G,EAAM6G,QACfC,MAAO,CACLC,YAAa1B,EAAC2B,EAAU,CAACC,KAAK,QAAQC,QAASlH,EAAMmH,SACrDC,WA9BFxH,EAAO0B,WAAmB,KAC1BlB,EAAaiH,YAAoBhC,EAACiC,EAAQ,CAAC/B,GAAI,CAAEgC,GAAI,KAAON,KAAK,QAAQvD,MAAM,oBAC5E2B,EAACmC,EAAkB,CAAAjC,GAAI,CAAEgC,GAAI,GAAK5G,MAAOU,EAAgBoG,SAAU,SAACC,EAAGC,GAX9EvG,EAWyGuG,EAAK,KA6BzGlC,SAAA,CAEDgB,EAACmB,EAAU,CAAAnC,SAAA,CACRP,GACA9E,EAAayH,aACZxC,EAACyC,EAAU,CAACC,QAAQ,UAAUC,MAAM,iBAAiBzC,GAAI,CAAEC,GAAI,EAAGyC,QAAS,SACxExC,SAAArF,EAAayH,cAGO,MAAxBjI,EAAOoF,eACNK,EAACyC,EAAW,CAAAC,QAAQ,UAAUC,MAAOjD,GAAe,eAAiB,iBAAkBQ,GAAI,CAAEC,GAAI,GAAKyC,QAAS,kBAnClHrI,EAAOoF,cACRD,GACF,WAAA6B,OAAkBhH,EAAOoF,wBAAa4B,OAAShH,EAAOoF,cAAgB,EAAI,IAAM,GAAE,6BAElF,SAAA4B,OAAgBhH,EAAOoF,wBAAa4B,OAAShH,EAAOoF,cAAgB,EAAI,IAAM,GAAE,oBAJhD,KAuC5BK,EAACxF,GACC0F,GAAI,CAAEC,GAAI,EAAG0C,aAAc,kBAC3BxE,MAAM,UACNyE,UAAU,aACVC,wBACA,EAAAzH,MAAO2D,GACP+D,SAAUrI,EAAMqI,WAED,YAAhBnG,GACCmD,EAACC,EAAG,CAACC,GAAI,CAAE0C,QAAS,OAAQK,eAAgB,SAAUC,GAAI,GAAG9C,SAC3DJ,EAACmD,EAAgB,CAACvB,KAAM,OAGX,UAAhB/E,GACCuE,EAACnB,EAAG,CAACC,GAAI,CAAE0C,QAAS,OAAQQ,cAAe,SAAUC,WAAY,SAAUH,GAAI,EAAG/C,GAAI,EAAGmD,IAAK,GAC5FlD,SAAA,CAAAJ,EAACuD,EAAS,CAAAZ,MAAM,QAAQa,SAAS,UACjCxD,EAACyC,GAAWC,QAAQ,QAAQC,MAAM,4CAGlC3C,EAACyD,EAAM,CAAC7B,KAAK,QAAQc,QAAQ,WAAWC,MAAM,QAAQd,QAAS5E,EAAQmD,SAAA,aAK9C,IAA5BnC,EAAiB2B,QAAgC,WAAhB/C,GAChCmD,EAACyC,GAAWC,QAAQ,QAAQC,MAAM,iBAAiBzC,GAAI,CAAEgD,GAAI,GAEhD9C,SAAA,yBAEfJ,EAAC0D,GACCxD,GAAI,CAAEyD,IAAI,GACV7F,KAAM/C,EAAauD,MAAMC,WACzBjD,MAAOc,QAAAA,EAAiB,GACxBgG,SAAU,SAACwB,GAAC,OAAKvH,EAAiBuH,EAAEC,OAAOvI,MAAqB,EAChEmF,UAAW1B,GAAY+E,MAAQ,QAAU,GAAE1D,SAE1CnC,EAAiBoB,IAAI,SAAC0E,EAAGC,GAAK,IAAAC,EACvBC,EAAajF,GAAkBC,MAAMiF,KAAK,SAACC,GAAI,OAAKA,EAAK9I,QAAUyI,EAAEzI,QAE3E,OACE0E,EAACqE,EACC,CAAAC,SAHaJ,GAAcxE,GAK3BpE,MAAOyI,EAAEzI,MACTiJ,QAASvE,EAACwE,EAAK,CAAC5C,KAAK,UACrBvD,MAAO2B,EAACyC,EAAU,CAACC,QAAQ,QAAOtC,SAAS6D,QAATA,EAAEF,EAAE1F,aAAK4F,IAAAA,EAAAA,EAAIF,EAAEzI,SAH5CyI,EAAEzI,MAAMiD,WAAayF,EAM/B,KAEFjF,GAAY+E,OACX9D,EAACyC,EAAW,CAAAC,QAAQ,UAAUC,MAAM,QAAQzC,GAAI,CAAEgD,GAAI,IAAK9C,SACxDrB,GAAY0F,aAInBrD,EAACsD,EACC,CAAAtE,SAAA,CAAAJ,EAACyD,EAAM,CAAC7B,KAAK,QAAQe,MAAM,QAAQD,QAAQ,OAAO4B,UAAWhJ,EAAMC,QAAkC,IAAxBD,EAAMC,OAAOqE,OAAciC,QA5GzF,WAAK,IAAA8C,EAAAC,UAC1BD,EAAAhK,EAAMkK,qBAAa,IAAAF,GAAnBA,EAAA9G,KAAAlD,EAAsBI,EAAauD,QACK,KAApC/D,SAAc,QAARqK,EAANrK,EAAQa,cAARwJ,IAAcA,OAAdA,EAAAA,EAAgBE,kBAA2BnK,EAAM6G,SACtD,EA2GgBpB,SAAA,cACTJ,EAACC,EAAI,CAAAC,GAAI,CAAE6E,KAAM,KACjB/E,EAACyD,EAAM,CAAC7B,KAAK,QAAQe,MAAM,UAAUD,QAAQ,OAAOb,QAASlH,EAAM6G,QAE1DpB,SAAA,WACTJ,EAACyD,EAAO,CAAA7B,KAAK,QAAQoD,KAAK,SAASrC,MAAM,UAAUD,QAAQ,YAAY4B,SAAUlG,GAExEgC,SAAA,iBAKlB,CAGH,CAIA,IAAMI,EAAayE,EAAO,OAAPA,CAAcjE,EAAA,CAC/BkE,SAAU,WACV,WAAY,CACVC,QAAS,KACTvC,QAAS,QACTsC,SAAU,WACVE,MAAO,EACPC,gBAAiB,sBACjBC,OAAQ,YACRC,QAAU,EACVC,QAAS,EACTC,WAAY,eACZC,WAAY,UAEd,aAAc,CACZC,cAAe,OACf,WAAY,CACVJ,OAAQ,EACRC,QAAS,EACTE,WAAY,aAEf,IAAAnE,OACIqE,EAAkBC,MAAS,CAC9B,yBAA0B,CAAElD,MAAO,WACnC,4BAA6B,CAAEmD,OAAQ,GACvC,kCAAmC,CAAET,gBAAiB"}

package/dist/src/filter-bar/menu/ui.units.js

@@ -1,2 +1,2 @@
-import{jsxs as r,jsx as o}from"react/jsx-runtime";import{styled as e,Stack as i,alpha as t,Typography as n}from"@mui/material";import a from"@mui/icons-material/Info";var c=function(){return r(l,{children:[o(a,{color:"error"}),o(n,{color:"error",variant:"subtitle1",component:"p",children:"Failed to load options."})]})},l=e(i)(function(r){var o=r.theme;return{alignItems:"center",flexDirection:"row",gap:o.spacing(1),padding:o.spacing(1),backgroundColor:t(o.palette.error.light,.1),borderRadius:o.shape.borderRadius}});export{c as ErrorPannel};
+import{jsxs as r,jsx as o}from"react/jsx-runtime";import{styled as e,Stack as i,alpha as t,Typography as a,Button as n}from"@mui/material";import l from"@mui/icons-material/Info";var c=function(e){var i=e.onRetry;return r(m,{children:[o(l,{color:"error",fontSize:"small"}),o(a,{color:"error",variant:"subtitle1",component:"p",sx:{flex:1},children:"Failed to load options."}),o(n,{variant:"text",color:"primary",size:"small",onClick:i,children:"Retry"})]})},m=e(i)(function(r){var o=r.theme;return{alignItems:"center",flexDirection:"row",gap:o.spacing(1),padding:o.spacing(1),backgroundColor:t(o.palette.error.light,.1),borderRadius:o.shape.borderRadius}});export{c as ErrorPannel};
 //# sourceMappingURL=ui.units.js.map

package/dist/src/filter-bar/menu/ui.units.js.map

@@ -1 +1 @@
-{"version":3,"file":"ui.units.js","sources":["../../../../src/filter-bar/menu/ui.units.tsx"],"sourcesContent":["import { FC } from 'react'\r\nimport { alpha, Stack, styled, Typography } from '@mui/material'\r\nimport InfoIcon from '@mui/icons-material/Info'\r\n\r\nexport const ErrorPannel: FC = () => (\r\n  <ErrorPannelStyled>\r\n    <InfoIcon color='error' />\r\n    <Typography color='error' variant='subtitle1' component='p'>\r\n      Failed to load options.\r\n    </Typography>\r\n  </ErrorPannelStyled>\r\n)\r\n\r\nconst ErrorPannelStyled = styled(Stack)(({ theme }) => ({\r\n  alignItems: 'center',\r\n  flexDirection: 'row',\r\n  gap: theme.spacing(1),\r\n  padding: theme.spacing(1),\r\n  backgroundColor: alpha(theme.palette.error.light, 0.1),\r\n  borderRadius: theme.shape.borderRadius\r\n}))\r\n"],"names":["ErrorPannel","_jsxs","ErrorPannelStyled","_jsx","InfoIcon","color","Typography","variant","component","children","styled","Stack","_ref","theme","alignItems","flexDirection","gap","spacing","padding","backgroundColor","alpha","palette","error","light","borderRadius","shape"],"mappings":"uKAIaA,IAAAA,EAAkB,WAAP,OACtBC,EAACC,aACCC,EAACC,EAAS,CAAAC,MAAM,UAChBF,EAACG,EAAW,CAAAD,MAAM,QAAQE,QAAQ,YAAYC,UAAU,IAE3CC,SAAA,8BACK,EAGhBP,EAAoBQ,EAAOC,EAAPD,CAAc,SAAAE,GAAA,IAAGC,EAAKD,EAALC,MAAK,MAAQ,CACtDC,WAAY,SACZC,cAAe,MACfC,IAAKH,EAAMI,QAAQ,GACnBC,QAASL,EAAMI,QAAQ,GACvBE,gBAAiBC,EAAMP,EAAMQ,QAAQC,MAAMC,MAAO,IAClDC,aAAcX,EAAMY,MAAMD,aAC3B"}
+{"version":3,"file":"ui.units.js","sources":["../../../../src/filter-bar/menu/ui.units.tsx"],"sourcesContent":["import { FC } from 'react'\r\nimport { alpha, Button, IconButton, Stack, styled, Typography } from '@mui/material'\r\nimport InfoIcon from '@mui/icons-material/Info'\r\nimport RefreshIcon from '@mui/icons-material/Refresh'\r\n\r\ninterface IErrorPannelProps {\r\n  onRetry?: () => void\r\n}\r\n\r\nexport const ErrorPannel: FC<IErrorPannelProps> = ({ onRetry }) => (\r\n  <ErrorPannelStyled>\r\n    <InfoIcon color='error' fontSize='small' />\r\n    <Typography color='error' variant='subtitle1' component='p' sx={{ flex: 1 }}>\r\n      Failed to load options.\r\n    </Typography>\r\n    {/* <IconButton color='error' size='small' onClick={onRetry}>\r\n      <RefreshIcon color='error' fontSize='small' />\r\n    </IconButton> */}\r\n    <Button variant='text' color='primary' size='small' onClick={onRetry}>\r\n      Retry\r\n    </Button>\r\n  </ErrorPannelStyled>\r\n)\r\n\r\nconst ErrorPannelStyled = styled(Stack)(({ theme }) => ({\r\n  alignItems: 'center',\r\n  flexDirection: 'row',\r\n  gap: theme.spacing(1),\r\n  padding: theme.spacing(1),\r\n  backgroundColor: alpha(theme.palette.error.light, 0.1),\r\n  borderRadius: theme.shape.borderRadius\r\n}))\r\n"],"names":["ErrorPannel","_ref","onRetry","_jsxs","ErrorPannelStyled","_jsx","InfoIcon","color","fontSize","Typography","variant","component","sx","flex","children","Button","size","onClick","styled","Stack","_ref2","theme","alignItems","flexDirection","gap","spacing","padding","backgroundColor","alpha","palette","error","light","borderRadius","shape"],"mappings":"uLASaA,EAAqC,SAA1BC,GAAA,IAA6BC,EAAOD,EAAPC,QAAO,OAC1DC,EAACC,aACCC,EAACC,EAAS,CAAAC,MAAM,QAAQC,SAAS,UACjCH,EAACI,EAAW,CAAAF,MAAM,QAAQG,QAAQ,YAAYC,UAAU,IAAIC,GAAI,CAAEC,KAAM,GAAGC,SAAA,4BAM3ET,EAACU,EAAO,CAAAL,QAAQ,OAAOH,MAAM,UAAUS,KAAK,QAAQC,QAASf,EAEpDY,SAAA,YACS,EAGhBV,EAAoBc,EAAOC,EAAPD,CAAc,SAAAE,GAAA,IAAGC,EAAKD,EAALC,MAAK,MAAQ,CACtDC,WAAY,SACZC,cAAe,MACfC,IAAKH,EAAMI,QAAQ,GACnBC,QAASL,EAAMI,QAAQ,GACvBE,gBAAiBC,EAAMP,EAAMQ,QAAQC,MAAMC,MAAO,IAClDC,aAAcX,EAAMY,MAAMD,aAC3B"}

package/dist/types/filter-bar/menu/create-form-field-select-multiple.d.ts

@@ -1,10 +1,13 @@
-import type { FC } from 'react';
+import type { FC, ReactNode } from 'react';
 import type { IFieldSelectOption } from './create-form-field-select';
 import type { TLogic } from '../types';
 import type { IFieldMenuConfig, IFilterMenuFormProps } from './types';
 /** Props for the `FormFieldSelectMultiple` component returned by `createFormFieldSelectMultiple`. Extends the base filter-menu form props. */
 export interface IFormFieldSelectMultipleProps<T> extends IFilterMenuFormProps<T> {
+    /** Callback function to handle errors */
     onError?: () => void;
+    /** Optional content to render at the top of the form */
+    top?: ReactNode;
 }
 /** Parameters passed to `createFormFieldSelectMultiple` to configure the generated component. */
 export interface IFormFieldSelectMultipleParam<T> {
@@ -20,6 +23,8 @@ export interface IFormFieldSelectMultipleParam<T> {
     forceLogic?: TLogic;
     /** Maximum number of values that can be selected */
     maxValueCount?: number;
+    /** Optional content to render at the top of the form */
+    top?: ReactNode;
 }
 /**
  * Factory function that creates a `FormFieldSelectMultiple` filter-menu component.

package/dist/types/filter-bar/menu/create-form-field-select.d.ts

@@ -1,9 +1,12 @@
-import { FC } from 'react';
+import { FC, ReactNode } from 'react';
 import type { TFieldValid, TLogic } from '../types';
 import type { IFieldMenuConfig, IFilterMenuFormProps } from './types';
 /** Props for the `FormFieldSelect` component returned by `createFormFieldSelect`. Extends the base filter-menu form props. */
 export interface IFormFieldSelectProps<T> extends IFilterMenuFormProps<T> {
+    /** Callback function to handle errors */
     onError?: () => void;
+    /** Optional content to render at the top of the form */
+    top?: ReactNode;
 }
 /** A single option item rendered as a radio button inside the select filter menu. */
 export interface IFieldSelectOption {
@@ -22,6 +25,8 @@ export interface IFormFieldSelectParam<T> {
     forceLogic?: TLogic;
     /** Maximum number of values that can be selected for this field */
     maxValueCount?: number;
+    /** Optional content to render at the top of the form */
+    top?: ReactNode;
 }
 /**
  * Factory function that creates a `FormFieldSelect` filter-menu component.

package/dist/types/filter-bar/menu/create-form-field-select.fallback.d.ts

@@ -1,5 +1,13 @@
-import { FC } from 'react';
-import { IFormFieldSelectParam } from './create-form-field-select';
-import { IFormFieldSelectMultipleParam } from './create-form-field-select-multiple';
-export declare function createFormFieldSelectWithFallback<T>(params: IFormFieldSelectParam<T>): FC<any>;
-export declare function createFormFieldSelectMultipleWithFallback<T>(params: IFormFieldSelectMultipleParam<T>): FC<any>;
+import { Dispatch, FC, ReactNode, SetStateAction } from 'react';
+import { TFetchStatus } from './types';
+import { IFormFieldSelectParam, IFormFieldSelectProps } from './create-form-field-select';
+import { IFormFieldSelectMultipleParam, IFormFieldSelectMultipleProps } from './create-form-field-select-multiple';
+type IFallbackPropsBase = {
+    renderTop?: (param?: {
+        setStatus: Dispatch<SetStateAction<TFetchStatus>>;
+        status: TFetchStatus;
+    }) => ReactNode;
+};
+export declare function createFormFieldSelectWithFallback<T>(params: IFormFieldSelectParam<T> & IFallbackPropsBase): FC<IFormFieldSelectProps<T>>;
+export declare function createFormFieldSelectMultipleWithFallback<T>(params: IFormFieldSelectMultipleParam<T> & IFallbackPropsBase): FC<IFormFieldSelectMultipleProps<T>>;
+export {};

package/dist/types/filter-bar/menu/ui.units.d.ts

@@ -1,2 +1,6 @@
 import { FC } from 'react';
-export declare const ErrorPannel: FC;
+interface IErrorPannelProps {
+    onRetry?: () => void;
+}
+export declare const ErrorPannel: FC<IErrorPannelProps>;
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dinocollab-core",
-  "version": "2.2.39",
+  "version": "2.2.40",
   "description": "Dinocollab core - libraries for building collaborative applications with React 18",
   "main": "dist/index.js",
   "module": "dist/index.js",