@aglyn/shared-ui-jsx-forms 1.0.0-beta.143

package/src/lib/mapper/dual-list-select.d.ts

@@ -0,0 +1,115 @@
+/**
+ * @license
+ * Copyright 2026 Aglyn LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * Ported from `@data-driven-forms/mui-component-mapper` (Apache-2.0) and
+ * updated for the current MUI APIs (Grid `size`, `ListItemButton` instead of
+ * the removed `ListItem button` prop).
+ */
+import type { HelpTipContent } from '@aglyn/shared-ui-jsx';
+import { type ButtonProps, type FormControlProps, type FormHelperTextProps, type FormLabelProps, type GridProps, type IconButtonProps, type ListItemButtonProps, type ListItemIconProps, type ListItemTextProps, type ListProps, type PaperProps, type TextFieldProps, type ToolbarProps, type TypographyProps } from '@mui/material';
+import { type ExtendedFieldMeta } from './validation-error';
+export interface DualListSelectProps {
+    handleOptionsClick: (e: any, value: any) => void;
+    rightValues: any[];
+    noValueTitle?: string;
+    filterValueText?: string;
+    leftValues: any[];
+    noOptionsTitle?: string;
+    state: any;
+    filterOptionsText?: string;
+    handleValuesClick: (e: any, value: any) => void;
+    handleMoveRight: () => void;
+    moveRightTitle?: string;
+    handleClearLeftValues: () => void;
+    moveAllRightTitle?: string;
+    handleClearRightValues: () => void;
+    moveAllLeftTitle?: string;
+    handleMoveLeft: () => void;
+    moveLeftTitle?: string;
+    allToRight?: boolean;
+    allToLeft?: boolean;
+    checkboxVariant?: boolean;
+    isRequired?: boolean;
+    meta: ExtendedFieldMeta;
+    validateOnMount?: boolean;
+    label?: string;
+    helperText?: string;
+    description?: string;
+    filterOptionsTitle?: string;
+    leftTitle?: string;
+    filterOptions: (value: string) => void;
+    sortOptions: () => void;
+    sortValues: () => void;
+    filterValueTitle?: string;
+    filterValues: (value: string) => void;
+    rightTitle?: string;
+    isFilterable?: boolean;
+    /** Contextual help tooltip rendered at the field's top-right (AGL-601). */
+    help?: HelpTipContent;
+    FormFieldGridProps?: any;
+    InternalGridProps?: GridProps;
+    ListGridProps?: GridProps;
+    LeftListGridProps?: GridProps;
+    ListProps?: ListProps;
+    LeftListProps?: ListProps;
+    ButtonsGridProps?: GridProps;
+    ButtonsInternalGridProps?: GridProps;
+    ButtonGridProps?: GridProps;
+    ToRightGridProps?: GridProps;
+    IconButtonProps?: ButtonProps;
+    ToRightIconButtonProps?: ButtonProps;
+    AllToRightGridProps?: GridProps;
+    AllToRightIconButtonProps?: ButtonProps;
+    AllToLeftGridProps?: GridProps;
+    AllToLeftIconButtonProps?: ButtonProps;
+    ToLeftGridProps?: GridProps;
+    ToLeftIconButtonProps?: ButtonProps;
+    RightListGridProps?: GridProps;
+    RightListProps?: ListProps;
+    ListItemProps?: ListItemButtonProps;
+    ListItemIconProps?: ListItemIconProps;
+    ListItemTextProps?: ListItemTextProps;
+    LeftListItemProps?: ListItemButtonProps;
+    LeftListItemIconProps?: ListItemIconProps;
+    LeftItemTextProps?: ListItemTextProps;
+    RightListItemProps?: ListItemButtonProps;
+    RightListItemIconProps?: ListItemIconProps;
+    RightItemTextProps?: ListItemTextProps;
+    FormControlProps?: FormControlProps;
+    FormLabelProps?: FormLabelProps;
+    FormHelperTextProps?: FormHelperTextProps;
+    TitleProps?: TypographyProps;
+    ToolbarProps?: ToolbarProps;
+    FilterFieldProps?: TextFieldProps;
+    SortIconButtonProps?: IconButtonProps;
+    SortIconProps?: any;
+    LeftToolbarProps?: ToolbarProps;
+    LeftFilterFieldProps?: TextFieldProps;
+    LeftSortIconButtonProps?: IconButtonProps;
+    LeftSortIconProps?: any;
+    LeftTitleProps?: TypographyProps;
+    RightToolbarProps?: ToolbarProps;
+    RightFilterFieldProps?: TextFieldProps;
+    RightSortIconButtonProps?: IconButtonProps;
+    RightSortIconProps?: any;
+    RightTitleProps?: TypographyProps;
+    PaperProps?: PaperProps;
+    LeftPaperProps?: PaperProps;
+    RightPaperProps?: PaperProps;
+}
+export declare const DualListSelectWrapper: (props: any) => import("react").JSX.Element;
+export default DualListSelectWrapper;

package/src/lib/mapper/dual-list-select.js

