@payloadcms/ui 4.0.0-internal.5f0cd13 → 4.0.0-internal.688c4d0

package/dist/elements/TimezonePicker/index.css

@@ -6,6 +6,12 @@
     align-items: center;
     position: relative;
 
+    --field-min-height: var(--text-body-medium-line-height);
+
+    .shimmer-effect {
+      max-width: calc(2 * var(--spacer-4));
+    }
+
     .timezone-picker__label {
       color: var(--color-text-secondary);
       flex-shrink: 0;
@@ -25,30 +31,6 @@
       display: inline-flex;
       position: static;
 
-      .rs__menu {
-        overflow: hidden;
-        border-radius: var(--radius-large);
-        background: var(--popup-bg-dark, var(--color-bg-menu));
-        color: var(--popup-item-color-dark, var(--color-text-ontooltip));
-        padding: var(--spacer-2);
-        min-width: 280px;
-        max-height: 280px;
-      }
-
-      .rs__menu-list {
-        max-height: calc(var(--spacer-6) * 5);
-        overflow-y: auto;
-      }
-
-      .rs__option {
-        padding: var(--spacer-1) var(--spacer-2);
-        border-radius: var(--button-radius);
-        cursor: pointer;
-        overflow: hidden;
-        text-overflow: ellipsis;
-        white-space: nowrap;
-      }
-
       .rs__option--is-focused,
       .rs__option--is-selected {
         /* Colors handled by inline styles via react-select styles prop */
@@ -163,4 +145,56 @@
       }
     }
   }
+
+  .timezone-picker__menu {
+    border-radius: var(--radius-large);
+    background: var(--color-bg-menu);
+    color: var(--color-text);
+    padding-top: var(--spacer-2);
+    min-width: 280px;
+
+    .rs__option {
+      padding: var(--spacer-1) var(--spacer-2);
+      border-radius: var(--button-radius);
+      cursor: pointer;
+    }
+
+    .timezone-picker__option-check {
+      opacity: 0;
+      flex-shrink: 0;
+    }
+
+    .timezone-picker__option-label {
+      flex: 1;
+      min-width: 0;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+
+    .rs__option--is-focused {
+      background-color: var(--popup-item-bg-hover, var(--color-bg-selected-strong));
+      color: var(--popup-item-color-hover, var(--color-text-onselected-strong));
+    }
+
+    .rs__option--is-selected {
+      background-color: transparent;
+      color: var(--popup-item-color-selected, var(--popup-item-color, var(--color-text)));
+
+      .timezone-picker__option-check {
+        opacity: 1;
+      }
+    }
+
+    .rs__option--is-selected.rs__option--is-focused {
+      background-color: var(--popup-item-bg-hover, var(--color-bg-selected-strong));
+      color: var(--popup-item-color-hover, var(--color-text-onselected-strong));
+    }
+  }
+
+  .timezone-picker__menu-list {
+    max-height: calc(var(--spacer-6) * 5);
+    padding-inline: var(--spacer-2);
+    padding-bottom: var(--spacer-2);
+  }
 }

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/TimezonePicker/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAO9B,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAOvC,OAAO,aAAa,CAAA;AAqDpB,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAsE1C,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/TimezonePicker/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAa9B,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAQvC,OAAO,aAAa,CAAA;AAgEpB,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAuE1C,CAAA"}

package/dist/elements/TimezonePicker/index.js

@@ -2,6 +2,8 @@
 
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useMemo } from 'react';
+import { components as rsComponents } from 'react-select';
+import { CheckIcon } from '../../icons/Check/index.js';
 import { ChevronIcon } from '../../icons/Chevron/index.js';
 import { CircledXIcon } from '../../icons/CircledX/index.js';
 import { useTranslation } from '../../providers/Translation/index.js';
@@ -55,6 +57,21 @@ const SmallClearIndicator = props => {
     })
   });
 };
