@payloadcms/ui 4.0.0-internal.d28e9fb → 4.0.0-internal.d3909a9

package/dist/elements/ReactSelect/index.js

@@ -1,44 +1,45 @@
 'use client';
 
 import { jsx as _jsx } from "react/jsx-runtime";
-import { arrayMove } from '@dnd-kit/sortable';
+import { arrayMove, horizontalListSortingStrategy } from '@dnd-kit/sortable';
 import { getTranslation } from '@payloadcms/translations';
-import React, { useEffect, useId } from 'react';
+import React, { useCallback, useEffect, useId, useMemo, useState } from 'react';
 import Select from 'react-select';
 import CreatableSelect from 'react-select/creatable';
+import { useDebouncedEffect } from '../../hooks/useDebouncedEffect.js';
 import { useTranslation } from '../../providers/Translation/index.js';
 import { DraggableSortable } from '../DraggableSortable/index.js';
 import { ShimmerEffect } from '../ShimmerEffect/index.js';
 import { ClearIndicator } from './ClearIndicator/index.js';
 import { Control } from './Control/index.js';
+import { DefaultMenuPortal } from './DefaultMenuPortal.js';
 import { DropdownIndicator } from './DropdownIndicator/index.js';
+import { getCaptureMenuScroll } from './getCaptureMenuScroll.js';
+import { getMenuListStyles } from './getMenuListStyles.js';
+import { getMenuStyles } from './getMenuStyles.js';
 import { Input } from './Input/index.js';
 import { generateMultiValueDraggableID, MultiValue } from './MultiValue/index.js';
 import { MultiValueLabel } from './MultiValueLabel/index.js';
 import { MultiValueRemove } from './MultiValueRemove/index.js';
+import { Option as SelectOption } from './Option/index.js';
 import { SingleValue } from './SingleValue/index.js';
 import { ValueContainer } from './ValueContainer/index.js';
 import './index.css';
