@payloadcms/ui 3.43.0-internal.693bd81 → 3.43.0

package/dist/elements/Popup/PopupTrigger/index.d.ts

@@ -8,7 +8,7 @@ export type PopupTriggerProps = {
     disabled?: boolean;
     noBackground?: boolean;
     setActive: (active: boolean) => void;
-    size?: 'large' | 'medium' | 'small';
+    size?: 'large' | 'medium' | 'small' | 'xsmall';
 };
 export declare const PopupTrigger: React.FC<PopupTriggerProps>;
 //# sourceMappingURL=index.d.ts.map

package/dist/elements/Popup/PopupTrigger/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/Popup/PopupTrigger/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,cAAc,CAAA;AAIrB,MAAM,MAAM,iBAAiB,GAAG;IAC9B,MAAM,EAAE,OAAO,CAAA;IACf,MAAM,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,UAAU,EAAE,QAAQ,GAAG,SAAS,GAAG,MAAM,CAAA;IACzC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,SAAS,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAA;IACpC,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;CACpC,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAwDpD,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/Popup/PopupTrigger/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,cAAc,CAAA;AAIrB,MAAM,MAAM,iBAAiB,GAAG;IAC9B,MAAM,EAAE,OAAO,CAAA;IACf,MAAM,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,UAAU,EAAE,QAAQ,GAAG,SAAS,GAAG,MAAM,CAAA;IACzC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,SAAS,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAA;IACpC,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAA;CAC/C,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAwDpD,CAAA"}

