@payloadcms/ui 4.0.0-canary.0 → 4.0.0-canary.1

package/dist/elements/ReactSelect/index.js

@@ -1,11 +1,14 @@
 'use client';
 
+import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { arrayMove } from '@dnd-kit/sortable';
 import { getTranslation } from '@payloadcms/translations';
 import React, { useEffect, useId } from 'react';
-import Select from 'react-select';
+import Select, { components as rsComponents } from 'react-select';
 import CreatableSelect from 'react-select/creatable';
+import { useDebouncedEffect } from '../../hooks/useDebouncedEffect.js';
+import { useTheme } from '../../providers/Theme/index.js';
 import { useTranslation } from '../../providers/Translation/index.js';
 import { DraggableSortable } from '../DraggableSortable/index.js';
 import { ShimmerEffect } from '../ShimmerEffect/index.js';
@@ -23,6 +26,32 @@ const createOption = label => ({
   label,
   value: label
 });
+// Propagates the nearest scoped theme (via ThemeProvider) into the portal div,
+// falling back to the global theme. Ensures dropdown menus portaled to
+// document.body inherit the correct theme (e.g. dark Popup).
+function ThemedMenuPortal(props) {
+  const $ = _c(3);
+  const {
+    theme
+  } = useTheme();
+  const menuPortalTheme = props.selectProps?.customProps?.menuPortalTheme;
+  const t0 = menuPortalTheme ?? theme;
+  let t1;
+  if ($[0] !== props || $[1] !== t0) {
+    t1 = _jsx(rsComponents.MenuPortal, {
+      ...props,
+      innerProps: {
+        "data-theme": t0
+      }
+    });
+    $[0] = props;
+    $[1] = t0;
+    $[2] = t1;
+  } else {
+    t1 = $[2];
+  }
+  return t1;
+}
 const SelectAdapter = props => {
   const {
     i18n,
@@ -37,6 +66,7 @@ const SelectAdapter = props => {
   }, []);
   const {
     className,
+    classNames: externalClassNames,
     components,
     customProps,
     disabled = false,
@@ -46,6 +76,8 @@ const SelectAdapter = props => {
     isCreatable,
     isLoading,
     isSearchable = true,
+    menuPortalTarget: menuPortalTargetProp,
+    menuPosition: menuPositionProp,
     noOptionsMessage = () => t('general:noOptions'),
     numberOnly = false,
     onChange,
@@ -57,6 +89,16 @@ const SelectAdapter = props => {
     styles: externalStyles,
     value
   } = props;
+  const menuPortalTarget = menuPortalTargetProp === undefined ? typeof document !== 'undefined' ? document.body : null : menuPortalTargetProp;
+  const menuPosition = menuPositionProp ?? (menuPortalTarget ? 'fixed' : undefined);
+  // 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] = React.useState(false);
+  useDebouncedEffect(() => {
+    setIsLoadingDebounced(isLoading);
+  }, [isLoading], 250);
   const loadingMessage = () => t('general:loading') + '...';
   const classes = [className, 'react-select', showError && 'react-select--error'].filter(Boolean).join(' ');
   const styles = {
@@ -68,39 +110,54 @@ const SelectAdapter = props => {
       zIndex: undefined,
       ...externalStyles?.menu?.(rsStyles, state)
     }),
+    // 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_0, state_0) => ({
+        ...rsStyles_0,
+        zIndex: 9999,
+        ...externalStyles?.menuPortal?.(rsStyles_0, state_0)
+      })
+    }),
     // Remove the default react-select min-height so our CSS can control it
