@payloadcms/ui 3.0.0-canary.518fabe → 3.0.0-canary.51be7be

package/dist/elements/CodeEditor/CodeEditor.js

@@ -3,23 +3,21 @@
 import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx } from "react/jsx-runtime";
 import EditorImport from '@monaco-editor/react';
-import React from 'react';
+import React, { useState } from 'react';
 import { useTheme } from '../../providers/Theme/index.js';
 import { ShimmerEffect } from '../ShimmerEffect/index.js';
 import './index.scss';
 const Editor = EditorImport.default || EditorImport;
 const baseClass = 'code-editor';
 const CodeEditor = props => {
-  const $ = _c(17);
+  const $ = _c(20);
   let rest;
   let readOnly;
   let className;
-  let height;
   let options;
   if ($[0] !== props) {
     ({
       className,
-      height,
       options,
       readOnly,
       ...rest
@@ -28,62 +26,90 @@ const CodeEditor = props => {
     $[1] = rest;
     $[2] = readOnly;
     $[3] = className;
-    $[4] = height;
-    $[5] = options;
+    $[4] = options;
   } else {
     rest = $[1];
     readOnly = $[2];
     className = $[3];
-    height = $[4];
-    options = $[5];
+    options = $[4];
   }
+  const [dynamicHeight, setDynamicHeight] = useState(20);
   const {
     theme
   } = useTheme();
   const t0 = rest?.defaultLanguage ? `language--${rest.defaultLanguage}` : "";
   const t1 = readOnly && "read-only";
   let t2;
-  if ($[6] !== className || $[7] !== t0 || $[8] !== t1) {
+  if ($[5] !== className || $[6] !== t0 || $[7] !== t1) {
     t2 = [baseClass, className, t0, t1].filter(Boolean);
-    $[6] = className;
-    $[7] = t0;
-    $[8] = t1;
-    $[9] = t2;
+    $[5] = className;
+    $[6] = t0;
+    $[7] = t1;
+    $[8] = t2;
   } else {
-    t2 = $[9];
+    t2 = $[8];
   }
   const classes = t2.join(" ");
   let t3;
-  if ($[10] !== height || $[11] !== readOnly || $[12] !== options || $[13] !== theme || $[14] !== classes || $[15] !== rest) {
+  if ($[9] !== dynamicHeight || $[10] !== readOnly || $[11] !== options || $[12] !== theme || $[13] !== rest || $[14] !== classes) {
+    let t4;
+    if ($[16] !== rest.onChange) {
+      t4 = (value, ev) => {
+        rest.onChange?.(value, ev);
+        setDynamicHeight(value.split("\n").length * 18 + 2);
+      };
+      $[16] = rest.onChange;
+      $[17] = t4;
+    } else {
+      t4 = $[17];
+    }
+    let t5;
+    if ($[18] !== rest.onMount) {
+      t5 = (editor, monaco) => {
+        rest.onMount?.(editor, monaco);
+        setDynamicHeight(editor.getValue().split("\n").length * 18 + 2);
+      };
+      $[18] = rest.onMount;
+      $[19] = t5;
+    } else {
+      t5 = $[19];
+    }
     t3 = _jsx(Editor, {
       className: classes,
-      height,
       loading: _jsx(ShimmerEffect, {
-        height
+        height: dynamicHeight
       }),
       options: {
         detectIndentation: true,
+        hideCursorInOverviewRuler: true,
         minimap: {
           enabled: false
         },
+        overviewRulerBorder: false,
         readOnly: Boolean(readOnly),
+        scrollbar: {
+          alwaysConsumeMouseWheel: false
+        },
         scrollBeyondLastLine: false,
         tabSize: 2,
         wordWrap: "on",
         ...options
       },
       theme: theme === "dark" ? "vs-dark" : "vs",
-      ...rest
+      ...rest,
+      height: dynamicHeight,
+      onChange: t4,
+      onMount: t5
     });
-    $[10] = height;
-    $[11] = readOnly;
-    $[12] = options;
-    $[13] = theme;
+    $[9] = dynamicHeight;
+    $[10] = readOnly;
+    $[11] = options;
+    $[12] = theme;
+    $[13] = rest;
     $[14] = classes;
-    $[15] = rest;
-    $[16] = t3;
+    $[15] = t3;
   } else {
-    t3 = $[16];
+    t3 = $[15];
   }
   return t3;
 };

package/dist/elements/CodeEditor/CodeEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"CodeEditor.js","names":["c","_c","EditorImport","React","useTheme","ShimmerEffect","Editor","default","baseClass","CodeEditor","props","$","rest","readOnly","className","height","options","theme","t0","defaultLanguage","t1","t2","filter","Boolean","classes","join","t3","_jsx","loading","scrollBeyondLastLine","tabSize","wordWrap"],"sources":["../../../src/elements/CodeEditor/CodeEditor.tsx"],"sourcesContent":["'use client'\nimport EditorImport from '@monaco-editor/react'\nimport React from 'react'\n\nimport type { Props } from './types.js'\n\nimport { useTheme } from '../../providers/Theme/index.js'\nimport { ShimmerEffect } from '../ShimmerEffect/index.js'\nimport './index.scss'\n\nconst Editor = (EditorImport.default || EditorImport) as unknown as typeof EditorImport.default\n\nconst baseClass = 'code-editor'\n\nconst CodeEditor: React.FC<Props> = (props) => {\n  const { className, height, options, readOnly, ...rest } = props\n\n  const { theme } = useTheme()\n\n  const classes = [\n    baseClass,\n    className,\n    rest?.defaultLanguage ? `language--${rest.defaultLanguage}` : '',\n    readOnly && 'read-only',\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  return (\n    <Editor\n      className={classes}\n      height={height}\n      loading={<ShimmerEffect height={height} />}\n      options={{\n        detectIndentation: true,\n        minimap: {\n          enabled: false,\n        },\n        readOnly: Boolean(readOnly),\n        scrollBeyondLastLine: false,\n        tabSize: 2,\n        wordWrap: 'on',\n        ...options,\n      }}\n      theme={theme === 'dark' ? 'vs-dark' : 'vs'}\n      {...rest}\n    />\n  )\n}\n\n// eslint-disable-next-line no-restricted-exports\nexport default CodeEditor\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,OAAOC,YAAA,MAAkB;AACzB,OAAOC,KAAA,MAAW;AAIlB,SAASC,QAAQ,QAAQ;AACzB,SAASC,aAAa,QAAQ;AAC9B,OAAO;AAEP,MAAMC,MAAA,GAAUJ,YAAA,CAAaK,OAAO,IAAIL,YAAA;AAExC,MAAMM,SAAA,GAAY;AAElB,MAAMC,UAAA,GAA8BC,KAAA;EAAA,MAAAC,CAAA,GAAAV,EAAA;EAAA,IAAAW,IAAA;EAAA,IAAAC,QAAA;EAAA,IAAAC,SAAA;EAAA,IAAAC,MAAA;EAAA,IAAAC,OAAA;EAAA,IAAAL,CAAA,QAAAD,KAAA;IAClC;MAAAI,SAAA;MAAAC,MAAA;MAAAC,OAAA;MAAAH,QAAA;MAAA,GAAAD;IAAA,IAA0DF,KAAA;IAAAC,CAAA,MAAAD,KAAA;IAAAC,CAAA,MAAAC,IAAA;IAAAD,CAAA,MAAAE,QAAA;IAAAF,CAAA,MAAAG,SAAA;IAAAH,CAAA,MAAAI,MAAA;IAAAJ,CAAA,MAAAK,OAAA;EAAA;IAAAJ,IAAA,GAAAD,CAAA;IAAAE,QAAA,GAAAF,CAAA;IAAAG,SAAA,GAAAH,CAAA;IAAAI,MAAA,GAAAJ,CAAA;IAAAK,OAAA,GAAAL,CAAA;EAAA;EAE1D;IAAAM;EAAA,IAAkBb,QAAA;EAKhB,MAAAc,EAAA,GAAAN,IAAA,EAAAO,eAAA,GAAwB,aAAaP,IAAA,CAAAO,eAAA,EAAsB,GAAG;EAC9D,MAAAC,EAAA,GAAAP,QAAA,IAAY;EAAA,IAAAQ,EAAA;EAAA,IAAAV,CAAA,QAAAG,SAAA,IAAAH,CAAA,QAAAO,EAAA,IAAAP,CAAA,QAAAS,EAAA;IAJEC,EAAA,IAAAb,SAAA,EAEdM,SAAA,EACAI,EAA8D,EAC9DE,EAAY,EAAAE,MAAA,CAAAC,OAEJ;IAAAZ,CAAA,MAAAG,SAAA;IAAAH,CAAA,MAAAO,EAAA;IAAAP,CAAA,MAAAS,EAAA;IAAAT,CAAA,MAAAU,EAAA;EAAA;IAAAA,EAAA,GAAAV,CAAA;EAAA;EANV,MAAAa,OAAA,GAAgBH,EAMN,CAAAI,IAAA,CACF;EAAA,IAAAC,EAAA;EAAA,IAAAf,CAAA,SAAAI,MAAA,IAAAJ,CAAA,SAAAE,QAAA,IAAAF,CAAA,SAAAK,OAAA,IAAAL,CAAA,SAAAM,KAAA,IAAAN,CAAA,SAAAa,OAAA,IAAAb,CAAA,SAAAC,IAAA;IAGNc,EAAA,GAAAC,IAAA,CAAArB,MAAA;MAAAQ,SAAA,EACaU,OAAA;MAAAT,MAAA;MAAAa,OAAA,EAEFD,IAAA,CAAAtB,aAAA;QAAAU;MAAA,C;;;;;;kBAMGQ,OAAA,CAAQV,QAAA;QAAAgB,oBAAA;QAAAC,OAAA;QAAAC,QAAA,EAGR;QAAA,GACPf;MAAO;MAAAC,KAAA,EAELA,KAAA,KAAU,SAAS,YAAY;MAAA,GAClCL;IAAI,C;;;;;;;;;;;SAhBVc,E;CAmBJ;AAEA;AACA,eAAejB,UAAA","ignoreList":[]}
+{"version":3,"file":"CodeEditor.js","names":["c","_c","EditorImport","React","useState","useTheme","ShimmerEffect","Editor","default","baseClass","CodeEditor","props","$","rest","readOnly","className","options","dynamicHeight","setDynamicHeight","theme","t0","defaultLanguage","t1","t2","filter","Boolean","classes","join","t3","t4","onChange","value","ev","split","length","t5","onMount","editor","monaco","getValue","_jsx","loading","height","scrollbar","alwaysConsumeMouseWheel","scrollBeyondLastLine","tabSize","wordWrap"],"sources":["../../../src/elements/CodeEditor/CodeEditor.tsx"],"sourcesContent":["'use client'\nimport EditorImport from '@monaco-editor/react'\nimport React, { useState } from 'react'\n\nimport type { Props } from './types.js'\n\nimport { useTheme } from '../../providers/Theme/index.js'\nimport { ShimmerEffect } from '../ShimmerEffect/index.js'\nimport './index.scss'\n\nconst Editor = (EditorImport.default || EditorImport) as unknown as typeof EditorImport.default\n\nconst baseClass = 'code-editor'\n\nconst CodeEditor: React.FC<Props> = (props) => {\n  const { className, options, readOnly, ...rest } = props\n  const [dynamicHeight, setDynamicHeight] = useState(20)\n  const { theme } = useTheme()\n\n  const classes = [\n    baseClass,\n    className,\n    rest?.defaultLanguage ? `language--${rest.defaultLanguage}` : '',\n    readOnly && 'read-only',\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  return (\n    <Editor\n      className={classes}\n      loading={<ShimmerEffect height={dynamicHeight} />}\n      options={{\n        detectIndentation: true,\n        hideCursorInOverviewRuler: true,\n        minimap: {\n          enabled: false,\n        },\n        overviewRulerBorder: false,\n        readOnly: Boolean(readOnly),\n        scrollbar: {\n          alwaysConsumeMouseWheel: false,\n        },\n        scrollBeyondLastLine: false,\n        tabSize: 2,\n        wordWrap: 'on',\n        ...options,\n      }}\n      theme={theme === 'dark' ? 'vs-dark' : 'vs'}\n      {...rest}\n      // Since we are not building an IDE and the container\n      // can already have scrolling, we want the height of the\n      // editor to fit its content.\n      // See: https://github.com/microsoft/monaco-editor/discussions/3677\n      height={dynamicHeight}\n      onChange={(value, ev) => {\n        rest.onChange?.(value, ev)\n        setDynamicHeight(value.split('\\n').length * 18 + 2)\n      }}\n      onMount={(editor, monaco) => {\n        rest.onMount?.(editor, monaco)\n        setDynamicHeight(editor.getValue().split('\\n').length * 18 + 2)\n      }}\n    />\n  )\n}\n\n// eslint-disable-next-line no-restricted-exports\nexport default CodeEditor\n"],"mappings":"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","ignoreList":[]}

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/CodeEditor/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAyB,MAAM,OAAO,CAAA;AAE7C,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAMvC,YAAY,EAAE,KAAK,EAAE,CAAA;AAErB,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAQtC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/CodeEditor/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAyB,MAAM,OAAO,CAAA;AAE7C,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAMvC,YAAY,EAAE,KAAK,EAAE,CAAA;AAErB,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAMtC,CAAA"}

package/dist/elements/CodeEditor/index.js

@@ -5,16 +5,10 @@ import React, { lazy, Suspense } from 'react';
 import { ShimmerEffect } from '../ShimmerEffect/index.js';
 const LazyEditor = /*#__PURE__*/lazy(() => import('./CodeEditor.js'));
 export const CodeEditor = props => {
-  const {
-    height = '35vh'
-  } = props;
   return /*#__PURE__*/_jsx(Suspense, {
-    fallback: /*#__PURE__*/_jsx(ShimmerEffect, {
-      height: height
-    }),
+    fallback: /*#__PURE__*/_jsx(ShimmerEffect, {}),
     children: /*#__PURE__*/_jsx(LazyEditor, {
-      ...props,
-      height: height
+      ...props
     })
   });
 };

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","lazy","Suspense","ShimmerEffect","LazyEditor","CodeEditor","props","height","_jsx","fallback"],"sources":["../../../src/elements/CodeEditor/index.tsx"],"sourcesContent":["'use client'\nimport React, { lazy, Suspense } from 'react'\n\nimport type { Props } from './types.js'\n\nimport { ShimmerEffect } from '../ShimmerEffect/index.js'\n\nconst LazyEditor = lazy(() => import('./CodeEditor.js'))\n\nexport type { Props }\n\nexport const CodeEditor: React.FC<Props> = (props) => {\n  const { height = '35vh' } = props\n\n  return (\n    <Suspense fallback={<ShimmerEffect height={height} />}>\n      <LazyEditor {...props} height={height} />\n    </Suspense>\n  )\n}\n"],"mappings":"AAAA;;;AACA,OAAOA,KAAA,IAASC,IAAI,EAAEC,QAAQ,QAAQ;AAItC,SAASC,aAAa,QAAQ;AAE9B,MAAMC,UAAA,gBAAaH,IAAA,CAAK,MAAM,MAAM,CAAC;AAIrC,OAAO,MAAMI,UAAA,GAA+BC,KAAA;EAC1C,MAAM;IAAEC,MAAA,GAAS;EAAM,CAAE,GAAGD,KAAA;EAE5B,oBACEE,IAAA,CAACN,QAAA;IAASO,QAAA,eAAUD,IAAA,CAACL,aAAA;MAAcI,MAAA,EAAQA;;cACzC,aAAAC,IAAA,CAACJ,UAAA;MAAY,GAAGE,KAAK;MAAEC,MAAA,EAAQA;;;AAGrC","ignoreList":[]}
+{"version":3,"file":"index.js","names":["React","lazy","Suspense","ShimmerEffect","LazyEditor","CodeEditor","props","_jsx","fallback"],"sources":["../../../src/elements/CodeEditor/index.tsx"],"sourcesContent":["'use client'\nimport React, { lazy, Suspense } from 'react'\n\nimport type { Props } from './types.js'\n\nimport { ShimmerEffect } from '../ShimmerEffect/index.js'\n\nconst LazyEditor = lazy(() => import('./CodeEditor.js'))\n\nexport type { Props }\n\nexport const CodeEditor: React.FC<Props> = (props) => {\n  return (\n    <Suspense fallback={<ShimmerEffect />}>\n      <LazyEditor {...props} />\n    </Suspense>\n  )\n}\n"],"mappings":"AAAA;;;AACA,OAAOA,KAAA,IAASC,IAAI,EAAEC,QAAQ,QAAQ;AAItC,SAASC,aAAa,QAAQ;AAE9B,MAAMC,UAAA,gBAAaH,IAAA,CAAK,MAAM,MAAM,CAAC;AAIrC,OAAO,MAAMI,UAAA,GAA+BC,KAAA;EAC1C,oBACEC,IAAA,CAACL,QAAA;IAASM,QAAA,eAAUD,IAAA,CAACJ,aAAA;cACnB,aAAAI,IAAA,CAACH,UAAA;MAAY,GAAGE;;;AAGtB","ignoreList":[]}

package/dist/elements/CodeEditor/index.scss

@@ -1,21 +1,23 @@
 @import '../../scss/styles';
 
-.code-editor {
-  direction: ltr;
-  @include formInput;
-  height: auto;
-  padding: 0;
+@layer payload-default {
+  .code-editor {
+    direction: ltr;
+    @include formInput;
+    height: auto;
+    padding: 0;
 
-  .monaco-editor {
-    .view-overlays .current-line {
-      max-width: calc(100% - 14px);
-      border-width: 0px;
-    }
-
-    &:focus-within {
+    .monaco-editor {
       .view-overlays .current-line {
-        border-right: 0;
-        border-width: 1px;
+        max-width: calc(100% - 14px);
+        border-width: 0px;
+      }
+
+      &:focus-within {
+        .view-overlays .current-line {
+          border-right: 0;
+          border-width: 1px;
+        }
       }
     }
   }

package/dist/elements/Collapsible/index.scss

@@ -1,158 +1,160 @@
 @import '../../scss/styles.scss';
 
-.collapsible {
-  --toggle-pad-h: #{base(0.75)};
-  --toggle-pad-v: #{base(0.6)};
-
-  border-radius: $style-radius-m;
-
-  &__toggle-wrap {
-    position: relative;
-    padding: base(0.4) base(0.4) base(0.4) base(0.8);
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    background: var(--theme-elevation-50);
-    line-height: base(1.2);
-    gap: base(0.2);
-    border-top-right-radius: $style-radius-m;
-    border-top-left-radius: $style-radius-m;
-    width: 100%;
-
-    &:hover {
-      background: var(--theme-elevation-100);
-    }
+@layer payload-default {
+  .collapsible {
+    --toggle-pad-h: #{base(0.75)};
+    --toggle-pad-v: #{base(0.6)};
+
+    border-radius: $style-radius-m;
+
+    &__toggle-wrap {
+      position: relative;
+      padding: base(0.4) base(0.4) base(0.4) base(0.8);
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      background: var(--theme-elevation-50);
+      line-height: base(1.2);
+      gap: base(0.2);
+      border-top-right-radius: $style-radius-m;
+      border-top-left-radius: $style-radius-m;
+      width: 100%;
+
+      &:hover {
+        background: var(--theme-elevation-100);
+      }
 
-    &:has(.collapsible__drag) {
-      padding-inline-start: base(0.4);
+      &:has(.collapsible__drag) {
+        padding-inline-start: base(0.4);
+      }
     }
-  }
 
-  &__drag {
-    display: flex;
-    opacity: 0.5;
-    top: var(--toggle-pad-v);
-    width: base(1.2);
-    height: base(1.2);
-    padding: base(0.1);
+    &__drag {
+      display: flex;
+      opacity: 0.5;
+      top: var(--toggle-pad-v);
+      width: base(1.2);
+      height: base(1.2);
+      padding: base(0.1);
+
+      icon {
+        width: 100%;
+        height: 100%;
+      }
+    }
 
-    icon {
+    &__toggle {
+      @extend %btn-reset;
+      @extend %body;
+      text-align: left;
+      cursor: pointer;
+      border-top-right-radius: $style-radius-m;
+      border-top-left-radius: $style-radius-m;
       width: 100%;
       height: 100%;
-    }
-  }
+      color: transparent;
+      position: absolute;
+      top: 0;
+      left: 0;
 
-  &__toggle {
-    @extend %btn-reset;
-    @extend %body;
-    text-align: left;
-    cursor: pointer;
-    border-top-right-radius: $style-radius-m;
-    border-top-left-radius: $style-radius-m;
-    width: 100%;
-    height: 100%;
-    color: transparent;
-    position: absolute;
-    top: 0;
-    left: 0;
-
-    span {
-      user-select: none;
+      span {
+        user-select: none;
+      }
     }
-  }
 
-  &--style-default {
-    border: 1px solid var(--theme-elevation-200);
-    &:hover {
-      border: 1px solid var(--theme-elevation-300);
-    }
+    &--style-default {
+      border: 1px solid var(--theme-elevation-200);
+      &:hover {
+        border: 1px solid var(--theme-elevation-300);
+      }
 
-    > .collapsible__toggle-wrap {
-      .row-label {
-        color: var(--theme-text);
+      > .collapsible__toggle-wrap {
+        .row-label {
+          color: var(--theme-text);
+        }
       }
     }
-  }
 
-  &--style-error {
-    border: 1px solid var(--theme-error-400);
-    > .collapsible__toggle-wrap {
-      background-color: var(--theme-error-100);
+    &--style-error {
+      border: 1px solid var(--theme-error-400);
+      > .collapsible__toggle-wrap {
+        background-color: var(--theme-error-100);
 
-      &:hover {
-        background: var(--theme-error-150);
-      }
+        &:hover {
+          background: var(--theme-error-150);
+        }
 
-      .row-label {
-        color: var(--theme-error-950);
+        .row-label {
+          color: var(--theme-error-950);
+        }
       }
     }
-  }
 
-  &__header-wrap {
-    top: 0;
-    right: base(3);
-    bottom: 0;
-    left: 0;
-    pointer-events: none;
-    width: 100%;
-    overflow: hidden;
-    max-width: 100%;
-  }
+    &__header-wrap {
+      top: 0;
+      right: base(3);
+      bottom: 0;
+      left: 0;
+      pointer-events: none;
+      width: 100%;
+      overflow: hidden;
+      max-width: 100%;
+    }
 
-  &__header-wrap--has-drag-handle {
-    left: base(1);
-  }
+    &__header-wrap--has-drag-handle {
+      left: base(1);
+    }
 
-  &--collapsed {
-    .collapsible__toggle-wrap {
-      border-bottom-right-radius: $style-radius-m;
-      border-bottom-left-radius: $style-radius-m;
+    &--collapsed {
+      .collapsible__toggle-wrap {
+        border-bottom-right-radius: $style-radius-m;
+        border-bottom-left-radius: $style-radius-m;
+      }
     }
-  }
 
-  &__actions-wrap {
-    pointer-events: none;
-    display: flex;
-    gap: base(0.2);
-    margin-inline-end: base(0.2);
-  }
+    &__actions-wrap {
+      pointer-events: none;
+      display: flex;
+      gap: base(0.2);
+      margin-inline-end: base(0.2);
+    }
 
-  &__actions {
-    pointer-events: all;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    width: base(1.2);
-    height: base(1.2);
+    &__actions {
+      pointer-events: all;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      width: base(1.2);
+      height: base(1.2);
 
-    &.icon {
-      padding: base(0.1);
+      &.icon {
+        padding: base(0.1);
+      }
     }
-  }
 
-  &__indicator {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    width: base(1.2);
-    height: base(1.2);
+    &__indicator {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      width: base(1.2);
+      height: base(1.2);
 
-    &.icon {
-      padding: base(0.1);
+      &.icon {
+        padding: base(0.1);
+      }
     }
-  }
-
-  &__content {
-    background-color: var(--theme-elevation-0);
-    border-bottom-left-radius: $style-radius-m;
-    border-bottom-right-radius: $style-radius-m;
-    padding: var(--base);
-  }
 
-  @include small-break {
     &__content {
-      padding: var(--gutter-h);
+      background-color: var(--theme-elevation-0);
+      border-bottom-left-radius: $style-radius-m;
+      border-bottom-right-radius: $style-radius-m;
+      padding: var(--base);
+    }
+
+    @include small-break {
+      &__content {
+        padding: var(--gutter-h);
+      }
     }
   }
 }

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/ColumnSelector/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAA;AAExD,OAAO,KAAgB,MAAM,OAAO,CAAA;AAUpC,OAAO,cAAc,CAAA;AAIrB,MAAM,MAAM,KAAK,GAAG;IAClB,QAAQ,CAAC,cAAc,EAAE,yBAAyB,CAAC,MAAM,CAAC,CAAA;CAC3D,CAAA;AAQD,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAuD1C,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/ColumnSelector/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAA;AAExD,OAAO,KAAgB,MAAM,OAAO,CAAA;AAUpC,OAAO,cAAc,CAAA;AAIrB,MAAM,MAAM,KAAK,GAAG;IAClB,QAAQ,CAAC,cAAc,EAAE,yBAAyB,CAAC,MAAM,CAAC,CAAA;CAC3D,CAAA;AAQD,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAkE1C,CAAA"}

package/dist/elements/ColumnSelector/index.js

@@ -60,9 +60,21 @@ export const ColumnSelector = t0 => {
         const {
           accessor,
           active,
-          Label
+          cellProps: t4
         } = col_0;
-        if (col_0.accessor === "_select") {
+        const {
+          field: t5
+        } = t4;
+        const {
+          admin: t6
+        } = t5 === undefined ? {} : t5;
+        const {
+          components: t7
+        } = t6 === undefined ? {} : t6;
+        const {
+          Label
+        } = t7 === undefined ? {} : t7;
+        if (col_0.accessor === "_select" || Label === null) {
           return null;
         }
         return _jsx(Pill, {

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","React","useId","PlusIcon","XIcon","useEditDepth","DraggableSortable","Pill","useTableColumns","baseClass","filterColumnFields","fields","filter","field","cellProps","admin","disableListColumn","ColumnSelector","t0","$","collectionSlug","columns","moveColumn","toggleColumn","uuid","editDepth","t1","filteredColumns","t2","t3","moveFromIndex","moveToIndex","fromIndex","toIndex","col_0","i","col","accessor","active","Label","_jsx","alignIcon","className","Boolean","join","draggable","icon","id","onClick","children","name","ids","map","_temp","onDragEnd"],"sources":["../../../src/elements/ColumnSelector/index.tsx"],"sourcesContent":["'use client'\nimport type { SanitizedCollectionConfig } from 'payload'\n\nimport React, { useId } from 'react'\n\nimport type { Column } from '../Table/index.js'\n\nimport { PlusIcon } from '../../icons/Plus/index.js'\nimport { XIcon } from '../../icons/X/index.js'\nimport { useEditDepth } from '../../providers/EditDepth/index.js'\nimport { DraggableSortable } from '../DraggableSortable/index.js'\nimport { Pill } from '../Pill/index.js'\nimport { useTableColumns } from '../TableColumns/index.js'\nimport './index.scss'\n\nconst baseClass = 'column-selector'\n\nexport type Props = {\n  readonly collectionSlug: SanitizedCollectionConfig['slug']\n}\n\nconst filterColumnFields = (fields: Column[]): Column[] => {\n  return fields.filter((field) => {\n    return !field.cellProps?.field?.admin?.disableListColumn\n  })\n}\n\nexport const ColumnSelector: React.FC<Props> = ({ collectionSlug }) => {\n  const { columns, moveColumn, toggleColumn } = useTableColumns()\n\n  const uuid = useId()\n  const editDepth = useEditDepth()\n\n  if (!columns) {\n    return null\n  }\n\n  const filteredColumns = filterColumnFields(columns)\n\n  return (\n    <DraggableSortable\n      className={baseClass}\n      ids={filteredColumns.map((col) => col?.accessor)}\n      onDragEnd={({ moveFromIndex, moveToIndex }) => {\n        moveColumn({\n          fromIndex: moveFromIndex,\n          toIndex: moveToIndex,\n        })\n      }}\n    >\n      {filteredColumns.map((col, i) => {\n        if (!col) {\n          return null\n        }\n\n        const { accessor, active, Label } = col\n\n        if (col.accessor === '_select') {\n          return null\n        }\n\n        return (\n          <Pill\n            alignIcon=\"left\"\n            aria-checked={active}\n            className={[`${baseClass}__column`, active && `${baseClass}__column--active`]\n              .filter(Boolean)\n              .join(' ')}\n            draggable\n            icon={active ? <XIcon /> : <PlusIcon />}\n            id={accessor}\n            key={`${collectionSlug}-${col.cellProps?.field && 'name' in col.cellProps.field ? col.cellProps?.field?.name : i}${editDepth ? `-${editDepth}-` : ''}${uuid}`}\n            onClick={() => {\n              toggleColumn(accessor)\n            }}\n          >\n            {Label}\n          </Pill>\n        )\n      })}\n    </DraggableSortable>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","React","useId","PlusIcon","XIcon","useEditDepth","DraggableSortable","Pill","useTableColumns","baseClass","filterColumnFields","fields","filter","field","cellProps","admin","disableListColumn","ColumnSelector","t0","$","collectionSlug","columns","moveColumn","toggleColumn","uuid","editDepth","t1","filteredColumns","t2","t3","moveFromIndex","moveToIndex","fromIndex","toIndex","col_0","i","col","accessor","active","t4","t5","t6","undefined","components","t7","Label","_jsx","alignIcon","className","Boolean","join","draggable","icon","id","onClick","children","name","ids","map","_temp","onDragEnd"],"sources":["../../../src/elements/ColumnSelector/index.tsx"],"sourcesContent":["'use client'\nimport type { SanitizedCollectionConfig } from 'payload'\n\nimport React, { useId } from 'react'\n\nimport type { Column } from '../Table/index.js'\n\nimport { PlusIcon } from '../../icons/Plus/index.js'\nimport { XIcon } from '../../icons/X/index.js'\nimport { useEditDepth } from '../../providers/EditDepth/index.js'\nimport { DraggableSortable } from '../DraggableSortable/index.js'\nimport { Pill } from '../Pill/index.js'\nimport { useTableColumns } from '../TableColumns/index.js'\nimport './index.scss'\n\nconst baseClass = 'column-selector'\n\nexport type Props = {\n  readonly collectionSlug: SanitizedCollectionConfig['slug']\n}\n\nconst filterColumnFields = (fields: Column[]): Column[] => {\n  return fields.filter((field) => {\n    return !field.cellProps?.field?.admin?.disableListColumn\n  })\n}\n\nexport const ColumnSelector: React.FC<Props> = ({ collectionSlug }) => {\n  const { columns, moveColumn, toggleColumn } = useTableColumns()\n\n  const uuid = useId()\n  const editDepth = useEditDepth()\n\n  if (!columns) {\n    return null\n  }\n\n  const filteredColumns = filterColumnFields(columns)\n\n  return (\n    <DraggableSortable\n      className={baseClass}\n      ids={filteredColumns.map((col) => col?.accessor)}\n      onDragEnd={({ moveFromIndex, moveToIndex }) => {\n        moveColumn({\n          fromIndex: moveFromIndex,\n          toIndex: moveToIndex,\n        })\n      }}\n    >\n      {filteredColumns.map((col, i) => {\n        if (!col) {\n          return null\n        }\n\n        const {\n          accessor,\n          active,\n          cellProps: {\n            field: {\n              admin: {\n                // @ts-expect-error // TODO: `Label` does not exist on the UI field\n                components: { Label } = {},\n              } = {},\n            } = {},\n          },\n        } = col\n\n        if (col.accessor === '_select' || Label === null) {\n          return null\n        }\n\n        return (\n          <Pill\n            alignIcon=\"left\"\n            aria-checked={active}\n            className={[`${baseClass}__column`, active && `${baseClass}__column--active`]\n              .filter(Boolean)\n              .join(' ')}\n            draggable\n            icon={active ? <XIcon /> : <PlusIcon />}\n            id={accessor}\n            key={`${collectionSlug}-${col.cellProps?.field && 'name' in col.cellProps.field ? col.cellProps?.field?.name : i}${editDepth ? `-${editDepth}-` : ''}${uuid}`}\n            onClick={() => {\n              toggleColumn(accessor)\n            }}\n          >\n            {Label}\n          </Pill>\n        )\n      })}\n    </DraggableSortable>\n  )\n}\n"],"mappings":"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","ignoreList":[]}