@@ -0,0 +1,353 @@
+/**
+ * @license
+ * Copyright 2026 Aglyn LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */ /**
+ * Ported from `@data-driven-forms/mui-component-mapper` (Apache-2.0) and
+ * updated for the current MUI APIs (Grid `size`, `ListItemButton` instead of
+ * the removed `ListItem button` prop).
+ */ import { _ as _extends } from "@swc/helpers/_/_extends";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, Checkbox, FormControl, FormHelperText, FormLabel, Grid, IconButton, List, ListItem, ListItemButton, ListItemIcon, ListItemText, Paper, TextField, Toolbar, Typography } from "@mui/material";
+import { styled } from "@mui/material/styles";
+import SortIcon from "@mui/icons-material/ArrowUpward";
+import clsx from "clsx";
+import DualListSelectCommon from "@data-driven-forms/common/dual-list-select";
+import FormFieldGrid from "./form-field-grid.js";
+import { validationError } from "./validation-error.js";
+const PREFIX = 'DualListSelectWrapper';
+const classes = {
+    allToLeftIcon: `${PREFIX}-allToLeftIcon`,
+    upsideDown: `${PREFIX}-upsideDown`,
+    list: `${PREFIX}-list`,
+    button: `${PREFIX}-button`,
+    buttonsGrid: `${PREFIX}-buttonsGrid`,
+    filter: `${PREFIX}-filter`,
+    toolbar: `${PREFIX}-toolbar`
+};
+const StyledDualListSelect = styled(FormFieldGrid)(({ theme })=>({
+        [`& .${classes.allToLeftIcon}`]: {
+            transform: 'scaleX(-1)'
+        },
+        [`& .${classes.upsideDown}`]: {
+            transform: 'scaleY(-1)'
+        },
+        [`& .${classes.list}`]: {
+            height: 300,
+            overflow: 'auto'
+        },
+        [`& .${classes.button}`]: {
+            display: 'flex',
+            justifyContent: 'center',
+            margin: theme.spacing(0.5, 0)
+        },
+        [`& .${classes.buttonsGrid}`]: {
+            height: '100%',
+            alignContent: 'center'
+        },
+        [`& .${classes.filter}`]: {
+            width: '100%'
+        },
+        [`& .${classes.toolbar}`]: {
+            paddingLeft: 16,
+            paddingRight: 16
+        }
+    }));
+const ListInternal = ({ value = [], optionClick, noOptionsTitle, filterValue, filterValueText, selectedValues, ListProps = {}, ListItemProps, ListItemIconProps, ListItemTextProps, checkboxVariant, PaperProps, LeftPaperProps })=>/*#__PURE__*/ _jsx(Paper, _extends({}, PaperProps, LeftPaperProps, {
+        className: clsx(PaperProps && PaperProps.className, LeftPaperProps && LeftPaperProps.className),
+        children: /*#__PURE__*/ _jsxs(List, _extends({
+            component: "div",
+            role: "list",
+            dense: true
+        }, ListProps, {
+            className: clsx(classes.list, ListProps.className),
+            children: [
+                value.length < 1 && /*#__PURE__*/ _jsx(ListItemButton, _extends({
+                    disabled: true
+                }, ListItemProps, {
+                    children: /*#__PURE__*/ _jsx(ListItemText, {
+                        primary: filterValue ? filterValueText : noOptionsTitle
+                    })
+                })),
+                value.length > 0 && value.map(({ value, label, icon, isCheckbox, secondaryActions, ListItemProps: ListItemPropsItem, ListItemIconProps: ListItemIconPropsItem, ListItemTextProps: ListItemTextPropsItem })=>/*#__PURE__*/ _jsx(ListItem, _extends({
+                        disablePadding: true
+                    }, secondaryActions && {
+                        secondaryAction: secondaryActions
+                    }, {
+                        children: /*#__PURE__*/ _jsxs(ListItemButton, _extends({
+                            selected: selectedValues.includes(value),
+                            onClick: (e)=>optionClick(isCheckbox || checkboxVariant ? _extends({}, e, {
+                                    ctrlKey: true
+                                }) : e, value),
+                            sx: {
+                                cursor: 'pointer'
+                            }
+                        }, ListItemProps, ListItemPropsItem, {
+                            children: [
+                                (icon || isCheckbox || checkboxVariant) && /*#__PURE__*/ _jsx(ListItemIcon, _extends({}, ListItemIconProps, ListItemIconPropsItem, {
+                                    children: isCheckbox || checkboxVariant ? /*#__PURE__*/ _jsx(Checkbox, {
+                                        edge: "start",
+                                        checked: selectedValues.includes(value),
+                                        tabIndex: -1,
+                                        disableRipple: true
+                                    }) : icon
+                                })),
+                                /*#__PURE__*/ _jsx(ListItemText, _extends({
+                                    primary: label
+                                }, ListItemTextProps, ListItemTextPropsItem))
+                            ]
+                        }))
+                    }), value))
+            ]
+        }))
+    }));
+const ToolbarInternal = ({ ToolbarProps, LeftToolbarProps, filterOptions, filterOptionsTitle, FilterFieldProps, sortOptions, SortIconButtonProps, SortIconProps, LeftSortIconProps, LeftFilterFieldProps, LeftSortIconButtonProps, filter, sortDesc, isValue = false })=>/*#__PURE__*/ _jsxs(Toolbar, _extends({
+        variant: "dense"
+    }, ToolbarProps, LeftToolbarProps, {
+        className: clsx(classes.toolbar, ToolbarProps && ToolbarProps.className, LeftToolbarProps && LeftToolbarProps.className),
+        children: [
+            /*#__PURE__*/ _jsx(TextField, _extends({
+                "aria-label": isValue ? 'value-search' : 'options-search',
+                label: filterOptionsTitle,
+                onChange: ({ target: { value } })=>filterOptions(value),
+                value: filter,
+                type: "search"
+            }, FilterFieldProps, LeftFilterFieldProps, {
+                className: clsx(classes.filter, FilterFieldProps && FilterFieldProps.className, LeftFilterFieldProps && LeftFilterFieldProps.className)
+            })),
+            /*#__PURE__*/ _jsx(IconButton, _extends({
+                "aria-label": isValue ? 'sort value' : 'sort options',
+                edge: "end",
+                onClick: sortOptions,
+                color: "inherit"
+            }, SortIconButtonProps, LeftSortIconButtonProps, {
+                size: "large",
+                children: /*#__PURE__*/ _jsx(SortIcon, _extends({}, SortIconProps, LeftSortIconProps, {
+                    className: clsx(!sortDesc && classes.upsideDown, SortIconProps && SortIconProps.className, LeftSortIconProps && LeftSortIconProps.className)
+                }))
+            }))
+        ]
+    }));
+const DualListSelect = ({ handleOptionsClick, rightValues, noValueTitle = 'No selected', filterValueText = 'Remove your filter to see all selected', leftValues, noOptionsTitle = 'No available options', state, filterOptionsText = 'Remove your filter to see all options', handleValuesClick, handleMoveRight, moveRightTitle = 'Move selected to right', handleClearLeftValues, moveAllRightTitle = 'Move all to right', handleClearRightValues, moveAllLeftTitle = 'Move all to left', handleMoveLeft, moveLeftTitle = 'Move selected to left', allToRight = true, allToLeft = true, checkboxVariant, isRequired, meta, validateOnMount, label, helperText, description, filterOptionsTitle = 'Filter options', leftTitle = 'Options', filterOptions, sortOptions, sortValues, filterValueTitle = 'Filter selected value', filterValues, rightTitle = 'Selected', isFilterable = true, help, // Props
+FormFieldGridProps, InternalGridProps, ListGridProps, LeftListGridProps, ListProps, LeftListProps, ButtonsGridProps, ButtonsInternalGridProps, ButtonGridProps, ToRightGridProps, IconButtonProps, ToRightIconButtonProps, AllToRightGridProps, AllToRightIconButtonProps, AllToLeftGridProps, AllToLeftIconButtonProps, ToLeftGridProps, ToLeftIconButtonProps, RightListGridProps, RightListProps, ListItemProps, ListItemIconProps, ListItemTextProps, LeftListItemProps, LeftListItemIconProps, LeftItemTextProps, RightListItemProps, RightListItemIconProps, RightItemTextProps, FormControlProps, FormLabelProps, FormHelperTextProps, TitleProps, ToolbarProps, FilterFieldProps, SortIconButtonProps, SortIconProps, LeftToolbarProps, LeftFilterFieldProps, LeftSortIconButtonProps, LeftSortIconProps, LeftTitleProps, RightToolbarProps, RightFilterFieldProps, RightSortIconButtonProps, RightSortIconProps, RightTitleProps, PaperProps, LeftPaperProps, RightPaperProps })=>{
+    const invalid = validationError(meta, validateOnMount);
+    const text = invalid || (meta.touched || validateOnMount) && meta.warning || helperText || description;
+    return /*#__PURE__*/ _jsx(StyledDualListSelect, _extends({
+        help: help
+    }, FormFieldGridProps, {
+        children: /*#__PURE__*/ _jsxs(FormControl, _extends({
+            fullWidth: true,
+            required: isRequired,
+            error: !!invalid,
+            component: "fieldset"
+        }, FormControlProps, {
+            children: [
+                /*#__PURE__*/ _jsx(FormLabel, _extends({
+                    component: "legend"
+                }, FormLabelProps, {
+                    children: label
+                })),
+                /*#__PURE__*/ _jsxs(Grid, _extends({
+                    container: true
+                }, InternalGridProps, {
+                    children: [
+                        /*#__PURE__*/ _jsxs(Grid, _extends({
+                            size: {
+                                xs: 12,
+                                md: 5
+                            }
+                        }, ListGridProps, LeftListGridProps, {
+                            children: [
+                                leftTitle && /*#__PURE__*/ _jsx(Typography, _extends({
+                                    variant: "h6",
+                                    gutterBottom: true
+                                }, TitleProps, LeftTitleProps, {
+                                    children: leftTitle
+                                })),
+                                isFilterable && /*#__PURE__*/ _jsx(ToolbarInternal, {
+                                    ToolbarProps: ToolbarProps,
+                                    LeftToolbarProps: LeftToolbarProps,
+                                    filterOptions: filterOptions,
+                                    filterOptionsTitle: filterOptionsTitle,
+                                    FilterFieldProps: FilterFieldProps,
+                                    sortOptions: sortOptions,
+                                    SortIconButtonProps: SortIconButtonProps,
+                                    SortIconProps: SortIconProps,
+                                    LeftSortIconProps: LeftSortIconProps,
+                                    LeftFilterFieldProps: LeftFilterFieldProps,
+                                    LeftSortIconButtonProps: LeftSortIconButtonProps,
+                                    filter: state.filterOptions,
+                                    sortDesc: state.sortLeftDesc
+                                }),
+                                /*#__PURE__*/ _jsx(ListInternal, {
+                                    optionClick: handleOptionsClick,
+                                    value: leftValues,
+                                    noOptionsTitle: noOptionsTitle,
+                                    filterValue: state.filterOptions,
+                                    filterValueText: filterOptionsText,
+                                    selectedValues: state.selectedLeftValues,
+                                    checkboxVariant: checkboxVariant,
+                                    ListProps: _extends({}, ListProps, LeftListProps),
+                                    ListItemProps: _extends({}, ListItemProps, LeftListItemProps),
+                                    ListItemIconProps: _extends({}, ListItemIconProps, LeftListItemIconProps),
+                                    ListItemTextProps: _extends({}, ListItemTextProps, LeftItemTextProps),
+                                    PaperProps: PaperProps,
+                                    LeftPaperProps: LeftPaperProps
+                                })
+                            ]
+                        })),
+                        /*#__PURE__*/ _jsx(Grid, _extends({
+                            size: {
+                                xs: 12,
+                                md: 2
+                            }
+                        }, ButtonsGridProps, {
+                            children: /*#__PURE__*/ _jsxs(Grid, _extends({
+                                container: true
+                            }, ButtonsInternalGridProps, {
+                                className: clsx(classes.buttonsGrid, ButtonsInternalGridProps && ButtonsInternalGridProps.className),
+                                children: [
+                                    allToRight && /*#__PURE__*/ _jsx(Grid, _extends({
+                                        size: {
+                                            md: 12,
+                                            sm: 3
+                                        }
+                                    }, ButtonGridProps, AllToRightGridProps, {
+                                        className: clsx(classes.button, ButtonGridProps && ButtonGridProps.className, AllToRightGridProps && AllToRightGridProps.className),
+                                        children: /*#__PURE__*/ _jsx(Button, _extends({
+                                            variant: "outlined",
+                                            size: "small",
+                                            disabled: leftValues.length === 0,
+                                            onClick: handleClearLeftValues,
+                                            "aria-label": moveAllRightTitle
+                                        }, IconButtonProps, AllToRightIconButtonProps, {
+                                            children: "≫"
+                                        }))
+                                    })),
+                                    /*#__PURE__*/ _jsx(Grid, _extends({
+                                        size: {
+                                            md: 12,
+                                            sm: 3
+                                        }
+                                    }, ButtonGridProps, ToRightGridProps, {
+                                        className: clsx(classes.button, ButtonGridProps && ButtonGridProps.className, ToRightGridProps && ToRightGridProps.className),
+                                        children: /*#__PURE__*/ _jsx(Button, _extends({
+                                            variant: "outlined",
+                                            size: "small",
+                                            disabled: leftValues.length === 0,
+                                            onClick: handleMoveRight,
+                                            "aria-label": moveRightTitle
+                                        }, IconButtonProps, ToRightIconButtonProps, {
+                                            children: ">"
+                                        }))
+                                    })),
+                                    /*#__PURE__*/ _jsx(Grid, _extends({
+                                        size: {
+                                            md: 12,
+                                            sm: 3
+                                        }
+                                    }, ButtonGridProps, ToLeftGridProps, {
+                                        className: clsx(classes.button, ButtonGridProps && ButtonGridProps.className, ToLeftGridProps && ToLeftGridProps.className),
+                                        children: /*#__PURE__*/ _jsx(Button, _extends({
+                                            variant: "outlined",
+                                            size: "small",
+                                            disabled: rightValues.length === 0,
+                                            onClick: handleMoveLeft,
+                                            "aria-label": moveLeftTitle
+                                        }, IconButtonProps, ToLeftIconButtonProps, {
+                                            children: "<"
+                                        }))
+                                    })),
+                                    allToLeft && /*#__PURE__*/ _jsx(Grid, _extends({
+                                        size: {
+                                            md: 12,
+                                            sm: 3
+                                        }
+                                    }, ButtonGridProps, AllToLeftGridProps, {
+                                        className: clsx(classes.button, ButtonGridProps && ButtonGridProps.className, AllToLeftGridProps && AllToLeftGridProps.className),
+                                        children: /*#__PURE__*/ _jsx(Button, _extends({
+                                            variant: "outlined",
+                                            size: "small",
+                                            disabled: rightValues.length === 0,
+                                            onClick: handleClearRightValues,
+                                            "aria-label": moveAllLeftTitle
+                                        }, IconButtonProps, AllToLeftIconButtonProps, {
+                                            children: "≪"
+                                        }))
+                                    }))
+                                ]
+                            }))
+                        })),
+                        /*#__PURE__*/ _jsxs(Grid, _extends({
+                            size: {
+                                xs: 12,
+                                md: 5
+                            }
+                        }, ListGridProps, RightListGridProps, {
+                            children: [
+                                rightTitle && /*#__PURE__*/ _jsx(Typography, _extends({
+                                    variant: "h6",
+                                    gutterBottom: true
+                                }, TitleProps, RightTitleProps, {
+                                    children: rightTitle
+                                })),
+                                isFilterable && /*#__PURE__*/ _jsx(ToolbarInternal, {
+                                    ToolbarProps: ToolbarProps,
+                                    LeftToolbarProps: RightToolbarProps,
+                                    filterOptions: filterValues,
+                                    filterOptionsTitle: filterValueTitle,
+                                    FilterFieldProps: FilterFieldProps,
+                                    sortOptions: sortValues,
+                                    SortIconButtonProps: SortIconButtonProps,
+                                    SortIconProps: SortIconProps,
+                                    LeftSortIconProps: RightSortIconProps,
+                                    LeftFilterFieldProps: RightFilterFieldProps,
+                                    LeftSortIconButtonProps: RightSortIconButtonProps,
+                                    filter: state.filterValue,
+                                    sortDesc: state.sortRightDesc,
+                                    isValue: true
+                                }),
+                                /*#__PURE__*/ _jsx(ListInternal, {
+                                    checkboxVariant: checkboxVariant,
+                                    optionClick: handleValuesClick,
+                                    value: rightValues,
+                                    noOptionsTitle: noValueTitle,
+                                    filterValue: state.filterValue,
+                                    filterValueText: filterValueText,
+                                    selectedValues: state.selectedRightValues,
+                                    ListProps: _extends({}, ListProps, RightListProps),
+                                    ListItemProps: _extends({}, ListItemProps, RightListItemProps),
+                                    ListItemIconProps: _extends({}, ListItemIconProps, RightListItemIconProps),
+                                    ListItemTextProps: _extends({}, ListItemTextProps, RightItemTextProps),
+                                    PaperProps: PaperProps,
+                                    LeftPaperProps: RightPaperProps
+                                })
+                            ]
+                        }))
+                    ]
+                })),
+                text && /*#__PURE__*/ _jsx(FormHelperText, _extends({}, FormHelperTextProps, {
+                    children: text
+                }))
+            ]
+        }))
+    }));
+};
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export const DualListSelectWrapper = (props)=>/*#__PURE__*/ _jsx(DualListSelectCommon, _extends({}, props, {
+        DualListSelect: DualListSelect
+    }));
+export default DualListSelectWrapper;
+
+//# sourceMappingURL=dual-list-select.js.map