-    control: (rsStyles_0, state_0) => ({
-      ...rsStyles_0,
+    control: (rsStyles_1, state_1) => ({
+      ...rsStyles_1,
       minHeight: undefined,
-      ...externalStyles?.control?.(rsStyles_0, state_0)
+      ...externalStyles?.control?.(rsStyles_1, state_1)
     }),
     // Allow external option styles to override emotion defaults
-    option: (rsStyles_1, state_1) => ({
-      ...rsStyles_1,
-      ...externalStyles?.option?.(rsStyles_1, state_1)
+    option: (rsStyles_2, state_2) => ({
+      ...rsStyles_2,
+      ...externalStyles?.option?.(rsStyles_2, state_2)
     })
   };
   if (!hasMounted) {
     return /*#__PURE__*/_jsx(ShimmerEffect, {
-      height: "calc(var(--base) * 2 + 2px)"
+      height: "var(--field-min-height)"
     });
   }
   if (!isCreatable) {
     return /*#__PURE__*/_jsx(Select, {
       captureMenuScroll: true,
       customProps: customProps,
-      isLoading: isLoading,
       ...props,
       className: classes,
       classNamePrefix: "rs",
       classNames: {
-        menu: state_2 => state_2.placement ? `rs__menu--placement-${state_2.placement}` : ''
+        ...externalClassNames,
+        menu: state_3 => {
+          const placement = state_3.placement ? `rs__menu--placement-${state_3.placement}` : '';
+          const external = externalClassNames?.menu?.(state_3) ?? '';
+          return [placement, external].filter(Boolean).join(' ');
+        }
       },
       components: {
         ClearIndicator,
         Control,
         DropdownIndicator,
         Input,
+        MenuPortal: ThemedMenuPortal,
         MultiValue,
         MultiValueLabel,
         MultiValueRemove,
@@ -113,9 +170,12 @@ const SelectAdapter = props => {
       instanceId: uuid,
       isClearable: isClearable,
       isDisabled: disabled,
+      isLoading: isLoadingDebounced,
       isSearchable: isSearchable,
       loadingMessage: loadingMessage,
       menuPlacement: "auto",
+      menuPortalTarget: menuPortalTarget,
+      menuPosition: menuPosition,
       noOptionsMessage: noOptionsMessage,
       onChange: onChange,
       onMenuClose: onMenuClose,
@@ -159,18 +219,23 @@ const SelectAdapter = props => {
   };
   return /*#__PURE__*/_jsx(CreatableSelect, {
     captureMenuScroll: true,
-    isLoading: isLoading,
     ...props,
     className: classes,
     classNamePrefix: "rs",
     classNames: {
-      menu: state_3 => state_3.placement ? `rs__menu--placement-${state_3.placement}` : ''
+      ...externalClassNames,
+      menu: state_4 => {
+        const placement_0 = state_4.placement ? `rs__menu--placement-${state_4.placement}` : '';
+        const external_0 = externalClassNames?.menu?.(state_4) ?? '';
+        return [placement_0, external_0].filter(Boolean).join(' ');
+      }
     },
     components: {
       ClearIndicator,
       Control,
       DropdownIndicator,
       Input,
+      MenuPortal: ThemedMenuPortal,
       MultiValue,
       MultiValueLabel,
       MultiValueRemove,
@@ -183,9 +248,12 @@ const SelectAdapter = props => {
     instanceId: uuid,
     isClearable: isClearable,
     isDisabled: disabled,
+    isLoading: isLoadingDebounced,
     isSearchable: isSearchable,
     loadingMessage: loadingMessage,
     menuPlacement: "auto",
+    menuPortalTarget: menuPortalTarget,
+    menuPosition: menuPosition,
     noOptionsMessage: noOptionsMessage,
     onChange: onChange,
     onInputChange: newValue => setInputValue(newValue),

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","styles","externalStyles","loadingMessage","classes","filter","Boolean","join","menu","rsStyles","state","zIndex","control","minHeight","option","_jsx","height","captureMenuScroll","classNamePrefix","classNames","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    styles: externalStyles,\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, state) => ({\n      ...rsStyles,\n      zIndex: undefined,\n      ...externalStyles?.menu?.(rsStyles, state),\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  }\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":["c","_c","arrayMove","getTranslation","React","useEffect","useId","Select","components","rsComponents","CreatableSelect","useDebouncedEffect","useTheme","useTranslation","DraggableSortable","ShimmerEffect","ClearIndicator","Control","DropdownIndicator","Input","generateMultiValueDraggableID","MultiValue","MultiValueLabel","MultiValueRemove","SingleValue","ValueContainer","createOption","label","value","ThemedMenuPortal","props","$","theme","menuPortalTheme","selectProps","customProps","t0","t1","_jsx","MenuPortal","innerProps","SelectAdapter","i18n","t","inputValue","setInputValue","useState","uuid","hasMounted","setHasMounted","className","classNames","externalClassNames","disabled","filterOption","undefined","getOptionValue","isClearable","isCreatable","isLoading","isSearchable","menuPortalTarget","menuPortalTargetProp","menuPosition","menuPositionProp","noOptionsMessage","numberOnly","onChange","onMenuClose","onMenuOpen","options","placeholder","showError","styles","externalStyles","document","body","isLoadingDebounced","setIsLoadingDebounced","loadingMessage","classes","filter","Boolean","join","menu","rsStyles","state","zIndex","menuPortal","control","minHeight","option","height","captureMenuScroll","classNamePrefix","placement","external","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 { JSX, KeyboardEventHandler } from 'react'\nimport type { GroupBase, MenuProps, StylesConfig } from 'react-select'\n\nimport { arrayMove } from '@dnd-kit/sortable'\nimport { getTranslation } from '@payloadcms/translations'\nimport React, { useEffect, useId } from 'react'\nimport Select, { components as rsComponents } 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 { useTheme } from '../../providers/Theme/index.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 { 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\n// Propagates the nearest scoped theme (via ThemeProvider) into the portal div,\n// falling back to the global theme. Ensures dropdown menus portaled to\n// document.body inherit the correct theme (e.g. dark Popup).\nfunction ThemedMenuPortal<Opt, IsMulti extends boolean, Group extends GroupBase<Opt>>(\n  props: React.ComponentProps<typeof rsComponents.MenuPortal<Opt, IsMulti, Group>>,\n) {\n  const { theme } = useTheme()\n  const menuPortalTheme = (props.selectProps as any)?.customProps?.menuPortalTheme\n  return (\n    <rsComponents.MenuPortal\n      {...props}\n      innerProps={{ 'data-theme': menuPortalTheme ?? theme } as JSX.IntrinsicElements['div']}\n    />\n  )\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    classNames: externalClassNames,\n    components,\n    customProps,\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\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] = React.useState(false)\n\n  useDebouncedEffect(\n    () => {\n      setIsLoadingDebounced(isLoading)\n    },\n    [isLoading],\n    250,\n  )\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, state) => ({\n      ...rsStyles,\n      zIndex: undefined,\n      ...externalStyles?.menu?.(rsStyles, state),\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: 9999,\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  }\n\n  if (!hasMounted) {\n    return <ShimmerEffect height=\"var(--field-min-height)\" />\n  }\n\n  if (!isCreatable) {\n    return (\n      <Select<Option, boolean, GroupBase<Option>>\n        captureMenuScroll\n        customProps={customProps}\n        {...props}\n        className={classes}\n        classNamePrefix=\"rs\"\n        classNames={{\n          ...externalClassNames,\n          menu: (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        }}\n        components={{\n          ClearIndicator,\n          Control,\n          DropdownIndicator,\n          Input,\n          MenuPortal: ThemedMenuPortal,\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        isLoading={isLoadingDebounced}\n        isSearchable={isSearchable}\n        loadingMessage={loadingMessage}\n        menuPlacement=\"auto\"\n        menuPortalTarget={menuPortalTarget}\n        menuPosition={menuPosition}\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<Option, boolean, GroupBase<Option>>\n      captureMenuScroll\n      {...props}\n      className={classes}\n      classNamePrefix=\"rs\"\n      classNames={{\n        ...externalClassNames,\n        menu: (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      }}\n      components={{\n        ClearIndicator,\n        Control,\n        DropdownIndicator,\n        Input,\n        MenuPortal: ThemedMenuPortal,\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      isLoading={isLoadingDebounced}\n      isSearchable={isSearchable}\n      loadingMessage={loadingMessage}\n      menuPlacement=\"auto\"\n      menuPortalTarget={menuPortalTarget}\n      menuPosition={menuPosition}\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":[]}

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

@@ -1,5 +1,5 @@
 import type { LabelFunction } from 'payload';
-import type { CommonProps, GroupBase, Props as ReactSelectStateManagerProps, StylesConfig } from 'react-select';
+import type { ClassNamesConfig, CommonProps, GroupBase, Props as ReactSelectStateManagerProps, StylesConfig } from 'react-select';
 import type { DocumentDrawerProps } from '../DocumentDrawer/types.js';
 type CustomSelectProps = {
     disableKeyDown?: boolean;
@@ -10,6 +10,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;
@@ -44,6 +46,7 @@ export type ReactSelectAdapterProps = {
     backspaceRemovesValue?: boolean;
     blurInputOnSelect?: boolean;
     className?: string;
+    classNames?: ClassNamesConfig<Option, boolean, GroupBase<Option>>;
     components?: {
         [key: string]: React.FC<any>;
     };
@@ -68,6 +71,8 @@ export type ReactSelectAdapterProps = {
     isSearchable?: boolean;
     isSortable?: boolean;
     menuIsOpen?: boolean;
+    menuPortalTarget?: HTMLElement | null;
+    menuPosition?: 'absolute' | 'fixed';
     noOptionsMessage?: (obj: {
         inputValue: string;
     }) => string;

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 {\n  CommonProps,\n  GroupBase,\n  Props as ReactSelectStateManagerProps,\n  StylesConfig,\n} 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  styles?: StylesConfig<Option>\n  value?: Option | Option[]\n}\n"],"mappings":"AAkEA","ignoreList":[]}
+{"version":3,"file":"types.js","names":[],"sources":["../../../src/elements/ReactSelect/types.ts"],"sourcesContent":["import type { LabelFunction } from 'payload'\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\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  /** 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  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  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  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":"AAqEA","ignoreList":[]}

package/dist/elements/RenderTitle/index.css

@@ -27,6 +27,16 @@
     position: relative;
   }
 
+  .render-title__link {
+    color: inherit;
+    text-decoration: none;
+
+    &:hover,
+    &:focus-visible {
+      text-decoration: underline;
+    }
+  }
+
   @media (max-width: 768px) {
     .render-title {
       --render-title-letter-spacing: -0.075px;

package/dist/elements/RenderTitle/index.d.ts

@@ -5,6 +5,11 @@ export type RenderTitleProps = {
     element?: React.ElementType;
     fallback?: string;
     fallbackToID?: boolean;
+    /**
+     * When true, renders the title as a link to the document. Useful inside drawers
+     * to navigate to the full document view.
+     */
+    renderAsLink?: boolean;
     title?: string;
 };
 export declare const RenderTitle: React.FC<RenderTitleProps>;

package/dist/elements/RenderTitle/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/RenderTitle/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmB,MAAM,OAAO,CAAA;AAKvC,OAAO,aAAa,CAAA;AAIpB,MAAM,MAAM,gBAAgB,GAAG;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAgClD,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/RenderTitle/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAmB,MAAM,OAAO,CAAA;AAOvC,OAAO,aAAa,CAAA;AAIpB,MAAM,MAAM,gBAAgB,GAAG;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAiDlD,CAAA"}

package/dist/elements/RenderTitle/index.js

@@ -2,67 +2,92 @@
 
 import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx } from "react/jsx-runtime";
+import { formatAdminURL } from 'payload/shared';
 import React, { Fragment } from 'react';
+import { Link } from '../../elements/Link/index.js';
+import { useConfig } from '../../providers/Config/index.js';
 import { useDocumentInfo } from '../../providers/DocumentInfo/index.js';
 import { useDocumentTitle } from '../../providers/DocumentTitle/index.js';
 import { IDLabel } from '../IDLabel/index.js';
 import './index.css';
 const baseClass = 'render-title';
 export const RenderTitle = props => {
-  const $ = _c(10);
+  const $ = _c(14);
   const {
     className,
     element: t0,
     fallback,
+    renderAsLink,
     title: titleFromProps
   } = props;
   const element = t0 === undefined ? "h1" : t0;
   const {
     id,
+    collectionSlug,
+    globalSlug,
     isInitializing
   } = useDocumentInfo();
   const {
     title: titleFromContext
   } = useDocumentTitle();
+  const {
+    config: t1
+  } = useConfig();
+  const {
+    routes: t2
+  } = t1;
+  const {
+    admin: adminRoute
+  } = t2;
   const title = titleFromProps || titleFromContext || fallback;
   const idAsTitle = title === id;
   const Tag = element;
-  let t1;
-  if ($[0] !== Tag || $[1] !== className || $[2] !== id || $[3] !== idAsTitle || $[4] !== isInitializing || $[5] !== title) {
+  let t3;
+  if ($[0] !== Tag || $[1] !== adminRoute || $[2] !== className || $[3] !== collectionSlug || $[4] !== globalSlug || $[5] !== id || $[6] !== idAsTitle || $[7] !== isInitializing || $[8] !== renderAsLink || $[9] !== title) {
     const EmptySpace = _jsx(Fragment, {
       children: "\xA0"
     });
-    const t2 = idAsTitle && `${baseClass}--has-id`;
-    let t3;
-    if ($[7] !== className || $[8] !== t2) {
-      t3 = [className, baseClass, t2].filter(Boolean);
-      $[7] = className;
-      $[8] = t2;
-      $[9] = t3;
+    const docPath = renderAsLink && id && (collectionSlug || globalSlug) ? formatAdminURL({
+      adminRoute,
+      path: `/${collectionSlug ? `collections/${collectionSlug}` : `globals/${globalSlug}`}/${id}`
+    }) : null;
+    const t4 = idAsTitle && `${baseClass}--has-id`;
+    let t5;
+    if ($[11] !== className || $[12] !== t4) {
+      t5 = [className, baseClass, t4].filter(Boolean);
+      $[11] = className;
+      $[12] = t4;
+      $[13] = t5;
     } else {
-      t3 = $[9];
+      t5 = $[13];
     }
-    t1 = _jsx(Tag, {
-      className: t3.join(" "),
+    t3 = _jsx(Tag, {
+      className: t5.join(" "),
       "data-doc-id": id,
       title,
-      children: isInitializing ? EmptySpace : _jsx(Fragment, {
-        children: idAsTitle ? _jsx(IDLabel, {
-          className: `${baseClass}__id`,
-          id
-        }) : title || EmptySpace
-      })
+      children: isInitializing ? EmptySpace : idAsTitle ? _jsx(IDLabel, {
+        className: `${baseClass}__id`,
+        id
+      }) : docPath ? _jsx(Link, {
+        className: `${baseClass}__link`,
+        href: docPath,
+        children: title || EmptySpace
+      }) : title || EmptySpace
     });
     $[0] = Tag;
-    $[1] = className;
-    $[2] = id;
-    $[3] = idAsTitle;
-    $[4] = isInitializing;
-    $[5] = title;
-    $[6] = t1;
+    $[1] = adminRoute;
+    $[2] = className;
+    $[3] = collectionSlug;
+    $[4] = globalSlug;
+    $[5] = id;
+    $[6] = idAsTitle;
+    $[7] = isInitializing;
+    $[8] = renderAsLink;
+    $[9] = title;
+    $[10] = t3;
   } else {
-    t1 = $[6];
+    t3 = $[10];
   }
-  return t1;
+  return t3;
 };
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","React","Fragment","useDocumentInfo","useDocumentTitle","IDLabel","baseClass","RenderTitle","props","$","className","element","t0","fallback","title","titleFromProps","undefined","id","isInitializing","titleFromContext","idAsTitle","Tag","t1","EmptySpace","_jsx","children","t2","t3","filter","Boolean","join"],"sources":["../../../src/elements/RenderTitle/index.tsx"],"sourcesContent":["'use client'\nimport React, { Fragment } from 'react'\n\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useDocumentTitle } from '../../providers/DocumentTitle/index.js'\nimport { IDLabel } from '../IDLabel/index.js'\nimport './index.css'\n\nconst baseClass = 'render-title'\n\nexport type RenderTitleProps = {\n  className?: string\n  element?: React.ElementType\n  fallback?: string\n  fallbackToID?: boolean\n  title?: string\n}\n\nexport const RenderTitle: React.FC<RenderTitleProps> = (props) => {\n  const { className, element = 'h1', fallback, title: titleFromProps } = props\n\n  const { id, isInitializing } = useDocumentInfo()\n  const { title: titleFromContext } = useDocumentTitle()\n\n  const title = titleFromProps || titleFromContext || fallback\n\n  const idAsTitle = title === id\n\n  const Tag = element\n\n  // Render and invisible character to prevent layout shift when the title populates from context\n  const EmptySpace = <Fragment>&nbsp;</Fragment>\n\n  return (\n    <Tag\n      className={[className, baseClass, idAsTitle && `${baseClass}--has-id`]\n        .filter(Boolean)\n        .join(' ')}\n      data-doc-id={id}\n      title={title}\n    >\n      {isInitializing ? (\n        EmptySpace\n      ) : (\n        <Fragment>\n          {idAsTitle ? <IDLabel className={`${baseClass}__id`} id={id} /> : title || EmptySpace}\n        </Fragment>\n      )}\n    </Tag>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,OAAOC,KAAA,IAASC,QAAQ,QAAQ;AAEhC,SAASC,eAAe,QAAQ;AAChC,SAASC,gBAAgB,QAAQ;AACjC,SAASC,OAAO,QAAQ;AACxB,OAAO;AAEP,MAAMC,SAAA,GAAY;AAUlB,OAAO,MAAMC,WAAA,GAA0CC,KAAA;EAAA,MAAAC,CAAA,GAAAT,EAAA;EACrD;IAAAU,SAAA;IAAAC,OAAA,EAAAC,EAAA;IAAAC,QAAA;IAAAC,KAAA,EAAAC;EAAA,IAAuEP,KAAA;EAApD,MAAAG,OAAA,GAAAC,EAAc,KAAAI,SAAA,GAAJ,IAAI,GAAdJ,EAAc;EAEjC;IAAAK,EAAA;IAAAC;EAAA,IAA+Bf,eAAA;EAC/B;IAAAW,KAAA,EAAAK;EAAA,IAAoCf,gBAAA;EAEpC,MAAAU,KAAA,GAAcC,cAAA,IAAkBI,gBAAA,IAAoBN,QAAA;EAEpD,MAAAO,SAAA,GAAkBN,KAAA,KAAUG,EAAA;EAE5B,MAAAI,GAAA,GAAYV,OAAA;EAAA,IAAAW,EAAA;EAAA,IAAAb,CAAA,QAAAY,GAAA,IAAAZ,CAAA,QAAAC,SAAA,IAAAD,CAAA,QAAAQ,EAAA,IAAAR,CAAA,QAAAW,SAAA,IAAAX,CAAA,QAAAS,cAAA,IAAAT,CAAA,QAAAK,KAAA;IAGZ,MAAAS,UAAA,GAAmBC,IAAA,CAAAtB,QAAA;MAAAuB,QAAA,EAAU;IAAA,C;IAIS,MAAAC,EAAA,GAAAN,SAAA,IAAa,GAAAd,SAAA,UAAsB;IAAA,IAAAqB,EAAA;IAAA,IAAAlB,CAAA,QAAAC,SAAA,IAAAD,CAAA,QAAAiB,EAAA;MAA1DC,EAAA,IAACjB,SAAA,EAAAJ,SAAA,EAAsBoB,EAAmC,EAAAE,MAAA,CAAAC,OAC3D;MAAApB,CAAA,MAAAC,SAAA;MAAAD,CAAA,MAAAiB,EAAA;MAAAjB,CAAA,MAAAkB,EAAA;IAAA;MAAAA,EAAA,GAAAlB,CAAA;IAAA;IAFZa,EAAA,GAAAE,IAAA,CAACH,GAAA;MAAAX,SAAA,EACYiB,EACD,CAAAG,IAAA,CACF;MAAA,eACKb,EAAA;MAAAH,KAAA;MAAAW,QAAA,EAGZP,cAAA,GACCK,UAAA,GAEAC,IAAA,CAAAtB,QAAA;QAAAuB,QAAA,EACGL,SAAA,GAAYI,IAAA,CAAAnB,OAAA;UAAAK,SAAA,EAAoB,GAAAJ,SAAA,MAAkB;UAAAW;QAAA,C,IAAeH,KAAA,IAASS;MAAA,C;;;;;;;;;;;;SAXjFD,E;CAgBJ","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","formatAdminURL","React","Fragment","Link","useConfig","useDocumentInfo","useDocumentTitle","IDLabel","baseClass","RenderTitle","props","$","className","element","t0","fallback","renderAsLink","title","titleFromProps","undefined","id","collectionSlug","globalSlug","isInitializing","titleFromContext","config","t1","routes","t2","admin","adminRoute","idAsTitle","Tag","t3","EmptySpace","_jsx","children","docPath","path","t4","t5","filter","Boolean","join","href"],"sources":["../../../src/elements/RenderTitle/index.tsx"],"sourcesContent":["'use client'\nimport { formatAdminURL } from 'payload/shared'\nimport React, { Fragment } from 'react'\n\nimport { Link } from '../../elements/Link/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useDocumentTitle } from '../../providers/DocumentTitle/index.js'\nimport { IDLabel } from '../IDLabel/index.js'\nimport './index.css'\n\nconst baseClass = 'render-title'\n\nexport type RenderTitleProps = {\n  className?: string\n  element?: React.ElementType\n  fallback?: string\n  fallbackToID?: boolean\n  /**\n   * When true, renders the title as a link to the document. Useful inside drawers\n   * to navigate to the full document view.\n   */\n  renderAsLink?: boolean\n  title?: string\n}\n\nexport const RenderTitle: React.FC<RenderTitleProps> = (props) => {\n  const { className, element = 'h1', fallback, renderAsLink, title: titleFromProps } = props\n\n  const { id, collectionSlug, globalSlug, isInitializing } = useDocumentInfo()\n  const { title: titleFromContext } = useDocumentTitle()\n  const {\n    config: {\n      routes: { admin: adminRoute },\n    },\n  } = useConfig()\n\n  const title = titleFromProps || titleFromContext || fallback\n\n  const idAsTitle = title === id\n\n  const Tag = element\n\n  // Render and invisible character to prevent layout shift when the title populates from context\n  const EmptySpace = <Fragment>&nbsp;</Fragment>\n\n  const docPath =\n    renderAsLink && id && (collectionSlug || globalSlug)\n      ? formatAdminURL({\n          adminRoute,\n          path: `/${collectionSlug ? `collections/${collectionSlug}` : `globals/${globalSlug}`}/${id}`,\n        })\n      : null\n\n  return (\n    <Tag\n      className={[className, baseClass, idAsTitle && `${baseClass}--has-id`]\n        .filter(Boolean)\n        .join(' ')}\n      data-doc-id={id}\n      title={title}\n    >\n      {isInitializing ? (\n        EmptySpace\n      ) : idAsTitle ? (\n        <IDLabel className={`${baseClass}__id`} id={id} />\n      ) : docPath ? (\n        <Link className={`${baseClass}__link`} href={docPath}>\n          {title || EmptySpace}\n        </Link>\n      ) : (\n        title || EmptySpace\n      )}\n    </Tag>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,SAASC,cAAc,QAAQ;AAC/B,OAAOC,KAAA,IAASC,QAAQ,QAAQ;AAEhC,SAASC,IAAI,QAAQ;AACrB,SAASC,SAAS,QAAQ;AAC1B,SAASC,eAAe,QAAQ;AAChC,SAASC,gBAAgB,QAAQ;AACjC,SAASC,OAAO,QAAQ;AACxB,OAAO;AAEP,MAAMC,SAAA,GAAY;AAelB,OAAO,MAAMC,WAAA,GAA0CC,KAAA;EAAA,MAAAC,CAAA,GAAAZ,EAAA;EACrD;IAAAa,SAAA;IAAAC,OAAA,EAAAC,EAAA;IAAAC,QAAA;IAAAC,YAAA;IAAAC,KAAA,EAAAC;EAAA,IAAqFR,KAAA;EAAlE,MAAAG,OAAA,GAAAC,EAAc,KAAAK,SAAA,GAAJ,IAAI,GAAdL,EAAc;EAEjC;IAAAM,EAAA;IAAAC,cAAA;IAAAC,UAAA;IAAAC;EAAA,IAA2DlB,eAAA;EAC3D;IAAAY,KAAA,EAAAO;EAAA,IAAoClB,gBAAA;EACpC;IAAAmB,MAAA,EAAAC;EAAA,IAIItB,SAAA;EAHM;IAAAuB,MAAA,EAAAC;EAAA,IAAAF,EAEP;EADS;IAAAG,KAAA,EAAAC;EAAA,IAAAF,EAAqB;EAIjC,MAAAX,KAAA,GAAcC,cAAA,IAAkBM,gBAAA,IAAoBT,QAAA;EAEpD,MAAAgB,SAAA,GAAkBd,KAAA,KAAUG,EAAA;EAE5B,MAAAY,GAAA,GAAYnB,OAAA;EAAA,IAAAoB,EAAA;EAAA,IAAAtB,CAAA,QAAAqB,GAAA,IAAArB,CAAA,QAAAmB,UAAA,IAAAnB,CAAA,QAAAC,SAAA,IAAAD,CAAA,QAAAU,cAAA,IAAAV,CAAA,QAAAW,UAAA,IAAAX,CAAA,QAAAS,EAAA,IAAAT,CAAA,QAAAoB,SAAA,IAAApB,CAAA,QAAAY,cAAA,IAAAZ,CAAA,QAAAK,YAAA,IAAAL,CAAA,QAAAM,KAAA;IAGZ,MAAAiB,UAAA,GAAmBC,IAAA,CAAAjC,QAAA;MAAAkC,QAAA,EAAU;IAAA,C;IAE7B,MAAAC,OAAA,GACErB,YAAA,IAAgBI,EAAA,KAAOC,cAAA,IAAkBC,UAAS,IAC9CtB,cAAA;MAAA8B,UAAA;MAAAQ,IAAA,EAEQ,IAAIjB,cAAA,GAAiB,eAAeA,cAAA,EAAgB,GAAG,WAAWC,UAAA,EAAY,IAAIF,EAAA;IAAI,CAC9F,QACA;IAIgC,MAAAmB,EAAA,GAAAR,SAAA,IAAa,GAAAvB,SAAA,UAAsB;IAAA,IAAAgC,EAAA;IAAA,IAAA7B,CAAA,SAAAC,SAAA,IAAAD,CAAA,SAAA4B,EAAA;MAA1DC,EAAA,IAAC5B,SAAA,EAAAJ,SAAA,EAAsB+B,EAAmC,EAAAE,MAAA,CAAAC,OAC3D;MAAA/B,CAAA,OAAAC,SAAA;MAAAD,CAAA,OAAA4B,EAAA;MAAA5B,CAAA,OAAA6B,EAAA;IAAA;MAAAA,EAAA,GAAA7B,CAAA;IAAA;IAFZsB,EAAA,GAAAE,IAAA,CAACH,GAAA;MAAApB,SAAA,EACY4B,EACD,CAAAG,IAAA,CACF;MAAA,eACKvB,EAAA;MAAAH,KAAA;MAAAmB,QAAA,EAGZb,cAAA,GACCW,UAAA,GACEH,SAAA,GACFI,IAAA,CAAA5B,OAAA;QAAAK,SAAA,EAAoB,GAAAJ,SAAA,MAAkB;QAAAY;MAAA,C,IACpCiB,OAAA,GACFF,IAAA,CAAAhC,IAAA;QAAAS,SAAA,EAAiB,GAAAJ,SAAA,QAAoB;QAAAoC,IAAA,EAAQP,OAAA;QAAAD,QAAA,EAC1CnB,KAAA,IAASiB;MAAA,C,IAGZjB,KAAA,IAASiB;IAAA,C;;;;;;;;;;;;;;;SAhBbD,E;CAoBJ","ignoreList":[]}

package/dist/elements/ShimmerEffect/index.css

@@ -0,0 +1,40 @@
+@layer payload-default {
+  .shimmer-effect {
+    --shine-bg: var(--color-bg-secondary);
+    --shine-fg: var(--color-bg-tertiary);
+
+    position: relative;
+    overflow: hidden;
+    background-color: var(--shine-bg);
+    border-radius: var(--radius-medium);
+  }
+
+  .shimmer-effect__shine {
+    position: absolute;
+    scale: 1.5;
+    width: 100%;
+    height: 100%;
+    transform: translateX(-100%);
+    animation: shimmer 1.75s infinite;
+    opacity: 0.75;
+    background: linear-gradient(
+      100deg,
+      var(--shine-bg) 0%,
+      var(--shine-bg) 15%,
+      var(--shine-fg) 50%,
+      var(--shine-bg) 85%,
+      var(--shine-bg) 100%
+    );
+  }
+
+  .shimmer-effect--transparent {
+    --shine-bg: transparent;
+    --shine-fg: var(--color-border);
+  }
+
+  @keyframes shimmer {
+    100% {
+      transform: translate3d(100%, 0, 0);
+    }
+  }
+}

package/dist/elements/ShimmerEffect/index.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import './index.scss';
+import './index.css';
 export type ShimmerEffectProps = {
     readonly animationDelay?: string;
     readonly className?: string;

package/dist/elements/ShimmerEffect/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/ShimmerEffect/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,cAAc,CAAA;AAErB,MAAM,MAAM,kBAAkB,GAAG;IAC/B,QAAQ,CAAC,cAAc,CAAC,EAAE,MAAM,CAAA;IAChC,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,mBAAmB,CAAC,EAAE,OAAO,CAAA;IACtC,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACjC;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CACjC,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAA;AAIxC,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CA6BtD,CAAA;AAED,MAAM,MAAM,sBAAsB,GAAG;IACnC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACxB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC9B,oBAAoB,CAAC,EAAE,MAAM,CAAA;IAC7B,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CACxB,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CA6B9D,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/ShimmerEffect/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,aAAa,CAAA;AAEpB,MAAM,MAAM,kBAAkB,GAAG;IAC/B,QAAQ,CAAC,cAAc,CAAC,EAAE,MAAM,CAAA;IAChC,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,mBAAmB,CAAC,EAAE,OAAO,CAAA;IACtC,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACjC;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CACjC,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAA;AAIxC,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CA6BtD,CAAA;AAED,MAAM,MAAM,sBAAsB,GAAG;IACnC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACxB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC9B,oBAAoB,CAAC,EAAE,MAAM,CAAA;IAC7B,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CACxB,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CA6B9D,CAAA"}

package/dist/elements/ShimmerEffect/index.js

@@ -4,7 +4,7 @@ import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 import { useDelay } from '../../hooks/useDelay.js';
-import './index.scss';
+import './index.css';
 const baseClass = 'shimmer-effect';
 export const ShimmerEffect = ({
   animationDelay = '0ms',

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","React","useDelay","baseClass","ShimmerEffect","animationDelay","className","disableInlineStyles","height","transparent","width","rest","_jsx","filter","Boolean","join","style","StaggeredShimmers","t0","$","count","renderDelay","t1","shimmerDelay","t2","shimmerItemClassName","undefined","shimmerDelayToPass","hasDelayed","t3","Array","t4","children","map","_","i"],"sources":["../../../src/elements/ShimmerEffect/index.tsx"],"sourcesContent":["'use client'\nimport * as React from 'react'\n\nimport { useDelay } from '../../hooks/useDelay.js'\nimport './index.scss'\n\nexport type ShimmerEffectProps = {\n  readonly animationDelay?: string\n  readonly className?: string\n  readonly disableInlineStyles?: boolean\n  readonly height?: number | string\n  /**\n   * When true, adjusts the gradient to allow the natural background of the element to shine through.\n   */\n  transparent?: boolean\n  readonly width?: number | string\n} & React.HTMLAttributes<HTMLDivElement>\n\nconst baseClass = 'shimmer-effect'\n\nexport const ShimmerEffect: React.FC<ShimmerEffectProps> = ({\n  animationDelay = '0ms',\n  className,\n  disableInlineStyles = false,\n  height = '60px',\n  transparent,\n  width = '100%',\n  ...rest\n}) => {\n  return (\n    <div\n      {...rest}\n      className={[baseClass, transparent && `${baseClass}--transparent`, className]\n        .filter(Boolean)\n        .join(' ')}\n      style={{\n        ...(rest?.style || {}),\n        height: !disableInlineStyles && (typeof height === 'number' ? `${height}px` : height),\n        width: !disableInlineStyles && (typeof width === 'number' ? `${width}px` : width),\n      }}\n    >\n      <div\n        className=\"shimmer-effect__shine\"\n        style={{\n          animationDelay,\n        }}\n      />\n    </div>\n  )\n}\n\nexport type StaggeredShimmersProps = {\n  className?: string\n  count: number\n  height?: number | string\n  renderDelay?: number\n  shimmerDelay?: number | string\n  shimmerItemClassName?: string\n  width?: number | string\n}\n\nexport const StaggeredShimmers: React.FC<StaggeredShimmersProps> = ({\n  className,\n  count,\n  height,\n  renderDelay = 500,\n  shimmerDelay = 25,\n  shimmerItemClassName,\n  width,\n}) => {\n  const shimmerDelayToPass = typeof shimmerDelay === 'number' ? `${shimmerDelay}ms` : shimmerDelay\n  const [hasDelayed] = useDelay(renderDelay, true)\n\n  if (!hasDelayed) {\n    return null\n  }\n\n  return (\n    <div className={className}>\n      {[...Array(count)].map((_, i) => (\n        <div className={shimmerItemClassName} key={i}>\n          <ShimmerEffect\n            animationDelay={`calc(${i} * ${shimmerDelayToPass})`}\n            height={height}\n            width={width}\n          />\n        </div>\n      ))}\n    </div>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,YAAYC,KAAA,MAAW;AAEvB,SAASC,QAAQ,QAAQ;AACzB,OAAO;AAcP,MAAMC,SAAA,GAAY;AAElB,OAAO,MAAMC,aAAA,GAA8CA,CAAC;EAC1DC,cAAA,GAAiB,KAAK;EACtBC,SAAS;EACTC,mBAAA,GAAsB,KAAK;EAC3BC,MAAA,GAAS,MAAM;EACfC,WAAW;EACXC,KAAA,GAAQ,MAAM;EACd,GAAGC;AAAA,CACJ;EACC,oBACEC,IAAA,CAAC;IACE,GAAGD,IAAI;IACRL,SAAA,EAAW,CAACH,SAAA,EAAWM,WAAA,IAAe,GAAGN,SAAA,eAAwB,EAAEG,SAAA,CAAU,CAC1EO,MAAM,CAACC,OAAA,EACPC,IAAI,CAAC;IACRC,KAAA,EAAO;MACL,IAAIL,IAAA,EAAMK,KAAA,IAAS,CAAC,CAAC;MACrBR,MAAA,EAAQ,CAACD,mBAAA,KAAwB,OAAOC,MAAA,KAAW,WAAW,GAAGA,MAAA,IAAU,GAAGA,MAAK;MACnFE,KAAA,EAAO,CAACH,mBAAA,KAAwB,OAAOG,KAAA,KAAU,WAAW,GAAGA,KAAA,IAAS,GAAGA,KAAI;IACjF;cAEA,aAAAE,IAAA,CAAC;MACCN,SAAA,EAAU;MACVU,KAAA,EAAO;QACLX;MACF;;;AAIR;AAYA,OAAO,MAAMY,iBAAA,GAAsDC,EAAA;EAAA,MAAAC,CAAA,GAAAnB,EAAA;EAAC;IAAAM,SAAA;IAAAc,KAAA;IAAAZ,MAAA;IAAAa,WAAA,EAAAC,EAAA;IAAAC,YAAA,EAAAC,EAAA;IAAAC,oBAAA;IAAAf;EAAA,IAAAQ,EAQnE;EAJC,MAAAG,WAAA,GAAAC,EAAiB,KAAAI,SAAA,SAAjBJ,EAAiB;EACjB,MAAAC,YAAA,GAAAC,EAAiB,KAAAE,SAAA,QAAjBF,EAAiB;EAIjB,MAAAG,kBAAA,GAA2B,OAAOJ,YAAA,KAAiB,WAAW,GAAGA,YAAA,IAAgB,GAAGA,YAAA;EACpF,OAAAK,UAAA,IAAqB1B,QAAA,CAASmB,WAAA,MAAa;EAAA,KAEtCO,UAAA;IAAA;EAAA;EAAA,IAAAC,EAAA;EAAA,IAAAV,CAAA,QAAAC,KAAA;IAMAS,EAAA,OAAIC,KAAA,CAAMV,KAAA;IAAOD,CAAA,MAAAC,KAAA;IAAAD,CAAA,MAAAU,EAAA;EAAA;IAAAA,EAAA,GAAAV,CAAA;EAAA;EAAA,IAAAY,EAAA;EAAA,IAAAZ,CAAA,QAAAb,SAAA,IAAAa,CAAA,QAAAX,MAAA,IAAAW,CAAA,QAAAQ,kBAAA,IAAAR,CAAA,QAAAM,oBAAA,IAAAN,CAAA,QAAAU,EAAA,IAAAV,CAAA,QAAAT,KAAA;IADpBqB,EAAA,GAAAnB,IAAA,CAAC;MAAAN,SAAA;MAAA0B,QAAA,EACEH,EAAiB,CAAAI,GAAA,EAAAC,CAAA,EAAAC,CAAA,KAChBvB,IAAA,CAAC;QAAAN,SAAA,EAAemB,oBAAA;QAAAO,QAAA,EACdpB,IAAA,CAAAR,aAAA;UAAAC,cAAA,EACkB,QAAQ8B,CAAA,MAAOR,kBAAA,GAAqB;UAAAnB,MAAA;UAAAE;QAAA,C;SAFbyB,CAAA;IAAA,C;;;;;;;;;;;SAF/CJ,E;CAYJ","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","React","useDelay","baseClass","ShimmerEffect","animationDelay","className","disableInlineStyles","height","transparent","width","rest","_jsx","filter","Boolean","join","style","StaggeredShimmers","t0","$","count","renderDelay","t1","shimmerDelay","t2","shimmerItemClassName","undefined","shimmerDelayToPass","hasDelayed","t3","Array","t4","children","map","_","i"],"sources":["../../../src/elements/ShimmerEffect/index.tsx"],"sourcesContent":["'use client'\nimport * as React from 'react'\n\nimport { useDelay } from '../../hooks/useDelay.js'\nimport './index.css'\n\nexport type ShimmerEffectProps = {\n  readonly animationDelay?: string\n  readonly className?: string\n  readonly disableInlineStyles?: boolean\n  readonly height?: number | string\n  /**\n   * When true, adjusts the gradient to allow the natural background of the element to shine through.\n   */\n  transparent?: boolean\n  readonly width?: number | string\n} & React.HTMLAttributes<HTMLDivElement>\n\nconst baseClass = 'shimmer-effect'\n\nexport const ShimmerEffect: React.FC<ShimmerEffectProps> = ({\n  animationDelay = '0ms',\n  className,\n  disableInlineStyles = false,\n  height = '60px',\n  transparent,\n  width = '100%',\n  ...rest\n}) => {\n  return (\n    <div\n      {...rest}\n      className={[baseClass, transparent && `${baseClass}--transparent`, className]\n        .filter(Boolean)\n        .join(' ')}\n      style={{\n        ...(rest?.style || {}),\n        height: !disableInlineStyles && (typeof height === 'number' ? `${height}px` : height),\n        width: !disableInlineStyles && (typeof width === 'number' ? `${width}px` : width),\n      }}\n    >\n      <div\n        className=\"shimmer-effect__shine\"\n        style={{\n          animationDelay,\n        }}\n      />\n    </div>\n  )\n}\n\nexport type StaggeredShimmersProps = {\n  className?: string\n  count: number\n  height?: number | string\n  renderDelay?: number\n  shimmerDelay?: number | string\n  shimmerItemClassName?: string\n  width?: number | string\n}\n\nexport const StaggeredShimmers: React.FC<StaggeredShimmersProps> = ({\n  className,\n  count,\n  height,\n  renderDelay = 500,\n  shimmerDelay = 25,\n  shimmerItemClassName,\n  width,\n}) => {\n  const shimmerDelayToPass = typeof shimmerDelay === 'number' ? `${shimmerDelay}ms` : shimmerDelay\n  const [hasDelayed] = useDelay(renderDelay, true)\n\n  if (!hasDelayed) {\n    return null\n  }\n\n  return (\n    <div className={className}>\n      {[...Array(count)].map((_, i) => (\n        <div className={shimmerItemClassName} key={i}>\n          <ShimmerEffect\n            animationDelay={`calc(${i} * ${shimmerDelayToPass})`}\n            height={height}\n            width={width}\n          />\n        </div>\n      ))}\n    </div>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,YAAYC,KAAA,MAAW;AAEvB,SAASC,QAAQ,QAAQ;AACzB,OAAO;AAcP,MAAMC,SAAA,GAAY;AAElB,OAAO,MAAMC,aAAA,GAA8CA,CAAC;EAC1DC,cAAA,GAAiB,KAAK;EACtBC,SAAS;EACTC,mBAAA,GAAsB,KAAK;EAC3BC,MAAA,GAAS,MAAM;EACfC,WAAW;EACXC,KAAA,GAAQ,MAAM;EACd,GAAGC;AAAA,CACJ;EACC,oBACEC,IAAA,CAAC;IACE,GAAGD,IAAI;IACRL,SAAA,EAAW,CAACH,SAAA,EAAWM,WAAA,IAAe,GAAGN,SAAA,eAAwB,EAAEG,SAAA,CAAU,CAC1EO,MAAM,CAACC,OAAA,EACPC,IAAI,CAAC;IACRC,KAAA,EAAO;MACL,IAAIL,IAAA,EAAMK,KAAA,IAAS,CAAC,CAAC;MACrBR,MAAA,EAAQ,CAACD,mBAAA,KAAwB,OAAOC,MAAA,KAAW,WAAW,GAAGA,MAAA,IAAU,GAAGA,MAAK;MACnFE,KAAA,EAAO,CAACH,mBAAA,KAAwB,OAAOG,KAAA,KAAU,WAAW,GAAGA,KAAA,IAAS,GAAGA,KAAI;IACjF;cAEA,aAAAE,IAAA,CAAC;MACCN,SAAA,EAAU;MACVU,KAAA,EAAO;QACLX;MACF;;;AAIR;AAYA,OAAO,MAAMY,iBAAA,GAAsDC,EAAA;EAAA,MAAAC,CAAA,GAAAnB,EAAA;EAAC;IAAAM,SAAA;IAAAc,KAAA;IAAAZ,MAAA;IAAAa,WAAA,EAAAC,EAAA;IAAAC,YAAA,EAAAC,EAAA;IAAAC,oBAAA;IAAAf;EAAA,IAAAQ,EAQnE;EAJC,MAAAG,WAAA,GAAAC,EAAiB,KAAAI,SAAA,SAAjBJ,EAAiB;EACjB,MAAAC,YAAA,GAAAC,EAAiB,KAAAE,SAAA,QAAjBF,EAAiB;EAIjB,MAAAG,kBAAA,GAA2B,OAAOJ,YAAA,KAAiB,WAAW,GAAGA,YAAA,IAAgB,GAAGA,YAAA;EACpF,OAAAK,UAAA,IAAqB1B,QAAA,CAASmB,WAAA,MAAa;EAAA,KAEtCO,UAAA;IAAA;EAAA;EAAA,IAAAC,EAAA;EAAA,IAAAV,CAAA,QAAAC,KAAA;IAMAS,EAAA,OAAIC,KAAA,CAAMV,KAAA;IAAOD,CAAA,MAAAC,KAAA;IAAAD,CAAA,MAAAU,EAAA;EAAA;IAAAA,EAAA,GAAAV,CAAA;EAAA;EAAA,IAAAY,EAAA;EAAA,IAAAZ,CAAA,QAAAb,SAAA,IAAAa,CAAA,QAAAX,MAAA,IAAAW,CAAA,QAAAQ,kBAAA,IAAAR,CAAA,QAAAM,oBAAA,IAAAN,CAAA,QAAAU,EAAA,IAAAV,CAAA,QAAAT,KAAA;IADpBqB,EAAA,GAAAnB,IAAA,CAAC;MAAAN,SAAA;MAAA0B,QAAA,EACEH,EAAiB,CAAAI,GAAA,EAAAC,CAAA,EAAAC,CAAA,KAChBvB,IAAA,CAAC;QAAAN,SAAA,EAAemB,oBAAA;QAAAO,QAAA,EACdpB,IAAA,CAAAR,aAAA;UAAAC,cAAA,EACkB,QAAQ8B,CAAA,MAAOR,kBAAA,GAAqB;UAAAnB,MAAA;UAAAE;QAAA,C;SAFbyB,CAAA;IAAA,C;;;;;;;;;;;SAF/CJ,E;CAYJ","ignoreList":[]}