@payloadcms/ui 3.0.0-canary.ff8c8fd → 3.0.0

package/dist/elements/SortColumn/index.js

@@ -2,35 +2,33 @@
 
 import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-// TODO: abstract the `next/navigation` dependency out from this component
-import React, { useCallback } from 'react';
+import React from 'react';
+import { FieldLabel } from '../../fields/FieldLabel/index.js';
 import { ChevronIcon } from '../../icons/Chevron/index.js';
 import { useListQuery } from '../../providers/ListQuery/index.js';
-import { useSearchParams } from '../../providers/SearchParams/index.js';
 import { useTranslation } from '../../providers/Translation/index.js';
 import './index.scss';
 const baseClass = 'sort-column';
 export const SortColumn = props => {
-  const $ = _c(18);
+  const $ = _c(22);
   const {
     name,
-    Label,
+    appearance,
     disable: t0,
+    Label,
     label
   } = props;
   const disable = t0 === undefined ? false : t0;
   const {
-    searchParams
-  } = useSearchParams();
-  const {
-    refineListData
+    handleSortChange,
+    query
   } = useListQuery();
   const {
     t
   } = useTranslation();
   const {
     sort
-  } = searchParams;
+  } = query;
   const desc = `-${name}`;
   const asc = name;
   let ascClasses;
@@ -57,26 +55,36 @@ export const SortColumn = props => {
   } else {
     descClasses = $[5];
   }