package/src/lib/mapper/dual-list-select.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../../libs/shared/ui/jsx-forms/src/lib/mapper/dual-list-select.tsx"],"sourcesContent":["/**\n * @license\n * Copyright 2026 Aglyn LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *   http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n/**\n * Ported from `@data-driven-forms/mui-component-mapper` (Apache-2.0) and\n * updated for the current MUI APIs (Grid `size`, `ListItemButton` instead of\n * the removed `ListItem button` prop).\n */\n\nimport type { HelpTipContent } from '@aglyn/shared-ui-jsx'\nimport type { ReactNode } from 'react'\n\nimport {\n  Button,\n  type ButtonProps,\n  Checkbox,\n  FormControl,\n  type FormControlProps,\n  FormHelperText,\n  type FormHelperTextProps,\n  FormLabel,\n  type FormLabelProps,\n  Grid,\n  type GridProps,\n  IconButton,\n  type IconButtonProps,\n  List,\n  ListItem,\n  ListItemButton,\n  type ListItemButtonProps,\n  ListItemIcon,\n  type ListItemIconProps,\n  ListItemText,\n  type ListItemTextProps,\n  type ListProps,\n  Paper,\n  type PaperProps,\n  TextField,\n  type TextFieldProps,\n  Toolbar,\n  type ToolbarProps,\n  Typography,\n  type TypographyProps,\n} from '@mui/material'\nimport { styled } from '@mui/material/styles'\n\nimport SortIcon from '@mui/icons-material/ArrowUpward'\n\nimport clsx from 'clsx'\n\nimport DualListSelectCommon from '@data-driven-forms/common/dual-list-select'\n\nimport FormFieldGrid from './form-field-grid'\nimport { type ExtendedFieldMeta, validationError } from './validation-error'\n\nconst PREFIX = 'DualListSelectWrapper'\n\nconst classes = {\n  allToLeftIcon: `${PREFIX}-allToLeftIcon`,\n  upsideDown: `${PREFIX}-upsideDown`,\n  list: `${PREFIX}-list`,\n  button: `${PREFIX}-button`,\n  buttonsGrid: `${PREFIX}-buttonsGrid`,\n  filter: `${PREFIX}-filter`,\n  toolbar: `${PREFIX}-toolbar`,\n}\n\nconst StyledDualListSelect = styled(FormFieldGrid)(({ theme }) => ({\n  [`& .${classes.allToLeftIcon}`]: {\n    transform: 'scaleX(-1)',\n  },\n\n  [`& .${classes.upsideDown}`]: {\n    transform: 'scaleY(-1)',\n  },\n\n  [`& .${classes.list}`]: {\n    height: 300,\n    overflow: 'auto',\n  },\n\n  [`& .${classes.button}`]: {\n    display: 'flex',\n    justifyContent: 'center',\n    margin: theme.spacing(0.5, 0),\n  },\n\n  [`& .${classes.buttonsGrid}`]: {\n    height: '100%',\n    alignContent: 'center',\n  },\n\n  [`& .${classes.filter}`]: {\n    width: '100%',\n  },\n\n  [`& .${classes.toolbar}`]: {\n    paddingLeft: 16,\n    paddingRight: 16,\n  },\n}))\n\ninterface ListOption {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  value: any\n  label: string\n  icon?: ReactNode\n  isCheckbox?: boolean\n  secondaryActions?: ReactNode\n  ListItemProps?: ListItemButtonProps\n  ListItemIconProps?: ListItemIconProps\n  ListItemTextProps?: ListItemTextProps\n}\n\ninterface ListInternalProps {\n  value?: ListOption[]\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  optionClick: (e: any, value: any) => void\n  noOptionsTitle: string\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  filterValue: any\n  filterValueText: string\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  selectedValues: any[]\n  ListProps?: ListProps\n  ListItemProps?: ListItemButtonProps\n  ListItemIconProps?: ListItemIconProps\n  ListItemTextProps?: ListItemTextProps\n  checkboxVariant?: boolean\n  PaperProps?: PaperProps\n  LeftPaperProps?: PaperProps\n}\n\nconst ListInternal = ({\n  value = [],\n  optionClick,\n  noOptionsTitle,\n  filterValue,\n  filterValueText,\n  selectedValues,\n  ListProps = {},\n  ListItemProps,\n  ListItemIconProps,\n  ListItemTextProps,\n  checkboxVariant,\n  PaperProps,\n  LeftPaperProps,\n}: ListInternalProps) => (\n  <Paper\n    {...PaperProps}\n    {...LeftPaperProps}\n    className={clsx(\n      PaperProps && PaperProps.className,\n      LeftPaperProps && LeftPaperProps.className,\n    )}\n  >\n    <List\n      component=\"div\"\n      role=\"list\"\n      dense\n      {...ListProps}\n      className={clsx(classes.list, ListProps.className)}\n    >\n      {value.length < 1 && (\n        <ListItemButton disabled {...ListItemProps}>\n          <ListItemText primary={filterValue ? filterValueText : noOptionsTitle} />\n        </ListItemButton>\n      )}\n      {value.length > 0 &&\n        value.map(\n          ({\n            value,\n            label,\n            icon,\n            isCheckbox,\n            secondaryActions,\n            ListItemProps: ListItemPropsItem,\n            ListItemIconProps: ListItemIconPropsItem,\n            ListItemTextProps: ListItemTextPropsItem,\n          }) => (\n            <ListItem\n              key={value}\n              disablePadding\n              {...(secondaryActions && { secondaryAction: secondaryActions })}\n            >\n              <ListItemButton\n                selected={selectedValues.includes(value)}\n                onClick={(e) =>\n                  optionClick(\n                    isCheckbox || checkboxVariant ? { ...e, ctrlKey: true } : e,\n                    value,\n                  )\n                }\n                sx={{ cursor: 'pointer' }}\n                {...ListItemProps}\n                {...ListItemPropsItem}\n              >\n                {(icon || isCheckbox || checkboxVariant) && (\n                  <ListItemIcon {...ListItemIconProps} {...ListItemIconPropsItem}>\n                    {isCheckbox || checkboxVariant ? (\n                      <Checkbox\n                        edge=\"start\"\n                        checked={selectedValues.includes(value)}\n                        tabIndex={-1}\n                        disableRipple\n                      />\n                    ) : (\n                      icon\n                    )}\n                  </ListItemIcon>\n                )}\n                <ListItemText\n                  primary={label}\n                  {...ListItemTextProps}\n                  {...ListItemTextPropsItem}\n                />\n              </ListItemButton>\n            </ListItem>\n          ),\n        )}\n    </List>\n  </Paper>\n)\n\ninterface ToolbarInternalProps {\n  ToolbarProps?: ToolbarProps\n  LeftToolbarProps?: ToolbarProps\n  filterOptions: (value: string) => void\n  filterOptionsTitle: string\n  FilterFieldProps?: TextFieldProps\n  sortOptions: () => void\n  SortIconButtonProps?: IconButtonProps\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  SortIconProps?: any\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  LeftSortIconProps?: any\n  LeftFilterFieldProps?: TextFieldProps\n  LeftSortIconButtonProps?: IconButtonProps\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  filter: any\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  sortDesc: any\n  isValue?: boolean\n}\n\nconst ToolbarInternal = ({\n  ToolbarProps,\n  LeftToolbarProps,\n  filterOptions,\n  filterOptionsTitle,\n  FilterFieldProps,\n  sortOptions,\n  SortIconButtonProps,\n  SortIconProps,\n  LeftSortIconProps,\n  LeftFilterFieldProps,\n  LeftSortIconButtonProps,\n  filter,\n  sortDesc,\n  isValue = false,\n}: ToolbarInternalProps) => (\n  <Toolbar\n    variant=\"dense\"\n    {...ToolbarProps}\n    {...LeftToolbarProps}\n    className={clsx(\n      classes.toolbar,\n      ToolbarProps && ToolbarProps.className,\n      LeftToolbarProps && LeftToolbarProps.className,\n    )}\n  >\n    <TextField\n      aria-label={isValue ? 'value-search' : 'options-search'}\n      label={filterOptionsTitle}\n      onChange={({ target: { value } }) => filterOptions(value)}\n      value={filter}\n      type=\"search\"\n      {...FilterFieldProps}\n      {...LeftFilterFieldProps}\n      className={clsx(\n        classes.filter,\n        FilterFieldProps && FilterFieldProps.className,\n        LeftFilterFieldProps && LeftFilterFieldProps.className,\n      )}\n    />\n    <IconButton\n      aria-label={isValue ? 'sort value' : 'sort options'}\n      edge=\"end\"\n      onClick={sortOptions}\n      color=\"inherit\"\n      {...SortIconButtonProps}\n      {...LeftSortIconButtonProps}\n      size=\"large\"\n    >\n      <SortIcon\n        {...SortIconProps}\n        {...LeftSortIconProps}\n        className={clsx(\n          !sortDesc && classes.upsideDown,\n          SortIconProps && SortIconProps.className,\n          LeftSortIconProps && LeftSortIconProps.className,\n        )}\n      />\n    </IconButton>\n  </Toolbar>\n)\n\nexport interface DualListSelectProps {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  handleOptionsClick: (e: any, value: any) => void\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  rightValues: any[]\n  noValueTitle?: string\n  filterValueText?: string\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  leftValues: any[]\n  noOptionsTitle?: string\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  state: any\n  filterOptionsText?: string\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  handleValuesClick: (e: any, value: any) => void\n  handleMoveRight: () => void\n  moveRightTitle?: string\n  handleClearLeftValues: () => void\n  moveAllRightTitle?: string\n  handleClearRightValues: () => void\n  moveAllLeftTitle?: string\n  handleMoveLeft: () => void\n  moveLeftTitle?: string\n  allToRight?: boolean\n  allToLeft?: boolean\n  checkboxVariant?: boolean\n  isRequired?: boolean\n  meta: ExtendedFieldMeta\n  validateOnMount?: boolean\n  label?: string\n  helperText?: string\n  description?: string\n  filterOptionsTitle?: string\n  leftTitle?: string\n  filterOptions: (value: string) => void\n  sortOptions: () => void\n  sortValues: () => void\n  filterValueTitle?: string\n  filterValues: (value: string) => void\n  rightTitle?: string\n  isFilterable?: boolean\n  /** Contextual help tooltip rendered at the field's top-right (AGL-601). */\n  help?: HelpTipContent\n  // MUI component props\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  FormFieldGridProps?: any\n  InternalGridProps?: GridProps\n  ListGridProps?: GridProps\n  LeftListGridProps?: GridProps\n  ListProps?: ListProps\n  LeftListProps?: ListProps\n  ButtonsGridProps?: GridProps\n  ButtonsInternalGridProps?: GridProps\n  ButtonGridProps?: GridProps\n  ToRightGridProps?: GridProps\n  IconButtonProps?: ButtonProps\n  ToRightIconButtonProps?: ButtonProps\n  AllToRightGridProps?: GridProps\n  AllToRightIconButtonProps?: ButtonProps\n  AllToLeftGridProps?: GridProps\n  AllToLeftIconButtonProps?: ButtonProps\n  ToLeftGridProps?: GridProps\n  ToLeftIconButtonProps?: ButtonProps\n  RightListGridProps?: GridProps\n  RightListProps?: ListProps\n  ListItemProps?: ListItemButtonProps\n  ListItemIconProps?: ListItemIconProps\n  ListItemTextProps?: ListItemTextProps\n  LeftListItemProps?: ListItemButtonProps\n  LeftListItemIconProps?: ListItemIconProps\n  LeftItemTextProps?: ListItemTextProps\n  RightListItemProps?: ListItemButtonProps\n  RightListItemIconProps?: ListItemIconProps\n  RightItemTextProps?: ListItemTextProps\n  FormControlProps?: FormControlProps\n  FormLabelProps?: FormLabelProps\n  FormHelperTextProps?: FormHelperTextProps\n  TitleProps?: TypographyProps\n  ToolbarProps?: ToolbarProps\n  FilterFieldProps?: TextFieldProps\n  SortIconButtonProps?: IconButtonProps\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  SortIconProps?: any\n  LeftToolbarProps?: ToolbarProps\n  LeftFilterFieldProps?: TextFieldProps\n  LeftSortIconButtonProps?: IconButtonProps\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  LeftSortIconProps?: any\n  LeftTitleProps?: TypographyProps\n  RightToolbarProps?: ToolbarProps\n  RightFilterFieldProps?: TextFieldProps\n  RightSortIconButtonProps?: IconButtonProps\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  RightSortIconProps?: any\n  RightTitleProps?: TypographyProps\n  PaperProps?: PaperProps\n  LeftPaperProps?: PaperProps\n  RightPaperProps?: PaperProps\n}\n\nconst DualListSelect = ({\n  handleOptionsClick,\n  rightValues,\n  noValueTitle = 'No selected',\n  filterValueText = 'Remove your filter to see all selected',\n  leftValues,\n  noOptionsTitle = 'No available options',\n  state,\n  filterOptionsText = 'Remove your filter to see all options',\n  handleValuesClick,\n  handleMoveRight,\n  moveRightTitle = 'Move selected to right',\n  handleClearLeftValues,\n  moveAllRightTitle = 'Move all to right',\n  handleClearRightValues,\n  moveAllLeftTitle = 'Move all to left',\n  handleMoveLeft,\n  moveLeftTitle = 'Move selected to left',\n  allToRight = true,\n  allToLeft = true,\n  checkboxVariant,\n  isRequired,\n  meta,\n  validateOnMount,\n  label,\n  helperText,\n  description,\n  filterOptionsTitle = 'Filter options',\n  leftTitle = 'Options',\n  filterOptions,\n  sortOptions,\n  sortValues,\n  filterValueTitle = 'Filter selected value',\n  filterValues,\n  rightTitle = 'Selected',\n  isFilterable = true,\n  help,\n  // Props\n  FormFieldGridProps,\n  InternalGridProps,\n  ListGridProps,\n  LeftListGridProps,\n  ListProps,\n  LeftListProps,\n  ButtonsGridProps,\n  ButtonsInternalGridProps,\n  ButtonGridProps,\n  ToRightGridProps,\n  IconButtonProps,\n  ToRightIconButtonProps,\n  AllToRightGridProps,\n  AllToRightIconButtonProps,\n  AllToLeftGridProps,\n  AllToLeftIconButtonProps,\n  ToLeftGridProps,\n  ToLeftIconButtonProps,\n  RightListGridProps,\n  RightListProps,\n  ListItemProps,\n  ListItemIconProps,\n  ListItemTextProps,\n  LeftListItemProps,\n  LeftListItemIconProps,\n  LeftItemTextProps,\n  RightListItemProps,\n  RightListItemIconProps,\n  RightItemTextProps,\n  FormControlProps,\n  FormLabelProps,\n  FormHelperTextProps,\n  TitleProps,\n  ToolbarProps,\n  FilterFieldProps,\n  SortIconButtonProps,\n  SortIconProps,\n  LeftToolbarProps,\n  LeftFilterFieldProps,\n  LeftSortIconButtonProps,\n  LeftSortIconProps,\n  LeftTitleProps,\n  RightToolbarProps,\n  RightFilterFieldProps,\n  RightSortIconButtonProps,\n  RightSortIconProps,\n  RightTitleProps,\n  PaperProps,\n  LeftPaperProps,\n  RightPaperProps,\n}: DualListSelectProps) => {\n  const invalid = validationError(meta, validateOnMount)\n  const text =\n    invalid ||\n    ((meta.touched || validateOnMount) && meta.warning) ||\n    helperText ||\n    description\n\n  return (\n    <StyledDualListSelect help={help} {...FormFieldGridProps}>\n      <FormControl\n        fullWidth\n        required={isRequired}\n        error={!!invalid}\n        component=\"fieldset\"\n        {...FormControlProps}\n      >\n        <FormLabel component=\"legend\" {...FormLabelProps}>\n          {label}\n        </FormLabel>\n        <Grid container {...InternalGridProps}>\n          <Grid size={{ xs: 12, md: 5 }} {...ListGridProps} {...LeftListGridProps}>\n            {leftTitle && (\n              <Typography\n                variant=\"h6\"\n                gutterBottom\n                {...TitleProps}\n                {...LeftTitleProps}\n              >\n                {leftTitle}\n              </Typography>\n            )}\n            {isFilterable && (\n              <ToolbarInternal\n                ToolbarProps={ToolbarProps}\n                LeftToolbarProps={LeftToolbarProps}\n                filterOptions={filterOptions}\n                filterOptionsTitle={filterOptionsTitle}\n                FilterFieldProps={FilterFieldProps}\n                sortOptions={sortOptions}\n                SortIconButtonProps={SortIconButtonProps}\n                SortIconProps={SortIconProps}\n                LeftSortIconProps={LeftSortIconProps}\n                LeftFilterFieldProps={LeftFilterFieldProps}\n                LeftSortIconButtonProps={LeftSortIconButtonProps}\n                filter={state.filterOptions}\n                sortDesc={state.sortLeftDesc}\n              />\n            )}\n            <ListInternal\n              optionClick={handleOptionsClick}\n              value={leftValues}\n              noOptionsTitle={noOptionsTitle}\n              filterValue={state.filterOptions}\n              filterValueText={filterOptionsText}\n              selectedValues={state.selectedLeftValues}\n              checkboxVariant={checkboxVariant}\n              ListProps={{ ...ListProps, ...LeftListProps }}\n              ListItemProps={{ ...ListItemProps, ...LeftListItemProps }}\n              ListItemIconProps={{ ...ListItemIconProps, ...LeftListItemIconProps }}\n              ListItemTextProps={{ ...ListItemTextProps, ...LeftItemTextProps }}\n              PaperProps={PaperProps}\n              LeftPaperProps={LeftPaperProps}\n            />\n          </Grid>\n          <Grid size={{ xs: 12, md: 2 }} {...ButtonsGridProps}>\n            <Grid\n              container\n              {...ButtonsInternalGridProps}\n              className={clsx(\n                classes.buttonsGrid,\n                ButtonsInternalGridProps && ButtonsInternalGridProps.className,\n              )}\n            >\n              {allToRight && (\n                <Grid\n                  size={{ md: 12, sm: 3 }}\n                  {...ButtonGridProps}\n                  {...AllToRightGridProps}\n                  className={clsx(\n                    classes.button,\n                    ButtonGridProps && ButtonGridProps.className,\n                    AllToRightGridProps && AllToRightGridProps.className,\n                  )}\n                >\n                  <Button\n                    variant=\"outlined\"\n                    size=\"small\"\n                    disabled={leftValues.length === 0}\n                    onClick={handleClearLeftValues}\n                    aria-label={moveAllRightTitle}\n                    {...IconButtonProps}\n                    {...AllToRightIconButtonProps}\n                  >\n                    &#8811;\n                  </Button>\n                </Grid>\n              )}\n              <Grid\n                size={{ md: 12, sm: 3 }}\n                {...ButtonGridProps}\n                {...ToRightGridProps}\n                className={clsx(\n                  classes.button,\n                  ButtonGridProps && ButtonGridProps.className,\n                  ToRightGridProps && ToRightGridProps.className,\n                )}\n              >\n                <Button\n                  variant=\"outlined\"\n                  size=\"small\"\n                  disabled={leftValues.length === 0}\n                  onClick={handleMoveRight}\n                  aria-label={moveRightTitle}\n                  {...IconButtonProps}\n                  {...ToRightIconButtonProps}\n                >\n                  &gt;\n                </Button>\n              </Grid>\n              <Grid\n                size={{ md: 12, sm: 3 }}\n                {...ButtonGridProps}\n                {...ToLeftGridProps}\n                className={clsx(\n                  classes.button,\n                  ButtonGridProps && ButtonGridProps.className,\n                  ToLeftGridProps && ToLeftGridProps.className,\n                )}\n              >\n                <Button\n                  variant=\"outlined\"\n                  size=\"small\"\n                  disabled={rightValues.length === 0}\n                  onClick={handleMoveLeft}\n                  aria-label={moveLeftTitle}\n                  {...IconButtonProps}\n                  {...ToLeftIconButtonProps}\n                >\n                  &lt;\n                </Button>\n              </Grid>\n              {allToLeft && (\n                <Grid\n                  size={{ md: 12, sm: 3 }}\n                  {...ButtonGridProps}\n                  {...AllToLeftGridProps}\n                  className={clsx(\n                    classes.button,\n                    ButtonGridProps && ButtonGridProps.className,\n                    AllToLeftGridProps && AllToLeftGridProps.className,\n                  )}\n                >\n                  <Button\n                    variant=\"outlined\"\n                    size=\"small\"\n                    disabled={rightValues.length === 0}\n                    onClick={handleClearRightValues}\n                    aria-label={moveAllLeftTitle}\n                    {...IconButtonProps}\n                    {...AllToLeftIconButtonProps}\n                  >\n                    &#8810;\n                  </Button>\n                </Grid>\n              )}\n            </Grid>\n          </Grid>\n          <Grid size={{ xs: 12, md: 5 }} {...ListGridProps} {...RightListGridProps}>\n            {rightTitle && (\n              <Typography\n                variant=\"h6\"\n                gutterBottom\n                {...TitleProps}\n                {...RightTitleProps}\n              >\n                {rightTitle}\n              </Typography>\n            )}\n            {isFilterable && (\n              <ToolbarInternal\n                ToolbarProps={ToolbarProps}\n                LeftToolbarProps={RightToolbarProps}\n                filterOptions={filterValues}\n                filterOptionsTitle={filterValueTitle}\n                FilterFieldProps={FilterFieldProps}\n                sortOptions={sortValues}\n                SortIconButtonProps={SortIconButtonProps}\n                SortIconProps={SortIconProps}\n                LeftSortIconProps={RightSortIconProps}\n                LeftFilterFieldProps={RightFilterFieldProps}\n                LeftSortIconButtonProps={RightSortIconButtonProps}\n                filter={state.filterValue}\n                sortDesc={state.sortRightDesc}\n                isValue\n              />\n            )}\n            <ListInternal\n              checkboxVariant={checkboxVariant}\n              optionClick={handleValuesClick}\n              value={rightValues}\n              noOptionsTitle={noValueTitle}\n              filterValue={state.filterValue}\n              filterValueText={filterValueText}\n              selectedValues={state.selectedRightValues}\n              ListProps={{ ...ListProps, ...RightListProps }}\n              ListItemProps={{ ...ListItemProps, ...RightListItemProps }}\n              ListItemIconProps={{ ...ListItemIconProps, ...RightListItemIconProps }}\n              ListItemTextProps={{ ...ListItemTextProps, ...RightItemTextProps }}\n              PaperProps={PaperProps}\n              LeftPaperProps={RightPaperProps}\n            />\n          </Grid>\n        </Grid>\n        {text && (\n          <FormHelperText {...FormHelperTextProps}>{text}</FormHelperText>\n        )}\n      </FormControl>\n    </StyledDualListSelect>\n  )\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport const DualListSelectWrapper = (props: any) => (\n  <DualListSelectCommon {...props} DualListSelect={DualListSelect} />\n)\n\nexport default DualListSelectWrapper\n"],"names":["Button","Checkbox","FormControl","FormHelperText","FormLabel","Grid","IconButton","List","ListItem","ListItemButton","ListItemIcon","ListItemText","Paper","TextField","Toolbar","Typography","styled","SortIcon","clsx","DualListSelectCommon","FormFieldGrid","validationError","PREFIX","classes","allToLeftIcon","upsideDown","list","button","buttonsGrid","filter","toolbar","StyledDualListSelect","theme","transform","height","overflow","display","justifyContent","margin","spacing","alignContent","width","paddingLeft","paddingRight","ListInternal","value","optionClick","noOptionsTitle","filterValue","filterValueText","selectedValues","ListProps","ListItemProps","ListItemIconProps","ListItemTextProps","checkboxVariant","PaperProps","LeftPaperProps","className","component","role","dense","length","disabled","primary","map","label","icon","isCheckbox","secondaryActions","ListItemPropsItem","ListItemIconPropsItem","ListItemTextPropsItem","disablePadding","secondaryAction","selected","includes","onClick","e","ctrlKey","sx","cursor","edge","checked","tabIndex","disableRipple","ToolbarInternal","ToolbarProps","LeftToolbarProps","filterOptions","filterOptionsTitle","FilterFieldProps","sortOptions","SortIconButtonProps","SortIconProps","LeftSortIconProps","LeftFilterFieldProps","LeftSortIconButtonProps","sortDesc","isValue","variant","aria-label","onChange","target","type","color","size","DualListSelect","handleOptionsClick","rightValues","noValueTitle","leftValues","state","filterOptionsText","handleValuesClick","handleMoveRight","moveRightTitle","handleClearLeftValues","moveAllRightTitle","handleClearRightValues","moveAllLeftTitle","handleMoveLeft","moveLeftTitle","allToRight","allToLeft","isRequired","meta","validateOnMount","helperText","description","leftTitle","sortValues","filterValueTitle","filterValues","rightTitle","isFilterable","help","FormFieldGridProps","InternalGridProps","ListGridProps","LeftListGridProps","LeftListProps","ButtonsGridProps","ButtonsInternalGridProps","ButtonGridProps","ToRightGridProps","IconButtonProps","ToRightIconButtonProps","AllToRightGridProps","AllToRightIconButtonProps","AllToLeftGridProps","AllToLeftIconButtonProps","ToLeftGridProps","ToLeftIconButtonProps","RightListGridProps","RightListProps","LeftListItemProps","LeftListItemIconProps","LeftItemTextProps","RightListItemProps","RightListItemIconProps","RightItemTextProps","FormControlProps","FormLabelProps","FormHelperTextProps","TitleProps","LeftTitleProps","RightToolbarProps","RightFilterFieldProps","RightSortIconButtonProps","RightSortIconProps","RightTitleProps","RightPaperProps","invalid","text","touched","warning","fullWidth","required","error","container","xs","md","gutterBottom","sortLeftDesc","selectedLeftValues","sm","sortRightDesc","selectedRightValues","DualListSelectWrapper","props"],"mappings":"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"}