package/dist/elements/Popup/PopupTrigger/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","React","baseClass","PopupTrigger","props","$","active","button","buttonType","className","disabled","noBackground","setActive","size","t0","t1","t2","t3","t4","filter","Boolean","classes","join","t5","handleClick","t6","e","key","t7","_jsx","onClick","onKeyDown","role","tabIndex","children","e_0","type"],"sources":["../../../../src/elements/Popup/PopupTrigger/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport './index.scss'\n\nconst baseClass = 'popup-button'\n\nexport type PopupTriggerProps = {\n  active: boolean\n  button: React.ReactNode\n  buttonType: 'custom' | 'default' | 'none'\n  className?: string\n  disabled?: boolean\n  noBackground?: boolean\n  setActive: (active: boolean) => void\n  size?: 'large' | 'medium' | 'small'\n}\n\nexport const PopupTrigger: React.FC<PopupTriggerProps> = (props) => {\n  const { active, button, buttonType, className, disabled, noBackground, setActive, size } = props\n\n  const classes = [\n    baseClass,\n    className,\n    `${baseClass}--${buttonType}`,\n    !noBackground && `${baseClass}--background`,\n    size && `${baseClass}--size-${size}`,\n    disabled && `${baseClass}--disabled`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  const handleClick = React.useCallback(() => {\n    setActive(!active)\n  }, [active, setActive])\n\n  if (buttonType === 'none') {\n    return null\n  }\n\n  if (buttonType === 'custom') {\n    return (\n      <div\n        className={classes}\n        onClick={handleClick}\n        onKeyDown={(e) => {\n          if (e.key === 'Enter') {\n            handleClick()\n          }\n        }}\n        role=\"button\"\n        tabIndex={0}\n      >\n        {button}\n      </div>\n    )\n  }\n\n  return (\n    <button\n      className={classes}\n      disabled={disabled}\n      onClick={handleClick}\n      onKeyDown={(e) => {\n        if (e.key === 'Enter') {\n          handleClick()\n        }\n      }}\n      tabIndex={0}\n      type=\"button\"\n    >\n      {button}\n    </button>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","React","baseClass","PopupTrigger","props","$","active","button","buttonType","className","disabled","noBackground","setActive","size","t0","t1","t2","t3","t4","filter","Boolean","classes","join","t5","handleClick","t6","e","key","t7","_jsx","onClick","onKeyDown","role","tabIndex","children","e_0","type"],"sources":["../../../../src/elements/Popup/PopupTrigger/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport './index.scss'\n\nconst baseClass = 'popup-button'\n\nexport type PopupTriggerProps = {\n  active: boolean\n  button: React.ReactNode\n  buttonType: 'custom' | 'default' | 'none'\n  className?: string\n  disabled?: boolean\n  noBackground?: boolean\n  setActive: (active: boolean) => void\n  size?: 'large' | 'medium' | 'small' | 'xsmall'\n}\n\nexport const PopupTrigger: React.FC<PopupTriggerProps> = (props) => {\n  const { active, button, buttonType, className, disabled, noBackground, setActive, size } = props\n\n  const classes = [\n    baseClass,\n    className,\n    `${baseClass}--${buttonType}`,\n    !noBackground && `${baseClass}--background`,\n    size && `${baseClass}--size-${size}`,\n    disabled && `${baseClass}--disabled`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  const handleClick = React.useCallback(() => {\n    setActive(!active)\n  }, [active, setActive])\n\n  if (buttonType === 'none') {\n    return null\n  }\n\n  if (buttonType === 'custom') {\n    return (\n      <div\n        className={classes}\n        onClick={handleClick}\n        onKeyDown={(e) => {\n          if (e.key === 'Enter') {\n            handleClick()\n          }\n        }}\n        role=\"button\"\n        tabIndex={0}\n      >\n        {button}\n      </div>\n    )\n  }\n\n  return (\n    <button\n      className={classes}\n      disabled={disabled}\n      onClick={handleClick}\n      onKeyDown={(e) => {\n        if (e.key === 'Enter') {\n          handleClick()\n        }\n      }}\n      tabIndex={0}\n      type=\"button\"\n    >\n      {button}\n    </button>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,OAAOC,KAAA,MAAW;AAElB,OAAO;AAEP,MAAMC,SAAA,GAAY;AAalB,OAAO,MAAMC,YAAA,GAA4CC,KAAA;EAAA,MAAAC,CAAA,GAAAL,EAAA;EACvD;IAAAM,MAAA;IAAAC,MAAA;IAAAC,UAAA;IAAAC,SAAA;IAAAC,QAAA;IAAAC,YAAA;IAAAC,SAAA;IAAAC;EAAA,IAA2FT,KAAA;EAKzF,MAAAU,EAAA,MAAAZ,SAAA,KAAiBM,UAAA,EAAY;EAC7B,MAAAO,EAAA,IAACJ,YAAA,IAAgB,GAAAT,SAAA,cAA0B;EAC3C,MAAAc,EAAA,GAAAH,IAAA,IAAQ,GAAAX,SAAA,UAAsBW,IAAA,EAAM;EACpC,MAAAI,EAAA,GAAAP,QAAA,IAAY,GAAAR,SAAA,YAAwB;EAAA,IAAAgB,EAAA;EAAA,IAAAb,CAAA,QAAAI,SAAA,IAAAJ,CAAA,QAAAS,EAAA,IAAAT,CAAA,QAAAU,EAAA,IAAAV,CAAA,QAAAW,EAAA,IAAAX,CAAA,QAAAY,EAAA;IANtBC,EAAA,IAAAhB,SAAA,EAEdO,SAAA,EACAK,EAA6B,EAC7BC,EAA2C,EAC3CC,EAAoC,EACpCC,EAAoC,EAAAE,MAAA,CAAAC,OAE5B;IAAAf,CAAA,MAAAI,SAAA;IAAAJ,CAAA,MAAAS,EAAA;IAAAT,CAAA,MAAAU,EAAA;IAAAV,CAAA,MAAAW,EAAA;IAAAX,CAAA,MAAAY,EAAA;IAAAZ,CAAA,MAAAa,EAAA;EAAA;IAAAA,EAAA,GAAAb,CAAA;EAAA;EARV,MAAAgB,OAAA,GAAgBH,EAQN,CAAAI,IAAA,CACF;EAAA,IAAAC,EAAA;EAAA,IAAAlB,CAAA,QAAAC,MAAA,IAAAD,CAAA,QAAAO,SAAA;IAE8BW,EAAA,GAAAA,CAAA;MACpCX,SAAA,EAAWN,MAAA;IAAA;IACbD,CAAA,MAAAC,MAAA;IAAAD,CAAA,MAAAO,SAAA;IAAAP,CAAA,MAAAkB,EAAA;EAAA;IAAAA,EAAA,GAAAlB,CAAA;EAAA;EAFA,MAAAmB,WAAA,GAAoBD,EAEE;EAAA,IAElBf,UAAA,KAAe;IAAA;EAAA;EAAA,IAIfA,UAAA,KAAe;IAAA,IAAAiB,EAAA;IAAA,IAAApB,CAAA,QAAAmB,WAAA;MAKFC,EAAA,GAAAC,CAAA;QAAA,IACLA,CAAA,CAAAC,GAAA,KAAU;UACZH,WAAA;QAAA;MAAA;MAEJnB,CAAA,MAAAmB,WAAA;MAAAnB,CAAA,OAAAoB,EAAA;IAAA;MAAAA,EAAA,GAAApB,CAAA;IAAA;IAAA,IAAAuB,EAAA;IAAA,IAAAvB,CAAA,SAAAE,MAAA,IAAAF,CAAA,SAAAgB,OAAA,IAAAhB,CAAA,SAAAmB,WAAA,IAAAnB,CAAA,SAAAoB,EAAA;MAPFG,EAAA,GAAAC,IAAA,CAAC;QAAApB,SAAA,EACYY,OAAA;QAAAS,OAAA,EACFN,WAAA;QAAAO,SAAA,EACEN,EAIX;QAAAO,IAAA,EACK;QAAAC,QAAA;QAAAC,QAAA,EAGJ3B;MAAA,C;;;;;;;;;WAXHqB,E;;;;IAqBWH,EAAA,GAAAU,GAAA;MAAA,IACLT,GAAA,CAAAC,GAAA,KAAU;QACZH,WAAA;MAAA;IAAA;IAEJnB,CAAA,OAAAmB,WAAA;IAAAnB,CAAA,OAAAoB,EAAA;EAAA;IAAAA,EAAA,GAAApB,CAAA;EAAA;EAAA,IAAAuB,EAAA;EAAA,IAAAvB,CAAA,SAAAE,MAAA,IAAAF,CAAA,SAAAgB,OAAA,IAAAhB,CAAA,SAAAK,QAAA,IAAAL,CAAA,SAAAmB,WAAA,IAAAnB,CAAA,SAAAoB,EAAA;IARFG,EAAA,GAAAC,IAAA,CAAC;MAAApB,SAAA,EACYY,OAAA;MAAAX,QAAA;MAAAoB,OAAA,EAEFN,WAAA;MAAAO,SAAA,EACEN,EAIX;MAAAQ,QAAA;MAAAG,IAAA,EAEK;MAAAF,QAAA,EAEJ3B;IAAA,C;;;;;;;;;;SAZHqB,E;CAeJ","ignoreList":[]}

package/dist/elements/Popup/PopupTrigger/index.scss

@@ -16,6 +16,10 @@
       background: transparent;
     }
 
+    &--size-xsmall {
+      padding: base(0.1);
+    }
+
     &--size-small {
       padding: base(0.2);
     }

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

@@ -7,7 +7,7 @@ export type PopupProps = {
     boundingRef?: React.RefObject<HTMLElement>;
     button?: React.ReactNode;
     buttonClassName?: string;
-    buttonSize?: 'large' | 'medium' | 'small';
+    buttonSize?: 'large' | 'medium' | 'small' | 'xsmall';
     buttonType?: 'custom' | 'default' | 'none';
     caret?: boolean;
     children?: React.ReactNode;

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Popup/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAE1C,OAAO,KAAK,SAAS,MAAM,4BAA4B,CAAA;AAGvD,OAAO,KAAmD,MAAM,OAAO,CAAA;AAIvE,OAAO,cAAc,CAAA;AAIrB,MAAM,MAAM,UAAU,GAAG;IACvB,eAAe,CAAC,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAA;IAClD,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAA;IAC1C,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACxB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,UAAU,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;IACzC,UAAU,CAAC,EAAE,QAAQ,GAAG,SAAS,GAAG,MAAM,CAAA;IAC1C,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,eAAe,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAA;IAC7C,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAA;IAC1B,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAA;IACxC,MAAM,CAAC,EAAE,CAAC,GAAG,KAAA,KAAK,KAAK,CAAC,SAAS,CAAA;IACjC,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,IAAI,CAAC,EAAE,aAAa,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;IACnD,aAAa,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAA;CACjC,CAAA;AAED,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CAuMtC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Popup/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAE1C,OAAO,KAAK,SAAS,MAAM,4BAA4B,CAAA;AAGvD,OAAO,KAAmD,MAAM,OAAO,CAAA;AAIvE,OAAO,cAAc,CAAA;AAIrB,MAAM,MAAM,UAAU,GAAG;IACvB,eAAe,CAAC,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAA;IAClD,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAA;IAC1C,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACxB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,UAAU,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,CAAA;IACpD,UAAU,CAAC,EAAE,QAAQ,GAAG,SAAS,GAAG,MAAM,CAAA;IAC1C,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,eAAe,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAA;IAC7C,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAA;IAC1B,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAA;IACxC,MAAM,CAAC,EAAE,CAAC,GAAG,KAAA,KAAK,KAAK,CAAC,SAAS,CAAA;IACjC,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,IAAI,CAAC,EAAE,aAAa,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;IACnD,aAAa,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAA;CACjC,CAAA;AAED,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CAuMtC,CAAA"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["PopupList","useWindowInfo","React","useCallback","useEffect","useRef","useState","useIntersect","PopupTrigger","baseClass","Popup","props","id","boundingRef","button","buttonClassName","buttonSize","buttonType","caret","children","className","disabled","forceOpen","horizontalAlign","horizontalAlignFromProps","initActive","noBackground","onToggleClose","onToggleOpen","render","showOnHover","showScrollbar","size","verticalAlign","verticalAlignFromProps","height","windowHeight","width","windowWidth","intersectionRef","intersectionEntry","root","current","rootMargin","threshold","contentRef","triggerRef","active","setActive_Internal","setVerticalAlign","setHorizontalAlign","setActive","setPosition","horizontal","vertical","bounds","getBoundingClientRect","bottom","contentBottomPos","left","contentLeftPos","right","contentRightPos","top","contentTopPos","boundingTopPos","boundingRightPos","document","documentElement","clientWidth","boundingBottomPos","clientHeight","boundingLeftPos","handleClickOutside","e","contains","target","addEventListener","removeEventListener","classes","filter","Boolean","join","_jsxs","_jsx","ref","onMouseEnter","onMouseLeave","role","tabIndex","close"],"sources":["../../../src/elements/Popup/index.tsx"],"sourcesContent":["'use client'\nimport type { CSSProperties } from 'react'\n\nexport * as PopupList from './PopupButtonList/index.js'\n\nimport { useWindowInfo } from '@faceless-ui/window-info'\nimport React, { useCallback, useEffect, useRef, useState } from 'react'\n\nimport { useIntersect } from '../../hooks/useIntersect.js'\nimport { PopupTrigger } from './PopupTrigger/index.js'\nimport './index.scss'\n\nconst baseClass = 'popup'\n\nexport type PopupProps = {\n  backgroundColor?: CSSProperties['backgroundColor']\n  boundingRef?: React.RefObject<HTMLElement>\n  button?: React.ReactNode\n  buttonClassName?: string\n  buttonSize?: 'large' | 'medium' | 'small'\n  buttonType?: 'custom' | 'default' | 'none'\n  caret?: boolean\n  children?: React.ReactNode\n  className?: string\n  disabled?: boolean\n  forceOpen?: boolean\n  horizontalAlign?: 'center' | 'left' | 'right'\n  id?: string\n  initActive?: boolean\n  noBackground?: boolean\n  onToggleClose?: () => void\n  onToggleOpen?: (active: boolean) => void\n  render?: (any) => React.ReactNode\n  showOnHover?: boolean\n  showScrollbar?: boolean\n  size?: 'fit-content' | 'large' | 'medium' | 'small'\n  verticalAlign?: 'bottom' | 'top'\n}\n\nexport const Popup: React.FC<PopupProps> = (props) => {\n  const {\n    id,\n    boundingRef,\n    button,\n    buttonClassName,\n    buttonSize,\n    buttonType = 'default',\n    caret = true,\n    children,\n    className,\n    disabled,\n    forceOpen,\n    horizontalAlign: horizontalAlignFromProps = 'left',\n    initActive = false,\n    noBackground,\n    onToggleClose,\n    onToggleOpen,\n    render,\n    showOnHover = false,\n    showScrollbar = false,\n    size = 'medium',\n    verticalAlign: verticalAlignFromProps = 'top',\n  } = props\n  const { height: windowHeight, width: windowWidth } = useWindowInfo()\n\n  const [intersectionRef, intersectionEntry] = useIntersect({\n    root: boundingRef?.current || null,\n    rootMargin: '-100px 0px 0px 0px',\n    threshold: 1,\n  })\n\n  const contentRef = useRef(null)\n  const triggerRef = useRef(null)\n  const [active, setActive_Internal] = useState(initActive)\n  const [verticalAlign, setVerticalAlign] = useState(verticalAlignFromProps)\n  const [horizontalAlign, setHorizontalAlign] = useState(horizontalAlignFromProps)\n\n  const setActive = React.useCallback(\n    (active: boolean) => {\n      if (active && typeof onToggleOpen === 'function') {\n        onToggleOpen(true)\n      }\n      if (!active && typeof onToggleClose === 'function') {\n        onToggleClose()\n      }\n      setActive_Internal(active)\n    },\n    [onToggleClose, onToggleOpen],\n  )\n\n  const setPosition = useCallback(\n    ({ horizontal = false, vertical = false }) => {\n      if (contentRef.current) {\n        const bounds = contentRef.current.getBoundingClientRect()\n\n        const {\n          bottom: contentBottomPos,\n          left: contentLeftPos,\n          right: contentRightPos,\n          top: contentTopPos,\n        } = bounds\n\n        let boundingTopPos = 100\n        let boundingRightPos = document.documentElement.clientWidth\n        let boundingBottomPos = document.documentElement.clientHeight\n        let boundingLeftPos = 0\n\n        if (boundingRef?.current) {\n          ;({\n            bottom: boundingBottomPos,\n            left: boundingLeftPos,\n            right: boundingRightPos,\n            top: boundingTopPos,\n          } = boundingRef.current.getBoundingClientRect())\n        }\n\n        if (horizontal) {\n          if (contentRightPos > boundingRightPos && contentLeftPos > boundingLeftPos) {\n            setHorizontalAlign('right')\n          } else if (contentLeftPos < boundingLeftPos && contentRightPos < boundingRightPos) {\n            setHorizontalAlign('left')\n          }\n        }\n\n        if (vertical) {\n          if (contentTopPos < boundingTopPos && contentBottomPos < boundingBottomPos) {\n            setVerticalAlign('bottom')\n          } else if (contentBottomPos > boundingBottomPos && contentTopPos > boundingTopPos) {\n            setVerticalAlign('top')\n          }\n        }\n      }\n    },\n    [boundingRef],\n  )\n\n  const handleClickOutside = useCallback(\n    (e) => {\n      if (contentRef.current.contains(e.target) || triggerRef.current.contains(e.target)) {\n        return\n      }\n\n      setActive(false)\n    },\n    [contentRef, setActive],\n  )\n\n  useEffect(() => {\n    setPosition({ horizontal: true })\n  }, [intersectionEntry, setPosition, windowWidth])\n\n  useEffect(() => {\n    setPosition({ vertical: true })\n  }, [intersectionEntry, setPosition, windowHeight])\n\n  useEffect(() => {\n    if (active) {\n      document.addEventListener('mousedown', handleClickOutside)\n    } else {\n      document.removeEventListener('mousedown', handleClickOutside)\n    }\n\n    return () => {\n      document.removeEventListener('mousedown', handleClickOutside)\n    }\n  }, [active, handleClickOutside, onToggleOpen])\n\n  useEffect(() => {\n    setActive(forceOpen)\n  }, [forceOpen, setActive])\n\n  const classes = [\n    baseClass,\n    className,\n    `${baseClass}--size-${size}`,\n    buttonSize && `${baseClass}--button-size-${buttonSize}`,\n    `${baseClass}--v-align-${verticalAlign}`,\n    `${baseClass}--h-align-${horizontalAlign}`,\n    active && `${baseClass}--active`,\n    showScrollbar && `${baseClass}--show-scrollbar`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  return (\n    <div className={classes} id={id}>\n      <div className={`${baseClass}__trigger-wrap`} ref={triggerRef}>\n        {showOnHover ? (\n          <div\n            className={`${baseClass}__on-hover-watch`}\n            onMouseEnter={() => setActive(true)}\n            onMouseLeave={() => setActive(false)}\n            role=\"button\"\n            tabIndex={0}\n          >\n            <PopupTrigger\n              {...{\n                active,\n                button,\n                buttonType,\n                className: buttonClassName,\n                disabled,\n                noBackground,\n                setActive,\n                size: buttonSize,\n              }}\n            />\n          </div>\n        ) : (\n          <PopupTrigger\n            {...{\n              active,\n              button,\n              buttonType,\n              className: buttonClassName,\n              disabled,\n              noBackground,\n              setActive,\n              size: buttonSize,\n            }}\n          />\n        )}\n      </div>\n\n      <div className={`${baseClass}__content`} ref={contentRef}>\n        <div className={`${baseClass}__hide-scrollbar`} ref={intersectionRef}>\n          <div className={`${baseClass}__scroll-container`}>\n            <div className={`${baseClass}__scroll-content`}>\n              {render && render({ close: () => setActive(false) })}\n              {children}\n            </div>\n          </div>\n        </div>\n\n        {caret && <div className={`${baseClass}__caret`} />}\n      </div>\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["PopupList","useWindowInfo","React","useCallback","useEffect","useRef","useState","useIntersect","PopupTrigger","baseClass","Popup","props","id","boundingRef","button","buttonClassName","buttonSize","buttonType","caret","children","className","disabled","forceOpen","horizontalAlign","horizontalAlignFromProps","initActive","noBackground","onToggleClose","onToggleOpen","render","showOnHover","showScrollbar","size","verticalAlign","verticalAlignFromProps","height","windowHeight","width","windowWidth","intersectionRef","intersectionEntry","root","current","rootMargin","threshold","contentRef","triggerRef","active","setActive_Internal","setVerticalAlign","setHorizontalAlign","setActive","setPosition","horizontal","vertical","bounds","getBoundingClientRect","bottom","contentBottomPos","left","contentLeftPos","right","contentRightPos","top","contentTopPos","boundingTopPos","boundingRightPos","document","documentElement","clientWidth","boundingBottomPos","clientHeight","boundingLeftPos","handleClickOutside","e","contains","target","addEventListener","removeEventListener","classes","filter","Boolean","join","_jsxs","_jsx","ref","onMouseEnter","onMouseLeave","role","tabIndex","close"],"sources":["../../../src/elements/Popup/index.tsx"],"sourcesContent":["'use client'\nimport type { CSSProperties } from 'react'\n\nexport * as PopupList from './PopupButtonList/index.js'\n\nimport { useWindowInfo } from '@faceless-ui/window-info'\nimport React, { useCallback, useEffect, useRef, useState } from 'react'\n\nimport { useIntersect } from '../../hooks/useIntersect.js'\nimport { PopupTrigger } from './PopupTrigger/index.js'\nimport './index.scss'\n\nconst baseClass = 'popup'\n\nexport type PopupProps = {\n  backgroundColor?: CSSProperties['backgroundColor']\n  boundingRef?: React.RefObject<HTMLElement>\n  button?: React.ReactNode\n  buttonClassName?: string\n  buttonSize?: 'large' | 'medium' | 'small' | 'xsmall'\n  buttonType?: 'custom' | 'default' | 'none'\n  caret?: boolean\n  children?: React.ReactNode\n  className?: string\n  disabled?: boolean\n  forceOpen?: boolean\n  horizontalAlign?: 'center' | 'left' | 'right'\n  id?: string\n  initActive?: boolean\n  noBackground?: boolean\n  onToggleClose?: () => void\n  onToggleOpen?: (active: boolean) => void\n  render?: (any) => React.ReactNode\n  showOnHover?: boolean\n  showScrollbar?: boolean\n  size?: 'fit-content' | 'large' | 'medium' | 'small'\n  verticalAlign?: 'bottom' | 'top'\n}\n\nexport const Popup: React.FC<PopupProps> = (props) => {\n  const {\n    id,\n    boundingRef,\n    button,\n    buttonClassName,\n    buttonSize,\n    buttonType = 'default',\n    caret = true,\n    children,\n    className,\n    disabled,\n    forceOpen,\n    horizontalAlign: horizontalAlignFromProps = 'left',\n    initActive = false,\n    noBackground,\n    onToggleClose,\n    onToggleOpen,\n    render,\n    showOnHover = false,\n    showScrollbar = false,\n    size = 'medium',\n    verticalAlign: verticalAlignFromProps = 'top',\n  } = props\n  const { height: windowHeight, width: windowWidth } = useWindowInfo()\n\n  const [intersectionRef, intersectionEntry] = useIntersect({\n    root: boundingRef?.current || null,\n    rootMargin: '-100px 0px 0px 0px',\n    threshold: 1,\n  })\n\n  const contentRef = useRef(null)\n  const triggerRef = useRef(null)\n  const [active, setActive_Internal] = useState(initActive)\n  const [verticalAlign, setVerticalAlign] = useState(verticalAlignFromProps)\n  const [horizontalAlign, setHorizontalAlign] = useState(horizontalAlignFromProps)\n\n  const setActive = React.useCallback(\n    (active: boolean) => {\n      if (active && typeof onToggleOpen === 'function') {\n        onToggleOpen(true)\n      }\n      if (!active && typeof onToggleClose === 'function') {\n        onToggleClose()\n      }\n      setActive_Internal(active)\n    },\n    [onToggleClose, onToggleOpen],\n  )\n\n  const setPosition = useCallback(\n    ({ horizontal = false, vertical = false }) => {\n      if (contentRef.current) {\n        const bounds = contentRef.current.getBoundingClientRect()\n\n        const {\n          bottom: contentBottomPos,\n          left: contentLeftPos,\n          right: contentRightPos,\n          top: contentTopPos,\n        } = bounds\n\n        let boundingTopPos = 100\n        let boundingRightPos = document.documentElement.clientWidth\n        let boundingBottomPos = document.documentElement.clientHeight\n        let boundingLeftPos = 0\n\n        if (boundingRef?.current) {\n          ;({\n            bottom: boundingBottomPos,\n            left: boundingLeftPos,\n            right: boundingRightPos,\n            top: boundingTopPos,\n          } = boundingRef.current.getBoundingClientRect())\n        }\n\n        if (horizontal) {\n          if (contentRightPos > boundingRightPos && contentLeftPos > boundingLeftPos) {\n            setHorizontalAlign('right')\n          } else if (contentLeftPos < boundingLeftPos && contentRightPos < boundingRightPos) {\n            setHorizontalAlign('left')\n          }\n        }\n\n        if (vertical) {\n          if (contentTopPos < boundingTopPos && contentBottomPos < boundingBottomPos) {\n            setVerticalAlign('bottom')\n          } else if (contentBottomPos > boundingBottomPos && contentTopPos > boundingTopPos) {\n            setVerticalAlign('top')\n          }\n        }\n      }\n    },\n    [boundingRef],\n  )\n\n  const handleClickOutside = useCallback(\n    (e) => {\n      if (contentRef.current.contains(e.target) || triggerRef.current.contains(e.target)) {\n        return\n      }\n\n      setActive(false)\n    },\n    [contentRef, setActive],\n  )\n\n  useEffect(() => {\n    setPosition({ horizontal: true })\n  }, [intersectionEntry, setPosition, windowWidth])\n\n  useEffect(() => {\n    setPosition({ vertical: true })\n  }, [intersectionEntry, setPosition, windowHeight])\n\n  useEffect(() => {\n    if (active) {\n      document.addEventListener('mousedown', handleClickOutside)\n    } else {\n      document.removeEventListener('mousedown', handleClickOutside)\n    }\n\n    return () => {\n      document.removeEventListener('mousedown', handleClickOutside)\n    }\n  }, [active, handleClickOutside, onToggleOpen])\n\n  useEffect(() => {\n    setActive(forceOpen)\n  }, [forceOpen, setActive])\n\n  const classes = [\n    baseClass,\n    className,\n    `${baseClass}--size-${size}`,\n    buttonSize && `${baseClass}--button-size-${buttonSize}`,\n    `${baseClass}--v-align-${verticalAlign}`,\n    `${baseClass}--h-align-${horizontalAlign}`,\n    active && `${baseClass}--active`,\n    showScrollbar && `${baseClass}--show-scrollbar`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  return (\n    <div className={classes} id={id}>\n      <div className={`${baseClass}__trigger-wrap`} ref={triggerRef}>\n        {showOnHover ? (\n          <div\n            className={`${baseClass}__on-hover-watch`}\n            onMouseEnter={() => setActive(true)}\n            onMouseLeave={() => setActive(false)}\n            role=\"button\"\n            tabIndex={0}\n          >\n            <PopupTrigger\n              {...{\n                active,\n                button,\n                buttonType,\n                className: buttonClassName,\n                disabled,\n                noBackground,\n                setActive,\n                size: buttonSize,\n              }}\n            />\n          </div>\n        ) : (\n          <PopupTrigger\n            {...{\n              active,\n              button,\n              buttonType,\n              className: buttonClassName,\n              disabled,\n              noBackground,\n              setActive,\n              size: buttonSize,\n            }}\n          />\n        )}\n      </div>\n\n      <div className={`${baseClass}__content`} ref={contentRef}>\n        <div className={`${baseClass}__hide-scrollbar`} ref={intersectionRef}>\n          <div className={`${baseClass}__scroll-container`}>\n            <div className={`${baseClass}__scroll-content`}>\n              {render && render({ close: () => setActive(false) })}\n              {children}\n            </div>\n          </div>\n        </div>\n\n        {caret && <div className={`${baseClass}__caret`} />}\n      </div>\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/Popup/index.scss

@@ -65,6 +65,13 @@
     // SIZE
     ////////////////////////////////
 
+    &--size-xsmall {
+      --popup-width: 80px;
+      .popup__content {
+        @include shadow-sm;
+      }
+    }
+
     &--size-small {
       --popup-width: 100px;
       .popup__content {
@@ -90,6 +97,10 @@
     /// BUTTON SIZE
     ////////////////////////////////
 
+    &--button-size-xsmall {
+      --button-size-offset: -12px;
+    }
+
     &--button-size-small {
       --button-size-offset: -8px;
     }

package/dist/elements/PublishButton/ScheduleDrawer/buildUpcomingColumns.js

@@ -27,6 +27,7 @@ export const buildUpcomingColumns = ({
       const type = doc.input?.type;
       return /*#__PURE__*/_jsxs(Pill, {
         pillStyle: type === 'publish' ? 'success' : 'warning',
+        size: "small",
         children: [type === 'publish' && t('version:publish'), type === 'unpublish' && t('version:unpublish')]
       }, doc.id);
     })

package/dist/elements/PublishButton/ScheduleDrawer/buildUpcomingColumns.js.map

@@ -1 +1 @@
-{"version":3,"file":"buildUpcomingColumns.js","names":["getTranslation","React","formatDate","Button","Pill","buildUpcomingColumns","dateFormat","deleteHandler","docs","i18n","localization","supportedTimezones","t","columns","accessor","active","field","name","type","Heading","_jsx","renderedCells","map","doc","input","_jsxs","pillStyle","id","date","waitUntil","pattern","timezone","matchedTimezone","find","value","label","push","locale","matchedLocale","locales","code","buttonStyle","className","icon","onClick","e","preventDefault","tooltip"],"sources":["../../../../src/elements/PublishButton/ScheduleDrawer/buildUpcomingColumns.tsx"],"sourcesContent":["import type { ClientConfig, Column } from 'payload'\n\nimport { getTranslation, type I18nClient, type TFunction } from '@payloadcms/translations'\nimport React from 'react'\n\nimport type { UpcomingEvent } from './types.js'\n\nimport { formatDate } from '../../../utilities/formatDocTitle/formatDateTitle.js'\nimport { Button } from '../../Button/index.js'\nimport { Pill } from '../../Pill/index.js'\n\ntype Args = {\n  dateFormat: string\n  deleteHandler: (id: number | string) => void\n  docs: UpcomingEvent[]\n  i18n: I18nClient\n  localization: ClientConfig['localization']\n  supportedTimezones: ClientConfig['admin']['timezones']['supportedTimezones']\n  t: TFunction\n}\n\nexport const buildUpcomingColumns = ({\n  dateFormat,\n  deleteHandler,\n  docs,\n  i18n,\n  localization,\n  supportedTimezones,\n  t,\n}: Args): Column[] => {\n  const columns: Column[] = [\n    {\n      accessor: 'input.type',\n      active: true,\n      field: {\n        name: '',\n        type: 'text',\n      },\n      Heading: <span>{t('version:type')}</span>,\n      renderedCells: docs.map((doc) => {\n        const type = doc.input?.type\n\n        return (\n          <Pill key={doc.id} pillStyle={type === 'publish' ? 'success' : 'warning'}>\n            {type === 'publish' && t('version:publish')}\n            {type === 'unpublish' && t('version:unpublish')}\n          </Pill>\n        )\n      }),\n    },\n    {\n      accessor: 'waitUntil',\n      active: true,\n      field: {\n        name: '',\n        type: 'date',\n      },\n      Heading: <span>{t('general:time')}</span>,\n      renderedCells: docs.map((doc) => (\n        <span key={doc.id}>\n          {formatDate({\n            date: doc.waitUntil,\n            i18n,\n            pattern: dateFormat,\n            timezone: doc.input.timezone,\n          })}\n        </span>\n      )),\n    },\n    {\n      accessor: 'input.timezone',\n      active: true,\n      field: {\n        name: '',\n        type: 'text',\n      },\n      Heading: <span>{t('general:timezone')}</span>,\n      renderedCells: docs.map((doc) => {\n        const matchedTimezone = supportedTimezones.find(\n          (timezone) => timezone.value === doc.input.timezone,\n        )\n\n        const timezone = matchedTimezone?.label || doc.input.timezone\n\n        return <span key={doc.id}>{timezone || t('general:noValue')}</span>\n      }),\n    },\n  ]\n\n  if (localization) {\n    columns.push({\n      accessor: 'input.locale',\n      active: true,\n      field: {\n        name: '',\n        type: 'text',\n      },\n      Heading: <span>{t('general:locale')}</span>,\n      renderedCells: docs.map((doc) => {\n        if (doc.input.locale) {\n          const matchedLocale = localization.locales.find(\n            (locale) => locale.code === doc.input.locale,\n          )\n          if (matchedLocale) {\n            return <span key={doc.id}>{getTranslation(matchedLocale.label, i18n)}</span>\n          }\n        }\n\n        return <span key={doc.id}>{t('general:all')}</span>\n      }),\n    })\n  }\n\n  columns.push({\n    accessor: 'delete',\n    active: true,\n    field: {\n      name: 'delete',\n      type: 'text',\n    },\n    Heading: <span>{t('general:delete')}</span>,\n    renderedCells: docs.map((doc) => (\n      <Button\n        buttonStyle=\"icon-label\"\n        className=\"schedule-publish__delete\"\n        icon=\"x\"\n        key={doc.id}\n        onClick={(e) => {\n          e.preventDefault()\n          deleteHandler(doc.id)\n        }}\n        tooltip={t('general:delete')}\n      />\n    )),\n  })\n\n  return columns\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"buildUpcomingColumns.js","names":["getTranslation","React","formatDate","Button","Pill","buildUpcomingColumns","dateFormat","deleteHandler","docs","i18n","localization","supportedTimezones","t","columns","accessor","active","field","name","type","Heading","_jsx","renderedCells","map","doc","input","_jsxs","pillStyle","size","id","date","waitUntil","pattern","timezone","matchedTimezone","find","value","label","push","locale","matchedLocale","locales","code","buttonStyle","className","icon","onClick","e","preventDefault","tooltip"],"sources":["../../../../src/elements/PublishButton/ScheduleDrawer/buildUpcomingColumns.tsx"],"sourcesContent":["import type { ClientConfig, Column } from 'payload'\n\nimport { getTranslation, type I18nClient, type TFunction } from '@payloadcms/translations'\nimport React from 'react'\n\nimport type { UpcomingEvent } from './types.js'\n\nimport { formatDate } from '../../../utilities/formatDocTitle/formatDateTitle.js'\nimport { Button } from '../../Button/index.js'\nimport { Pill } from '../../Pill/index.js'\n\ntype Args = {\n  dateFormat: string\n  deleteHandler: (id: number | string) => void\n  docs: UpcomingEvent[]\n  i18n: I18nClient\n  localization: ClientConfig['localization']\n  supportedTimezones: ClientConfig['admin']['timezones']['supportedTimezones']\n  t: TFunction\n}\n\nexport const buildUpcomingColumns = ({\n  dateFormat,\n  deleteHandler,\n  docs,\n  i18n,\n  localization,\n  supportedTimezones,\n  t,\n}: Args): Column[] => {\n  const columns: Column[] = [\n    {\n      accessor: 'input.type',\n      active: true,\n      field: {\n        name: '',\n        type: 'text',\n      },\n      Heading: <span>{t('version:type')}</span>,\n      renderedCells: docs.map((doc) => {\n        const type = doc.input?.type\n\n        return (\n          <Pill key={doc.id} pillStyle={type === 'publish' ? 'success' : 'warning'} size=\"small\">\n            {type === 'publish' && t('version:publish')}\n            {type === 'unpublish' && t('version:unpublish')}\n          </Pill>\n        )\n      }),\n    },\n    {\n      accessor: 'waitUntil',\n      active: true,\n      field: {\n        name: '',\n        type: 'date',\n      },\n      Heading: <span>{t('general:time')}</span>,\n      renderedCells: docs.map((doc) => (\n        <span key={doc.id}>\n          {formatDate({\n            date: doc.waitUntil,\n            i18n,\n            pattern: dateFormat,\n            timezone: doc.input.timezone,\n          })}\n        </span>\n      )),\n    },\n    {\n      accessor: 'input.timezone',\n      active: true,\n      field: {\n        name: '',\n        type: 'text',\n      },\n      Heading: <span>{t('general:timezone')}</span>,\n      renderedCells: docs.map((doc) => {\n        const matchedTimezone = supportedTimezones.find(\n          (timezone) => timezone.value === doc.input.timezone,\n        )\n\n        const timezone = matchedTimezone?.label || doc.input.timezone\n\n        return <span key={doc.id}>{timezone || t('general:noValue')}</span>\n      }),\n    },\n  ]\n\n  if (localization) {\n    columns.push({\n      accessor: 'input.locale',\n      active: true,\n      field: {\n        name: '',\n        type: 'text',\n      },\n      Heading: <span>{t('general:locale')}</span>,\n      renderedCells: docs.map((doc) => {\n        if (doc.input.locale) {\n          const matchedLocale = localization.locales.find(\n            (locale) => locale.code === doc.input.locale,\n          )\n          if (matchedLocale) {\n            return <span key={doc.id}>{getTranslation(matchedLocale.label, i18n)}</span>\n          }\n        }\n\n        return <span key={doc.id}>{t('general:all')}</span>\n      }),\n    })\n  }\n\n  columns.push({\n    accessor: 'delete',\n    active: true,\n    field: {\n      name: 'delete',\n      type: 'text',\n    },\n    Heading: <span>{t('general:delete')}</span>,\n    renderedCells: docs.map((doc) => (\n      <Button\n        buttonStyle=\"icon-label\"\n        className=\"schedule-publish__delete\"\n        icon=\"x\"\n        key={doc.id}\n        onClick={(e) => {\n          e.preventDefault()\n          deleteHandler(doc.id)\n        }}\n        tooltip={t('general:delete')}\n      />\n    )),\n  })\n\n  return columns\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/QueryPresets/cells/ColumnsCell/index.js

@@ -17,6 +17,7 @@ export const QueryPresetsColumnsCell = ({
       }
       return /*#__PURE__*/_jsx(Pill, {
         pillStyle: isColumnActive ? 'always-white' : 'light',
+        size: "small",
         children: toWords(column)
       }, i);
     }) : 'No columns selected'

package/dist/elements/QueryPresets/cells/ColumnsCell/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["toWords","transformColumnsToSearchParams","React","Pill","baseClass","QueryPresetsColumnsCell","cellData","_jsx","className","map","column","i","isColumnActive","startsWith","pillStyle"],"sources":["../../../../../src/elements/QueryPresets/cells/ColumnsCell/index.tsx"],"sourcesContent":["import type { ColumnPreference, DefaultCellComponentProps } from 'payload'\n\nimport { toWords, transformColumnsToSearchParams } from 'payload/shared'\nimport React from 'react'\n\nimport { Pill } from '../../../Pill/index.js'\nimport './index.scss'\n\nconst baseClass = 'query-preset-columns-cell'\n\nexport const QueryPresetsColumnsCell: React.FC<DefaultCellComponentProps> = ({ cellData }) => {\n  return (\n    <div className={baseClass}>\n      {cellData\n        ? transformColumnsToSearchParams(cellData as ColumnPreference[]).map((column, i) => {\n            const isColumnActive = !column.startsWith('-')\n\n            // to void very lengthy cells, only display the active columns\n            if (!isColumnActive) {\n              return null\n            }\n\n            return (\n              <Pill key={i} pillStyle={isColumnActive ? 'always-white' : 'light'}>\n                {toWords(column)}\n              </Pill>\n            )\n          })\n        : 'No columns selected'}\n    </div>\n  )\n}\n"],"mappings":";AAEA,SAASA,OAAO,EAAEC,8BAA8B,QAAQ;AACxD,OAAOC,KAAA,MAAW;AAElB,SAASC,IAAI,QAAQ;AACrB,OAAO;AAEP,MAAMC,SAAA,GAAY;AAElB,OAAO,MAAMC,uBAAA,GAA+DA,CAAC;EAAEC;AAAQ,CAAE;EACvF,oBACEC,IAAA,CAAC;IAAIC,SAAA,EAAWJ,SAAA;cACbE,QAAA,GACGL,8BAAA,CAA+BK,QAAA,EAAgCG,GAAG,CAAC,CAACC,MAAA,EAAQC,CAAA;MAC1E,MAAMC,cAAA,GAAiB,CAACF,MAAA,CAAOG,UAAU,CAAC;MAE1C;MACA,IAAI,CAACD,cAAA,EAAgB;QACnB,OAAO;MACT;MAEA,oBACEL,IAAA,CAACJ,IAAA;QAAaW,SAAA,EAAWF,cAAA,GAAiB,iBAAiB;kBACxDZ,OAAA,CAAQU,MAAA;SADAC,CAAA;IAIf,KACA;;AAGV","ignoreList":[]}
+{"version":3,"file":"index.js","names":["toWords","transformColumnsToSearchParams","React","Pill","baseClass","QueryPresetsColumnsCell","cellData","_jsx","className","map","column","i","isColumnActive","startsWith","pillStyle","size"],"sources":["../../../../../src/elements/QueryPresets/cells/ColumnsCell/index.tsx"],"sourcesContent":["import type { ColumnPreference, DefaultCellComponentProps } from 'payload'\n\nimport { toWords, transformColumnsToSearchParams } from 'payload/shared'\nimport React from 'react'\n\nimport { Pill } from '../../../Pill/index.js'\nimport './index.scss'\n\nconst baseClass = 'query-preset-columns-cell'\n\nexport const QueryPresetsColumnsCell: React.FC<DefaultCellComponentProps> = ({ cellData }) => {\n  return (\n    <div className={baseClass}>\n      {cellData\n        ? transformColumnsToSearchParams(cellData as ColumnPreference[]).map((column, i) => {\n            const isColumnActive = !column.startsWith('-')\n\n            // to void very lengthy cells, only display the active columns\n            if (!isColumnActive) {\n              return null\n            }\n\n            return (\n              <Pill key={i} pillStyle={isColumnActive ? 'always-white' : 'light'} size=\"small\">\n                {toWords(column)}\n              </Pill>\n            )\n          })\n        : 'No columns selected'}\n    </div>\n  )\n}\n"],"mappings":";AAEA,SAASA,OAAO,EAAEC,8BAA8B,QAAQ;AACxD,OAAOC,KAAA,MAAW;AAElB,SAASC,IAAI,QAAQ;AACrB,OAAO;AAEP,MAAMC,SAAA,GAAY;AAElB,OAAO,MAAMC,uBAAA,GAA+DA,CAAC;EAAEC;AAAQ,CAAE;EACvF,oBACEC,IAAA,CAAC;IAAIC,SAAA,EAAWJ,SAAA;cACbE,QAAA,GACGL,8BAAA,CAA+BK,QAAA,EAAgCG,GAAG,CAAC,CAACC,MAAA,EAAQC,CAAA;MAC1E,MAAMC,cAAA,GAAiB,CAACF,MAAA,CAAOG,UAAU,CAAC;MAE1C;MACA,IAAI,CAACD,cAAA,EAAgB;QACnB,OAAO;MACT;MAEA,oBACEL,IAAA,CAACJ,IAAA;QAAaW,SAAA,EAAWF,cAAA,GAAiB,iBAAiB;QAASG,IAAA,EAAK;kBACtEf,OAAA,CAAQU,MAAA;SADAC,CAAA;IAIf,KACA;;AAGV","ignoreList":[]}

package/dist/elements/QueryPresets/fields/ColumnsField/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/elements/QueryPresets/fields/ColumnsField/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAoB,wBAAwB,EAAE,MAAM,SAAS,CAAA;AAQzE,OAAO,cAAc,CAAA;AAErB,eAAO,MAAM,uBAAuB,EAAE,wBAuBrC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/elements/QueryPresets/fields/ColumnsField/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAoB,wBAAwB,EAAE,MAAM,SAAS,CAAA;AAQzE,OAAO,cAAc,CAAA;AAErB,eAAO,MAAM,uBAAuB,EAAE,wBA2BrC,CAAA"}

package/dist/elements/QueryPresets/fields/ColumnsField/index.js

@@ -49,6 +49,7 @@ function _temp(column, i) {
   const isColumnActive = !column.startsWith("-");
   return _jsx(Pill, {
     pillStyle: isColumnActive ? "always-white" : "light-gray",
+    size: "small",
     children: toWords(column)
   }, i);
 }

package/dist/elements/QueryPresets/fields/ColumnsField/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","toWords","transformColumnsToSearchParams","React","FieldLabel","useField","Pill","QueryPresetsColumnField","t0","$","field","t1","label","required","path","value","t2","_jsxs","className","children","_jsx","as","map","_temp","column","i","isColumnActive","startsWith","pillStyle"],"sources":["../../../../../src/elements/QueryPresets/fields/ColumnsField/index.tsx"],"sourcesContent":["'use client'\nimport type { ColumnPreference, JSONFieldClientComponent } from 'payload'\n\nimport { toWords, transformColumnsToSearchParams } from 'payload/shared'\nimport React from 'react'\n\nimport { FieldLabel } from '../../../../fields/FieldLabel/index.js'\nimport { useField } from '../../../../forms/useField/index.js'\nimport { Pill } from '../../../Pill/index.js'\nimport './index.scss'\n\nexport const QueryPresetsColumnField: JSONFieldClientComponent = ({\n  field: { label, required },\n}) => {\n  const { path, value } = useField()\n\n  return (\n    <div className=\"field-type query-preset-columns-field\">\n      <FieldLabel as=\"h3\" label={label} path={path} required={required} />\n      <div className=\"value-wrapper\">\n        {value\n          ? transformColumnsToSearchParams(value as ColumnPreference[]).map((column, i) => {\n              const isColumnActive = !column.startsWith('-')\n\n              return (\n                <Pill key={i} pillStyle={isColumnActive ? 'always-white' : 'light-gray'}>\n                  {toWords(column)}\n                </Pill>\n              )\n            })\n          : 'No columns selected'}\n      </div>\n    </div>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAGA,SAASC,OAAO,EAAEC,8BAA8B,QAAQ;AACxD,OAAOC,KAAA,MAAW;AAElB,SAASC,UAAU,QAAQ;AAC3B,SAASC,QAAQ,QAAQ;AACzB,SAASC,IAAI,QAAQ;AACrB,OAAO;AAEP,OAAO,MAAMC,uBAAA,GAAoDC,EAAA;EAAA,MAAAC,CAAA,GAAAT,EAAA;EAAC;IAAAU,KAAA,EAAAC;EAAA,IAAAH,EAEjE;EADQ;IAAAI,KAAA;IAAAC;EAAA,IAAAF,EAAmB;EAE1B;IAAAG,IAAA;IAAAC;EAAA,IAAwBV,QAAA;EAAA,IAAAW,EAAA;EAAA,IAAAP,CAAA,QAAAG,KAAA,IAAAH,CAAA,QAAAK,IAAA,IAAAL,CAAA,QAAAI,QAAA,IAAAJ,CAAA,QAAAM,KAAA;IAGtBC,EAAA,GAAAC,KAAA,CAAC;MAAAC,SAAA,EAAc;MAAAC,QAAA,GACbC,IAAA,CAAAhB,UAAA;QAAAiB,EAAA,EAAe;QAAAT,KAAA;QAAAE,IAAA;QAAAD;MAAA,C,GACfO,IAAA,CAAC;QAAAF,SAAA,EAAc;QAAAC,QAAA,EACZJ,KAAA,GACGb,8BAAA,CAA+Ba,KAAA,EAAAO,GAAA,CAAAC,KAQ/B,IACA;MAAA,C;;;;;;;;;;SAbRP,E;CAiBJ;AAvBiE,SAAAO,MAAAC,MAAA,EAAAC,CAAA;EAWnD,MAAAC,cAAA,IAAwBF,MAAA,CAAAG,UAAA,CAAkB;EAAA,OAGxCP,IAAA,CAAAd,IAAA;IAAAsB,SAAA,EAAyBF,cAAA,GAAiB,iBAAiB;IAAAP,QAAA,EACxDlB,OAAA,CAAQuB,MAAA;EAAA,GADAC,CAAA;AAAA","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","toWords","transformColumnsToSearchParams","React","FieldLabel","useField","Pill","QueryPresetsColumnField","t0","$","field","t1","label","required","path","value","t2","_jsxs","className","children","_jsx","as","map","_temp","column","i","isColumnActive","startsWith","pillStyle","size"],"sources":["../../../../../src/elements/QueryPresets/fields/ColumnsField/index.tsx"],"sourcesContent":["'use client'\nimport type { ColumnPreference, JSONFieldClientComponent } from 'payload'\n\nimport { toWords, transformColumnsToSearchParams } from 'payload/shared'\nimport React from 'react'\n\nimport { FieldLabel } from '../../../../fields/FieldLabel/index.js'\nimport { useField } from '../../../../forms/useField/index.js'\nimport { Pill } from '../../../Pill/index.js'\nimport './index.scss'\n\nexport const QueryPresetsColumnField: JSONFieldClientComponent = ({\n  field: { label, required },\n}) => {\n  const { path, value } = useField()\n\n  return (\n    <div className=\"field-type query-preset-columns-field\">\n      <FieldLabel as=\"h3\" label={label} path={path} required={required} />\n      <div className=\"value-wrapper\">\n        {value\n          ? transformColumnsToSearchParams(value as ColumnPreference[]).map((column, i) => {\n              const isColumnActive = !column.startsWith('-')\n\n              return (\n                <Pill\n                  key={i}\n                  pillStyle={isColumnActive ? 'always-white' : 'light-gray'}\n                  size=\"small\"\n                >\n                  {toWords(column)}\n                </Pill>\n              )\n            })\n          : 'No columns selected'}\n      </div>\n    </div>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAGA,SAASC,OAAO,EAAEC,8BAA8B,QAAQ;AACxD,OAAOC,KAAA,MAAW;AAElB,SAASC,UAAU,QAAQ;AAC3B,SAASC,QAAQ,QAAQ;AACzB,SAASC,IAAI,QAAQ;AACrB,OAAO;AAEP,OAAO,MAAMC,uBAAA,GAAoDC,EAAA;EAAA,MAAAC,CAAA,GAAAT,EAAA;EAAC;IAAAU,KAAA,EAAAC;EAAA,IAAAH,EAEjE;EADQ;IAAAI,KAAA;IAAAC;EAAA,IAAAF,EAAmB;EAE1B;IAAAG,IAAA;IAAAC;EAAA,IAAwBV,QAAA;EAAA,IAAAW,EAAA;EAAA,IAAAP,CAAA,QAAAG,KAAA,IAAAH,CAAA,QAAAK,IAAA,IAAAL,CAAA,QAAAI,QAAA,IAAAJ,CAAA,QAAAM,KAAA;IAGtBC,EAAA,GAAAC,KAAA,CAAC;MAAAC,SAAA,EAAc;MAAAC,QAAA,GACbC,IAAA,CAAAhB,UAAA;QAAAiB,EAAA,EAAe;QAAAT,KAAA;QAAAE,IAAA;QAAAD;MAAA,C,GACfO,IAAA,CAAC;QAAAF,SAAA,EAAc;QAAAC,QAAA,EACZJ,KAAA,GACGb,8BAAA,CAA+Ba,KAAA,EAAAO,GAAA,CAAAC,KAY/B,IACA;MAAA,C;;;;;;;;;;SAjBRP,E;CAqBJ;AA3BiE,SAAAO,MAAAC,MAAA,EAAAC,CAAA;EAWnD,MAAAC,cAAA,IAAwBF,MAAA,CAAAG,UAAA,CAAkB;EAAA,OAGxCP,IAAA,CAAAd,IAAA;IAAAsB,SAAA,EAEaF,cAAA,GAAiB,iBAAiB;IAAAG,IAAA,EACxC;IAAAV,QAAA,EAEJlB,OAAA,CAAQuB,MAAA;EAAA,GAJJC,CAAA;AAAA","ignoreList":[]}

package/dist/elements/QueryPresets/fields/WhereField/index.js

@@ -35,6 +35,7 @@ const transformWhereToNaturalLanguage = (where, collectionLabel) => {
     }
     return /*#__PURE__*/_jsxs(Pill, {
       pillStyle: "always-white",
+      size: "small",
       children: [/*#__PURE__*/_jsx("b", {
         children: toWords(key)
       }), " ", operator, " ", /*#__PURE__*/_jsx("b", {

package/dist/elements/QueryPresets/fields/WhereField/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["getTranslation","toWords","React","FieldLabel","useField","useConfig","useListQuery","useTranslation","Pill","transformWhereToNaturalLanguage","where","collectionLabel","renderCondition","condition","key","Object","keys","operator","value","Date","toLocaleDateString","_err","_jsxs","pillStyle","_jsx","renderWhere","or","length","className","map","orCondition","orIndex","Fragment","and","andCondition","andIndex","QueryPresetsWhereField","t0","field","t1","label","required","path","collectionSlug","getEntityConfig","collectionConfig","i18n","children","as","labels","plural"],"sources":["../../../../../src/elements/QueryPresets/fields/WhereField/index.tsx"],"sourcesContent":["'use client'\nimport type { JSONFieldClientComponent, Where } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { toWords } from 'payload/shared'\nimport React from 'react'\n\nimport { FieldLabel } from '../../../../fields/FieldLabel/index.js'\nimport { useField } from '../../../../forms/useField/index.js'\nimport { useConfig } from '../../../../providers/Config/index.js'\nimport { useListQuery } from '../../../../providers/ListQuery/index.js'\nimport { useTranslation } from '../../../../providers/Translation/index.js'\nimport { Pill } from '../../../Pill/index.js'\nimport './index.scss'\n\n/** @todo: improve this */\nconst transformWhereToNaturalLanguage = (\n  where: Where,\n  collectionLabel: string,\n): React.ReactNode => {\n  if (!where) {\n    return null\n  }\n\n  const renderCondition = (condition: any): React.ReactNode => {\n    const key = Object.keys(condition)[0]\n\n    if (!condition[key]) {\n      return 'No where query'\n    }\n\n    const operator = Object.keys(condition[key])[0]\n    let value = condition[key][operator]\n\n    // TODO: this is not right, but works for now at least.\n    // Ideally we look up iterate _fields_ so we know the type of the field\n    // Currently, we're only iterating over the `where` field's value, so we don't know the type\n    if (typeof value === 'object') {\n      try {\n        value = new Date(value).toLocaleDateString()\n      } catch (_err) {\n        value = 'Unknown error has occurred'\n      }\n    }\n\n    return (\n      <Pill pillStyle=\"always-white\">\n        <b>{toWords(key)}</b> {operator} <b>{toWords(value)}</b>\n      </Pill>\n    )\n  }\n\n  const renderWhere = (where: Where, collectionLabel: string): React.ReactNode => {\n    if (where.or && where.or.length > 0) {\n      return (\n        <div className=\"or-condition\">\n          {where.or.map((orCondition, orIndex) => (\n            <React.Fragment key={orIndex}>\n              {orCondition.and && orCondition.and.length > 0 ? (\n                <div className=\"and-condition\">\n                  {orIndex === 0 && (\n                    <span className=\"label\">{`Filter ${collectionLabel} where `}</span>\n                  )}\n                  {orIndex > 0 && <span className=\"label\"> or </span>}\n                  {orCondition.and.map((andCondition, andIndex) => (\n                    <React.Fragment key={andIndex}>\n                      {renderCondition(andCondition)}\n                      {andIndex < orCondition.and.length - 1 && (\n                        <span className=\"label\"> and </span>\n                      )}\n                    </React.Fragment>\n                  ))}\n                </div>\n              ) : (\n                renderCondition(orCondition)\n              )}\n            </React.Fragment>\n          ))}\n        </div>\n      )\n    }\n\n    return renderCondition(where)\n  }\n\n  return renderWhere(where, collectionLabel)\n}\n\nexport const QueryPresetsWhereField: JSONFieldClientComponent = ({\n  field: { label, required },\n}) => {\n  const { path, value } = useField()\n  const { collectionSlug } = useListQuery()\n  const { getEntityConfig } = useConfig()\n\n  const collectionConfig = getEntityConfig({ collectionSlug })\n\n  const { i18n } = useTranslation()\n\n  return (\n    <div className=\"field-type query-preset-where-field\">\n      <FieldLabel as=\"h3\" label={label} path={path} required={required} />\n      <div className=\"value-wrapper\">\n        {value\n          ? transformWhereToNaturalLanguage(\n              value as Where,\n              getTranslation(collectionConfig?.labels?.plural, i18n),\n            )\n          : 'No where query'}\n      </div>\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["getTranslation","toWords","React","FieldLabel","useField","useConfig","useListQuery","useTranslation","Pill","transformWhereToNaturalLanguage","where","collectionLabel","renderCondition","condition","key","Object","keys","operator","value","Date","toLocaleDateString","_err","_jsxs","pillStyle","size","_jsx","renderWhere","or","length","className","map","orCondition","orIndex","Fragment","and","andCondition","andIndex","QueryPresetsWhereField","t0","field","t1","label","required","path","collectionSlug","getEntityConfig","collectionConfig","i18n","children","as","labels","plural"],"sources":["../../../../../src/elements/QueryPresets/fields/WhereField/index.tsx"],"sourcesContent":["'use client'\nimport type { JSONFieldClientComponent, Where } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { toWords } from 'payload/shared'\nimport React from 'react'\n\nimport { FieldLabel } from '../../../../fields/FieldLabel/index.js'\nimport { useField } from '../../../../forms/useField/index.js'\nimport { useConfig } from '../../../../providers/Config/index.js'\nimport { useListQuery } from '../../../../providers/ListQuery/index.js'\nimport { useTranslation } from '../../../../providers/Translation/index.js'\nimport { Pill } from '../../../Pill/index.js'\nimport './index.scss'\n\n/** @todo: improve this */\nconst transformWhereToNaturalLanguage = (\n  where: Where,\n  collectionLabel: string,\n): React.ReactNode => {\n  if (!where) {\n    return null\n  }\n\n  const renderCondition = (condition: any): React.ReactNode => {\n    const key = Object.keys(condition)[0]\n\n    if (!condition[key]) {\n      return 'No where query'\n    }\n\n    const operator = Object.keys(condition[key])[0]\n    let value = condition[key][operator]\n\n    // TODO: this is not right, but works for now at least.\n    // Ideally we look up iterate _fields_ so we know the type of the field\n    // Currently, we're only iterating over the `where` field's value, so we don't know the type\n    if (typeof value === 'object') {\n      try {\n        value = new Date(value).toLocaleDateString()\n      } catch (_err) {\n        value = 'Unknown error has occurred'\n      }\n    }\n\n    return (\n      <Pill pillStyle=\"always-white\" size=\"small\">\n        <b>{toWords(key)}</b> {operator} <b>{toWords(value)}</b>\n      </Pill>\n    )\n  }\n\n  const renderWhere = (where: Where, collectionLabel: string): React.ReactNode => {\n    if (where.or && where.or.length > 0) {\n      return (\n        <div className=\"or-condition\">\n          {where.or.map((orCondition, orIndex) => (\n            <React.Fragment key={orIndex}>\n              {orCondition.and && orCondition.and.length > 0 ? (\n                <div className=\"and-condition\">\n                  {orIndex === 0 && (\n                    <span className=\"label\">{`Filter ${collectionLabel} where `}</span>\n                  )}\n                  {orIndex > 0 && <span className=\"label\"> or </span>}\n                  {orCondition.and.map((andCondition, andIndex) => (\n                    <React.Fragment key={andIndex}>\n                      {renderCondition(andCondition)}\n                      {andIndex < orCondition.and.length - 1 && (\n                        <span className=\"label\"> and </span>\n                      )}\n                    </React.Fragment>\n                  ))}\n                </div>\n              ) : (\n                renderCondition(orCondition)\n              )}\n            </React.Fragment>\n          ))}\n        </div>\n      )\n    }\n\n    return renderCondition(where)\n  }\n\n  return renderWhere(where, collectionLabel)\n}\n\nexport const QueryPresetsWhereField: JSONFieldClientComponent = ({\n  field: { label, required },\n}) => {\n  const { path, value } = useField()\n  const { collectionSlug } = useListQuery()\n  const { getEntityConfig } = useConfig()\n\n  const collectionConfig = getEntityConfig({ collectionSlug })\n\n  const { i18n } = useTranslation()\n\n  return (\n    <div className=\"field-type query-preset-where-field\">\n      <FieldLabel as=\"h3\" label={label} path={path} required={required} />\n      <div className=\"value-wrapper\">\n        {value\n          ? transformWhereToNaturalLanguage(\n              value as Where,\n              getTranslation(collectionConfig?.labels?.plural, i18n),\n            )\n          : 'No where query'}\n      </div>\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/ReactSelect/ValueContainer/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/ReactSelect/ValueContainer/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAA;AAEvD,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAA;AAEzC,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAAC,MAAM,EAAE,GAAG,CAAC,CASrE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/ReactSelect/ValueContainer/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAA;AAEvD,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAA;AAEzC,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAAC,MAAM,EAAE,GAAG,CAAC,CAYrE,CAAA"}

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

@@ -1,6 +1,6 @@
 'use client';
 
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
 import { components as SelectComponents } from 'react-select';
 import './index.scss';
@@ -12,12 +12,15 @@ export const ValueContainer = props => {
       customProps
     } = {}
   } = props;
-  return /*#__PURE__*/_jsx("div", {
+  return /*#__PURE__*/_jsxs("div", {
     className: baseClass,
     ref: customProps?.droppableRef,
-    children: /*#__PURE__*/_jsx(SelectComponents.ValueContainer, {
+    children: [customProps?.valueContainerLabel && /*#__PURE__*/_jsx("span", {
+      className: `${baseClass}__label`,
+      children: customProps?.valueContainerLabel
+    }), /*#__PURE__*/_jsx(SelectComponents.ValueContainer, {
       ...props
-    })
+    })]
   });
 };
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","components","SelectComponents","baseClass","ValueContainer","props","selectProps","customProps","_jsx","className","ref","droppableRef"],"sources":["../../../../src/elements/ReactSelect/ValueContainer/index.tsx"],"sourcesContent":["'use client'\nimport type { ValueContainerProps } from 'react-select'\n\nimport React from 'react'\nimport { components as SelectComponents } from 'react-select'\n\nimport type { Option } from '../types.js'\n\nimport './index.scss'\n\nconst baseClass = 'value-container'\n\nexport const ValueContainer: React.FC<ValueContainerProps<Option, any>> = (props) => {\n  // @ts-expect-error-next-line // TODO Fix this - moduleResolution 16 breaks our declare module\n  const { selectProps: { customProps } = {} } = props\n\n  return (\n    <div className={baseClass} ref={customProps?.droppableRef}>\n      <SelectComponents.ValueContainer {...props} />\n    </div>\n  )\n}\n"],"mappings":"AAAA;;;AAGA,OAAOA,KAAA,MAAW;AAClB,SAASC,UAAA,IAAcC,gBAAgB,QAAQ;AAI/C,OAAO;AAEP,MAAMC,SAAA,GAAY;AAElB,OAAO,MAAMC,cAAA,GAA8DC,KAAA;EACzE;EACA,MAAM;IAAEC,WAAA,EAAa;MAAEC;IAAW,CAAE,GAAG,CAAC;EAAC,CAAE,GAAGF,KAAA;EAE9C,oBACEG,IAAA,CAAC;IAAIC,SAAA,EAAWN,SAAA;IAAWO,GAAA,EAAKH,WAAA,EAAaI,YAAA;cAC3C,aAAAH,IAAA,CAACN,gBAAA,CAAiBE,cAAc;MAAE,GAAGC;;;AAG3C","ignoreList":[]}
+{"version":3,"file":"index.js","names":["React","components","SelectComponents","baseClass","ValueContainer","props","selectProps","customProps","_jsxs","className","ref","droppableRef","valueContainerLabel","_jsx"],"sources":["../../../../src/elements/ReactSelect/ValueContainer/index.tsx"],"sourcesContent":["'use client'\nimport type { ValueContainerProps } from 'react-select'\n\nimport React from 'react'\nimport { components as SelectComponents } from 'react-select'\n\nimport type { Option } from '../types.js'\n\nimport './index.scss'\n\nconst baseClass = 'value-container'\n\nexport const ValueContainer: React.FC<ValueContainerProps<Option, any>> = (props) => {\n  // @ts-expect-error-next-line // TODO Fix this - moduleResolution 16 breaks our declare module\n  const { selectProps: { customProps } = {} } = props\n\n  return (\n    <div className={baseClass} ref={customProps?.droppableRef}>\n      {customProps?.valueContainerLabel && (\n        <span className={`${baseClass}__label`}>{customProps?.valueContainerLabel}</span>\n      )}\n      <SelectComponents.ValueContainer {...props} />\n    </div>\n  )\n}\n"],"mappings":"AAAA;;;AAGA,OAAOA,KAAA,MAAW;AAClB,SAASC,UAAA,IAAcC,gBAAgB,QAAQ;AAI/C,OAAO;AAEP,MAAMC,SAAA,GAAY;AAElB,OAAO,MAAMC,cAAA,GAA8DC,KAAA;EACzE;EACA,MAAM;IAAEC,WAAA,EAAa;MAAEC;IAAW,CAAE,GAAG,CAAC;EAAC,CAAE,GAAGF,KAAA;EAE9C,oBACEG,KAAA,CAAC;IAAIC,SAAA,EAAWN,SAAA;IAAWO,GAAA,EAAKH,WAAA,EAAaI,YAAA;eAC1CJ,WAAA,EAAaK,mBAAA,iBACZC,IAAA,CAAC;MAAKJ,SAAA,EAAW,GAAGN,SAAA,SAAkB;gBAAGI,WAAA,EAAaK;qBAExDC,IAAA,CAACX,gBAAA,CAAiBE,cAAc;MAAE,GAAGC;;;AAG3C","ignoreList":[]}

package/dist/elements/ReactSelect/ValueContainer/index.scss

@@ -4,6 +4,14 @@
   .value-container {
     flex-grow: 1;
     min-width: 0;
+    display: flex;
+    align-items: center;
+    flex-direction: row;
+    gap: calc(var(--base) / 2);
+
+    &__label {
+      color: var(--theme-elevation-550);
+    }
 
     .rs__value-container {
       overflow: visible;

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

@@ -19,6 +19,7 @@ type CustomSelectProps = {
     }) => void;
     onDuplicate?: DocumentDrawerProps['onSave'];
     onSave?: DocumentDrawerProps['onSave'];
+    valueContainerLabel?: string;
 };
 declare module 'react-select/dist/declarations/src/Select' {
     interface Props<Option, IsMulti extends boolean, Group extends GroupBase<Option>> {

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}\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  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":"AA4DA","ignoreList":[]}
+{"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  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":[]}

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

@@ -8,6 +8,7 @@ type RelationshipTableComponentProps = {
     readonly BeforeInput?: React.ReactNode;
     readonly disableTable?: boolean;
     readonly field: JoinFieldClient;
+    readonly fieldPath?: string;
     readonly filterOptions?: Where;
     readonly initialData?: PaginatedDocs;
     readonly initialDrawerData?: DocumentDrawerProps['initialData'];

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/RelationshipTable/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,KAAK,cAAc,EAEnB,KAAK,eAAe,EAEpB,KAAK,aAAa,EAClB,KAAK,KAAK,EACX,MAAM,SAAS,CAAA;AAEhB,OAAO,KAAqD,MAAM,OAAO,CAAA;AAEzE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,4BAA4B,CAAA;AAoBrE,OAAO,cAAc,CAAA;AAIrB,KAAK,+BAA+B,GAAG;IACrC,QAAQ,CAAC,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACrC,QAAQ,CAAC,WAAW,CAAC,EAAE,OAAO,CAAA;IAC9B,QAAQ,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtC,QAAQ,CAAC,YAAY,CAAC,EAAE,OAAO,CAAA;IAC/B,QAAQ,CAAC,KAAK,EAAE,eAAe,CAAA;IAC/B,QAAQ,CAAC,aAAa,CAAC,EAAE,KAAK,CAAA;IAC9B,QAAQ,CAAC,WAAW,CAAC,EAAE,aAAa,CAAA;IACpC,QAAQ,CAAC,iBAAiB,CAAC,EAAE,mBAAmB,CAAC,aAAa,CAAC,CAAA;IAC/D,QAAQ,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAChC,QAAQ,CAAC,MAAM,CAAC,EAAE;QAChB,cAAc,EAAE,cAAc,CAAA;QAC9B,EAAE,EAAE,MAAM,GAAG,MAAM,CAAA;QACnB,QAAQ,EAAE,MAAM,CAAA;KACjB,CAAA;IACD,QAAQ,CAAC,UAAU,EAAE,MAAM,GAAG,MAAM,EAAE,CAAA;CACvC,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,+BAA+B,CAkUvE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/RelationshipTable/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,KAAK,cAAc,EAEnB,KAAK,eAAe,EAEpB,KAAK,aAAa,EAClB,KAAK,KAAK,EACX,MAAM,SAAS,CAAA;AAEhB,OAAO,KAAqD,MAAM,OAAO,CAAA;AAEzE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,4BAA4B,CAAA;AAoBrE,OAAO,cAAc,CAAA;AAIrB,KAAK,+BAA+B,GAAG;IACrC,QAAQ,CAAC,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACrC,QAAQ,CAAC,WAAW,CAAC,EAAE,OAAO,CAAA;IAC9B,QAAQ,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtC,QAAQ,CAAC,YAAY,CAAC,EAAE,OAAO,CAAA;IAC/B,QAAQ,CAAC,KAAK,EAAE,eAAe,CAAA;IAC/B,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,aAAa,CAAC,EAAE,KAAK,CAAA;IAC9B,QAAQ,CAAC,WAAW,CAAC,EAAE,aAAa,CAAA;IACpC,QAAQ,CAAC,iBAAiB,CAAC,EAAE,mBAAmB,CAAC,aAAa,CAAC,CAAA;IAC/D,QAAQ,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAChC,QAAQ,CAAC,MAAM,CAAC,EAAE;QAChB,cAAc,EAAE,cAAc,CAAA;QAC9B,EAAE,EAAE,MAAM,GAAG,MAAM,CAAA;QACnB,QAAQ,EAAE,MAAM,CAAA;KACjB,CAAA;IACD,QAAQ,CAAC,UAAU,EAAE,MAAM,GAAG,MAAM,EAAE,CAAA;CACvC,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,+BAA+B,CAoUvE,CAAA"}

package/dist/elements/RelationshipTable/index.js

@@ -31,6 +31,7 @@ export const RelationshipTable = props => {
     BeforeInput,
     disableTable = false,
     field,
+    fieldPath,
     filterOptions,
     initialData: initialDataFromProps,
     initialDrawerData,
@@ -208,6 +209,7 @@ export const RelationshipTable = props => {
           }),
           onClick: () => setOpenColumnSelector(!openColumnSelector),
           pillStyle: "light",
+          size: "small",
           children: t('general:columns')
         })]
       })]
@@ -234,7 +236,7 @@ export const RelationshipTable = props => {
           defaultSort: field.defaultSort ?? collectionConfig?.defaultSort,
           modifySearchParams: false,
           onQueryChange: setQuery,
-          orderableFieldName: !field.orderable || Array.isArray(field.collection) ? undefined : `_${field.collection}_${field.name}_order`,
+          orderableFieldName: !field.orderable || Array.isArray(field.collection) ? undefined : `_${field.collection}_${fieldPath.replaceAll('.', '_')}_order`,
           children: /*#__PURE__*/_jsxs(TableColumnsProvider, {
             collectionSlug: Array.isArray(relationTo) ? relationTo[0] : relationTo,
             columnState: columnState,