-const createOption = label => ({
-  label,
-  value: label
-});
+const DEFAULT_MAX_MENU_HEIGHT = 300;
 const SelectAdapter = props => {
   const {
     i18n,
     t
   } = useTranslation();
-  const [inputValue, setInputValue] = React.useState('') // for creatable select
+  const [inputValue, setInputValue] = useState('') // for creatable select
 ;
   const uuid = useId();
-  const [hasMounted, setHasMounted] = React.useState(false);
-  useEffect(() => {
-    setHasMounted(true);
-  }, []);
+  const [hasMounted, setHasMounted] = useState(false);
   const {
+    captureMenuScroll: captureMenuScrollProp,
     className,
+    classNames: externalClassNames,
     components,
-    customProps,
     disabled = false,
     filterOption = undefined,
     getOptionValue,
@@ -46,6 +47,8 @@ const SelectAdapter = props => {
     isCreatable,
     isLoading,
     isSearchable = true,
+    menuPortalTarget: menuPortalTargetProp,
+    menuPosition: menuPositionProp,
     noOptionsMessage = () => t('general:noOptions'),
     numberOnly = false,
     onChange,
@@ -54,69 +57,123 @@ const SelectAdapter = props => {
     options,
     placeholder = t('general:selectValue'),
     showError,
+    styles: externalStyles,
     value
   } = props;
-  const loadingMessage = () => t('general:loading') + '...';
-  const classes = [className, 'react-select', showError && 'react-select--error'].filter(Boolean).join(' ');
-  const styles = {
-    // Remove the default react-select z-index from the menu so that our custom
-    // z-index in the "payload-default" css layer can take effect, in such a way
-    // that end users can easily override it as with other styles.
-    menu: rsStyles => ({
-      ...rsStyles,
-      zIndex: undefined
-    }),
-    // Remove the default react-select min-height so our CSS can control it
-    control: rsStyles_0 => ({
-      ...rsStyles_0,
-      minHeight: undefined
-    })
+  const menuPortalTarget = menuPortalTargetProp === undefined ? typeof document !== 'undefined' ? document.body : null : menuPortalTargetProp;
+  const menuPosition = menuPositionProp ?? (menuPortalTarget ? 'fixed' : undefined);
+  const shouldUseFloatingMenuPortal = Boolean(menuPortalTarget && !components?.MenuPortal);
+  const captureMenuScroll = getCaptureMenuScroll({
+    captureMenuScroll: captureMenuScrollProp,
+    menuPortalTarget
+  });
+  useEffect(() => {
+    setHasMounted(true);
+  }, []);
+  // Debounce the loading state so that fast option fetches (e.g. relationship
+  // fields that resolve almost instantly) don't cause the clear indicator to
+  // flash to react-select's loading indicator and back. The loading indicator
+  // only appears once a load takes longer than the threshold below.
+  const [isLoadingDebounced, setIsLoadingDebounced] = useState(false);
+  useDebouncedEffect(() => {
+    setIsLoadingDebounced(isLoading);
+  }, [isLoading], 250);
+  const menuClassName = useCallback(state => {
+    const placement = state.placement ? `rs__menu--placement-${state.placement}` : '';
+    const external = externalClassNames?.menu?.(state) ?? '';
+    return [placement, external].filter(Boolean).join(' ');
+  }, [externalClassNames]);
+  const selectClassNames = useMemo(() => ({
+    ...externalClassNames,
+    menu: menuClassName,
+    menuList: state_0 => {
+      const external_0 = externalClassNames?.menuList?.(state_0) ?? '';
+      return ['scrollbar-thin', external_0].filter(Boolean).join(' ');
+    }
+  }), [externalClassNames, menuClassName]);
+  const selectComponents = useMemo(() => ({
+    ClearIndicator,
+    Control,
+    DropdownIndicator,
+    Input,
+    MenuPortal: DefaultMenuPortal,
+    MultiValue,
+    MultiValueLabel,
+    MultiValueRemove,
+    Option: SelectOption,
+    SingleValue,
+    ValueContainer,
+    ...components
+  }), [components]);
+  const sharedSelectProps = {
+    captureMenuScroll,
+    className: [className, 'react-select', showError && 'react-select--error'].filter(Boolean).join(' '),
+    classNamePrefix: 'rs',
+    classNames: selectClassNames,
+    components: selectComponents,
+    filterOption,
+    instanceId: uuid,
+    isClearable,
+    isDisabled: disabled,
+    isLoading: isLoadingDebounced,
+    isSearchable,
+    loadingMessage: () => t('general:loading') + '...',
+    maxMenuHeight: DEFAULT_MAX_MENU_HEIGHT,
+    menuPlacement: 'auto',
+    menuPortalTarget,
+    menuPosition,
+    menuShouldBlockScroll: false,
+    noOptionsMessage,
+    onChange,
+    onMenuClose,
+    onMenuOpen,
+    options,
+    placeholder: getTranslation(placeholder, i18n),
+    styles: {
+      menu: getMenuStyles({
+        externalStyles,
+        shouldUseFloatingMenuPortal
+      }),
+      // When portaling to document.body, the portal container needs an explicit
+      // z-index so the menu appears above drawers and dialogs. unstyled={true}
+      // strips react-select's default zIndex:9999 from the portal container.
+      ...(menuPortalTarget && {
+        menuPortal: (rsStyles, state_1) => ({
+          ...rsStyles,
+          zIndex: 'var(--z-portal-element)',
+          ...externalStyles?.menuPortal?.(rsStyles, state_1)
+        })
+      }),
+      // Remove the default react-select min-height so our CSS can control it
+      control: (rsStyles_0, state_2) => ({
+        ...rsStyles_0,
+        minHeight: undefined,
+        ...externalStyles?.control?.(rsStyles_0, state_2)
+      }),
+      // Allow external option styles to override emotion defaults
+      option: (rsStyles_1, state_3) => ({
+        ...rsStyles_1,
+        ...externalStyles?.option?.(rsStyles_1, state_3)
+      }),
+      // Keep react-select's computed maxHeight so the menu can fit available
+      // viewport space near screen edges (instead of using a fixed class value).
+      menuList: getMenuListStyles(externalStyles, shouldUseFloatingMenuPortal)
+    },
+    unstyled: true
   };
   if (!hasMounted) {
     return /*#__PURE__*/_jsx(ShimmerEffect, {
-      height: "calc(var(--base) * 2 + 2px)"
+      height: "var(--field-min-height-large)"
     });
   }
   if (!isCreatable) {
-    return /*#__PURE__*/_jsx(Select, {
-      captureMenuScroll: true,
-      customProps: customProps,
-      isLoading: isLoading,
-      ...props,
-      className: classes,
-      classNamePrefix: "rs",
-      classNames: {
-        menu: state => state.placement ? `rs__menu--placement-${state.placement}` : ''
-      },
-      components: {
-        ClearIndicator,
-        Control,
-        DropdownIndicator,
-        Input,
-        MultiValue,
-        MultiValueLabel,
-        MultiValueRemove,
-        SingleValue,
-        ValueContainer,
-        ...components
-      },
-      filterOption: filterOption,
-      getOptionValue: getOptionValue,
-      instanceId: uuid,
-      isClearable: isClearable,
-      isDisabled: disabled,
-      isSearchable: isSearchable,
-      loadingMessage: loadingMessage,
-      menuPlacement: "auto",
-      noOptionsMessage: noOptionsMessage,
-      onChange: onChange,
-      onMenuClose: onMenuClose,
-      onMenuOpen: onMenuOpen,
-      options: options,
-      placeholder: getTranslation(placeholder, i18n),
-      styles: styles,
-      unstyled: true,
-      value: value
+    return /*#__PURE__*/_jsx("div", {
+      children: /*#__PURE__*/_jsx(Select, {
+        ...props,
+        ...sharedSelectProps,
+        getOptionValue: getOptionValue,
+        value: value
+      })
     });
   }
   const handleKeyDown = event => {
@@ -141,7 +198,10 @@ const SelectAdapter = props => {
     switch (event.key) {
       case 'Enter':
       case 'Tab':
-        onChange([...value, createOption(inputValue)]);
+        onChange([...value, {
+          label: inputValue,
+          value: inputValue
+        }]);
         setInputValue('');
         event.preventDefault();
         break;
@@ -149,46 +209,15 @@ const SelectAdapter = props => {
         break;
     }
   };
-  return /*#__PURE__*/_jsx(CreatableSelect, {
-    captureMenuScroll: true,
-    isLoading: isLoading,
-    ...props,
-    className: classes,
-    classNamePrefix: "rs",
-    classNames: {
-      menu: state_0 => state_0.placement ? `rs__menu--placement-${state_0.placement}` : ''
-    },
-    components: {
-      ClearIndicator,
-      Control,
-      DropdownIndicator,
-      Input,
-      MultiValue,
-      MultiValueLabel,
-      MultiValueRemove,
-      SingleValue,
-      ValueContainer,
-      ...components
-    },
-    filterOption: filterOption,
-    inputValue: inputValue,
-    instanceId: uuid,
-    isClearable: isClearable,
-    isDisabled: disabled,
-    isSearchable: isSearchable,
-    loadingMessage: loadingMessage,
-    menuPlacement: "auto",
-    noOptionsMessage: noOptionsMessage,
-    onChange: onChange,
-    onInputChange: newValue => setInputValue(newValue),
-    onKeyDown: handleKeyDown,
-    onMenuClose: onMenuClose,
-    onMenuOpen: onMenuOpen,
-    options: options,
-    placeholder: getTranslation(placeholder, i18n),
-    styles: styles,
-    unstyled: true,
-    value: value
+  return /*#__PURE__*/_jsx("div", {
+    children: /*#__PURE__*/_jsx(CreatableSelect, {
+      ...props,
+      ...sharedSelectProps,
+      inputValue: inputValue,
+      onInputChange: newValue => setInputValue(newValue),
+      onKeyDown: handleKeyDown,
+      value: value
+    })
   });
 };
 const SortableSelect = props => {
@@ -216,6 +245,7 @@ const SortableSelect = props => {
       }
       onChange(sorted);
     },
+    sortingStrategy: horizontalListSortingStrategy,
     children: /*#__PURE__*/_jsx(SelectAdapter, {
       ...props
     })

package/dist/elements/ReactSelect/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["arrayMove","getTranslation","React","useEffect","useId","Select","CreatableSelect","useTranslation","DraggableSortable","ShimmerEffect","ClearIndicator","Control","DropdownIndicator","Input","generateMultiValueDraggableID","MultiValue","MultiValueLabel","MultiValueRemove","SingleValue","ValueContainer","createOption","label","value","SelectAdapter","props","i18n","t","inputValue","setInputValue","useState","uuid","hasMounted","setHasMounted","className","components","customProps","disabled","filterOption","undefined","getOptionValue","isClearable","isCreatable","isLoading","isSearchable","noOptionsMessage","numberOnly","onChange","onMenuClose","onMenuOpen","options","placeholder","showError","loadingMessage","classes","filter","Boolean","join","styles","menu","rsStyles","zIndex","control","minHeight","_jsx","height","captureMenuScroll","classNamePrefix","classNames","state","placement","instanceId","isDisabled","menuPlacement","unstyled","handleKeyDown","event","acceptableKeys","isNumber","test","key","isActionKey","includes","preventDefault","trim","nativeEvent","isComposing","onInputChange","newValue","onKeyDown","SortableSelect","draggableIDs","Array","isArray","map","optionValue","ids","onDragEnd","moveFromIndex","moveToIndex","sorted","ReactSelect","isMulti","isSortable"],"sources":["../../../src/elements/ReactSelect/index.tsx"],"sourcesContent":["'use client'\nimport type { KeyboardEventHandler } from 'react'\n\nimport { arrayMove } from '@dnd-kit/sortable'\nimport { getTranslation } from '@payloadcms/translations'\nimport React, { useEffect, useId } from 'react'\nimport Select, { type StylesConfig } from 'react-select'\nimport CreatableSelect from 'react-select/creatable'\n\nimport type { Option, ReactSelectAdapterProps } from './types.js'\nexport type { Option } from './types.js'\n\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { DraggableSortable } from '../DraggableSortable/index.js'\nimport { ShimmerEffect } from '../ShimmerEffect/index.js'\nimport { ClearIndicator } from './ClearIndicator/index.js'\nimport { Control } from './Control/index.js'\nimport { DropdownIndicator } from './DropdownIndicator/index.js'\nimport { Input } from './Input/index.js'\nimport { generateMultiValueDraggableID, MultiValue } from './MultiValue/index.js'\nimport { MultiValueLabel } from './MultiValueLabel/index.js'\nimport { MultiValueRemove } from './MultiValueRemove/index.js'\nimport { SingleValue } from './SingleValue/index.js'\nimport { ValueContainer } from './ValueContainer/index.js'\nimport './index.css'\n\nconst createOption = (label: string) => ({\n  label,\n  value: label,\n})\n\nconst SelectAdapter: React.FC<ReactSelectAdapterProps> = (props) => {\n  const { i18n, t } = useTranslation()\n  const [inputValue, setInputValue] = React.useState('') // for creatable select\n  const uuid = useId()\n  const [hasMounted, setHasMounted] = React.useState(false)\n\n  useEffect(() => {\n    setHasMounted(true)\n  }, [])\n\n  const {\n    className,\n    components,\n    customProps,\n    disabled = false,\n    filterOption = undefined,\n    getOptionValue,\n    isClearable = true,\n    isCreatable,\n    isLoading,\n    isSearchable = true,\n    noOptionsMessage = () => t('general:noOptions'),\n    numberOnly = false,\n    onChange,\n    onMenuClose,\n    onMenuOpen,\n    options,\n    placeholder = t('general:selectValue'),\n    showError,\n    value,\n  } = props\n\n  const loadingMessage = () => t('general:loading') + '...'\n\n  const classes = [className, 'react-select', showError && 'react-select--error']\n    .filter(Boolean)\n    .join(' ')\n\n  const styles: StylesConfig<Option> = {\n    // Remove the default react-select z-index from the menu so that our custom\n    // z-index in the \"payload-default\" css layer can take effect, in such a way\n    // that end users can easily override it as with other styles.\n    menu: (rsStyles) => ({ ...rsStyles, zIndex: undefined }),\n    // Remove the default react-select min-height so our CSS can control it\n    control: (rsStyles) => ({ ...rsStyles, minHeight: undefined }),\n  }\n\n  if (!hasMounted) {\n    return <ShimmerEffect height=\"calc(var(--base) * 2 + 2px)\" />\n  }\n\n  if (!isCreatable) {\n    return (\n      <Select\n        captureMenuScroll\n        customProps={customProps}\n        isLoading={isLoading}\n        {...props}\n        className={classes}\n        classNamePrefix=\"rs\"\n        classNames={{\n          menu: (state) => (state.placement ? `rs__menu--placement-${state.placement}` : ''),\n        }}\n        components={{\n          ClearIndicator,\n          Control,\n          DropdownIndicator,\n          Input,\n          MultiValue,\n          MultiValueLabel,\n          MultiValueRemove,\n          SingleValue,\n          ValueContainer,\n          ...components,\n        }}\n        filterOption={filterOption}\n        getOptionValue={getOptionValue}\n        instanceId={uuid}\n        isClearable={isClearable}\n        isDisabled={disabled}\n        isSearchable={isSearchable}\n        loadingMessage={loadingMessage}\n        menuPlacement=\"auto\"\n        noOptionsMessage={noOptionsMessage}\n        onChange={onChange}\n        onMenuClose={onMenuClose}\n        onMenuOpen={onMenuOpen}\n        options={options}\n        placeholder={getTranslation(placeholder, i18n)}\n        styles={styles}\n        unstyled={true}\n        value={value}\n      />\n    )\n  }\n  const handleKeyDown: KeyboardEventHandler = (event) => {\n    if (numberOnly === true) {\n      const acceptableKeys = [\n        'Tab',\n        'Escape',\n        'Backspace',\n        'Enter',\n        'ArrowRight',\n        'ArrowLeft',\n        'ArrowUp',\n        'ArrowDown',\n      ]\n      const isNumber = !/\\D/.test(event.key)\n      const isActionKey = acceptableKeys.includes(event.key)\n      if (!isNumber && !isActionKey) {\n        event.preventDefault()\n        return\n      }\n    }\n    if (!value || !inputValue || inputValue.trim() === '') {\n      return\n    }\n    if (filterOption && !filterOption(null, inputValue)) {\n      return\n    }\n    if (event.nativeEvent.isComposing) {\n      return\n    }\n    switch (event.key) {\n      case 'Enter':\n      case 'Tab':\n        onChange([...(value as Option[]), createOption(inputValue)])\n        setInputValue('')\n        event.preventDefault()\n        break\n      default:\n        break\n    }\n  }\n\n  return (\n    <CreatableSelect\n      captureMenuScroll\n      isLoading={isLoading}\n      {...props}\n      className={classes}\n      classNamePrefix=\"rs\"\n      classNames={{\n        menu: (state) => (state.placement ? `rs__menu--placement-${state.placement}` : ''),\n      }}\n      components={{\n        ClearIndicator,\n        Control,\n        DropdownIndicator,\n        Input,\n        MultiValue,\n        MultiValueLabel,\n        MultiValueRemove,\n        SingleValue,\n        ValueContainer,\n        ...components,\n      }}\n      filterOption={filterOption}\n      inputValue={inputValue}\n      instanceId={uuid}\n      isClearable={isClearable}\n      isDisabled={disabled}\n      isSearchable={isSearchable}\n      loadingMessage={loadingMessage}\n      menuPlacement=\"auto\"\n      noOptionsMessage={noOptionsMessage}\n      onChange={onChange}\n      onInputChange={(newValue) => setInputValue(newValue)}\n      onKeyDown={handleKeyDown}\n      onMenuClose={onMenuClose}\n      onMenuOpen={onMenuOpen}\n      options={options}\n      placeholder={getTranslation(placeholder, i18n)}\n      styles={styles}\n      unstyled={true}\n      value={value}\n    />\n  )\n}\n\nconst SortableSelect: React.FC<ReactSelectAdapterProps> = (props) => {\n  const { getOptionValue, onChange, value } = props\n\n  let draggableIDs: string[] = []\n  if (value) {\n    draggableIDs = (Array.isArray(value) ? value : [value]).map((optionValue) => {\n      return generateMultiValueDraggableID(optionValue, getOptionValue)\n    })\n  }\n\n  return (\n    <DraggableSortable\n      className=\"react-select-container\"\n      ids={draggableIDs}\n      onDragEnd={({ moveFromIndex, moveToIndex }) => {\n        let sorted = value\n        if (value && Array.isArray(value)) {\n          sorted = arrayMove(value, moveFromIndex, moveToIndex)\n        }\n        onChange(sorted)\n      }}\n    >\n      <SelectAdapter {...props} />\n    </DraggableSortable>\n  )\n}\n\nexport const ReactSelect: React.FC<ReactSelectAdapterProps> = (props) => {\n  const { isMulti, isSortable } = props\n\n  if (isMulti && isSortable) {\n    return <SortableSelect {...props} />\n  }\n\n  return <SelectAdapter {...props} />\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["arrayMove","horizontalListSortingStrategy","getTranslation","React","useCallback","useEffect","useId","useMemo","useState","Select","CreatableSelect","useDebouncedEffect","useTranslation","DraggableSortable","ShimmerEffect","ClearIndicator","Control","DefaultMenuPortal","DropdownIndicator","getCaptureMenuScroll","getMenuListStyles","getMenuStyles","Input","generateMultiValueDraggableID","MultiValue","MultiValueLabel","MultiValueRemove","Option","SelectOption","SingleValue","ValueContainer","DEFAULT_MAX_MENU_HEIGHT","SelectAdapter","props","i18n","t","inputValue","setInputValue","uuid","hasMounted","setHasMounted","captureMenuScroll","captureMenuScrollProp","className","classNames","externalClassNames","components","disabled","filterOption","undefined","getOptionValue","isClearable","isCreatable","isLoading","isSearchable","menuPortalTarget","menuPortalTargetProp","menuPosition","menuPositionProp","noOptionsMessage","numberOnly","onChange","onMenuClose","onMenuOpen","options","placeholder","showError","styles","externalStyles","value","document","body","shouldUseFloatingMenuPortal","Boolean","MenuPortal","isLoadingDebounced","setIsLoadingDebounced","menuClassName","state","placement","external","menu","filter","join","selectClassNames","menuList","selectComponents","sharedSelectProps","classNamePrefix","instanceId","isDisabled","loadingMessage","maxMenuHeight","menuPlacement","menuShouldBlockScroll","menuPortal","rsStyles","zIndex","control","minHeight","option","unstyled","_jsx","height","handleKeyDown","event","acceptableKeys","isNumber","test","key","isActionKey","includes","preventDefault","trim","nativeEvent","isComposing","label","onInputChange","newValue","onKeyDown","SortableSelect","draggableIDs","Array","isArray","map","optionValue","ids","onDragEnd","moveFromIndex","moveToIndex","sorted","sortingStrategy","ReactSelect","isMulti","isSortable"],"sources":["../../../src/elements/ReactSelect/index.tsx"],"sourcesContent":["'use client'\nimport type { KeyboardEventHandler } from 'react'\nimport type { GroupBase, MenuListProps, MenuProps } from 'react-select'\n\nimport { arrayMove, horizontalListSortingStrategy } from '@dnd-kit/sortable'\nimport { getTranslation } from '@payloadcms/translations'\nimport React, { useCallback, useEffect, useId, useMemo, useState } from 'react'\nimport Select from 'react-select'\nimport CreatableSelect from 'react-select/creatable'\n\nimport type { Option, ReactSelectAdapterProps } from './types.js'\nexport type { Option } from './types.js'\n\nimport { useDebouncedEffect } from '../../hooks/useDebouncedEffect.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { DraggableSortable } from '../DraggableSortable/index.js'\nimport { ShimmerEffect } from '../ShimmerEffect/index.js'\nimport { ClearIndicator } from './ClearIndicator/index.js'\nimport { Control } from './Control/index.js'\nimport { DefaultMenuPortal } from './DefaultMenuPortal.js'\nimport { DropdownIndicator } from './DropdownIndicator/index.js'\nimport { getCaptureMenuScroll } from './getCaptureMenuScroll.js'\nimport { getMenuListStyles } from './getMenuListStyles.js'\nimport { getMenuStyles } from './getMenuStyles.js'\nimport { Input } from './Input/index.js'\nimport { generateMultiValueDraggableID, MultiValue } from './MultiValue/index.js'\nimport { MultiValueLabel } from './MultiValueLabel/index.js'\nimport { MultiValueRemove } from './MultiValueRemove/index.js'\nimport { Option as SelectOption } from './Option/index.js'\nimport { SingleValue } from './SingleValue/index.js'\nimport { ValueContainer } from './ValueContainer/index.js'\nimport './index.css'\n\nconst DEFAULT_MAX_MENU_HEIGHT = 300\n\nconst SelectAdapter: React.FC<ReactSelectAdapterProps> = (props) => {\n  const { i18n, t } = useTranslation()\n  const [inputValue, setInputValue] = useState('') // for creatable select\n  const uuid = useId()\n  const [hasMounted, setHasMounted] = useState(false)\n\n  const {\n    captureMenuScroll: captureMenuScrollProp,\n    className,\n    classNames: externalClassNames,\n    components,\n    disabled = false,\n    filterOption = undefined,\n    getOptionValue,\n    isClearable = true,\n    isCreatable,\n    isLoading,\n    isSearchable = true,\n    menuPortalTarget: menuPortalTargetProp,\n    menuPosition: menuPositionProp,\n    noOptionsMessage = () => t('general:noOptions'),\n    numberOnly = false,\n    onChange,\n    onMenuClose,\n    onMenuOpen,\n    options,\n    placeholder = t('general:selectValue'),\n    showError,\n    styles: externalStyles,\n    value,\n  } = props\n\n  const menuPortalTarget =\n    menuPortalTargetProp === undefined\n      ? typeof document !== 'undefined'\n        ? document.body\n        : null\n      : menuPortalTargetProp\n\n  const menuPosition = menuPositionProp ?? (menuPortalTarget ? 'fixed' : undefined)\n  const shouldUseFloatingMenuPortal = Boolean(menuPortalTarget && !components?.MenuPortal)\n  const captureMenuScroll = getCaptureMenuScroll({\n    captureMenuScroll: captureMenuScrollProp,\n    menuPortalTarget,\n  })\n\n  useEffect(() => {\n    setHasMounted(true)\n  }, [])\n\n  // Debounce the loading state so that fast option fetches (e.g. relationship\n  // fields that resolve almost instantly) don't cause the clear indicator to\n  // flash to react-select's loading indicator and back. The loading indicator\n  // only appears once a load takes longer than the threshold below.\n  const [isLoadingDebounced, setIsLoadingDebounced] = useState(false)\n\n  useDebouncedEffect(\n    () => {\n      setIsLoadingDebounced(isLoading)\n    },\n    [isLoading],\n    250,\n  )\n\n  const menuClassName = useCallback(\n    (state: MenuProps<Option, boolean, GroupBase<Option>>) => {\n      const placement = state.placement ? `rs__menu--placement-${state.placement}` : ''\n      const external = externalClassNames?.menu?.(state) ?? ''\n      return [placement, external].filter(Boolean).join(' ')\n    },\n    [externalClassNames],\n  )\n\n  const selectClassNames = useMemo(\n    () => ({\n      ...externalClassNames,\n      menu: menuClassName,\n      menuList: (state: MenuListProps<Option, boolean, GroupBase<Option>>) => {\n        const external = externalClassNames?.menuList?.(state) ?? ''\n        return ['scrollbar-thin', external].filter(Boolean).join(' ')\n      },\n    }),\n    [externalClassNames, menuClassName],\n  )\n\n  const selectComponents = useMemo(\n    () => ({\n      ClearIndicator,\n      Control,\n      DropdownIndicator,\n      Input,\n      MenuPortal: DefaultMenuPortal,\n      MultiValue,\n      MultiValueLabel,\n      MultiValueRemove,\n      Option: SelectOption,\n      SingleValue,\n      ValueContainer,\n      ...components,\n    }),\n    [components],\n  )\n\n  const sharedSelectProps = {\n    captureMenuScroll,\n    className: [className, 'react-select', showError && 'react-select--error']\n      .filter(Boolean)\n      .join(' '),\n    classNamePrefix: 'rs',\n    classNames: selectClassNames,\n    components: selectComponents,\n    filterOption,\n    instanceId: uuid,\n    isClearable,\n    isDisabled: disabled,\n    isLoading: isLoadingDebounced,\n    isSearchable,\n    loadingMessage: () => t('general:loading') + '...',\n    maxMenuHeight: DEFAULT_MAX_MENU_HEIGHT,\n    menuPlacement: 'auto' as const,\n    menuPortalTarget,\n    menuPosition,\n    menuShouldBlockScroll: false,\n    noOptionsMessage,\n    onChange,\n    onMenuClose,\n    onMenuOpen,\n    options,\n    placeholder: getTranslation(placeholder, i18n),\n    styles: {\n      menu: getMenuStyles({\n        externalStyles,\n        shouldUseFloatingMenuPortal,\n      }),\n      // When portaling to document.body, the portal container needs an explicit\n      // z-index so the menu appears above drawers and dialogs. unstyled={true}\n      // strips react-select's default zIndex:9999 from the portal container.\n      ...(menuPortalTarget && {\n        menuPortal: (rsStyles, state) => ({\n          ...rsStyles,\n          zIndex: 'var(--z-portal-element)',\n          ...externalStyles?.menuPortal?.(rsStyles, state),\n        }),\n      }),\n      // Remove the default react-select min-height so our CSS can control it\n      control: (rsStyles, state) => ({\n        ...rsStyles,\n        minHeight: undefined,\n        ...externalStyles?.control?.(rsStyles, state),\n      }),\n      // Allow external option styles to override emotion defaults\n      option: (rsStyles, state) => ({\n        ...rsStyles,\n        ...externalStyles?.option?.(rsStyles, state),\n      }),\n      // Keep react-select's computed maxHeight so the menu can fit available\n      // viewport space near screen edges (instead of using a fixed class value).\n      menuList: getMenuListStyles(externalStyles, shouldUseFloatingMenuPortal),\n    },\n    unstyled: true,\n  }\n\n  if (!hasMounted) {\n    return <ShimmerEffect height=\"var(--field-min-height-large)\" />\n  }\n\n  if (!isCreatable) {\n    return (\n      <div>\n        <Select<Option, boolean, GroupBase<Option>>\n          {...props}\n          {...sharedSelectProps}\n          getOptionValue={getOptionValue}\n          value={value}\n        />\n      </div>\n    )\n  }\n\n  const handleKeyDown: KeyboardEventHandler = (event) => {\n    if (numberOnly === true) {\n      const acceptableKeys = [\n        'Tab',\n        'Escape',\n        'Backspace',\n        'Enter',\n        'ArrowRight',\n        'ArrowLeft',\n        'ArrowUp',\n        'ArrowDown',\n      ]\n      const isNumber = !/\\D/.test(event.key)\n      const isActionKey = acceptableKeys.includes(event.key)\n      if (!isNumber && !isActionKey) {\n        event.preventDefault()\n        return\n      }\n    }\n\n    if (!value || !inputValue || inputValue.trim() === '') {\n      return\n    }\n\n    if (filterOption && !filterOption(null, inputValue)) {\n      return\n    }\n\n    if (event.nativeEvent.isComposing) {\n      return\n    }\n\n    switch (event.key) {\n      case 'Enter':\n      case 'Tab':\n        onChange([\n          ...(value as Option[]),\n          {\n            label: inputValue,\n            value: inputValue,\n          },\n        ])\n        setInputValue('')\n        event.preventDefault()\n        break\n      default:\n        break\n    }\n  }\n\n  return (\n    <div>\n      <CreatableSelect<Option, boolean, GroupBase<Option>>\n        {...props}\n        {...sharedSelectProps}\n        inputValue={inputValue}\n        onInputChange={(newValue) => setInputValue(newValue)}\n        onKeyDown={handleKeyDown}\n        value={value}\n      />\n    </div>\n  )\n}\n\nconst SortableSelect: React.FC<ReactSelectAdapterProps> = (props) => {\n  const { getOptionValue, onChange, value } = props\n\n  let draggableIDs: string[] = []\n  if (value) {\n    draggableIDs = (Array.isArray(value) ? value : [value]).map((optionValue) => {\n      return generateMultiValueDraggableID(optionValue, getOptionValue)\n    })\n  }\n\n  return (\n    <DraggableSortable\n      className=\"react-select-container\"\n      ids={draggableIDs}\n      onDragEnd={({ moveFromIndex, moveToIndex }) => {\n        let sorted = value\n        if (value && Array.isArray(value)) {\n          sorted = arrayMove(value, moveFromIndex, moveToIndex)\n        }\n        onChange(sorted)\n      }}\n      sortingStrategy={horizontalListSortingStrategy}\n    >\n      <SelectAdapter {...props} />\n    </DraggableSortable>\n  )\n}\n\nexport const ReactSelect: React.FC<ReactSelectAdapterProps> = (props) => {\n  const { isMulti, isSortable } = props\n\n  if (isMulti && isSortable) {\n    return <SortableSelect {...props} />\n  }\n\n  return <SelectAdapter {...props} />\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/ReactSelect/types.d.ts

@@ -1,7 +1,9 @@
 import type { LabelFunction } from 'payload';
-import type { CommonProps, GroupBase, Props as ReactSelectStateManagerProps } from 'react-select';
+import type { AriaAttributes } from 'react';
+import type { ClassNamesConfig, CommonProps, GroupBase, Props as ReactSelectStateManagerProps, StylesConfig } from 'react-select';
 import type { DocumentDrawerProps } from '../DocumentDrawer/types.js';
-type CustomSelectProps = {
+export type CustomSelectProps = {
+    clearValueLabel?: string;
     disableKeyDown?: boolean;
     disableMouseDown?: boolean;
     draggableProps?: any;
@@ -10,6 +12,8 @@ type CustomSelectProps = {
         label: string;
         value: string;
     }>, className: string, selectProps: ReactSelectStateManagerProps) => any;
+    /** Force the portaled menu to render with a specific theme, independent of the control's ambient theme. */
+    menuPortalTheme?: 'dark' | 'light';
     onDelete?: DocumentDrawerProps['onDelete'];
     onDocumentOpen?: (args: {
         collectionSlug: string;
@@ -19,6 +23,7 @@ type CustomSelectProps = {
     }) => void;
     onDuplicate?: DocumentDrawerProps['onSave'];
     onSave?: DocumentDrawerProps['onSave'];
+    removeValueLabel?: string;
     valueContainerLabel?: string;
 };
 declare module 'react-select/dist/declarations/src/Select' {
@@ -41,9 +46,16 @@ export type OptionGroup = {
     options: Option[];
 };
 export type ReactSelectAdapterProps = {
+    'aria-describedby'?: AriaAttributes['aria-describedby'];
+    'aria-invalid'?: AriaAttributes['aria-invalid'];
+    'aria-label'?: AriaAttributes['aria-label'];
+    'aria-labelledby'?: AriaAttributes['aria-labelledby'];
+    'aria-required'?: AriaAttributes['aria-required'];
     backspaceRemovesValue?: boolean;
     blurInputOnSelect?: boolean;
+    captureMenuScroll?: boolean;
     className?: string;
+    classNames?: ClassNamesConfig<Option, boolean, GroupBase<Option>>;
     components?: {
         [key: string]: React.FC<any>;
     };
@@ -55,6 +67,8 @@ export type ReactSelectAdapterProps = {
         label: string;
         value: string;
     }, search: string) => boolean) | undefined;
+    formatOptionLabel?: ReactSelectStateManagerProps<Option, boolean, GroupBase<Option>>['formatOptionLabel'];
+    getOptionLabel?: ReactSelectStateManagerProps<Option, boolean, GroupBase<Option>>['getOptionLabel'];
     getOptionValue?: ReactSelectStateManagerProps<Option, boolean, GroupBase<Option>>['getOptionValue'];
     id?: string;
     inputId?: string;
@@ -68,6 +82,8 @@ export type ReactSelectAdapterProps = {
     isSearchable?: boolean;
     isSortable?: boolean;
     menuIsOpen?: boolean;
+    menuPortalTarget?: HTMLElement | null;
+    menuPosition?: 'absolute' | 'fixed';
     noOptionsMessage?: (obj: {
         inputValue: string;
     }) => string;
@@ -80,7 +96,7 @@ export type ReactSelectAdapterProps = {
     options: Option[] | OptionGroup[];
     placeholder?: LabelFunction | string;
     showError?: boolean;
+    styles?: StylesConfig<Option>;
     value?: Option | Option[];
 };
-export {};
 //# sourceMappingURL=types.d.ts.map

package/dist/elements/ReactSelect/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/elements/ReactSelect/types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/elements/ReactSelect/types.ts"],"names":[],"mappings":"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"}

package/dist/elements/ReactSelect/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":[],"sources":["../../../src/elements/ReactSelect/types.ts"],"sourcesContent":["import type { LabelFunction } from 'payload'\nimport type { CommonProps, GroupBase, Props as ReactSelectStateManagerProps } from 'react-select'\n\nimport type { DocumentDrawerProps } from '../DocumentDrawer/types.js'\n\ntype CustomSelectProps = {\n  disableKeyDown?: boolean\n  disableMouseDown?: boolean\n  draggableProps?: any\n  droppableRef?: React.RefObject<HTMLDivElement | null>\n  editableProps?: (\n    data: Option<{ label: string; value: string }>,\n    className: string,\n    selectProps: ReactSelectStateManagerProps,\n  ) => any\n  onDelete?: DocumentDrawerProps['onDelete']\n  onDocumentOpen?: (args: {\n    collectionSlug: string\n    hasReadPermission: boolean\n    id: number | string\n    openInNewTab?: boolean\n  }) => void\n  onDuplicate?: DocumentDrawerProps['onSave']\n  onSave?: DocumentDrawerProps['onSave']\n  valueContainerLabel?: string\n}\n\n// augment the types for the `Select` component from `react-select`\n// this is to include the `selectProps` prop at the top-level `Select` component\n// @ts-expect-error-next-line // TODO Fix this - moduleResolution 16 breaks our declare module\ndeclare module 'react-select/dist/declarations/src/Select' {\n  export interface Props<Option, IsMulti extends boolean, Group extends GroupBase<Option>> {\n    customProps?: CustomSelectProps\n  }\n}\n\n// augment the types for the `CommonPropsAndClassName` from `react-select`\n// this will include the `selectProps` prop to every `react-select` component automatically\n// @ts-expect-error-next-line // TODO Fix this - moduleResolution 16 breaks our declare module\ndeclare module 'react-select/dist/declarations/src' {\n  export interface CommonPropsAndClassName<\n    Option,\n    IsMulti extends boolean,\n    Group extends GroupBase<Option>,\n  > extends CommonProps<Option, IsMulti, Group> {\n    customProps?: CustomSelectProps & ReactSelectStateManagerProps<Option, IsMulti, Group>\n  }\n}\n\nexport type Option<TValue = unknown> = {\n  [key: string]: unknown\n  //* The ID is used to identify the option in the UI. If it doesn't exist and value cannot be transformed into a string, sorting won't work */\n  id?: string\n  value: TValue\n}\n\nexport type OptionGroup = {\n  label: string\n  options: Option[]\n}\n\nexport type ReactSelectAdapterProps = {\n  backspaceRemovesValue?: boolean\n  blurInputOnSelect?: boolean\n  className?: string\n  components?: {\n    [key: string]: React.FC<any>\n  }\n  customProps?: CustomSelectProps\n  disabled?: boolean\n  filterOption?:\n    | ((\n        {\n          allowEdit,\n          data,\n          label,\n          value,\n        }: { allowEdit: boolean; data: Option; label: string; value: string },\n        search: string,\n      ) => boolean)\n    | undefined\n  getOptionValue?: ReactSelectStateManagerProps<\n    Option,\n    boolean,\n    GroupBase<Option>\n  >['getOptionValue']\n  id?: string\n  inputId?: string\n  isClearable?: boolean\n  /** Allows you to create own values in the UI despite them not being pre-specified */\n  isCreatable?: boolean\n  isLoading?: boolean\n  /** Allows you to specify multiple values instead of just one */\n  isMulti?: boolean\n  isOptionSelected?: any\n  isSearchable?: boolean\n  isSortable?: boolean\n  menuIsOpen?: boolean\n  noOptionsMessage?: (obj: { inputValue: string }) => string\n  numberOnly?: boolean\n  onChange?: (value: Option | Option[]) => void\n  onInputChange?: (val: string) => void\n  onMenuClose?: () => void\n  onMenuOpen?: () => void\n  onMenuScrollToBottom?: () => void\n  options: Option[] | OptionGroup[]\n  placeholder?: LabelFunction | string\n  showError?: boolean\n  value?: Option | Option[]\n}\n"],"mappings":"AA6DA","ignoreList":[]}
+{"version":3,"file":"types.js","names":[],"sources":["../../../src/elements/ReactSelect/types.ts"],"sourcesContent":["import type { LabelFunction } from 'payload'\nimport type { AriaAttributes } from 'react'\nimport type {\n  ClassNamesConfig,\n  CommonProps,\n  GroupBase,\n  Props as ReactSelectStateManagerProps,\n  StylesConfig,\n} from 'react-select'\n\nimport type { DocumentDrawerProps } from '../DocumentDrawer/types.js'\n\nexport type CustomSelectProps = {\n  clearValueLabel?: string\n  disableKeyDown?: boolean\n  disableMouseDown?: boolean\n  draggableProps?: any\n  droppableRef?: React.RefObject<HTMLDivElement | null>\n  editableProps?: (\n    data: Option<{ label: string; value: string }>,\n    className: string,\n    selectProps: ReactSelectStateManagerProps,\n  ) => any\n  /** Force the portaled menu to render with a specific theme, independent of the control's ambient theme. */\n  menuPortalTheme?: 'dark' | 'light'\n  onDelete?: DocumentDrawerProps['onDelete']\n  onDocumentOpen?: (args: {\n    collectionSlug: string\n    hasReadPermission: boolean\n    id: number | string\n    openInNewTab?: boolean\n  }) => void\n  onDuplicate?: DocumentDrawerProps['onSave']\n  onSave?: DocumentDrawerProps['onSave']\n  removeValueLabel?: string\n  valueContainerLabel?: string\n}\n\n// augment the types for the `Select` component from `react-select`\n// this is to include the `selectProps` prop at the top-level `Select` component\n// @ts-expect-error-next-line // TODO Fix this - moduleResolution 16 breaks our declare module\ndeclare module 'react-select/dist/declarations/src/Select' {\n  export interface Props<Option, IsMulti extends boolean, Group extends GroupBase<Option>> {\n    customProps?: CustomSelectProps\n  }\n}\n\n// augment the types for the `CommonPropsAndClassName` from `react-select`\n// this will include the `selectProps` prop to every `react-select` component automatically\n// @ts-expect-error-next-line // TODO Fix this - moduleResolution 16 breaks our declare module\ndeclare module 'react-select/dist/declarations/src' {\n  export interface CommonPropsAndClassName<\n    Option,\n    IsMulti extends boolean,\n    Group extends GroupBase<Option>,\n  > extends CommonProps<Option, IsMulti, Group> {\n    customProps?: CustomSelectProps & ReactSelectStateManagerProps<Option, IsMulti, Group>\n  }\n}\n\nexport type Option<TValue = unknown> = {\n  [key: string]: unknown\n  //* The ID is used to identify the option in the UI. If it doesn't exist and value cannot be transformed into a string, sorting won't work */\n  id?: string\n  value: TValue\n}\n\nexport type OptionGroup = {\n  label: string\n  options: Option[]\n}\n\nexport type ReactSelectAdapterProps = {\n  'aria-describedby'?: AriaAttributes['aria-describedby']\n  'aria-invalid'?: AriaAttributes['aria-invalid']\n  'aria-label'?: AriaAttributes['aria-label']\n  'aria-labelledby'?: AriaAttributes['aria-labelledby']\n  'aria-required'?: AriaAttributes['aria-required']\n  backspaceRemovesValue?: boolean\n  blurInputOnSelect?: boolean\n  captureMenuScroll?: boolean\n  className?: string\n  classNames?: ClassNamesConfig<Option, boolean, GroupBase<Option>>\n  components?: {\n    [key: string]: React.FC<any>\n  }\n  customProps?: CustomSelectProps\n  disabled?: boolean\n  filterOption?:\n    | ((\n        {\n          allowEdit,\n          data,\n          label,\n          value,\n        }: { allowEdit: boolean; data: Option; label: string; value: string },\n        search: string,\n      ) => boolean)\n    | undefined\n  formatOptionLabel?: ReactSelectStateManagerProps<\n    Option,\n    boolean,\n    GroupBase<Option>\n  >['formatOptionLabel']\n  getOptionLabel?: ReactSelectStateManagerProps<\n    Option,\n    boolean,\n    GroupBase<Option>\n  >['getOptionLabel']\n  getOptionValue?: ReactSelectStateManagerProps<\n    Option,\n    boolean,\n    GroupBase<Option>\n  >['getOptionValue']\n  id?: string\n  inputId?: string\n  isClearable?: boolean\n  /** Allows you to create own values in the UI despite them not being pre-specified */\n  isCreatable?: boolean\n  isLoading?: boolean\n  /** Allows you to specify multiple values instead of just one */\n  isMulti?: boolean\n  isOptionSelected?: any\n  isSearchable?: boolean\n  isSortable?: boolean\n  menuIsOpen?: boolean\n  menuPortalTarget?: HTMLElement | null\n  menuPosition?: 'absolute' | 'fixed'\n  noOptionsMessage?: (obj: { inputValue: string }) => string\n  numberOnly?: boolean\n  onChange?: (value: Option | Option[]) => void\n  onInputChange?: (val: string) => void\n  onMenuClose?: () => void\n  onMenuOpen?: () => void\n  onMenuScrollToBottom?: () => void\n  options: Option[] | OptionGroup[]\n  placeholder?: LabelFunction | string\n  showError?: boolean\n  styles?: StylesConfig<Option>\n  value?: Option | Option[]\n}\n"],"mappings":"AAwEA","ignoreList":[]}

package/dist/elements/RelationshipTable/AddNewButton.d.ts

@@ -4,11 +4,11 @@ import type { Props as ButtonProps } from '../../elements/Button/types.js';
 export declare const AddNewButton: ({ allowCreate, baseClass, buttonStyle, className, collections, i18n, icon, label, onClick, permissions, relationTo, }: {
     allowCreate: boolean;
     baseClass: string;
-    buttonStyle?: ButtonProps["buttonStyle"];
+    buttonStyle?: ButtonProps['buttonStyle'];
     className?: string;
     collections: ClientCollectionConfig[];
     i18n: I18nClient;
-    icon?: ButtonProps["icon"];
+    icon?: ButtonProps['icon'];
     label: string;
     onClick: (selectedCollection?: string) => void;
     permissions: SanitizedPermissions;

package/dist/elements/RelationshipTable/AddNewButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AddNewButton.d.ts","sourceRoot":"","sources":["../../../src/elements/RelationshipTable/AddNewButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAA;AAC1D,OAAO,KAAK,EAAE,sBAAsB,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAI3E,OAAO,KAAK,EAAE,KAAK,IAAI,WAAW,EAAE,MAAM,gCAAgC,CAAA;AAK1E,eAAO,MAAM,YAAY,0HAYtB;IACD,WAAW,EAAE,OAAO,CAAA;IACpB,SAAS,EAAE,MAAM,CAAA;IACjB,WAAW,CAAC,EAAE,WAAW,CAAC,aAAa,CAAC,CAAA;IACxC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,WAAW,EAAE,sBAAsB,EAAE,CAAA;IACrC,IAAI,EAAE,UAAU,CAAA;IAChB,IAAI,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAA;IAC1B,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,CAAC,kBAAkB,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;IAC9C,WAAW,EAAE,oBAAoB,CAAA;IACjC,UAAU,EAAE,MAAM,GAAG,MAAM,EAAE,CAAA;CAC9B,gCAsDA,CAAA"}
+{"version":3,"file":"AddNewButton.d.ts","sourceRoot":"","sources":["../../../src/elements/RelationshipTable/AddNewButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAA;AAC1D,OAAO,KAAK,EAAE,sBAAsB,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAI3E,OAAO,KAAK,EAAE,KAAK,IAAI,WAAW,EAAE,MAAM,gCAAgC,CAAA;AAK1E,eAAO,MAAM,YAAY,0HAYtB;IACD,WAAW,EAAE,OAAO,CAAA;IACpB,SAAS,EAAE,MAAM,CAAA;IACjB,WAAW,CAAC,EAAE,WAAW,CAAC,aAAa,CAAC,CAAA;IACxC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,WAAW,EAAE,sBAAsB,EAAE,CAAA;IACrC,IAAI,EAAE,UAAU,CAAA;IAChB,IAAI,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAA;IAC1B,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,CAAC,kBAAkB,CAAC,EAAE,MAAM,KAAK,IAAI,CAAA;IAC9C,WAAW,EAAE,oBAAoB,CAAA;IACjC,UAAU,EAAE,MAAM,GAAG,MAAM,EAAE,CAAA;CAC9B,gCA8DA,CAAA"}

package/dist/elements/RelationshipTable/AddNewButton.js

@@ -22,9 +22,12 @@ export const AddNewButton = ({
   }
   const isPolymorphic = Array.isArray(relationTo);
   if (!isPolymorphic) {
+    if (!permissions?.collections?.[relationTo]?.create) {
+      return null;
+    }
     return /*#__PURE__*/_jsx(Button, {
       buttonStyle: buttonStyle,
-      className: className,
+      className: [className, 'doc-drawer__toggler'].filter(Boolean).join(' '),
       onClick: () => onClick(),
       children: label
     });
@@ -40,6 +43,7 @@ export const AddNewButton = ({
       }),
       buttonType: "custom",
       horizontalAlign: "center",
+      popupType: "menu",
       render: ({
         close: closePopup
       }) => /*#__PURE__*/_jsx(PopupList.ButtonGroup, {
@@ -56,8 +60,7 @@ export const AddNewButton = ({
           }
           return null;
         })
-      }),
-      size: "medium"
+      })
     })
   });
 };

package/dist/elements/RelationshipTable/AddNewButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"AddNewButton.js","names":["getTranslation","Button","Popup","PopupList","AddNewButton","allowCreate","baseClass","buttonStyle","className","collections","i18n","icon","label","onClick","permissions","relationTo","isPolymorphic","Array","isArray","_jsx","button","buttonType","horizontalAlign","render","close","closePopup","ButtonGroup","map","relatedCollection","create","find","each","slug","labels","singular","size"],"sources":["../../../src/elements/RelationshipTable/AddNewButton.tsx"],"sourcesContent":["'use client'\nimport type { I18nClient } from '@payloadcms/translations'\nimport type { ClientCollectionConfig, SanitizedPermissions } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\n\nimport type { Props as ButtonProps } from '../../elements/Button/types.js'\n\nimport { Button } from '../../elements/Button/index.js'\nimport { Popup, PopupList } from '../Popup/index.js'\n\nexport const AddNewButton = ({\n  allowCreate,\n  baseClass,\n  buttonStyle,\n  className,\n  collections,\n  i18n,\n  icon,\n  label,\n  onClick,\n  permissions,\n  relationTo,\n}: {\n  allowCreate: boolean\n  baseClass: string\n  buttonStyle?: ButtonProps['buttonStyle']\n  className?: string\n  collections: ClientCollectionConfig[]\n  i18n: I18nClient\n  icon?: ButtonProps['icon']\n  label: string\n  onClick: (selectedCollection?: string) => void\n  permissions: SanitizedPermissions\n  relationTo: string | string[]\n}) => {\n  if (!allowCreate) {\n    return null\n  }\n\n  const isPolymorphic = Array.isArray(relationTo)\n\n  if (!isPolymorphic) {\n    return (\n      <Button buttonStyle={buttonStyle} className={className} onClick={() => onClick()}>\n        {label}\n      </Button>\n    )\n  }\n\n  return (\n    <div className={`${baseClass}__add-new-polymorphic-wrapper`}>\n      <Popup\n        button={\n          <Button buttonStyle={buttonStyle} className={className} icon={icon}>\n            {label}\n          </Button>\n        }\n        buttonType=\"custom\"\n        horizontalAlign=\"center\"\n        render={({ close: closePopup }) => (\n          <PopupList.ButtonGroup>\n            {relationTo.map((relatedCollection) => {\n              if (permissions.collections[relatedCollection]?.create) {\n                return (\n                  <PopupList.Button\n                    className={`${baseClass}__relation-button--${relatedCollection}`}\n                    key={relatedCollection}\n                    onClick={() => {\n                      closePopup()\n                      onClick(relatedCollection)\n                    }}\n                  >\n                    {getTranslation(\n                      collections.find((each) => each.slug === relatedCollection).labels.singular,\n                      i18n,\n                    )}\n                  </PopupList.Button>\n                )\n              }\n\n              return null\n            })}\n          </PopupList.ButtonGroup>\n        )}\n        size=\"medium\"\n      />\n    </div>\n  )\n}\n"],"mappings":"AAAA;;;AAIA,SAASA,cAAc,QAAQ;AAI/B,SAASC,MAAM,QAAQ;AACvB,SAASC,KAAK,EAAEC,SAAS,QAAQ;AAEjC,OAAO,MAAMC,YAAA,GAAeA,CAAC;EAC3BC,WAAW;EACXC,SAAS;EACTC,WAAW;EACXC,SAAS;EACTC,WAAW;EACXC,IAAI;EACJC,IAAI;EACJC,KAAK;EACLC,OAAO;EACPC,WAAW;EACXC;AAAU,CAaX;EACC,IAAI,CAACV,WAAA,EAAa;IAChB,OAAO;EACT;EAEA,MAAMW,aAAA,GAAgBC,KAAA,CAAMC,OAAO,CAACH,UAAA;EAEpC,IAAI,CAACC,aAAA,EAAe;IAClB,oBACEG,IAAA,CAAClB,MAAA;MAAOM,WAAA,EAAaA,WAAA;MAAaC,SAAA,EAAWA,SAAA;MAAWK,OAAA,EAASA,CAAA,KAAMA,OAAA;gBACpED;;EAGP;EAEA,oBACEO,IAAA,CAAC;IAAIX,SAAA,EAAW,GAAGF,SAAA,+BAAwC;cACzD,aAAAa,IAAA,CAACjB,KAAA;MACCkB,MAAA,eACED,IAAA,CAAClB,MAAA;QAAOM,WAAA,EAAaA,WAAA;QAAaC,SAAA,EAAWA,SAAA;QAAWG,IAAA,EAAMA,IAAA;kBAC3DC;;MAGLS,UAAA,EAAW;MACXC,eAAA,EAAgB;MAChBC,MAAA,EAAQA,CAAC;QAAEC,KAAA,EAAOC;MAAU,CAAE,kBAC5BN,IAAA,CAAChB,SAAA,CAAUuB,WAAW;kBACnBX,UAAA,CAAWY,GAAG,CAAEC,iBAAA;UACf,IAAId,WAAA,CAAYL,WAAW,CAACmB,iBAAA,CAAkB,EAAEC,MAAA,EAAQ;YACtD,oBACEV,IAAA,CAAChB,SAAA,CAAUF,MAAM;cACfO,SAAA,EAAW,GAAGF,SAAA,sBAA+BsB,iBAAA,EAAmB;cAEhEf,OAAA,EAASA,CAAA;gBACPY,UAAA;gBACAZ,OAAA,CAAQe,iBAAA;cACV;wBAEC5B,cAAA,CACCS,WAAA,CAAYqB,IAAI,CAAEC,IAAA,IAASA,IAAA,CAAKC,IAAI,KAAKJ,iBAAA,EAAmBK,MAAM,CAACC,QAAQ,EAC3ExB,IAAA;eARGkB,iBAAA;UAYX;UAEA,OAAO;QACT;;MAGJO,IAAA,EAAK;;;AAIb","ignoreList":[]}
+{"version":3,"file":"AddNewButton.js","names":["getTranslation","Button","Popup","PopupList","AddNewButton","allowCreate","baseClass","buttonStyle","className","collections","i18n","icon","label","onClick","permissions","relationTo","isPolymorphic","Array","isArray","create","_jsx","filter","Boolean","join","button","buttonType","horizontalAlign","popupType","render","close","closePopup","ButtonGroup","map","relatedCollection","find","each","slug","labels","singular"],"sources":["../../../src/elements/RelationshipTable/AddNewButton.tsx"],"sourcesContent":["'use client'\nimport type { I18nClient } from '@payloadcms/translations'\nimport type { ClientCollectionConfig, SanitizedPermissions } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\n\nimport type { Props as ButtonProps } from '../../elements/Button/types.js'\n\nimport { Button } from '../../elements/Button/index.js'\nimport { Popup, PopupList } from '../Popup/index.js'\n\nexport const AddNewButton = ({\n  allowCreate,\n  baseClass,\n  buttonStyle,\n  className,\n  collections,\n  i18n,\n  icon,\n  label,\n  onClick,\n  permissions,\n  relationTo,\n}: {\n  allowCreate: boolean\n  baseClass: string\n  buttonStyle?: ButtonProps['buttonStyle']\n  className?: string\n  collections: ClientCollectionConfig[]\n  i18n: I18nClient\n  icon?: ButtonProps['icon']\n  label: string\n  onClick: (selectedCollection?: string) => void\n  permissions: SanitizedPermissions\n  relationTo: string | string[]\n}) => {\n  if (!allowCreate) {\n    return null\n  }\n\n  const isPolymorphic = Array.isArray(relationTo)\n\n  if (!isPolymorphic) {\n    if (!permissions?.collections?.[relationTo]?.create) {\n      return null\n    }\n\n    return (\n      <Button\n        buttonStyle={buttonStyle}\n        className={[className, 'doc-drawer__toggler'].filter(Boolean).join(' ')}\n        onClick={() => onClick()}\n      >\n        {label}\n      </Button>\n    )\n  }\n\n  return (\n    <div className={`${baseClass}__add-new-polymorphic-wrapper`}>\n      <Popup\n        button={\n          <Button buttonStyle={buttonStyle} className={className} icon={icon}>\n            {label}\n          </Button>\n        }\n        buttonType=\"custom\"\n        horizontalAlign=\"center\"\n        popupType=\"menu\"\n        render={({ close: closePopup }) => (\n          <PopupList.ButtonGroup>\n            {relationTo.map((relatedCollection) => {\n              if (permissions.collections[relatedCollection]?.create) {\n                return (\n                  <PopupList.Button\n                    className={`${baseClass}__relation-button--${relatedCollection}`}\n                    key={relatedCollection}\n                    onClick={() => {\n                      closePopup()\n                      onClick(relatedCollection)\n                    }}\n                  >\n                    {getTranslation(\n                      collections.find((each) => each.slug === relatedCollection).labels.singular,\n                      i18n,\n                    )}\n                  </PopupList.Button>\n                )\n              }\n\n              return null\n            })}\n          </PopupList.ButtonGroup>\n        )}\n      />\n    </div>\n  )\n}\n"],"mappings":"AAAA;;;AAIA,SAASA,cAAc,QAAQ;AAI/B,SAASC,MAAM,QAAQ;AACvB,SAASC,KAAK,EAAEC,SAAS,QAAQ;AAEjC,OAAO,MAAMC,YAAA,GAAeA,CAAC;EAC3BC,WAAW;EACXC,SAAS;EACTC,WAAW;EACXC,SAAS;EACTC,WAAW;EACXC,IAAI;EACJC,IAAI;EACJC,KAAK;EACLC,OAAO;EACPC,WAAW;EACXC;AAAU,CAaX;EACC,IAAI,CAACV,WAAA,EAAa;IAChB,OAAO;EACT;EAEA,MAAMW,aAAA,GAAgBC,KAAA,CAAMC,OAAO,CAACH,UAAA;EAEpC,IAAI,CAACC,aAAA,EAAe;IAClB,IAAI,CAACF,WAAA,EAAaL,WAAA,GAAcM,UAAA,CAAW,EAAEI,MAAA,EAAQ;MACnD,OAAO;IACT;IAEA,oBACEC,IAAA,CAACnB,MAAA;MACCM,WAAA,EAAaA,WAAA;MACbC,SAAA,EAAW,CAACA,SAAA,EAAW,sBAAsB,CAACa,MAAM,CAACC,OAAA,EAASC,IAAI,CAAC;MACnEV,OAAA,EAASA,CAAA,KAAMA,OAAA;gBAEdD;;EAGP;EAEA,oBACEQ,IAAA,CAAC;IAAIZ,SAAA,EAAW,GAAGF,SAAA,+BAAwC;cACzD,aAAAc,IAAA,CAAClB,KAAA;MACCsB,MAAA,eACEJ,IAAA,CAACnB,MAAA;QAAOM,WAAA,EAAaA,WAAA;QAAaC,SAAA,EAAWA,SAAA;QAAWG,IAAA,EAAMA,IAAA;kBAC3DC;;MAGLa,UAAA,EAAW;MACXC,eAAA,EAAgB;MAChBC,SAAA,EAAU;MACVC,MAAA,EAAQA,CAAC;QAAEC,KAAA,EAAOC;MAAU,CAAE,kBAC5BV,IAAA,CAACjB,SAAA,CAAU4B,WAAW;kBACnBhB,UAAA,CAAWiB,GAAG,CAAEC,iBAAA;UACf,IAAInB,WAAA,CAAYL,WAAW,CAACwB,iBAAA,CAAkB,EAAEd,MAAA,EAAQ;YACtD,oBACEC,IAAA,CAACjB,SAAA,CAAUF,MAAM;cACfO,SAAA,EAAW,GAAGF,SAAA,sBAA+B2B,iBAAA,EAAmB;cAEhEpB,OAAA,EAASA,CAAA;gBACPiB,UAAA;gBACAjB,OAAA,CAAQoB,iBAAA;cACV;wBAECjC,cAAA,CACCS,WAAA,CAAYyB,IAAI,CAAEC,IAAA,IAASA,IAAA,CAAKC,IAAI,KAAKH,iBAAA,EAAmBI,MAAM,CAACC,QAAQ,EAC3E5B,IAAA;eARGuB,iBAAA;UAYX;UAEA,OAAO;QACT;;;;AAMZ","ignoreList":[]}

package/dist/elements/RelationshipTable/Pagination.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../../src/elements/RelationshipTable/Pagination.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,eAAO,MAAM,2BAA2B,EAAE,KAAK,CAAC,EAkB/C,CAAA"}
+{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../../src/elements/RelationshipTable/Pagination.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,eAAO,MAAM,2BAA2B,EAAE,KAAK,CAAC,EAoB/C,CAAA"}