package/src/lib/mapper/field-array.d.ts

@@ -0,0 +1,71 @@
+/**
+ * @license
+ * Copyright 2026 Aglyn LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { type ButtonProps, type FormControlProps, type FormHelperTextProps, type GridProps, type IconButtonProps, type TypographyProps } from '@mui/material';
+import { type FormFieldGridProps } from './form-field-grid';
+import type { BaseFieldProps } from './types';
+interface ButtonLabels {
+    add?: string;
+    remove?: string;
+}
+interface HistoryAction {
+    action: 'remove';
+    value: any;
+}
+interface HistoryState {
+    index: number;
+    history: HistoryAction[];
+}
+type ReducerAction = {
+    type: 'redo';
+} | {
+    type: 'undo';
+} | {
+    type: 'action';
+    action: HistoryAction;
+} | {
+    type: 'resetHistory';
+};
+export declare const reducer: (state: HistoryState, actionObj: ReducerAction) => HistoryState;
+export interface FieldArrayProps extends BaseFieldProps {
+    arrayValidator?: (value: any[]) => string | undefined;
+    fields: Record<string, any>[];
+    defaultItem?: any;
+    minItems?: number;
+    maxItems?: number;
+    noItemsMessage?: string;
+    buttonLabels?: ButtonLabels;
+    FormFieldGridProps?: FormFieldGridProps;
+    FormControlProps?: FormControlProps;
+    GridContainerProps?: GridProps;
+    HeaderGridProps?: GridProps;
+    HeaderProps?: TypographyProps;
+    UndoButtonProps?: IconButtonProps;
+    RedoButtonProps?: IconButtonProps;
+    AddButtonProps?: ButtonProps;
+    DescriptionGridProps?: GridProps;
+    DescriptionProps?: TypographyProps;
+    BodyGridProps?: GridProps;
+    NoItemsProps?: TypographyProps;
+    FormHelperTextGridProps?: GridProps;
+    FormHelperTextProps?: FormHelperTextProps;
+    FieldContainerProps?: GridProps;
+    FieldGroupGridProps?: GridProps;
+    RemoveButtonGridProps?: GridProps;
+    RemoveButtonProps?: ButtonProps;
+}
+export declare const DynamicArray: (props: FieldArrayProps) => import("react").JSX.Element;
+export default DynamicArray;