+const TimezoneOption = props => {
+  const {
+    children
+  } = props;
+  return /*#__PURE__*/_jsxs(rsComponents.Option, {
+    ...props,
+    children: [/*#__PURE__*/_jsx(CheckIcon, {
+      className: "timezone-picker__option-check",
+      size: 16
+    }), /*#__PURE__*/_jsx("span", {
+      className: "timezone-picker__option-label",
+      children: children
+    })]
+  });
+};
 export const TimezonePicker = props => {
   const {
     id,
@@ -85,9 +102,17 @@ export const TimezonePicker = props => {
       })]
     }), /*#__PURE__*/_jsx(ReactSelect, {
       className: "timezone-picker",
+      classNames: {
+        menu: () => 'timezone-picker__menu',
+        menuList: () => 'timezone-picker__menu-list'
+      },
       components: {
         ClearIndicator: SmallClearIndicator,
-        DropdownIndicator: SmallDropdownIndicator
+        DropdownIndicator: SmallDropdownIndicator,
+        Option: TimezoneOption
+      },
+      customProps: {
+        menuPortalTheme: 'dark'
       },
       disabled: readOnly,
       inputId: id,
@@ -105,10 +130,12 @@ export const TimezonePicker = props => {
           ...base,
           flexWrap: 'nowrap'
         }),
-        option: (base_0, state) => ({
+        option: base_0 => ({
           ...base_0,
-          backgroundColor: state.isSelected ? 'var(--popup-item-bg-selected-dark, var(--color-bg-selected))' : state.isFocused ? 'var(--popup-item-bg-hover-dark, var(--color-bg-selected-strong))' : 'transparent',
-          color: state.isFocused || state.isSelected ? 'var(--popup-item-color-hover-dark, var(--color-text-onselected-strong))' : 'var(--popup-item-color-dark, var(--color-text-ontooltip))'
+          alignItems: 'center',
+          display: 'flex',
+          gap: 'var(--spacer-1)',
+          minWidth: 0
         })
       },
       value: selectedTimezone

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["useMemo","ChevronIcon","CircledXIcon","useTranslation","ReactSelect","formatOptions","SmallDropdownIndicator","props","innerProps","ref","restInnerProps","_jsx","className","onKeyDown","e","key","type","size","SmallClearIndicator","clearValue","stopPropagation","role","tabIndex","TimezonePicker","id","onChange","onChangeFromProps","options","optionsFromProps","readOnly","readOnlyFromProps","required","selectedTimezone","selectedTimezoneFromProps","t","find","value","Boolean","length","_jsxs","components","ClearIndicator","DropdownIndicator","disabled","inputId","isClearable","isCreatable","val","placeholder","styles","control","base","flexWrap","option","state","backgroundColor","isSelected","isFocused","color"],"sources":["../../../src/elements/TimezonePicker/index.tsx"],"sourcesContent":["'use client'\n\nimport type { OptionObject } from 'payload'\nimport type React from 'react'\nimport type { JSX } from 'react'\nimport type { ClearIndicatorProps, DropdownIndicatorProps, StylesConfig } from 'react-select'\n\nimport { useMemo } from 'react'\n\nimport type { Option as OptionType } from '../ReactSelect/types.js'\nimport type { Props } from './types.js'\n\nimport { ChevronIcon } from '../../icons/Chevron/index.js'\nimport { CircledXIcon } from '../../icons/CircledX/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { ReactSelect } from '../ReactSelect/index.js'\nimport { formatOptions } from '../WhereBuilder/Condition/Select/formatOptions.js'\nimport './index.css'\n\nconst SmallDropdownIndicator: React.FC<\n  {\n    innerProps: JSX.IntrinsicElements['button']\n  } & DropdownIndicatorProps<OptionType, true>\n> = (props) => {\n  const {\n    innerProps: { ref, ...restInnerProps },\n  } = props\n\n  return (\n    <button\n      className=\"timezone-picker__dropdown-indicator\"\n      ref={ref}\n      {...restInnerProps}\n      onKeyDown={(e) => {\n        if (e.key === 'Enter') {\n          e.key = ' '\n        }\n      }}\n      type=\"button\"\n    >\n      <ChevronIcon size={16} />\n    </button>\n  )\n}\n\nconst SmallClearIndicator: React.FC<ClearIndicatorProps<OptionType, true>> = (props) => {\n  const {\n    clearValue,\n    innerProps: { ref, ...restInnerProps },\n  } = props\n\n  return (\n    <div\n      className=\"timezone-picker__clear-indicator\"\n      ref={typeof ref === 'string' ? null : ref}\n      {...restInnerProps}\n      onKeyDown={(e) => {\n        if (e.key === 'Enter') {\n          clearValue()\n          e.stopPropagation()\n        }\n      }}\n      role=\"button\"\n      tabIndex={0}\n    >\n      <CircledXIcon size={24} />\n    </div>\n  )\n}\n\nexport const TimezonePicker: React.FC<Props> = (props) => {\n  const {\n    id,\n    onChange: onChangeFromProps,\n    options: optionsFromProps,\n    readOnly: readOnlyFromProps,\n    required,\n    selectedTimezone: selectedTimezoneFromProps,\n  } = props\n\n  const { t } = useTranslation()\n\n  const options = formatOptions(optionsFromProps)\n\n  const selectedTimezone = useMemo(() => {\n    return options.find((t) => {\n      const value = typeof t === 'string' ? t : t.value\n      return value === selectedTimezoneFromProps\n    })\n  }, [options, selectedTimezoneFromProps])\n\n  const readOnly = Boolean(readOnlyFromProps) || options.length === 1\n\n  return (\n    <div className=\"timezone-picker-wrapper\">\n      <span className=\"timezone-picker__label\">\n        {t('general:timezone')}\n        {required && <span className=\"timezone-picker__required\">*</span>}\n      </span>\n      <ReactSelect\n        className=\"timezone-picker\"\n        components={{\n          ClearIndicator: SmallClearIndicator,\n          DropdownIndicator: SmallDropdownIndicator,\n        }}\n        disabled={readOnly}\n        inputId={id}\n        isClearable={!required}\n        isCreatable={false}\n        onChange={(val: OptionObject) => {\n          if (onChangeFromProps) {\n            onChangeFromProps(val?.value || '')\n          }\n        }}\n        options={options}\n        placeholder={t('general:none')}\n        styles={\n          {\n            control: (base) => ({\n              ...base,\n              flexWrap: 'nowrap',\n            }),\n            option: (base, state) => ({\n              ...base,\n              backgroundColor: state.isSelected\n                ? 'var(--popup-item-bg-selected-dark, var(--color-bg-selected))'\n                : state.isFocused\n                  ? 'var(--popup-item-bg-hover-dark, var(--color-bg-selected-strong))'\n                  : 'transparent',\n              color:\n                state.isFocused || state.isSelected\n                  ? 'var(--popup-item-color-hover-dark, var(--color-text-onselected-strong))'\n                  : 'var(--popup-item-color-dark, var(--color-text-ontooltip))',\n            }),\n          } as StylesConfig<OptionType>\n        }\n        value={selectedTimezone}\n      />\n    </div>\n  )\n}\n"],"mappings":"AAAA;;;AAOA,SAASA,OAAO,QAAQ;AAKxB,SAASC,WAAW,QAAQ;AAC5B,SAASC,YAAY,QAAQ;AAC7B,SAASC,cAAc,QAAQ;AAC/B,SAASC,WAAW,QAAQ;AAC5B,SAASC,aAAa,QAAQ;AAC9B,OAAO;AAEP,MAAMC,sBAAA,GAIDC,KAAA;EACH,MAAM;IACJC,UAAA,EAAY;MAAEC,GAAG;MAAE,GAAGC;IAAA;EAAgB,CACvC,GAAGH,KAAA;EAEJ,oBACEI,IAAA,CAAC;IACCC,SAAA,EAAU;IACVH,GAAA,EAAKA,GAAA;IACJ,GAAGC,cAAc;IAClBG,SAAA,EAAYC,CAAA;MACV,IAAIA,CAAA,CAAEC,GAAG,KAAK,SAAS;QACrBD,CAAA,CAAEC,GAAG,GAAG;MACV;IACF;IACAC,IAAA,EAAK;cAEL,aAAAL,IAAA,CAACV,WAAA;MAAYgB,IAAA,EAAM;;;AAGzB;AAEA,MAAMC,mBAAA,GAAwEX,KAAA;EAC5E,MAAM;IACJY,UAAU;IACVX,UAAA,EAAY;MAAEC,GAAG;MAAE,GAAGC;IAAA;EAAgB,CACvC,GAAGH,KAAA;EAEJ,oBACEI,IAAA,CAAC;IACCC,SAAA,EAAU;IACVH,GAAA,EAAK,OAAOA,GAAA,KAAQ,WAAW,OAAOA,GAAA;IACrC,GAAGC,cAAc;IAClBG,SAAA,EAAYC,CAAA;MACV,IAAIA,CAAA,CAAEC,GAAG,KAAK,SAAS;QACrBI,UAAA;QACAL,CAAA,CAAEM,eAAe;MACnB;IACF;IACAC,IAAA,EAAK;IACLC,QAAA,EAAU;cAEV,aAAAX,IAAA,CAACT,YAAA;MAAae,IAAA,EAAM;;;AAG1B;AAEA,OAAO,MAAMM,cAAA,GAAmChB,KAAA;EAC9C,MAAM;IACJiB,EAAE;IACFC,QAAA,EAAUC,iBAAiB;IAC3BC,OAAA,EAASC,gBAAgB;IACzBC,QAAA,EAAUC,iBAAiB;IAC3BC,QAAQ;IACRC,gBAAA,EAAkBC;EAAyB,CAC5C,GAAG1B,KAAA;EAEJ,MAAM;IAAE2B;EAAC,CAAE,GAAG/B,cAAA;EAEd,MAAMwB,OAAA,GAAUtB,aAAA,CAAcuB,gBAAA;EAE9B,MAAMI,gBAAA,GAAmBhC,OAAA,CAAQ;IAC/B,OAAO2B,OAAA,CAAQQ,IAAI,CAAED,GAAA;MACnB,MAAME,KAAA,GAAQ,OAAOF,GAAA,KAAM,WAAWA,GAAA,GAAIA,GAAA,CAAEE,KAAK;MACjD,OAAOA,KAAA,KAAUH,yBAAA;IACnB;EACF,GAAG,CAACN,OAAA,EAASM,yBAAA,CAA0B;EAEvC,MAAMJ,QAAA,GAAWQ,OAAA,CAAQP,iBAAA,KAAsBH,OAAA,CAAQW,MAAM,KAAK;EAElE,oBACEC,KAAA,CAAC;IAAI3B,SAAA,EAAU;4BACb2B,KAAA,CAAC;MAAK3B,SAAA,EAAU;iBACbsB,CAAA,CAAE,qBACFH,QAAA,iBAAYpB,IAAA,CAAC;QAAKC,SAAA,EAAU;kBAA4B;;qBAE3DD,IAAA,CAACP,WAAA;MACCQ,SAAA,EAAU;MACV4B,UAAA,EAAY;QACVC,cAAA,EAAgBvB,mBAAA;QAChBwB,iBAAA,EAAmBpC;MACrB;MACAqC,QAAA,EAAUd,QAAA;MACVe,OAAA,EAASpB,EAAA;MACTqB,WAAA,EAAa,CAACd,QAAA;MACde,WAAA,EAAa;MACbrB,QAAA,EAAWsB,GAAA;QACT,IAAIrB,iBAAA,EAAmB;UACrBA,iBAAA,CAAkBqB,GAAA,EAAKX,KAAA,IAAS;QAClC;MACF;MACAT,OAAA,EAASA,OAAA;MACTqB,WAAA,EAAad,CAAA,CAAE;MACfe,MAAA,EACE;QACEC,OAAA,EAAUC,IAAA,KAAU;UAClB,GAAGA,IAAI;UACPC,QAAA,EAAU;QACZ;QACAC,MAAA,EAAQA,CAACF,MAAA,EAAMG,KAAA,MAAW;UACxB,GAAGH,MAAI;UACPI,eAAA,EAAiBD,KAAA,CAAME,UAAU,GAC7B,iEACAF,KAAA,CAAMG,SAAS,GACb,qEACA;UACNC,KAAA,EACEJ,KAAA,CAAMG,SAAS,IAAIH,KAAA,CAAME,UAAU,GAC/B,4EACA;QACR;MACF;MAEFpB,KAAA,EAAOJ;;;AAIf","ignoreList":[]}
+{"version":3,"file":"index.js","names":["useMemo","components","rsComponents","CheckIcon","ChevronIcon","CircledXIcon","useTranslation","ReactSelect","formatOptions","SmallDropdownIndicator","props","innerProps","ref","restInnerProps","_jsx","className","onKeyDown","e","key","type","size","SmallClearIndicator","clearValue","stopPropagation","role","tabIndex","TimezoneOption","children","_jsxs","Option","TimezonePicker","id","onChange","onChangeFromProps","options","optionsFromProps","readOnly","readOnlyFromProps","required","selectedTimezone","selectedTimezoneFromProps","t","find","value","Boolean","length","classNames","menu","menuList","ClearIndicator","DropdownIndicator","customProps","menuPortalTheme","disabled","inputId","isClearable","isCreatable","val","placeholder","styles","control","base","flexWrap","option","alignItems","display","gap","minWidth"],"sources":["../../../src/elements/TimezonePicker/index.tsx"],"sourcesContent":["'use client'\n\nimport type { OptionObject } from 'payload'\nimport type React from 'react'\nimport type { JSX } from 'react'\nimport type {\n  ClearIndicatorProps,\n  DropdownIndicatorProps,\n  OptionProps,\n  StylesConfig,\n} from 'react-select'\n\nimport { useMemo } from 'react'\nimport { components as rsComponents } from 'react-select'\n\nimport type { Option as OptionType } from '../ReactSelect/types.js'\nimport type { Props } from './types.js'\n\nimport { CheckIcon } from '../../icons/Check/index.js'\nimport { ChevronIcon } from '../../icons/Chevron/index.js'\nimport { CircledXIcon } from '../../icons/CircledX/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { ReactSelect } from '../ReactSelect/index.js'\nimport { formatOptions } from '../WhereBuilder/Condition/Select/formatOptions.js'\nimport './index.css'\n\nconst SmallDropdownIndicator: React.FC<\n  {\n    innerProps: JSX.IntrinsicElements['button']\n  } & DropdownIndicatorProps<OptionType, true>\n> = (props) => {\n  const {\n    innerProps: { ref, ...restInnerProps },\n  } = props\n\n  return (\n    <button\n      className=\"timezone-picker__dropdown-indicator\"\n      ref={ref}\n      {...restInnerProps}\n      onKeyDown={(e) => {\n        if (e.key === 'Enter') {\n          e.key = ' '\n        }\n      }}\n      type=\"button\"\n    >\n      <ChevronIcon size={16} />\n    </button>\n  )\n}\n\nconst SmallClearIndicator: React.FC<ClearIndicatorProps<OptionType, true>> = (props) => {\n  const {\n    clearValue,\n    innerProps: { ref, ...restInnerProps },\n  } = props\n\n  return (\n    <div\n      className=\"timezone-picker__clear-indicator\"\n      ref={typeof ref === 'string' ? null : ref}\n      {...restInnerProps}\n      onKeyDown={(e) => {\n        if (e.key === 'Enter') {\n          clearValue()\n          e.stopPropagation()\n        }\n      }}\n      role=\"button\"\n      tabIndex={0}\n    >\n      <CircledXIcon size={24} />\n    </div>\n  )\n}\n\nconst TimezoneOption: React.FC<OptionProps<OptionType, false>> = (props) => {\n  const { children } = props\n\n  return (\n    <rsComponents.Option {...props}>\n      <CheckIcon className=\"timezone-picker__option-check\" size={16} />\n      <span className=\"timezone-picker__option-label\">{children}</span>\n    </rsComponents.Option>\n  )\n}\n\nexport const TimezonePicker: React.FC<Props> = (props) => {\n  const {\n    id,\n    onChange: onChangeFromProps,\n    options: optionsFromProps,\n    readOnly: readOnlyFromProps,\n    required,\n    selectedTimezone: selectedTimezoneFromProps,\n  } = props\n\n  const { t } = useTranslation()\n\n  const options = formatOptions(optionsFromProps)\n\n  const selectedTimezone = useMemo(() => {\n    return options.find((t) => {\n      const value = typeof t === 'string' ? t : t.value\n      return value === selectedTimezoneFromProps\n    })\n  }, [options, selectedTimezoneFromProps])\n\n  const readOnly = Boolean(readOnlyFromProps) || options.length === 1\n\n  return (\n    <div className=\"timezone-picker-wrapper\">\n      <span className=\"timezone-picker__label\">\n        {t('general:timezone')}\n        {required && <span className=\"timezone-picker__required\">*</span>}\n      </span>\n      <ReactSelect\n        className=\"timezone-picker\"\n        classNames={{\n          menu: () => 'timezone-picker__menu',\n          menuList: () => 'timezone-picker__menu-list',\n        }}\n        components={{\n          ClearIndicator: SmallClearIndicator,\n          DropdownIndicator: SmallDropdownIndicator,\n          Option: TimezoneOption,\n        }}\n        customProps={{ menuPortalTheme: 'dark' }}\n        disabled={readOnly}\n        inputId={id}\n        isClearable={!required}\n        isCreatable={false}\n        onChange={(val: OptionObject) => {\n          if (onChangeFromProps) {\n            onChangeFromProps(val?.value || '')\n          }\n        }}\n        options={options}\n        placeholder={t('general:none')}\n        styles={\n          {\n            control: (base) => ({\n              ...base,\n              flexWrap: 'nowrap',\n            }),\n            option: (base) => ({\n              ...base,\n              alignItems: 'center',\n              display: 'flex',\n              gap: 'var(--spacer-1)',\n              minWidth: 0,\n            }),\n          } as StylesConfig<OptionType>\n        }\n        value={selectedTimezone}\n      />\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/Tooltip/index.css

@@ -5,12 +5,15 @@
     --caret-offset: 4px;
     --caret-border-color: var(--color-border);
     --tooltip-x: -50%;
+    --tooltip-caret-x: 0px;
+    --tooltip-max-width: none;
 
     opacity: 0;
     background-color: var(--color-bg-tooltip);
     position: absolute;
     z-index: 3;
     left: 50%;
+    max-width: var(--tooltip-max-width);
     padding: var(--spacer-1);
     color: var(--color-text-ontooltip);
     font-family: var(--text-body-medium-font-family);
@@ -48,6 +51,11 @@
     }
   }
 
+  .tooltip--wrap {
+    white-space: normal;
+    overflow-wrap: break-word;
+  }
+
   .tooltip__caret {
     position: absolute;
     pointer-events: none;
@@ -87,7 +95,11 @@
 
   .tooltip--position-top {
     top: 0;
-    transform: translate3d(var(--tooltip-x), calc(-100% - var(--caret-height) - var(--caret-offset) + 1px), 0);
+    transform: translate3d(
+      var(--tooltip-x),
+      calc(-100% - var(--caret-height) - var(--caret-offset) + 1px),
+      0
+    );
 
     .tooltip__caret {
       --color-border: var(--ramp-grey-700);
@@ -95,13 +107,17 @@
     }
 
     &.tooltip--caret-center .tooltip__caret {
-      transform: translateX(-50%);
+      transform: translateX(calc(-50% + var(--tooltip-caret-x)));
     }
   }
 
   .tooltip--position-bottom {
     top: 100%;
-    transform: translate3d(-50%, calc(var(--caret-height) + var(--caret-offset) - 1px), 0);
+    transform: translate3d(
+      var(--tooltip-x),
+      calc(var(--caret-height) + var(--caret-offset) - 1px),
+      0
+    );
 
     .tooltip__caret {
       bottom: calc(100% - 0.5px);
@@ -109,7 +125,7 @@
     }
 
     &.tooltip--caret-center .tooltip__caret {
-      transform: translateX(-50%) rotate(180deg);
+      transform: translateX(calc(-50% + var(--tooltip-caret-x))) rotate(180deg);
     }
 
     &.tooltip--caret-right .tooltip__caret {

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Tooltip/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAoB,MAAM,OAAO,CAAA;AAGxC,OAAO,aAAa,CAAA;AAEpB,MAAM,MAAM,KAAK,GAAG;IAClB,UAAU,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAA;IACxC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;IACjD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,CAAA;IAC9C,IAAI,CAAC,EAAE,OAAO,CAAA;IACd;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAA;CAC5B,CAAA;AAsBD,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAkFnC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Tooltip/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAA4D,MAAM,OAAO,CAAA;AAGhF,OAAO,aAAa,CAAA;AAwBpB,MAAM,MAAM,KAAK,GAAG;IAClB,UAAU,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAA;IACxC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;IACjD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,CAAA;IAC9C,IAAI,CAAC,EAAE,OAAO,CAAA;IACd;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAA;CAC5B,CAAA;AAsBD,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAsJnC,CAAA"}

package/dist/elements/Tooltip/index.js

@@ -2,9 +2,24 @@
 
 import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React, { useEffect } from 'react';
+import React, { useCallback, useEffect, useLayoutEffect, useState } from 'react';
 import { useIntersect } from '../../hooks/useIntersect.js';
 import './index.css';
+// Breathing room (px) between a shifted tooltip and its clipping edge. Maps to `--spacer-1`.
+const EDGE_GUTTER = 4;
+const getClipBoundary = el => {
+  let current = el?.parentElement || null;
+  while (current) {
+    const {
+      overflowX
+    } = window.getComputedStyle(current);
+    if (overflowX === 'auto' || overflowX === 'clip' || overflowX === 'hidden' || overflowX === 'scroll') {
+      return current.getBoundingClientRect();
+    }
+    current = current.parentElement;
+  }
+  return null;
+};
 const TooltipCaret = () => {
   const $ = _c(2);
   const clipId = React.useId();
@@ -53,7 +68,9 @@ export const Tooltip = props => {
   } = props;
   const [show, setShow] = React.useState(showFromProps);
   const [position, setPosition] = React.useState('top');
-  const [ref, intersectionEntry] = useIntersect({
+  const [shiftX, setShiftX] = useState(0);
+  const [maxWidth, setMaxWidth] = useState(null);
+  const [ref, intersectionEntry, node] = useIntersect({
     root: boundingRef?.current || null,
     rootMargin: '-145px 0px 0px 100px',
     threshold: 0
@@ -80,6 +97,48 @@ export const Tooltip = props => {
     }
     setPosition(intersectionEntry?.isIntersecting ? 'top' : 'bottom');
   }, [intersectionEntry, staticPositioning]);
+  // Keep a horizontally-centered tooltip (top/bottom) inside its boundary by
+  // shifting it inward by exactly the amount it would overflow. The hidden
+  // measuring aside (`node`) provides the natural, unshifted geometry.
+  const computeShift = useCallback(() => {
+    const usesHorizontalCenter = (positionFromProps || position) === 'top' || (positionFromProps || position) === 'bottom';
+    if (staticPositioning || !node || !usesHorizontalCenter) {
+      setShiftX(0);
+      setMaxWidth(null);
+      return;
+    }
+    const rect = node.getBoundingClientRect();
+    const boundary = boundingRef?.current?.getBoundingClientRect() ?? getClipBoundary(node) ?? undefined;
+    const leftEdge = (boundary?.left ?? 0) + EDGE_GUTTER;
+    const rightEdge = (boundary?.right ?? window.innerWidth) - EDGE_GUTTER;
+    const available = rightEdge - leftEdge;
+    // When the tooltip can't fit even at full boundary width, cap it so it wraps.
+    const nextMaxWidth = rect.width > available ? available : null;
+    setMaxWidth(nextMaxWidth);
+    // Compute the shift against the clamped box, kept centered on the anchor.
+    const center = rect.left + rect.width / 2;
+    const effectiveWidth = nextMaxWidth ?? rect.width;
+    const effectiveLeft = center - effectiveWidth / 2;
+    const effectiveRight = center + effectiveWidth / 2;
+    let shift = 0;
+    if (effectiveRight > rightEdge) {
+      shift = rightEdge - effectiveRight;
+    }
+    if (effectiveLeft + shift < leftEdge) {
+      shift = leftEdge - effectiveLeft;
+    }
+    setShiftX(shift);
+  }, [boundingRef, node, position, positionFromProps, staticPositioning]);
+  useLayoutEffect(() => {
+    if (!show) {
+      return;
+    }
+    computeShift();
+    window.addEventListener('resize', computeShift);
+    return () => {
+      window.removeEventListener('resize', computeShift);
+    };
+  }, [show, computeShift]);
   // The first aside is always on top. The purpose of that is that it can reliably be used for the interaction observer (as it's not moving around), to calculate the position of the actual tooltip.
   return /*#__PURE__*/_jsxs(React.Fragment, {
     children: [!staticPositioning && /*#__PURE__*/_jsxs("aside", {
@@ -94,7 +153,16 @@ export const Tooltip = props => {
         children: children
       })]
     }), /*#__PURE__*/_jsxs("aside", {
-      className: ['tooltip', className, show && 'tooltip--show', `tooltip--caret-${alignCaret}`, `tooltip--position-${positionFromProps || position}`].filter(Boolean).join(' '),
+      className: ['tooltip', className, show && 'tooltip--show', maxWidth && 'tooltip--wrap', `tooltip--caret-${alignCaret}`, `tooltip--position-${positionFromProps || position}`].filter(Boolean).join(' '),
+      style: {
+        ...(maxWidth ? {
+          '--tooltip-max-width': `${maxWidth}px`
+        } : {}),
+        ...(shiftX ? {
+          '--tooltip-caret-x': `${-shiftX}px`,
+          '--tooltip-x': `calc(-50% + ${shiftX}px)`
+        } : {})
+      },
       children: [/*#__PURE__*/_jsx(TooltipCaret, {}), /*#__PURE__*/_jsx("div", {
         className: "tooltip-content",
         children: children

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","React","useEffect","useIntersect","TooltipCaret","$","clipId","useId","t0","_jsxs","className","height","viewBox","width","children","_jsx","id","x","y","clipPath","d","Tooltip","props","alignCaret","boundingRef","delay","position","positionFromProps","show","showFromProps","staticPositioning","setShow","useState","setPosition","ref","intersectionEntry","root","current","rootMargin","threshold","timerID","setTimeout","clearTimeout","isIntersecting","Fragment","filter","Boolean","join","style","opacity"],"sources":["../../../src/elements/Tooltip/index.tsx"],"sourcesContent":["'use client'\nimport React, { useEffect } from 'react'\n\nimport { useIntersect } from '../../hooks/useIntersect.js'\nimport './index.css'\n\nexport type Props = {\n  alignCaret?: 'center' | 'left' | 'right'\n  boundingRef?: React.RefObject<HTMLElement | null>\n  children: React.ReactNode\n  className?: string\n  delay?: number\n  position?: 'bottom' | 'left' | 'right' | 'top'\n  show?: boolean\n  /**\n   * If the tooltip position should not change depending on if the toolbar is outside the boundingRef. @default false\n   */\n  staticPositioning?: boolean\n}\n\nconst TooltipCaret: React.FC = () => {\n  const clipId = React.useId()\n\n  return (\n    <svg aria-hidden=\"true\" className=\"tooltip__caret\" height=\"14\" viewBox=\"0 0 14 14\" width=\"15\">\n      <clipPath id={clipId}>\n        <rect height=\"14\" width=\"15\" x=\"-0.5\" y=\"0.5\" />\n      </clipPath>\n      {/* Border stroke - clipped to hide top edge */}\n      <path\n        className=\"tooltip__caret-stroke\"\n        clipPath={`url(#${clipId})`}\n        d=\"M0,0 H14 L7.875,6.125 Q7,7 6.125,6.125 Z\"\n      />\n      {/* Fill path */}\n      <path className=\"tooltip__caret-fill\" d=\"M0,0 H14 L7.875,6.125 Q7,7 6.125,6.125 Z\" />\n    </svg>\n  )\n}\n\nexport const Tooltip: React.FC<Props> = (props) => {\n  const {\n    alignCaret = 'center',\n    boundingRef,\n    children,\n    className,\n    delay = 500,\n    position: positionFromProps,\n    show: showFromProps = true,\n    staticPositioning = false,\n  } = props\n\n  const [show, setShow] = React.useState(showFromProps)\n  const [position, setPosition] = React.useState<'bottom' | 'left' | 'right' | 'top'>('top')\n\n  const [ref, intersectionEntry] = useIntersect(\n    {\n      root: boundingRef?.current || null,\n      rootMargin: '-145px 0px 0px 100px',\n      threshold: 0,\n    },\n    staticPositioning,\n  )\n\n  useEffect(() => {\n    let timerID: NodeJS.Timeout\n\n    // do not use the delay on transition-out\n    if (delay && showFromProps) {\n      timerID = setTimeout(() => {\n        setShow(showFromProps)\n      }, delay)\n    } else {\n      setShow(showFromProps)\n    }\n\n    return () => {\n      if (timerID) {\n        clearTimeout(timerID)\n      }\n    }\n  }, [showFromProps, delay])\n\n  useEffect(() => {\n    if (staticPositioning) {\n      return\n    }\n    setPosition(intersectionEntry?.isIntersecting ? 'top' : 'bottom')\n  }, [intersectionEntry, staticPositioning])\n\n  // The first aside is always on top. The purpose of that is that it can reliably be used for the interaction observer (as it's not moving around), to calculate the position of the actual tooltip.\n  return (\n    <React.Fragment>\n      {!staticPositioning && (\n        <aside\n          aria-hidden=\"true\"\n          className={['tooltip', className, `tooltip--caret-${alignCaret}`, 'tooltip--position-top']\n            .filter(Boolean)\n            .join(' ')}\n          ref={ref}\n          style={{ opacity: '0' }}\n        >\n          <TooltipCaret />\n          <div className=\"tooltip-content\">{children}</div>\n        </aside>\n      )}\n      <aside\n        className={[\n          'tooltip',\n          className,\n          show && 'tooltip--show',\n          `tooltip--caret-${alignCaret}`,\n          `tooltip--position-${positionFromProps || position}`,\n        ]\n          .filter(Boolean)\n          .join(' ')}\n      >\n        <TooltipCaret />\n        <div className=\"tooltip-content\">{children}</div>\n      </aside>\n    </React.Fragment>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","React","useCallback","useEffect","useLayoutEffect","useState","useIntersect","EDGE_GUTTER","getClipBoundary","el","current","parentElement","overflowX","window","getComputedStyle","getBoundingClientRect","TooltipCaret","$","clipId","useId","t0","_jsxs","className","height","viewBox","width","children","_jsx","id","x","y","clipPath","d","Tooltip","props","alignCaret","boundingRef","delay","position","positionFromProps","show","showFromProps","staticPositioning","setShow","setPosition","shiftX","setShiftX","maxWidth","setMaxWidth","ref","intersectionEntry","node","root","rootMargin","threshold","timerID","setTimeout","clearTimeout","isIntersecting","computeShift","usesHorizontalCenter","rect","boundary","undefined","leftEdge","left","rightEdge","right","innerWidth","available","nextMaxWidth","center","effectiveWidth","effectiveLeft","effectiveRight","shift","addEventListener","removeEventListener","Fragment","filter","Boolean","join","style","opacity"],"sources":["../../../src/elements/Tooltip/index.tsx"],"sourcesContent":["'use client'\nimport React, { useCallback, useEffect, useLayoutEffect, useState } from 'react'\n\nimport { useIntersect } from '../../hooks/useIntersect.js'\nimport './index.css'\n\n// Breathing room (px) between a shifted tooltip and its clipping edge. Maps to `--spacer-1`.\nconst EDGE_GUTTER = 4\n\nconst getClipBoundary = (el: HTMLElement | null): DOMRect | null => {\n  let current = el?.parentElement || null\n\n  while (current) {\n    const { overflowX } = window.getComputedStyle(current)\n    if (\n      overflowX === 'auto' ||\n      overflowX === 'clip' ||\n      overflowX === 'hidden' ||\n      overflowX === 'scroll'\n    ) {\n      return current.getBoundingClientRect()\n    }\n    current = current.parentElement\n  }\n\n  return null\n}\n\nexport type Props = {\n  alignCaret?: 'center' | 'left' | 'right'\n  boundingRef?: React.RefObject<HTMLElement | null>\n  children: React.ReactNode\n  className?: string\n  delay?: number\n  position?: 'bottom' | 'left' | 'right' | 'top'\n  show?: boolean\n  /**\n   * If the tooltip position should not change depending on if the toolbar is outside the boundingRef. @default false\n   */\n  staticPositioning?: boolean\n}\n\nconst TooltipCaret: React.FC = () => {\n  const clipId = React.useId()\n\n  return (\n    <svg aria-hidden=\"true\" className=\"tooltip__caret\" height=\"14\" viewBox=\"0 0 14 14\" width=\"15\">\n      <clipPath id={clipId}>\n        <rect height=\"14\" width=\"15\" x=\"-0.5\" y=\"0.5\" />\n      </clipPath>\n      {/* Border stroke - clipped to hide top edge */}\n      <path\n        className=\"tooltip__caret-stroke\"\n        clipPath={`url(#${clipId})`}\n        d=\"M0,0 H14 L7.875,6.125 Q7,7 6.125,6.125 Z\"\n      />\n      {/* Fill path */}\n      <path className=\"tooltip__caret-fill\" d=\"M0,0 H14 L7.875,6.125 Q7,7 6.125,6.125 Z\" />\n    </svg>\n  )\n}\n\nexport const Tooltip: React.FC<Props> = (props) => {\n  const {\n    alignCaret = 'center',\n    boundingRef,\n    children,\n    className,\n    delay = 500,\n    position: positionFromProps,\n    show: showFromProps = true,\n    staticPositioning = false,\n  } = props\n\n  const [show, setShow] = React.useState(showFromProps)\n  const [position, setPosition] = React.useState<'bottom' | 'left' | 'right' | 'top'>('top')\n  const [shiftX, setShiftX] = useState(0)\n  const [maxWidth, setMaxWidth] = useState<null | number>(null)\n\n  const [ref, intersectionEntry, node] = useIntersect(\n    {\n      root: boundingRef?.current || null,\n      rootMargin: '-145px 0px 0px 100px',\n      threshold: 0,\n    },\n    staticPositioning,\n  )\n\n  useEffect(() => {\n    let timerID: NodeJS.Timeout\n\n    // do not use the delay on transition-out\n    if (delay && showFromProps) {\n      timerID = setTimeout(() => {\n        setShow(showFromProps)\n      }, delay)\n    } else {\n      setShow(showFromProps)\n    }\n\n    return () => {\n      if (timerID) {\n        clearTimeout(timerID)\n      }\n    }\n  }, [showFromProps, delay])\n\n  useEffect(() => {\n    if (staticPositioning) {\n      return\n    }\n    setPosition(intersectionEntry?.isIntersecting ? 'top' : 'bottom')\n  }, [intersectionEntry, staticPositioning])\n\n  // Keep a horizontally-centered tooltip (top/bottom) inside its boundary by\n  // shifting it inward by exactly the amount it would overflow. The hidden\n  // measuring aside (`node`) provides the natural, unshifted geometry.\n  const computeShift = useCallback(() => {\n    const usesHorizontalCenter =\n      (positionFromProps || position) === 'top' || (positionFromProps || position) === 'bottom'\n\n    if (staticPositioning || !node || !usesHorizontalCenter) {\n      setShiftX(0)\n      setMaxWidth(null)\n      return\n    }\n\n    const rect = node.getBoundingClientRect()\n    const boundary =\n      boundingRef?.current?.getBoundingClientRect() ?? getClipBoundary(node) ?? undefined\n    const leftEdge = (boundary?.left ?? 0) + EDGE_GUTTER\n    const rightEdge = (boundary?.right ?? window.innerWidth) - EDGE_GUTTER\n    const available = rightEdge - leftEdge\n\n    // When the tooltip can't fit even at full boundary width, cap it so it wraps.\n    const nextMaxWidth = rect.width > available ? available : null\n    setMaxWidth(nextMaxWidth)\n\n    // Compute the shift against the clamped box, kept centered on the anchor.\n    const center = rect.left + rect.width / 2\n    const effectiveWidth = nextMaxWidth ?? rect.width\n    const effectiveLeft = center - effectiveWidth / 2\n    const effectiveRight = center + effectiveWidth / 2\n\n    let shift = 0\n    if (effectiveRight > rightEdge) {\n      shift = rightEdge - effectiveRight\n    }\n    if (effectiveLeft + shift < leftEdge) {\n      shift = leftEdge - effectiveLeft\n    }\n\n    setShiftX(shift)\n  }, [boundingRef, node, position, positionFromProps, staticPositioning])\n\n  useLayoutEffect(() => {\n    if (!show) {\n      return\n    }\n\n    computeShift()\n    window.addEventListener('resize', computeShift)\n\n    return () => {\n      window.removeEventListener('resize', computeShift)\n    }\n  }, [show, computeShift])\n\n  // The first aside is always on top. The purpose of that is that it can reliably be used for the interaction observer (as it's not moving around), to calculate the position of the actual tooltip.\n  return (\n    <React.Fragment>\n      {!staticPositioning && (\n        <aside\n          aria-hidden=\"true\"\n          className={['tooltip', className, `tooltip--caret-${alignCaret}`, 'tooltip--position-top']\n            .filter(Boolean)\n            .join(' ')}\n          ref={ref}\n          style={{ opacity: '0' }}\n        >\n          <TooltipCaret />\n          <div className=\"tooltip-content\">{children}</div>\n        </aside>\n      )}\n      <aside\n        className={[\n          'tooltip',\n          className,\n          show && 'tooltip--show',\n          maxWidth && 'tooltip--wrap',\n          `tooltip--caret-${alignCaret}`,\n          `tooltip--position-${positionFromProps || position}`,\n        ]\n          .filter(Boolean)\n          .join(' ')}\n        style={\n          {\n            ...(maxWidth ? { '--tooltip-max-width': `${maxWidth}px` } : {}),\n            ...(shiftX\n              ? {\n                  '--tooltip-caret-x': `${-shiftX}px`,\n                  '--tooltip-x': `calc(-50% + ${shiftX}px)`,\n                }\n              : {}),\n          } as React.CSSProperties\n        }\n      >\n        <TooltipCaret />\n        <div className=\"tooltip-content\">{children}</div>\n      </aside>\n    </React.Fragment>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/UnpublishButton/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,SAAS,CAAA;AAMzD,OAAO,KAA2C,MAAM,OAAO,CAAA;AAY/D,wBAAgB,eAAe,CAAC,EAC9B,KAAK,EAAE,SAAS,GACjB,GAAE;IAAE,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,GAAG,0BAA+B,qBAuMtD"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/UnpublishButton/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,SAAS,CAAA;AAMzD,OAAO,KAAgC,MAAM,OAAO,CAAA;AAWpD,wBAAgB,eAAe,CAAC,EAC9B,KAAK,EAAE,SAAS,GACjB,GAAE;IAAE,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,GAAG,0BAA+B,qBA8LtD"}

package/dist/elements/UnpublishButton/index.js

@@ -3,9 +3,9 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useModal } from '@faceless-ui/modal';
 import { getTranslation } from '@payloadcms/translations';
-import { formatAdminURL } from 'payload/shared';
+import { formatAdminURL, hasLocalizeStatusEnabled } from 'payload/shared';
 import * as qs from 'qs-esm';
-import React, { useCallback, useEffect, useState } from 'react';
+import React, { useCallback, useState } from 'react';
 import { toast } from 'sonner';
 import { useForm } from '../../forms/Form/context.js';
 import { useConfig } from '../../providers/Config/index.js';
@@ -13,7 +13,6 @@ import { useDocumentInfo } from '../../providers/DocumentInfo/index.js';
 import { useLocale } from '../../providers/Locale/index.js';
 import { useTranslation } from '../../providers/Translation/index.js';
 import { requests } from '../../utilities/api.js';
-import { traverseForLocalizedFields } from '../../utilities/traverseForLocalizedFields.js';
 import { ConfirmationModal } from '../ConfirmationModal/index.js';
 import { PopupList } from '../Popup/index.js';
 export function UnpublishButton({
@@ -47,7 +46,6 @@ export function UnpublishButton({
     label: localeLabel
   } = useLocale();
   const [unpublishAll, setUnpublishAll] = useState(false);
-  const [hasLocalizedFields, setHasLocalizedFields] = useState(false);
   const unPublishModalSlug = `confirm-un-publish-${id}`;
   const {
     routes: {
@@ -142,23 +140,17 @@ export function UnpublishButton({
       toast.error(t('error:unPublishingDocument'));
     });
   }, [dataFromProps, resetForm, collectionSlug, globalSlug, serverURL, api, localeCode, id, i18n.language, incrementVersionCount, setHasPublishedDoc, setMostRecentVersionIsAutosaved, setUnpublishedVersionCount, t]);
-  useEffect(() => {
-    const hasLocalizedField = traverseForLocalizedFields(entityConfig?.fields);
-    setHasLocalizedFields(hasLocalizedField);
-  }, [entityConfig?.fields]);
   const drafts = entityConfig?.versions?.drafts;
   const hasDraftsEnabled = typeof drafts === 'object' && drafts !== null;
   const canUnpublish = React.useMemo(() => {
     return hasDraftsEnabled && hasPublishPermission && hasPublishedDoc && !isTrashed;
   }, [hasPublishPermission, hasPublishedDoc, isTrashed, hasDraftsEnabled]);
   const canUnpublishCurrentLocale = React.useMemo(() => {
-    if (!canUnpublish || !hasLocalizedFields) {
+    if (!canUnpublish) {
       return false;
     }
-    const isLocalizeStatusEnabled = drafts && drafts.localizeStatus === true;
-    const isExperimentalEnabled = config.experimental?.localizeStatus === true;
-    return isLocalizeStatusEnabled && isExperimentalEnabled;
-  }, [canUnpublish, hasLocalizedFields, drafts, config.experimental?.localizeStatus]);
+    return Boolean(entityConfig && hasLocalizeStatusEnabled(entityConfig));
+  }, [canUnpublish, entityConfig]);
   const label = getTranslation(localeLabel, i18n);
   if (!canUnpublish) {
     return null;

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["useModal","getTranslation","formatAdminURL","qs","React","useCallback","useEffect","useState","toast","useForm","useConfig","useDocumentInfo","useLocale","useTranslation","requests","traverseForLocalizedFields","ConfirmationModal","PopupList","UnpublishButton","label","labelProp","id","collectionSlug","data","dataFromProps","globalSlug","hasPublishedDoc","hasPublishPermission","incrementVersionCount","isTrashed","setHasPublishedDoc","setMostRecentVersionIsAutosaved","setUnpublishedVersionCount","toggleModal","config","getEntityConfig","reset","resetForm","code","localeCode","localeLabel","unpublishAll","setUnpublishAll","hasLocalizedFields","setHasLocalizedFields","unPublishModalSlug","routes","api","serverURL","i18n","t","entityConfig","useMemo","unpublish","url","method","queryString","stringify","depth","locale","undefined","unpublishAllLocales","addQueryPrefix","apiRoute","path","res","body","JSON","_status","headers","language","status","success","json","errors","message","error","catch","hasLocalizedField","fields","drafts","versions","hasDraftsEnabled","canUnpublish","canUnpublishCurrentLocale","isLocalizeStatusEnabled","localizeStatus","isExperimentalEnabled","experimental","_jsxs","Fragment","_jsx","Button","onClick","confirmingLabel","heading","modalSlug","onConfirm"],"sources":["../../../src/elements/UnpublishButton/index.tsx"],"sourcesContent":["'use client'\n\nimport type { UnpublishButtonClientProps } from 'payload'\n\nimport { useModal } from '@faceless-ui/modal'\nimport { getTranslation } from '@payloadcms/translations'\nimport { formatAdminURL } from 'payload/shared'\nimport * as qs from 'qs-esm'\nimport React, { useCallback, useEffect, useState } from 'react'\nimport { toast } from 'sonner'\n\nimport { useForm } from '../../forms/Form/context.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useLocale } from '../../providers/Locale/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { requests } from '../../utilities/api.js'\nimport { traverseForLocalizedFields } from '../../utilities/traverseForLocalizedFields.js'\nimport { ConfirmationModal } from '../ConfirmationModal/index.js'\nimport { PopupList } from '../Popup/index.js'\nexport function UnpublishButton({\n  label: labelProp,\n}: { label?: string } & UnpublishButtonClientProps = {}) {\n  const {\n    id,\n    collectionSlug,\n    data: dataFromProps,\n    globalSlug,\n    hasPublishedDoc,\n    hasPublishPermission,\n    incrementVersionCount,\n    isTrashed,\n    setHasPublishedDoc,\n    setMostRecentVersionIsAutosaved,\n    setUnpublishedVersionCount,\n  } = useDocumentInfo()\n  const { toggleModal } = useModal()\n\n  const { config, getEntityConfig } = useConfig()\n  const { reset: resetForm } = useForm()\n  const { code: localeCode, label: localeLabel } = useLocale()\n  const [unpublishAll, setUnpublishAll] = useState(false)\n  const [hasLocalizedFields, setHasLocalizedFields] = useState(false)\n  const unPublishModalSlug = `confirm-un-publish-${id}`\n\n  const {\n    routes: { api },\n    serverURL,\n  } = config\n\n  const { i18n, t } = useTranslation()\n\n  const entityConfig = React.useMemo(() => {\n    if (collectionSlug) {\n      return getEntityConfig({ collectionSlug })\n    }\n\n    if (globalSlug) {\n      return getEntityConfig({ globalSlug })\n    }\n  }, [collectionSlug, globalSlug, getEntityConfig])\n\n  const unpublish = useCallback(\n    (unpublishAll?: boolean) => {\n      void (async () => {\n        let url\n        let method\n\n        const queryString = qs.stringify(\n          {\n            depth: 0,\n            'fallback-locale': 'null',\n            locale: unpublishAll ? undefined : localeCode,\n            unpublishAllLocales: unpublishAll,\n          },\n          { addQueryPrefix: true },\n        )\n\n        if (collectionSlug) {\n          url = formatAdminURL({\n            apiRoute: api,\n            path: `/${collectionSlug}/${id}${queryString}`,\n            serverURL,\n          })\n          method = 'patch'\n        }\n\n        if (globalSlug) {\n          url = formatAdminURL({\n            apiRoute: api,\n            path: `/globals/${globalSlug}${queryString}`,\n            serverURL,\n          })\n          method = 'post'\n        }\n\n        try {\n          const res = await requests[method](url, {\n            body: JSON.stringify({ _status: 'draft' }),\n            headers: {\n              'Accept-Language': i18n.language,\n              'Content-Type': 'application/json',\n            },\n          })\n\n          if (res.status === 200) {\n            void resetForm({\n              ...(dataFromProps || {}),\n              _status: 'draft',\n            })\n\n            toast.success(t('version:unpublishedSuccessfully'))\n            if (!unpublishAll) {\n              incrementVersionCount()\n            }\n            setUnpublishedVersionCount(1)\n            setMostRecentVersionIsAutosaved(false)\n            setHasPublishedDoc(false)\n          } else {\n            try {\n              const json = await res.json()\n              if (json.errors?.[0]?.message) {\n                toast.error(json.errors[0].message)\n              } else if (json.error) {\n                toast.error(json.error)\n              } else {\n                toast.error(t('error:unPublishingDocument'))\n              }\n            } catch {\n              toast.error(t('error:unPublishingDocument'))\n            }\n          }\n        } catch {\n          toast.error(t('error:unPublishingDocument'))\n        }\n      })().catch(() => {\n        toast.error(t('error:unPublishingDocument'))\n      })\n    },\n    [\n      dataFromProps,\n      resetForm,\n      collectionSlug,\n      globalSlug,\n      serverURL,\n      api,\n      localeCode,\n      id,\n      i18n.language,\n      incrementVersionCount,\n      setHasPublishedDoc,\n      setMostRecentVersionIsAutosaved,\n      setUnpublishedVersionCount,\n      t,\n    ],\n  )\n\n  useEffect(() => {\n    const hasLocalizedField = traverseForLocalizedFields(entityConfig?.fields)\n    setHasLocalizedFields(hasLocalizedField)\n  }, [entityConfig?.fields])\n\n  const drafts = entityConfig?.versions?.drafts\n  const hasDraftsEnabled = typeof drafts === 'object' && drafts !== null\n\n  const canUnpublish = React.useMemo(() => {\n    return hasDraftsEnabled && hasPublishPermission && hasPublishedDoc && !isTrashed\n  }, [hasPublishPermission, hasPublishedDoc, isTrashed, hasDraftsEnabled])\n\n  const canUnpublishCurrentLocale = React.useMemo(() => {\n    if (!canUnpublish || !hasLocalizedFields) {\n      return false\n    }\n\n    const isLocalizeStatusEnabled = drafts && drafts.localizeStatus === true\n    const isExperimentalEnabled = config.experimental?.localizeStatus === true\n\n    return isLocalizeStatusEnabled && isExperimentalEnabled\n  }, [canUnpublish, hasLocalizedFields, drafts, config.experimental?.localizeStatus])\n\n  const label = getTranslation(localeLabel, i18n)\n\n  if (!canUnpublish) {\n    return null\n  }\n\n  return (\n    <React.Fragment>\n      <PopupList.Button\n        id=\"action-unpublish\"\n        onClick={() => {\n          setUnpublishAll(true)\n          toggleModal(unPublishModalSlug)\n        }}\n      >\n        {labelProp || t('version:unpublish')}\n      </PopupList.Button>\n      {canUnpublishCurrentLocale && (\n        <PopupList.Button\n          id=\"action-unpublish-locale\"\n          onClick={() => {\n            setUnpublishAll(false)\n            toggleModal(unPublishModalSlug)\n          }}\n        >\n          {labelProp ? `${labelProp} [${label}]` : t('version:unpublishIn', { locale: label })}\n        </PopupList.Button>\n      )}\n      <ConfirmationModal\n        body={\n          !unpublishAll\n            ? t('version:aboutToUnpublishIn', { locale: label })\n            : t('version:aboutToUnpublish')\n        }\n        confirmingLabel={t('version:unpublishing')}\n        heading={t('version:confirmUnpublish')}\n        modalSlug={unPublishModalSlug}\n        onConfirm={() => unpublish(unpublishAll)}\n      />\n    </React.Fragment>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["useModal","getTranslation","formatAdminURL","hasLocalizeStatusEnabled","qs","React","useCallback","useState","toast","useForm","useConfig","useDocumentInfo","useLocale","useTranslation","requests","ConfirmationModal","PopupList","UnpublishButton","label","labelProp","id","collectionSlug","data","dataFromProps","globalSlug","hasPublishedDoc","hasPublishPermission","incrementVersionCount","isTrashed","setHasPublishedDoc","setMostRecentVersionIsAutosaved","setUnpublishedVersionCount","toggleModal","config","getEntityConfig","reset","resetForm","code","localeCode","localeLabel","unpublishAll","setUnpublishAll","unPublishModalSlug","routes","api","serverURL","i18n","t","entityConfig","useMemo","unpublish","url","method","queryString","stringify","depth","locale","undefined","unpublishAllLocales","addQueryPrefix","apiRoute","path","res","body","JSON","_status","headers","language","status","success","json","errors","message","error","catch","drafts","versions","hasDraftsEnabled","canUnpublish","canUnpublishCurrentLocale","Boolean","_jsxs","Fragment","_jsx","Button","onClick","confirmingLabel","heading","modalSlug","onConfirm"],"sources":["../../../src/elements/UnpublishButton/index.tsx"],"sourcesContent":["'use client'\n\nimport type { UnpublishButtonClientProps } from 'payload'\n\nimport { useModal } from '@faceless-ui/modal'\nimport { getTranslation } from '@payloadcms/translations'\nimport { formatAdminURL, hasLocalizeStatusEnabled } from 'payload/shared'\nimport * as qs from 'qs-esm'\nimport React, { useCallback, useState } from 'react'\nimport { toast } from 'sonner'\n\nimport { useForm } from '../../forms/Form/context.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useLocale } from '../../providers/Locale/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { requests } from '../../utilities/api.js'\nimport { ConfirmationModal } from '../ConfirmationModal/index.js'\nimport { PopupList } from '../Popup/index.js'\nexport function UnpublishButton({\n  label: labelProp,\n}: { label?: string } & UnpublishButtonClientProps = {}) {\n  const {\n    id,\n    collectionSlug,\n    data: dataFromProps,\n    globalSlug,\n    hasPublishedDoc,\n    hasPublishPermission,\n    incrementVersionCount,\n    isTrashed,\n    setHasPublishedDoc,\n    setMostRecentVersionIsAutosaved,\n    setUnpublishedVersionCount,\n  } = useDocumentInfo()\n  const { toggleModal } = useModal()\n\n  const { config, getEntityConfig } = useConfig()\n  const { reset: resetForm } = useForm()\n  const { code: localeCode, label: localeLabel } = useLocale()\n  const [unpublishAll, setUnpublishAll] = useState(false)\n  const unPublishModalSlug = `confirm-un-publish-${id}`\n\n  const {\n    routes: { api },\n    serverURL,\n  } = config\n\n  const { i18n, t } = useTranslation()\n\n  const entityConfig = React.useMemo(() => {\n    if (collectionSlug) {\n      return getEntityConfig({ collectionSlug })\n    }\n\n    if (globalSlug) {\n      return getEntityConfig({ globalSlug })\n    }\n  }, [collectionSlug, globalSlug, getEntityConfig])\n\n  const unpublish = useCallback(\n    (unpublishAll?: boolean) => {\n      void (async () => {\n        let url\n        let method\n\n        const queryString = qs.stringify(\n          {\n            depth: 0,\n            'fallback-locale': 'null',\n            locale: unpublishAll ? undefined : localeCode,\n            unpublishAllLocales: unpublishAll,\n          },\n          { addQueryPrefix: true },\n        )\n\n        if (collectionSlug) {\n          url = formatAdminURL({\n            apiRoute: api,\n            path: `/${collectionSlug}/${id}${queryString}`,\n            serverURL,\n          })\n          method = 'patch'\n        }\n\n        if (globalSlug) {\n          url = formatAdminURL({\n            apiRoute: api,\n            path: `/globals/${globalSlug}${queryString}`,\n            serverURL,\n          })\n          method = 'post'\n        }\n\n        try {\n          const res = await requests[method](url, {\n            body: JSON.stringify({ _status: 'draft' }),\n            headers: {\n              'Accept-Language': i18n.language,\n              'Content-Type': 'application/json',\n            },\n          })\n\n          if (res.status === 200) {\n            void resetForm({\n              ...(dataFromProps || {}),\n              _status: 'draft',\n            })\n\n            toast.success(t('version:unpublishedSuccessfully'))\n            if (!unpublishAll) {\n              incrementVersionCount()\n            }\n            setUnpublishedVersionCount(1)\n            setMostRecentVersionIsAutosaved(false)\n            setHasPublishedDoc(false)\n          } else {\n            try {\n              const json = await res.json()\n              if (json.errors?.[0]?.message) {\n                toast.error(json.errors[0].message)\n              } else if (json.error) {\n                toast.error(json.error)\n              } else {\n                toast.error(t('error:unPublishingDocument'))\n              }\n            } catch {\n              toast.error(t('error:unPublishingDocument'))\n            }\n          }\n        } catch {\n          toast.error(t('error:unPublishingDocument'))\n        }\n      })().catch(() => {\n        toast.error(t('error:unPublishingDocument'))\n      })\n    },\n    [\n      dataFromProps,\n      resetForm,\n      collectionSlug,\n      globalSlug,\n      serverURL,\n      api,\n      localeCode,\n      id,\n      i18n.language,\n      incrementVersionCount,\n      setHasPublishedDoc,\n      setMostRecentVersionIsAutosaved,\n      setUnpublishedVersionCount,\n      t,\n    ],\n  )\n\n  const drafts = entityConfig?.versions?.drafts\n  const hasDraftsEnabled = typeof drafts === 'object' && drafts !== null\n\n  const canUnpublish = React.useMemo(() => {\n    return hasDraftsEnabled && hasPublishPermission && hasPublishedDoc && !isTrashed\n  }, [hasPublishPermission, hasPublishedDoc, isTrashed, hasDraftsEnabled])\n\n  const canUnpublishCurrentLocale = React.useMemo(() => {\n    if (!canUnpublish) {\n      return false\n    }\n\n    return Boolean(entityConfig && hasLocalizeStatusEnabled(entityConfig))\n  }, [canUnpublish, entityConfig])\n\n  const label = getTranslation(localeLabel, i18n)\n\n  if (!canUnpublish) {\n    return null\n  }\n\n  return (\n    <React.Fragment>\n      <PopupList.Button\n        id=\"action-unpublish\"\n        onClick={() => {\n          setUnpublishAll(true)\n          toggleModal(unPublishModalSlug)\n        }}\n      >\n        {labelProp || t('version:unpublish')}\n      </PopupList.Button>\n      {canUnpublishCurrentLocale && (\n        <PopupList.Button\n          id=\"action-unpublish-locale\"\n          onClick={() => {\n            setUnpublishAll(false)\n            toggleModal(unPublishModalSlug)\n          }}\n        >\n          {labelProp ? `${labelProp} [${label}]` : t('version:unpublishIn', { locale: label })}\n        </PopupList.Button>\n      )}\n      <ConfirmationModal\n        body={\n          !unpublishAll\n            ? t('version:aboutToUnpublishIn', { locale: label })\n            : t('version:aboutToUnpublish')\n        }\n        confirmingLabel={t('version:unpublishing')}\n        heading={t('version:confirmUnpublish')}\n        modalSlug={unPublishModalSlug}\n        onConfirm={() => unpublish(unpublishAll)}\n      />\n    </React.Fragment>\n  )\n}\n"],"mappings":"AAAA;;;AAIA,SAASA,QAAQ,QAAQ;AACzB,SAASC,cAAc,QAAQ;AAC/B,SAASC,cAAc,EAAEC,wBAAwB,QAAQ;AACzD,YAAYC,EAAA,MAAQ;AACpB,OAAOC,KAAA,IAASC,WAAW,EAAEC,QAAQ,QAAQ;AAC7C,SAASC,KAAK,QAAQ;AAEtB,SAASC,OAAO,QAAQ;AACxB,SAASC,SAAS,QAAQ;AAC1B,SAASC,eAAe,QAAQ;AAChC,SAASC,SAAS,QAAQ;AAC1B,SAASC,cAAc,QAAQ;AAC/B,SAASC,QAAQ,QAAQ;AACzB,SAASC,iBAAiB,QAAQ;AAClC,SAASC,SAAS,QAAQ;AAC1B,OAAO,SAASC,gBAAgB;EAC9BC,KAAA,EAAOC;AAAS,CACgC,GAAG,CAAC,CAAC;EACrD,MAAM;IACJC,EAAE;IACFC,cAAc;IACdC,IAAA,EAAMC,aAAa;IACnBC,UAAU;IACVC,eAAe;IACfC,oBAAoB;IACpBC,qBAAqB;IACrBC,SAAS;IACTC,kBAAkB;IAClBC,+BAA+B;IAC/BC;EAA0B,CAC3B,GAAGpB,eAAA;EACJ,MAAM;IAAEqB;EAAW,CAAE,GAAGhC,QAAA;EAExB,MAAM;IAAEiC,MAAM;IAAEC;EAAe,CAAE,GAAGxB,SAAA;EACpC,MAAM;IAAEyB,KAAA,EAAOC;EAAS,CAAE,GAAG3B,OAAA;EAC7B,MAAM;IAAE4B,IAAA,EAAMC,UAAU;IAAEpB,KAAA,EAAOqB;EAAW,CAAE,GAAG3B,SAAA;EACjD,MAAM,CAAC4B,YAAA,EAAcC,eAAA,CAAgB,GAAGlC,QAAA,CAAS;EACjD,MAAMmC,kBAAA,GAAqB,sBAAsBtB,EAAA,EAAI;EAErD,MAAM;IACJuB,MAAA,EAAQ;MAAEC;IAAG,CAAE;IACfC;EAAS,CACV,GAAGZ,MAAA;EAEJ,MAAM;IAAEa,IAAI;IAAEC;EAAC,CAAE,GAAGlC,cAAA;EAEpB,MAAMmC,YAAA,GAAe3C,KAAA,CAAM4C,OAAO,CAAC;IACjC,IAAI5B,cAAA,EAAgB;MAClB,OAAOa,eAAA,CAAgB;QAAEb;MAAe;IAC1C;IAEA,IAAIG,UAAA,EAAY;MACd,OAAOU,eAAA,CAAgB;QAAEV;MAAW;IACtC;EACF,GAAG,CAACH,cAAA,EAAgBG,UAAA,EAAYU,eAAA,CAAgB;EAEhD,MAAMgB,SAAA,GAAY5C,WAAA,CACfkC,cAAA;IACC,KAAK,CAAC;MACJ,IAAIW,GAAA;MACJ,IAAIC,MAAA;MAEJ,MAAMC,WAAA,GAAcjD,EAAA,CAAGkD,SAAS,CAC9B;QACEC,KAAA,EAAO;QACP,mBAAmB;QACnBC,MAAA,EAAQhB,cAAA,GAAeiB,SAAA,GAAYnB,UAAA;QACnCoB,mBAAA,EAAqBlB;MACvB,GACA;QAAEmB,cAAA,EAAgB;MAAK;MAGzB,IAAItC,cAAA,EAAgB;QAClB8B,GAAA,GAAMjD,cAAA,CAAe;UACnB0D,QAAA,EAAUhB,GAAA;UACViB,IAAA,EAAM,IAAIxC,cAAA,IAAkBD,EAAA,GAAKiC,WAAA,EAAa;UAC9CR;QACF;QACAO,MAAA,GAAS;MACX;MAEA,IAAI5B,UAAA,EAAY;QACd2B,GAAA,GAAMjD,cAAA,CAAe;UACnB0D,QAAA,EAAUhB,GAAA;UACViB,IAAA,EAAM,YAAYrC,UAAA,GAAa6B,WAAA,EAAa;UAC5CR;QACF;QACAO,MAAA,GAAS;MACX;MAEA,IAAI;QACF,MAAMU,GAAA,GAAM,MAAMhD,QAAQ,CAACsC,MAAA,CAAO,CAACD,GAAA,EAAK;UACtCY,IAAA,EAAMC,IAAA,CAAKV,SAAS,CAAC;YAAEW,OAAA,EAAS;UAAQ;UACxCC,OAAA,EAAS;YACP,mBAAmBpB,IAAA,CAAKqB,QAAQ;YAChC,gBAAgB;UAClB;QACF;QAEA,IAAIL,GAAA,CAAIM,MAAM,KAAK,KAAK;UACtB,KAAKhC,SAAA,CAAU;YACb,IAAIb,aAAA,IAAiB,CAAC,CAAC;YACvB0C,OAAA,EAAS;UACX;UAEAzD,KAAA,CAAM6D,OAAO,CAACtB,CAAA,CAAE;UAChB,IAAI,CAACP,cAAA,EAAc;YACjBb,qBAAA;UACF;UACAI,0BAAA,CAA2B;UAC3BD,+BAAA,CAAgC;UAChCD,kBAAA,CAAmB;QACrB,OAAO;UACL,IAAI;YACF,MAAMyC,IAAA,GAAO,MAAMR,GAAA,CAAIQ,IAAI;YAC3B,IAAIA,IAAA,CAAKC,MAAM,GAAG,EAAE,EAAEC,OAAA,EAAS;cAC7BhE,KAAA,CAAMiE,KAAK,CAACH,IAAA,CAAKC,MAAM,CAAC,EAAE,CAACC,OAAO;YACpC,OAAO,IAAIF,IAAA,CAAKG,KAAK,EAAE;cACrBjE,KAAA,CAAMiE,KAAK,CAACH,IAAA,CAAKG,KAAK;YACxB,OAAO;cACLjE,KAAA,CAAMiE,KAAK,CAAC1B,CAAA,CAAE;YAChB;UACF,EAAE,MAAM;YACNvC,KAAA,CAAMiE,KAAK,CAAC1B,CAAA,CAAE;UAChB;QACF;MACF,EAAE,MAAM;QACNvC,KAAA,CAAMiE,KAAK,CAAC1B,CAAA,CAAE;MAChB;IACF,KAAK2B,KAAK,CAAC;MACTlE,KAAA,CAAMiE,KAAK,CAAC1B,CAAA,CAAE;IAChB;EACF,GACA,CACExB,aAAA,EACAa,SAAA,EACAf,cAAA,EACAG,UAAA,EACAqB,SAAA,EACAD,GAAA,EACAN,UAAA,EACAlB,EAAA,EACA0B,IAAA,CAAKqB,QAAQ,EACbxC,qBAAA,EACAE,kBAAA,EACAC,+BAAA,EACAC,0BAAA,EACAgB,CAAA,CACD;EAGH,MAAM4B,MAAA,GAAS3B,YAAA,EAAc4B,QAAA,EAAUD,MAAA;EACvC,MAAME,gBAAA,GAAmB,OAAOF,MAAA,KAAW,YAAYA,MAAA,KAAW;EAElE,MAAMG,YAAA,GAAezE,KAAA,CAAM4C,OAAO,CAAC;IACjC,OAAO4B,gBAAA,IAAoBnD,oBAAA,IAAwBD,eAAA,IAAmB,CAACG,SAAA;EACzE,GAAG,CAACF,oBAAA,EAAsBD,eAAA,EAAiBG,SAAA,EAAWiD,gBAAA,CAAiB;EAEvE,MAAME,yBAAA,GAA4B1E,KAAA,CAAM4C,OAAO,CAAC;IAC9C,IAAI,CAAC6B,YAAA,EAAc;MACjB,OAAO;IACT;IAEA,OAAOE,OAAA,CAAQhC,YAAA,IAAgB7C,wBAAA,CAAyB6C,YAAA;EAC1D,GAAG,CAAC8B,YAAA,EAAc9B,YAAA,CAAa;EAE/B,MAAM9B,KAAA,GAAQjB,cAAA,CAAesC,WAAA,EAAaO,IAAA;EAE1C,IAAI,CAACgC,YAAA,EAAc;IACjB,OAAO;EACT;EAEA,oBACEG,KAAA,CAAC5E,KAAA,CAAM6E,QAAQ;4BACbC,IAAA,CAACnE,SAAA,CAAUoE,MAAM;MACfhE,EAAA,EAAG;MACHiE,OAAA,EAASA,CAAA;QACP5C,eAAA,CAAgB;QAChBT,WAAA,CAAYU,kBAAA;MACd;gBAECvB,SAAA,IAAa4B,CAAA,CAAE;QAEjBgC,yBAAA,iBACCI,IAAA,CAACnE,SAAA,CAAUoE,MAAM;MACfhE,EAAA,EAAG;MACHiE,OAAA,EAASA,CAAA;QACP5C,eAAA,CAAgB;QAChBT,WAAA,CAAYU,kBAAA;MACd;gBAECvB,SAAA,GAAY,GAAGA,SAAA,KAAcD,KAAA,GAAQ,GAAG6B,CAAA,CAAE,uBAAuB;QAAES,MAAA,EAAQtC;MAAM;qBAGtFiE,IAAA,CAACpE,iBAAA;MACCgD,IAAA,EACE,CAACvB,YAAA,GACGO,CAAA,CAAE,8BAA8B;QAAES,MAAA,EAAQtC;MAAM,KAChD6B,CAAA,CAAE;MAERuC,eAAA,EAAiBvC,CAAA,CAAE;MACnBwC,OAAA,EAASxC,CAAA,CAAE;MACXyC,SAAA,EAAW9C,kBAAA;MACX+C,SAAA,EAAWA,CAAA,KAAMvC,SAAA,CAAUV,YAAA;;;AAInC","ignoreList":[]}

package/dist/elements/UserMenu/LanguageMenu/index.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+export declare const LanguageMenuContent: React.FC;
+export declare const LanguageMenu: React.FC<{
+    readonly onMobileOpen?: () => void;
+}>;
+//# sourceMappingURL=index.d.ts.map

package/dist/elements/UserMenu/LanguageMenu/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/UserMenu/LanguageMenu/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAOzB,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAsBvC,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC;IAClC,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,IAAI,CAAA;CACnC,CAsDA,CAAA"}