-  let t1;
-  if ($[6] !== refineListData) {
-    t1 = async newSort => {
-      await refineListData({
-        sort: newSort
-      });
-    };
-    $[6] = refineListData;
-    $[7] = t1;
+  const t1 = appearance && `${baseClass}--appearance-${appearance}`;
+  let t2;
+  if ($[6] !== t1) {
+    t2 = [baseClass, t1].filter(Boolean);
+    $[6] = t1;
+    $[7] = t2;
   } else {
-    t1 = $[7];
+    t2 = $[7];
   }
-  const setSort = t1;
-  let t2;
-  if ($[8] !== Label || $[9] !== disable || $[10] !== t || $[11] !== label || $[12] !== ascClasses || $[13] !== setSort || $[14] !== asc || $[15] !== descClasses || $[16] !== desc) {
-    t2 = _jsxs("div", {
-      className: baseClass,
+  const t3 = t2.join(" ");
+  let t4;
+  if ($[8] !== Label || $[9] !== label) {
+    t4 = Label ?? _jsx(FieldLabel, {
+      hideLocale: true,
+      label,
+      unstyled: true
+    });
+    $[8] = Label;
+    $[9] = label;
+    $[10] = t4;
+  } else {
+    t4 = $[10];
+  }
+  let t5;
+  if ($[11] !== t4 || $[12] !== disable || $[13] !== t || $[14] !== label || $[15] !== ascClasses || $[16] !== handleSortChange || $[17] !== asc || $[18] !== descClasses || $[19] !== desc || $[20] !== t3) {
+    t5 = _jsxs("div", {
+      className: t3,
       children: [_jsx("span", {
         className: `${baseClass}__label`,
-        children: Label
+        children: t4
       }), !disable && _jsxs("div", {
         className: `${baseClass}__buttons`,
         children: [_jsx("button", {
@@ -85,7 +93,7 @@ export const SortColumn = props => {
             label
           }),
           className: [...ascClasses, `${baseClass}__button`].filter(Boolean).join(" "),
-          onClick: () => void setSort(asc),
+          onClick: () => void handleSortChange(asc),
           type: "button",
           children: _jsx(ChevronIcon, {
             direction: "up"
@@ -96,25 +104,26 @@ export const SortColumn = props => {
             label
           }),
           className: [...descClasses, `${baseClass}__button`].filter(Boolean).join(" "),
-          onClick: () => void setSort(desc),
+          onClick: () => void handleSortChange(desc),
           type: "button",
           children: _jsx(ChevronIcon, {})
         })]
       })]
     });
-    $[8] = Label;
-    $[9] = disable;
-    $[10] = t;
-    $[11] = label;
-    $[12] = ascClasses;
-    $[13] = setSort;
-    $[14] = asc;
-    $[15] = descClasses;
-    $[16] = desc;
-    $[17] = t2;
+    $[11] = t4;
+    $[12] = disable;
+    $[13] = t;
+    $[14] = label;
+    $[15] = ascClasses;
+    $[16] = handleSortChange;
+    $[17] = asc;
+    $[18] = descClasses;
+    $[19] = desc;
+    $[20] = t3;
+    $[21] = t5;
   } else {
-    t2 = $[17];
+    t5 = $[21];
   }
-  return t2;
+  return t5;
 };
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","React","useCallback","ChevronIcon","useListQuery","useSearchParams","useTranslation","baseClass","SortColumn","props","$","name","Label","disable","t0","label","undefined","searchParams","refineListData","t","sort","desc","asc","ascClasses","push","descClasses","t1","newSort","setSort","t2","_jsxs","className","children","_jsx","direction","filter","Boolean","join","onClick","type"],"sources":["../../../src/elements/SortColumn/index.tsx"],"sourcesContent":["'use client'\nimport type { FieldBase } from 'payload'\n\n// TODO: abstract the `next/navigation` dependency out from this component\nimport React, { useCallback } from 'react'\n\nimport { ChevronIcon } from '../../icons/Chevron/index.js'\nimport { useListQuery } from '../../providers/ListQuery/index.js'\nimport { useSearchParams } from '../../providers/SearchParams/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport './index.scss'\n\nexport type SortColumnProps = {\n  Label: React.ReactNode\n  disable?: boolean\n  label?: FieldBase['label']\n  name: string\n}\n\nconst baseClass = 'sort-column'\n\nexport const SortColumn: React.FC<SortColumnProps> = (props) => {\n  const { name, Label, disable = false, label } = props\n  const { searchParams } = useSearchParams()\n  const { refineListData } = useListQuery()\n  const { t } = useTranslation()\n\n  const { sort } = searchParams\n\n  const desc = `-${name}`\n  const asc = name\n\n  const ascClasses = [`${baseClass}__asc`]\n  if (sort === asc) ascClasses.push(`${baseClass}--active`)\n\n  const descClasses = [`${baseClass}__desc`]\n  if (sort === desc) descClasses.push(`${baseClass}--active`)\n\n  const setSort = useCallback(\n    async (newSort: string) => {\n      await refineListData({\n        sort: newSort,\n      })\n    },\n    [refineListData],\n  )\n\n  return (\n    <div className={baseClass}>\n      <span className={`${baseClass}__label`}>{Label}</span>\n      {!disable && (\n        <div className={`${baseClass}__buttons`}>\n          <button\n            aria-label={t('general:sortByLabelDirection', {\n              direction: t('general:ascending'),\n              label,\n            })}\n            className={[...ascClasses, `${baseClass}__button`].filter(Boolean).join(' ')}\n            onClick={() => void setSort(asc)}\n            type=\"button\"\n          >\n            <ChevronIcon direction=\"up\" />\n          </button>\n          <button\n            aria-label={t('general:sortByLabelDirection', {\n              direction: t('general:descending'),\n              label,\n            })}\n            className={[...descClasses, `${baseClass}__button`].filter(Boolean).join(' ')}\n            onClick={() => void setSort(desc)}\n            type=\"button\"\n          >\n            <ChevronIcon />\n          </button>\n        </div>\n      )}\n    </div>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAGA;AACA,OAAOC,KAAA,IAASC,WAAW,QAAQ;AAEnC,SAASC,WAAW,QAAQ;AAC5B,SAASC,YAAY,QAAQ;AAC7B,SAASC,eAAe,QAAQ;AAChC,SAASC,cAAc,QAAQ;AAC/B,OAAO;AASP,MAAMC,SAAA,GAAY;AAElB,OAAO,MAAMC,UAAA,GAAwCC,KAAA;EAAA,MAAAC,CAAA,GAAAV,EAAA;EACnD;IAAAW,IAAA;IAAAC,KAAA;IAAAC,OAAA,EAAAC,EAAA;IAAAC;EAAA,IAAgDN,KAAA;EAA3B,MAAAI,OAAA,GAAAC,EAAe,KAAAE,SAAA,WAAfF,EAAe;EACpC;IAAAG;EAAA,IAAyBZ,eAAA;EACzB;IAAAa;EAAA,IAA2Bd,YAAA;EAC3B;IAAAe;EAAA,IAAcb,cAAA;EAEd;IAAAc;EAAA,IAAiBH,YAAA;EAEjB,MAAAI,IAAA,GAAa,IAAIV,IAAA,EAAM;EACvB,MAAAW,GAAA,GAAYX,IAAA;EAAA,IAAAY,UAAA;EAAA,IAAAb,CAAA,QAAAU,IAAA,IAAAV,CAAA,QAAAY,GAAA;IAEZC,UAAA,IAAoB,GAAAhB,SAAA,OAAmB;IAAC,IACpCa,IAAA,KAASE,GAAA;MAAKC,UAAA,CAAAC,IAAA,CAAgB,GAAAjB,SAAA,UAAsB;IAAA;IAAAG,CAAA,MAAAU,IAAA;IAAAV,CAAA,MAAAY,GAAA;IAAAZ,CAAA,MAAAa,UAAA;EAAA;IAAAA,UAAA,GAAAb,CAAA;EAAA;EAAA,IAAAe,WAAA;EAAA,IAAAf,CAAA,QAAAU,IAAA,IAAAV,CAAA,QAAAW,IAAA;IAExDI,WAAA,IAAqB,GAAAlB,SAAA,QAAoB;IAAC,IACtCa,IAAA,KAASC,IAAA;MAAMI,WAAA,CAAAD,IAAA,CAAiB,GAAAjB,SAAA,UAAsB;IAAA;IAAAG,CAAA,MAAAU,IAAA;IAAAV,CAAA,MAAAW,IAAA;IAAAX,CAAA,MAAAe,WAAA;EAAA;IAAAA,WAAA,GAAAf,CAAA;EAAA;EAAA,IAAAgB,EAAA;EAAA,IAAAhB,CAAA,QAAAQ,cAAA;IAGxDQ,EAAA,SAAAC,OAAA;MAAA,MACQT,cAAA;QAAAE,IAAA,EACEO;MAAA,CACR;IAAA;IACFjB,CAAA,MAAAQ,cAAA;IAAAR,CAAA,MAAAgB,EAAA;EAAA;IAAAA,EAAA,GAAAhB,CAAA;EAAA;EALF,MAAAkB,OAAA,GAAgBF,EAME;EAAA,IAAAG,EAAA;EAAA,IAAAnB,CAAA,QAAAE,KAAA,IAAAF,CAAA,QAAAG,OAAA,IAAAH,CAAA,SAAAS,CAAA,IAAAT,CAAA,SAAAK,KAAA,IAAAL,CAAA,SAAAa,UAAA,IAAAb,CAAA,SAAAkB,OAAA,IAAAlB,CAAA,SAAAY,GAAA,IAAAZ,CAAA,SAAAe,WAAA,IAAAf,CAAA,SAAAW,IAAA;IAIhBQ,EAAA,GAAAC,KAAA,CAAC;MAAAC,SAAA,EAAAxB,SAAA;MAAAyB,QAAA,GACCC,IAAA,CAAC;QAAAF,SAAA,EAAgB,GAAAxB,SAAA,SAAqB;QAAAyB,QAAA,EAAGpB;MAAA,C,GACxC,CAACC,OAAA,IACAiB,KAAA,CAAC;QAAAC,SAAA,EAAe,GAAAxB,SAAA,WAAuB;QAAAyB,QAAA,GACrCC,IAAA,CAAC;UAAA,cACad,CAAA,CAAE;YAAAe,SAAA,EACDf,CAAA,CAAE;YAAAJ;UAAA,CAEf;UAAAgB,SAAA,EACW,IAAIR,UAAA,EAAY,GAAAhB,SAAA,UAAsB,EAAA4B,MAAA,CAAAC,OAAS,EAAAC,IAAA,CAAc;UAAAC,OAAA,EAAAA,CAAA,UACpDV,OAAA,CAAQN,GAAA;UAAAiB,IAAA,EACvB;UAAAP,QAAA,EAELC,IAAA,CAAA9B,WAAA;YAAA+B,SAAA,EAAuB;UAAA,C;YAEzBD,IAAA,CAAC;UAAA,cACad,CAAA,CAAE;YAAAe,SAAA,EACDf,CAAA,CAAE;YAAAJ;UAAA,CAEf;UAAAgB,SAAA,EACW,IAAIN,WAAA,EAAa,GAAAlB,SAAA,UAAsB,EAAA4B,MAAA,CAAAC,OAAS,EAAAC,IAAA,CAAc;UAAAC,OAAA,EAAAA,CAAA,UACrDV,OAAA,CAAQP,IAAA;UAAAkB,IAAA,EACvB;UAAAP,QAAA,EAELC,IAAA,CAAA9B,WAAA,IAAC;QAAA,C;;;;;;;;;;;;;;;;SAxBT0B,E;CA8BJ","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","React","FieldLabel","ChevronIcon","useListQuery","useTranslation","baseClass","SortColumn","props","$","name","appearance","disable","t0","Label","label","undefined","handleSortChange","query","t","sort","desc","asc","ascClasses","push","descClasses","t1","t2","filter","Boolean","t3","join","t4","_jsx","hideLocale","unstyled","t5","_jsxs","className","children","direction","onClick","type"],"sources":["../../../src/elements/SortColumn/index.tsx"],"sourcesContent":["'use client'\nimport type { StaticLabel } from 'payload'\n\nimport React from 'react'\n\nimport { FieldLabel } from '../../fields/FieldLabel/index.js'\nimport { ChevronIcon } from '../../icons/Chevron/index.js'\nimport { useListQuery } from '../../providers/ListQuery/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport './index.scss'\n\nexport type SortColumnProps = {\n  readonly appearance?: 'condensed' | 'default'\n  readonly disable?: boolean\n  readonly Label: React.ReactNode\n  readonly label?: StaticLabel\n  readonly name: string\n}\n\nconst baseClass = 'sort-column'\n\nexport const SortColumn: React.FC<SortColumnProps> = (props) => {\n  const { name, appearance, disable = false, Label, label } = props\n  const { handleSortChange, query } = useListQuery()\n  const { t } = useTranslation()\n\n  const { sort } = query\n\n  const desc = `-${name}`\n  const asc = name\n\n  const ascClasses = [`${baseClass}__asc`]\n  if (sort === asc) {\n    ascClasses.push(`${baseClass}--active`)\n  }\n\n  const descClasses = [`${baseClass}__desc`]\n  if (sort === desc) {\n    descClasses.push(`${baseClass}--active`)\n  }\n\n  return (\n    <div\n      className={[baseClass, appearance && `${baseClass}--appearance-${appearance}`]\n        .filter(Boolean)\n        .join(' ')}\n    >\n      <span className={`${baseClass}__label`}>\n        {Label ?? <FieldLabel hideLocale label={label} unstyled />}\n      </span>\n      {!disable && (\n        <div className={`${baseClass}__buttons`}>\n          <button\n            aria-label={t('general:sortByLabelDirection', {\n              direction: t('general:ascending'),\n              label,\n            })}\n            className={[...ascClasses, `${baseClass}__button`].filter(Boolean).join(' ')}\n            onClick={() => void handleSortChange(asc)}\n            type=\"button\"\n          >\n            <ChevronIcon direction=\"up\" />\n          </button>\n          <button\n            aria-label={t('general:sortByLabelDirection', {\n              direction: t('general:descending'),\n              label,\n            })}\n            className={[...descClasses, `${baseClass}__button`].filter(Boolean).join(' ')}\n            onClick={() => void handleSortChange(desc)}\n            type=\"button\"\n          >\n            <ChevronIcon />\n          </button>\n        </div>\n      )}\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/SortColumn/index.scss

@@ -1,57 +1,68 @@
 @import '../../scss/styles.scss';
 
-.sort-column {
-  display: flex;
-  gap: calc(var(--base) / 4);
-  align-items: center;
-
-  &__label {
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
+@layer payload-default {
+  .sort-column {
+    display: flex;
+    gap: calc(var(--base) / 2);
+    align-items: center;
 
-  &__label,
-  .btn {
-    vertical-align: middle;
-    display: inline-block;
-  }
+    &__label {
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
 
-  &__label {
-    cursor: default;
-  }
+    &__label,
+    .btn {
+      vertical-align: middle;
+      display: inline-block;
+    }
 
-  &__buttons {
-    display: flex;
-    align-items: center;
-  }
+    &__label {
+      cursor: default;
+    }
 
-  &__button {
-    margin: 0;
-    opacity: 0.3;
-    padding: calc(var(--base) / 4);
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    background: transparent;
-    border: none;
-    outline: none;
-    cursor: pointer;
-
-    &.sort-column--active {
-      opacity: 1;
-      visibility: visible;
+    &__buttons {
+      display: flex;
+      align-items: center;
+      gap: calc(var(--base) / 4);
+    }
+
+    &__button {
+      margin: 0;
+      opacity: 0.3;
+      padding: calc(var(--base) / 4);
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      background: transparent;
+      border: none;
+      outline: none;
+      cursor: pointer;
+
+      &.sort-column--active {
+        opacity: 1;
+        visibility: visible;
+      }
+
+      &:hover {
+        opacity: 0.7;
+      }
     }
 
     &:hover {
-      opacity: 0.7;
+      .btn {
+        opacity: 0.4;
+        visibility: visible;
+      }
     }
-  }
 
-  &:hover {
-    .btn {
-      opacity: 0.4;
-      visibility: visible;
+    &--appearance-condensed {
+      gap: calc(var(--base) / 4);
+
+      .sort-column__buttons {
+        gap: 0;
+      }
     }
   }
 }

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/SortComplex/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAgB,yBAAyB,EAAE,MAAM,SAAS,CAAA;AAQtE,OAAO,KAA8B,MAAM,OAAO,CAAA;AAElD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,UAAU,EAAE,yBAAyB,CAAA;IACrC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IACrC,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,CAAA;AAOD,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CA0ElD,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/SortComplex/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAgB,yBAAyB,EAAE,MAAM,SAAS,CAAA;AAQtE,OAAO,KAA8B,MAAM,OAAO,CAAA;AAElD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,UAAU,EAAE,yBAAyB,CAAA;IACrC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IACrC,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,CAAA;AAOD,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CA4ElD,CAAA"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","getTranslation","usePathname","useRouter","sortableFieldTypes","fieldAffectsData","qs","React","useEffect","useState","useSearchParams","useTranslation","ReactSelect","baseClass","SortComplex","props","$","collection","handleChange","modifySearchQuery","t0","undefined","router","pathname","searchParams","i18n","t","sortOptions","setSortOptions","t1","fields","reduce","field","indexOf","type","label","name","value","sortFields","sortField","setSortField","t2","initialSort","sortOrder","setSortOrder","t3","newSortValue","sort","search","stringify","addQueryPrefix","replace","t4","t5","t6","t7","t8","incomingSort","_jsx","className","children","Fragment","_jsxs","onChange","options"],"sources":["../../../src/elements/SortComplex/index.tsx"],"sourcesContent":["'use client'\nimport type { OptionObject, SanitizedCollectionConfig } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\n// TODO: abstract the `next/navigation` dependency out from this component\nimport { usePathname, useRouter } from 'next/navigation.js'\nimport { sortableFieldTypes } from 'payload'\nimport { fieldAffectsData } from 'payload/shared'\nimport * as qs from 'qs-esm'\nimport React, { useEffect, useState } from 'react'\n\nexport type SortComplexProps = {\n  collection: SanitizedCollectionConfig\n  handleChange?: (sort: string) => void\n  modifySearchQuery?: boolean\n  sort?: string\n}\n\nimport type { Option } from '../ReactSelect/index.js'\n\nimport { useSearchParams } from '../../providers/SearchParams/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { ReactSelect } from '../ReactSelect/index.js'\nimport './index.scss'\n\nconst baseClass = 'sort-complex'\n\nexport const SortComplex: React.FC<SortComplexProps> = (props) => {\n  const { collection, handleChange, modifySearchQuery = true } = props\n\n  const router = useRouter()\n  const pathname = usePathname()\n  const { searchParams } = useSearchParams()\n  const { i18n, t } = useTranslation()\n  const [sortOptions, setSortOptions] = useState<OptionObject[]>()\n\n  const [sortFields] = useState(() =>\n    collection.fields.reduce((fields, field) => {\n      if (fieldAffectsData(field) && sortableFieldTypes.indexOf(field.type) > -1) {\n        return [\n          ...fields,\n          { label: getTranslation(field.label || field.name, i18n), value: field.name },\n        ]\n      }\n      return fields\n    }, []),\n  )\n\n  const [sortField, setSortField] = useState(sortFields[0])\n  const [initialSort] = useState<Option>(() => ({ label: t('general:descending'), value: '-' }))\n  const [sortOrder, setSortOrder] = useState(initialSort)\n\n  useEffect(() => {\n    if (sortField?.value) {\n      const newSortValue = `${sortOrder.value}${sortField.value}`\n\n      if (handleChange) handleChange(newSortValue)\n\n      if (searchParams.sort !== newSortValue && modifySearchQuery) {\n        const search = qs.stringify(\n          {\n            ...searchParams,\n            sort: newSortValue,\n          },\n          { addQueryPrefix: true },\n        )\n\n        router.replace(`${pathname}${search}`)\n      }\n    }\n  }, [pathname, router, searchParams, sortField, sortOrder, modifySearchQuery, handleChange])\n\n  useEffect(() => {\n    setSortOptions([\n      { label: t('general:ascending'), value: '' },\n      { label: t('general:descending'), value: '-' },\n    ])\n  }, [i18n, t])\n\n  return (\n    <div className={baseClass}>\n      <React.Fragment>\n        <div className={`${baseClass}__wrap`}>\n          <div className={`${baseClass}__select`}>\n            <div className={`${baseClass}__label`}>{t('general:columnToSort')}</div>\n            <ReactSelect onChange={setSortField} options={sortFields} value={sortField} />\n          </div>\n          <div className={`${baseClass}__select`}>\n            <div className={`${baseClass}__label`}>{t('general:order')}</div>\n            <ReactSelect\n              onChange={(incomingSort: Option) => {\n                setSortOrder(incomingSort || initialSort)\n              }}\n              options={sortOptions}\n              value={sortOrder}\n            />\n          </div>\n        </div>\n      </React.Fragment>\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","getTranslation","usePathname","useRouter","sortableFieldTypes","fieldAffectsData","qs","React","useEffect","useState","useSearchParams","useTranslation","ReactSelect","baseClass","SortComplex","props","$","collection","handleChange","modifySearchQuery","t0","undefined","router","pathname","searchParams","i18n","t","sortOptions","setSortOptions","t1","fields","reduce","field","indexOf","type","label","name","value","sortFields","sortField","setSortField","t2","initialSort","sortOrder","setSortOrder","t3","newSortValue","sort","search","stringify","addQueryPrefix","replace","t4","t5","t6","t7","t8","incomingSort","_jsx","className","children","Fragment","_jsxs","onChange","options"],"sources":["../../../src/elements/SortComplex/index.tsx"],"sourcesContent":["'use client'\nimport type { OptionObject, SanitizedCollectionConfig } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\n// TODO: abstract the `next/navigation` dependency out from this component\nimport { usePathname, useRouter } from 'next/navigation.js'\nimport { sortableFieldTypes } from 'payload'\nimport { fieldAffectsData } from 'payload/shared'\nimport * as qs from 'qs-esm'\nimport React, { useEffect, useState } from 'react'\n\nexport type SortComplexProps = {\n  collection: SanitizedCollectionConfig\n  handleChange?: (sort: string) => void\n  modifySearchQuery?: boolean\n  sort?: string\n}\n\nimport type { Option } from '../ReactSelect/index.js'\n\nimport { useSearchParams } from '../../providers/SearchParams/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { ReactSelect } from '../ReactSelect/index.js'\nimport './index.scss'\n\nconst baseClass = 'sort-complex'\n\nexport const SortComplex: React.FC<SortComplexProps> = (props) => {\n  const { collection, handleChange, modifySearchQuery = true } = props\n\n  const router = useRouter()\n  const pathname = usePathname()\n  const { searchParams } = useSearchParams()\n  const { i18n, t } = useTranslation()\n  const [sortOptions, setSortOptions] = useState<OptionObject[]>()\n\n  const [sortFields] = useState(() =>\n    collection.fields.reduce((fields, field) => {\n      if (fieldAffectsData(field) && sortableFieldTypes.indexOf(field.type) > -1) {\n        return [\n          ...fields,\n          { label: getTranslation(field.label || field.name, i18n), value: field.name },\n        ]\n      }\n      return fields\n    }, []),\n  )\n\n  const [sortField, setSortField] = useState(sortFields[0])\n  const [initialSort] = useState<Option>(() => ({ label: t('general:descending'), value: '-' }))\n  const [sortOrder, setSortOrder] = useState(initialSort)\n\n  useEffect(() => {\n    if (sortField?.value) {\n      const newSortValue = `${sortOrder.value}${sortField.value}`\n\n      if (handleChange) {\n        handleChange(newSortValue)\n      }\n\n      if (searchParams.sort !== newSortValue && modifySearchQuery) {\n        const search = qs.stringify(\n          {\n            ...searchParams,\n            sort: newSortValue,\n          },\n          { addQueryPrefix: true },\n        )\n\n        router.replace(`${pathname}${search}`)\n      }\n    }\n  }, [pathname, router, searchParams, sortField, sortOrder, modifySearchQuery, handleChange])\n\n  useEffect(() => {\n    setSortOptions([\n      { label: t('general:ascending'), value: '' },\n      { label: t('general:descending'), value: '-' },\n    ])\n  }, [i18n, t])\n\n  return (\n    <div className={baseClass}>\n      <React.Fragment>\n        <div className={`${baseClass}__wrap`}>\n          <div className={`${baseClass}__select`}>\n            <div className={`${baseClass}__label`}>{t('general:columnToSort')}</div>\n            <ReactSelect onChange={setSortField} options={sortFields} value={sortField} />\n          </div>\n          <div className={`${baseClass}__select`}>\n            <div className={`${baseClass}__label`}>{t('general:order')}</div>\n            <ReactSelect\n              onChange={(incomingSort: Option) => {\n                setSortOrder(incomingSort || initialSort)\n              }}\n              options={sortOptions}\n              value={sortOrder}\n            />\n          </div>\n        </div>\n      </React.Fragment>\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/SortComplex/index.scss

@@ -1,36 +1,38 @@
 @import '../../scss/styles.scss';
 
-.sort-complex {
-  background: var(--theme-elevation-100);
-  padding: base(0.5);
-  display: flex;
-
-  &__wrap {
-    width: 100%;
+@layer payload-default {
+  .sort-complex {
+    background: var(--theme-elevation-100);
+    padding: base(0.5);
     display: flex;
-    align-items: center;
-  }
-
-  &__select {
-    width: 50%;
-    margin-bottom: base(0.5);
-    padding: 0 base(0.5);
-    flex-grow: 1;
-  }
 
-  &__label {
-    color: var(--theme-elevation-400);
-    margin: base(0.5) 0;
-  }
-
-  @include mid-break {
     &__wrap {
-      display: block;
+      width: 100%;
+      display: flex;
+      align-items: center;
     }
 
     &__select {
-      margin: 0 0 base(0.5);
-      width: 100%;
+      width: 50%;
+      margin-bottom: base(0.5);
+      padding: 0 base(0.5);
+      flex-grow: 1;
+    }
+
+    &__label {
+      color: var(--theme-elevation-400);
+      margin: base(0.5) 0;
+    }
+
+    @include mid-break {
+      &__wrap {
+        display: block;
+      }
+
+      &__select {
+        margin: 0 0 base(0.5);
+        width: 100%;
+      }
     }
   }
 }

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Status/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAgC,MAAM,OAAO,CAAA;AAUpD,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAiM1B,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Status/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAgC,MAAM,OAAO,CAAA;AAUpD,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAuN1B,CAAA"}