@payloadcms/ui 3.0.0-canary.b8dd0db → 3.0.0-canary.bb00d64

package/dist/elements/Status/index.scss

@@ -1,41 +1,62 @@
 @import '../../scss/styles.scss';
 
-.status {
-  &__label {
-    color: var(--theme-elevation-500);
-  }
+@layer payload-default {
+  .status {
+    &__label {
+      color: var(--theme-elevation-500);
+    }
 
-  &__value {
-    font-weight: 600;
-  }
+    &__value {
+      font-weight: 600;
+    }
 
-  &__value-wrap {
-    white-space: nowrap;
-  }
+    &__value-wrap {
+      white-space: nowrap;
+    }
 
-  &__action {
-    text-decoration: underline;
-  }
+    &__action {
+      text-decoration: underline;
+    }
 
-  &__modal {
-    @include blur-bg;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    height: 100%;
-    padding: base(2);
+    &__modal {
+      @include blur-bg;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      height: 100%;
 
-    &__toggle {
-      @extend %btn-reset;
+      &__toggle {
+        @extend %btn-reset;
+      }
     }
 
-    .btn {
-      margin-right: $baseline;
+    &__wrapper {
+      z-index: 1;
+      position: relative;
+      display: flex;
+      flex-direction: column;
+      gap: base(0.8);
+      padding: base(2);
+      max-width: base(36);
     }
-  }
 
-  &__modal-template {
-    position: relative;
-    z-index: 1;
+    &__content {
+      display: flex;
+      flex-direction: column;
+      gap: base(0.4);
+
+      > * {
+        margin: 0;
+      }
+    }
+
+    &__controls {
+      display: flex;
+      gap: base(0.4);
+
+      .btn {
+        margin: 0;
+      }
+    }
   }
 }

package/dist/elements/StayLoggedIn/index.scss

@@ -1,37 +1,40 @@
 @import '../../scss/styles.scss';
 
-.stay-logged-in {
-  @include blur-bg;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  height: 100%;
-
-  &__wrapper {
-    z-index: 1;
-    position: relative;
+@layer payload-default {
+  .stay-logged-in {
+    @include blur-bg;
     display: flex;
-    flex-direction: column;
-    gap: var(--base);
-    padding: base(2);
-  }
+    align-items: center;
+    justify-content: center;
+    height: 100%;
 
-  &__content {
-    display: flex;
-    flex-direction: column;
-    gap: var(--base);
+    &__wrapper {
+      z-index: 1;
+      position: relative;
+      display: flex;
+      flex-direction: column;
+      gap: var(--base);
+      padding: base(2);
+    }
 
-    > * {
-      margin: 0;
+    &__content {
+      display: flex;
+      flex-direction: column;
+      gap: var(--base);
+      max-width: base(36);
+
+      > * {
+        margin: 0;
+      }
     }
-  }
 
-  &__controls {
-    display: flex;
-    gap: var(--base);
+    &__controls {
+      display: flex;
+      gap: var(--base);
 
-    .btn {
-      margin: 0;
+      .btn {
+        margin: 0;
+      }
     }
   }
 }

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

@@ -1,11 +1,12 @@
 import React from 'react';
+import type { StepNavItem } from './types.js';
 import { StepNavProvider, useStepNav } from './context.js';
 import './index.scss';
 export { SetStepNav } from './SetStepNav.js';
-import type { StepNavItem } from './types.js';
 declare const StepNav: React.FC<{
-    readonly Link?: React.ComponentType;
     readonly className?: string;
+    readonly CustomIcon?: React.ReactNode;
+    readonly Link?: React.ComponentType;
 }>;
 export { StepNav, StepNavItem, StepNavProvider, useStepNav };
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/StepNav/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAmB,MAAM,OAAO,CAAA;AAIvC,OAAO,EAAE,eAAe,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAC1D,OAAO,cAAc,CAAA;AACrB,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAA;AAC5C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,YAAY,CAAA;AAO7C,QAAA,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC;IACtB,QAAQ,CAAC,IAAI,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;IACnC,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAC5B,CAmEA,CAAA;AAED,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,UAAU,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/StepNav/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAmB,MAAM,OAAO,CAAA;AAEvC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,YAAY,CAAA;AAM7C,OAAO,EAAE,eAAe,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAC1D,OAAO,cAAc,CAAA;AAErB,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAA;AAI5C,QAAA,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC;IACtB,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACrC,QAAQ,CAAC,IAAI,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;CACpC,CAqEA,CAAA;AAED,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,UAAU,EAAE,CAAA"}

package/dist/elements/StepNav/index.js

@@ -4,19 +4,20 @@ import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { getTranslation } from '@payloadcms/translations';
 import React, { Fragment } from 'react';
+import { PayloadIcon } from '../../graphics/Icon/index.js';
 import { useConfig } from '../../providers/Config/index.js';
 import { useTranslation } from '../../providers/Translation/index.js';
+import { RenderCustomComponent } from '../RenderCustomComponent/index.js';
 import { StepNavProvider, useStepNav } from './context.js';
 import './index.scss';
 export { SetStepNav } from './SetStepNav.js';
-import { PayloadIcon } from '../../graphics/Icon/index.js';
-import { RenderComponent } from '../../providers/Config/RenderComponent.js';
 const baseClass = 'step-nav';
 const StepNav = t0 => {
-  const $ = _c(8);
+  const $ = _c(9);
   const {
-    Link,
-    className
+    className,
+    CustomIcon,
+    Link
   } = t0;
   const {
     i18n
@@ -25,7 +26,6 @@ const StepNav = t0 => {
     stepNav
   } = useStepNav();
   const {
-    config,
     config: t1
   } = useConfig();
   const {
@@ -38,20 +38,25 @@ const StepNav = t0 => {
     t
   } = useTranslation();
   const LinkElement = Link || "a";
-  let t3;
-  if ($[0] !== stepNav || $[1] !== className || $[2] !== t || $[3] !== config || $[4] !== admin || $[5] !== LinkElement || $[6] !== i18n) {
-    t3 = _jsx(Fragment, {
+  const t3 = Link ? false : undefined;
+  let t4;
+  if ($[0] !== t3 || $[1] !== stepNav || $[2] !== className || $[3] !== t || $[4] !== CustomIcon || $[5] !== admin || $[6] !== LinkElement || $[7] !== i18n) {
+    const baseLinkProps = {
+      prefetch: t3
+    };
+    t4 = _jsx(Fragment, {
       children: stepNav.length > 0 ? _jsxs("nav", {
         className: [baseClass, className].filter(Boolean).join(" "),
         children: [_jsx(LinkElement, {
           className: `${baseClass}__home`,
           href: admin,
           tabIndex: 0,
+          ...baseLinkProps,
           children: _jsx("span", {
             title: t("general:dashboard"),
-            children: _jsx(RenderComponent, {
-              Component: PayloadIcon,
-              mappedComponent: config?.admin?.components?.graphics?.Icon
+            children: _jsx(RenderCustomComponent, {
+              CustomComponent: CustomIcon,
+              Fallback: _jsx(PayloadIcon, {})
             })
           })
         }), _jsx("span", {
@@ -65,6 +70,7 @@ const StepNav = t0 => {
           }, i) : _jsxs(Fragment, {
             children: [item.url ? _jsx(LinkElement, {
               href: item.url,
+              ...baseLinkProps,
               children: _jsx("span", {
                 children: StepLabel
               }, i)
@@ -82,26 +88,27 @@ const StepNav = t0 => {
           className: `${baseClass}__home`,
           children: _jsx("span", {
             title: t("general:dashboard"),
-            children: _jsx(RenderComponent, {
-              Component: PayloadIcon,
-              mappedComponent: config?.admin?.components?.graphics?.Icon
+            children: _jsx(RenderCustomComponent, {
+              CustomComponent: CustomIcon,
+              Fallback: _jsx(PayloadIcon, {})
             })
           })
         })
       })
     });
-    $[0] = stepNav;
-    $[1] = className;
-    $[2] = t;
-    $[3] = config;
-    $[4] = admin;
-    $[5] = LinkElement;
-    $[6] = i18n;
-    $[7] = t3;
+    $[0] = t3;
+    $[1] = stepNav;
+    $[2] = className;
+    $[3] = t;
+    $[4] = CustomIcon;
+    $[5] = admin;
+    $[6] = LinkElement;
+    $[7] = i18n;
+    $[8] = t4;
   } else {
-    t3 = $[7];
+    t4 = $[8];
   }
-  return t3;
+  return t4;
 };
 export { StepNav, StepNavProvider, useStepNav };
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","getTranslation","React","Fragment","useConfig","useTranslation","StepNavProvider","useStepNav","SetStepNav","PayloadIcon","RenderComponent","baseClass","StepNav","t0","$","Link","className","i18n","stepNav","config","t1","routes","t2","admin","t","LinkElement","t3","_jsx","children","length","_jsxs","filter","Boolean","join","href","tabIndex","title","Component","mappedComponent","components","graphics","Icon","map","item","i","StepLabel","label","isLast","Step","url"],"sources":["../../../src/elements/StepNav/index.tsx"],"sourcesContent":["'use client'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport React, { Fragment } from 'react'\n\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { StepNavProvider, useStepNav } from './context.js'\nimport './index.scss'\nexport { SetStepNav } from './SetStepNav.js'\nimport type { StepNavItem } from './types.js'\n\nimport { PayloadIcon } from '../../graphics/Icon/index.js'\nimport { RenderComponent } from '../../providers/Config/RenderComponent.js'\n\nconst baseClass = 'step-nav'\n\nconst StepNav: React.FC<{\n  readonly Link?: React.ComponentType\n  readonly className?: string\n}> = ({ Link, className }) => {\n  const { i18n } = useTranslation()\n\n  const { stepNav } = useStepNav()\n\n  const {\n    config,\n    config: {\n      routes: { admin },\n    },\n  } = useConfig()\n\n  const { t } = useTranslation()\n\n  const LinkElement = Link || 'a'\n\n  return (\n    <Fragment>\n      {stepNav.length > 0 ? (\n        <nav className={[baseClass, className].filter(Boolean).join(' ')}>\n          <LinkElement className={`${baseClass}__home`} href={admin} tabIndex={0}>\n            <span title={t('general:dashboard')}>\n              <RenderComponent\n                Component={PayloadIcon}\n                mappedComponent={config?.admin?.components?.graphics?.Icon}\n              />\n            </span>\n          </LinkElement>\n          <span>/</span>\n          {stepNav.map((item, i) => {\n            const StepLabel = getTranslation(item.label, i18n)\n            const isLast = stepNav.length === i + 1\n\n            const Step = isLast ? (\n              <span className={`${baseClass}__last`} key={i}>\n                {StepLabel}\n              </span>\n            ) : (\n              <Fragment key={i}>\n                {item.url ? (\n                  <LinkElement href={item.url}>\n                    <span key={i}>{StepLabel}</span>\n                  </LinkElement>\n                ) : (\n                  <span key={i}>{StepLabel}</span>\n                )}\n                <span>/</span>\n              </Fragment>\n            )\n\n            return Step\n          })}\n        </nav>\n      ) : (\n        <div className={[baseClass, className].filter(Boolean).join(' ')}>\n          <div className={`${baseClass}__home`}>\n            <span title={t('general:dashboard')}>\n              <RenderComponent\n                Component={PayloadIcon}\n                mappedComponent={config?.admin?.components?.graphics?.Icon}\n              />\n            </span>\n          </div>\n        </div>\n      )}\n    </Fragment>\n  )\n}\n\nexport { StepNav, StepNavItem, StepNavProvider, useStepNav }\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","getTranslation","React","Fragment","PayloadIcon","useConfig","useTranslation","RenderCustomComponent","StepNavProvider","useStepNav","SetStepNav","baseClass","StepNav","t0","$","className","CustomIcon","Link","i18n","stepNav","config","t1","routes","t2","admin","t","LinkElement","t3","undefined","t4","baseLinkProps","prefetch","_jsx","children","length","_jsxs","filter","Boolean","join","href","tabIndex","title","CustomComponent","Fallback","map","item","i","StepLabel","label","isLast","Step","url"],"sources":["../../../src/elements/StepNav/index.tsx"],"sourcesContent":["'use client'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport React, { Fragment } from 'react'\n\nimport type { StepNavItem } from './types.js'\n\nimport { PayloadIcon } from '../../graphics/Icon/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { RenderCustomComponent } from '../RenderCustomComponent/index.js'\nimport { StepNavProvider, useStepNav } from './context.js'\nimport './index.scss'\n\nexport { SetStepNav } from './SetStepNav.js'\n\nconst baseClass = 'step-nav'\n\nconst StepNav: React.FC<{\n  readonly className?: string\n  readonly CustomIcon?: React.ReactNode\n  readonly Link?: React.ComponentType\n}> = ({ className, CustomIcon, Link }) => {\n  const { i18n } = useTranslation()\n\n  const { stepNav } = useStepNav()\n\n  const {\n    config: {\n      routes: { admin },\n    },\n  } = useConfig()\n\n  const { t } = useTranslation()\n\n  const LinkElement = Link || 'a'\n\n  const baseLinkProps = {\n    prefetch: Link ? false : undefined,\n  }\n\n  return (\n    <Fragment>\n      {stepNav.length > 0 ? (\n        <nav className={[baseClass, className].filter(Boolean).join(' ')}>\n          <LinkElement\n            className={`${baseClass}__home`}\n            href={admin}\n            tabIndex={0}\n            {...baseLinkProps}\n          >\n            <span title={t('general:dashboard')}>\n              <RenderCustomComponent CustomComponent={CustomIcon} Fallback={<PayloadIcon />} />\n            </span>\n          </LinkElement>\n          <span>/</span>\n          {stepNav.map((item, i) => {\n            const StepLabel = getTranslation(item.label, i18n)\n            const isLast = stepNav.length === i + 1\n\n            const Step = isLast ? (\n              <span className={`${baseClass}__last`} key={i}>\n                {StepLabel}\n              </span>\n            ) : (\n              <Fragment key={i}>\n                {item.url ? (\n                  <LinkElement href={item.url} {...baseLinkProps}>\n                    <span key={i}>{StepLabel}</span>\n                  </LinkElement>\n                ) : (\n                  <span key={i}>{StepLabel}</span>\n                )}\n                <span>/</span>\n              </Fragment>\n            )\n\n            return Step\n          })}\n        </nav>\n      ) : (\n        <div className={[baseClass, className].filter(Boolean).join(' ')}>\n          <div className={`${baseClass}__home`}>\n            <span title={t('general:dashboard')}>\n              <RenderCustomComponent CustomComponent={CustomIcon} Fallback={<PayloadIcon />} />\n            </span>\n          </div>\n        </div>\n      )}\n    </Fragment>\n  )\n}\n\nexport { StepNav, StepNavItem, StepNavProvider, useStepNav }\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/StepNav/index.scss

@@ -1,80 +1,81 @@
 @import '../../scss/styles.scss';
+@layer payload-default {
+  .step-nav {
+    display: flex;
+    align-items: center;
+    gap: calc(var(--base) / 2);
 
-.step-nav {
-  display: flex;
-  align-items: center;
-  gap: calc(var(--base) / 2);
-
-  &::after {
-    content: ' ';
-    position: sticky;
-    top: 0;
-    right: 0;
-    width: var(--base);
-    background: linear-gradient(to right, transparent, var(--theme-bg));
-  }
+    &::after {
+      content: ' ';
+      position: sticky;
+      top: 0;
+      right: 0;
+      width: var(--base);
+      background: linear-gradient(to right, transparent, var(--theme-bg));
+    }
 
-  // Use a pseudo element for the accessability so that it doesn't take up DOM space
-  // Also because the parent element has `overflow: hidden` which would clip an outline
-  &__home {
-    width: 18px;
-    height: 18px;
-    position: relative;
+    // Use a pseudo element for the accessability so that it doesn't take up DOM space
+    // Also because the parent element has `overflow: hidden` which would clip an outline
+    &__home {
+      width: 18px;
+      height: 18px;
+      position: relative;
 
-    &:focus-visible {
-      outline: none;
+      &:focus-visible {
+        outline: none;
 
-      &::after {
-        content: '';
-        border: var(--accessibility-outline);
-        position: absolute;
-        top: 0;
-        right: 0;
-        bottom: 0;
-        left: 0;
-        pointer-events: none;
+        &::after {
+          content: '';
+          border: var(--accessibility-outline);
+          position: absolute;
+          top: 0;
+          right: 0;
+          bottom: 0;
+          left: 0;
+          pointer-events: none;
+        }
       }
     }
-  }
 
-  * {
-    display: block;
-  }
+    * {
+      display: block;
+    }
 
-  a {
-    border: 0;
-    display: flex;
-    align-items: center;
-    font-weight: 600;
-    text-decoration: none;
+    a {
+      border: 0;
+      display: flex;
+      align-items: center;
+      font-weight: 600;
+      text-decoration: none;
 
-    label {
-      cursor: pointer;
-    }
+      label {
+        cursor: pointer;
+      }
 
-    &:hover,
-    &:focus-visible {
-      text-decoration: underline;
+      &:hover,
+      &:focus-visible {
+        text-decoration: underline;
+      }
     }
-  }
 
-  span {
-    max-width: base(8);
-    text-overflow: ellipsis;
-    overflow: hidden;
-    white-space: nowrap;
-  }
+    span {
+      max-width: base(8);
+      text-overflow: ellipsis;
+      overflow: hidden;
+      white-space: nowrap;
+    }
 
-  @include mid-break {
-    .step-nav {
-      &__home {
-        width: 16px;
-        height: 16px;
+    @include mid-break {
+      .step-nav {
+        &__home {
+          width: 16px;
+          height: 16px;
+        }
       }
     }
-  }
 
-  @include small-break {
-    gap: base(0.4);
+    @include small-break {
+      gap: base(0.4);
+    }
   }
 }

package/dist/elements/Table/DefaultCell/fields/Blocks/index.d.ts

@@ -1,6 +1,6 @@
-import type { BlockFieldClient, DefaultCellComponentProps } from 'payload';
+import type { BlocksFieldClient, DefaultCellComponentProps } from 'payload';
 import React from 'react';
-export interface BlocksCellProps extends DefaultCellComponentProps<any, BlockFieldClient> {
+export interface BlocksCellProps extends DefaultCellComponentProps<any, BlocksFieldClient> {
 }
 export declare const BlocksCell: React.FC<BlocksCellProps>;
 //# sourceMappingURL=index.d.ts.map

package/dist/elements/Table/DefaultCell/fields/Blocks/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/elements/Table/DefaultCell/fields/Blocks/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,gBAAgB,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAA;AAG1E,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,MAAM,WAAW,eAAgB,SAAQ,yBAAyB,CAAC,GAAG,EAAE,gBAAgB,CAAC;CAAG;AAE5F,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAoChD,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/elements/Table/DefaultCell/fields/Blocks/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAA;AAG3E,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,MAAM,WAAW,eAAgB,SAAQ,yBAAyB,CAAC,GAAG,EAAE,iBAAiB,CAAC;CAAG;AAE7F,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAoChD,CAAA"}

package/dist/elements/Table/DefaultCell/fields/Blocks/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","getTranslation","React","useTranslation","BlocksCell","t0","$","cellData","field","t1","blocks","labels","i18n","selectedBlocks","Array","isArray","map","_temp","translatedBlockLabels","b","slug","label","singular","plural","formatBlockList","blocks_0","b_0","filtered","filter","f","join","length","more","t","count","items","slice","t2","_jsx","children","blockType"],"sources":["../../../../../../src/elements/Table/DefaultCell/fields/Blocks/index.tsx"],"sourcesContent":["'use client'\nimport type { BlockFieldClient, DefaultCellComponentProps } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport React from 'react'\n\nimport { useTranslation } from '../../../../../providers/Translation/index.js'\n\nexport interface BlocksCellProps extends DefaultCellComponentProps<any, BlockFieldClient> {}\n\nexport const BlocksCell: React.FC<BlocksCellProps> = ({ cellData, field: { blocks, labels } }) => {\n  const { i18n } = useTranslation()\n\n  const selectedBlocks = Array.isArray(cellData) ? cellData.map(({ blockType }) => blockType) : []\n\n  const translatedBlockLabels = blocks?.map((b) => ({\n    slug: b.slug,\n    label: getTranslation(b.labels.singular, i18n),\n  }))\n\n  let label = `0 ${getTranslation(labels?.plural, i18n)}`\n\n  const formatBlockList = (blocks) =>\n    blocks\n      .map((b) => {\n        const filtered = translatedBlockLabels.filter((f) => f.slug === b)?.[0]\n        return filtered?.label\n      })\n      .join(', ')\n\n  const itemsToShow = 5\n\n  if (selectedBlocks.length > itemsToShow) {\n    const more = selectedBlocks.length - itemsToShow\n    label = `${selectedBlocks.length} ${getTranslation(labels?.plural, i18n)} - ${i18n.t(\n      'fields:itemsAndMore',\n      { count: more, items: formatBlockList(selectedBlocks.slice(0, itemsToShow)) },\n    )}`\n  } else if (selectedBlocks.length > 0) {\n    label = `${selectedBlocks.length} ${getTranslation(\n      selectedBlocks.length === 1 ? labels?.singular : labels?.plural,\n      i18n,\n    )} - ${formatBlockList(selectedBlocks)}`\n  }\n\n  return <span>{label}</span>\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAGA,SAASC,cAAc,QAAQ;AAC/B,OAAOC,KAAA,MAAW;AAElB,SAASC,cAAc,QAAQ;AAI/B,OAAO,MAAMC,UAAA,GAAwCC,EAAA;EAAA,MAAAC,CAAA,GAAAN,EAAA;EAAC;IAAAO,QAAA;IAAAC,KAAA,EAAAC;EAAA,IAAAJ,EAAuC;EAApB;IAAAK,MAAA;IAAAC;EAAA,IAAAF,EAAkB;EACzF;IAAAG;EAAA,IAAiBT,cAAA;EAEjB,MAAAU,cAAA,GAAuBC,KAAA,CAAAC,OAAA,CAAcR,QAAA,IAAYA,QAAA,CAAAS,GAAA,CAAAC,KAAgC,MAAe;EAEhG,MAAAC,qBAAA,GAA8BR,MAAA,EAAAM,GAAA,CAAAG,CAAA;IAAAC,IAAA,EACtBD,CAAA,CAAAC,IAAA;IAAAC,KAAA,EACCpB,cAAA,CAAekB,CAAA,CAAAR,MAAA,CAAAW,QAAA,EAAmBV,IAAA;EAAA;EAG3C,IAAAS,KAAA,GAAY,KAAKpB,cAAA,CAAeU,MAAA,EAAAY,MAAA,EAAgBX,IAAA,GAAO;EAEvD,MAAAY,eAAA,GAAAC,QAAA,IACEf,QAAA,CAAAM,GAAA,CAAAU,GAAA;IAEI,MAAAC,QAAA,GAAiBT,qBAAA,CAAAU,MAAA,CAAAC,CAAA,IAAoCA,CAAA,CAAAT,IAAA,KAAWD,GAAA;IAAO,OAChEQ,QAAA,EAAAN,KAAA;EAAA,CACT,EAAAS,IAAA,CACM;EAAA,IAINjB,cAAA,CAAAkB,MAAA,IAAwB;IAC1B,MAAAC,IAAA,GAAanB,cAAA,CAAAkB,MAAA,IAAwB;IACrCV,KAAA,CAAAA,CAAA,CAAQA,GAAGR,cAAA,CAAAkB,MAAA,IAAyB9B,cAAA,CAAeU,MAAA,EAAAY,MAAA,EAAgBX,IAAA,OAAWA,IAAA,CAAAqB,CAAA,CAC5E;MAAAC,KAAA,EACSF,IAAA;MAAAG,KAAA,EAAaX,eAAA,CAAgBX,cAAA,CAAAuB,KAAA,KAAwB;IAAA,CAAc,GAC3E;EAHH;IAAA,IAISvB,cAAA,CAAAkB,MAAA,IAAwB;MACjCV,KAAA,CAAAA,CAAA,CAAQA,GAAGR,cAAA,CAAAkB,MAAA,IAAyB9B,cAAA,CAClCY,cAAA,CAAAkB,MAAA,MAA0B,GAAIpB,MAAA,EAAAW,QAAA,GAAmBX,MAAA,EAAAY,MAAQ,EACzDX,IAAA,OACKY,eAAA,CAAgBX,cAAA,GAAiB;IAHxC;EAAA;EAAA,IAAAwB,EAAA;EAAA,IAAA/B,CAAA,QAAAe,KAAA;IAMKgB,EAAA,GAAAC,IAAA,CAAC;MAAAC,QAAA,EAAMlB;IAAA,C;;;;;;SAAPgB,E;CACT;AApCqD,SAAApB,MAAAZ,EAAA;EAGY;IAAAmC;EAAA,IAAAnC,EAAa;EAAA,OAAKmC,SAAA;AAAA","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","getTranslation","React","useTranslation","BlocksCell","t0","$","cellData","field","t1","blocks","labels","i18n","selectedBlocks","Array","isArray","map","_temp","translatedBlockLabels","b","slug","label","singular","plural","formatBlockList","blocks_0","b_0","filtered","filter","f","join","length","more","t","count","items","slice","t2","_jsx","children","blockType"],"sources":["../../../../../../src/elements/Table/DefaultCell/fields/Blocks/index.tsx"],"sourcesContent":["'use client'\nimport type { BlocksFieldClient, DefaultCellComponentProps } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport React from 'react'\n\nimport { useTranslation } from '../../../../../providers/Translation/index.js'\n\nexport interface BlocksCellProps extends DefaultCellComponentProps<any, BlocksFieldClient> {}\n\nexport const BlocksCell: React.FC<BlocksCellProps> = ({ cellData, field: { blocks, labels } }) => {\n  const { i18n } = useTranslation()\n\n  const selectedBlocks = Array.isArray(cellData) ? cellData.map(({ blockType }) => blockType) : []\n\n  const translatedBlockLabels = blocks?.map((b) => ({\n    slug: b.slug,\n    label: getTranslation(b.labels.singular, i18n),\n  }))\n\n  let label = `0 ${getTranslation(labels?.plural, i18n)}`\n\n  const formatBlockList = (blocks) =>\n    blocks\n      .map((b) => {\n        const filtered = translatedBlockLabels.filter((f) => f.slug === b)?.[0]\n        return filtered?.label\n      })\n      .join(', ')\n\n  const itemsToShow = 5\n\n  if (selectedBlocks.length > itemsToShow) {\n    const more = selectedBlocks.length - itemsToShow\n    label = `${selectedBlocks.length} ${getTranslation(labels?.plural, i18n)} - ${i18n.t(\n      'fields:itemsAndMore',\n      { count: more, items: formatBlockList(selectedBlocks.slice(0, itemsToShow)) },\n    )}`\n  } else if (selectedBlocks.length > 0) {\n    label = `${selectedBlocks.length} ${getTranslation(\n      selectedBlocks.length === 1 ? labels?.singular : labels?.plural,\n      i18n,\n    )} - ${formatBlockList(selectedBlocks)}`\n  }\n\n  return <span>{label}</span>\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAGA,SAASC,cAAc,QAAQ;AAC/B,OAAOC,KAAA,MAAW;AAElB,SAASC,cAAc,QAAQ;AAI/B,OAAO,MAAMC,UAAA,GAAwCC,EAAA;EAAA,MAAAC,CAAA,GAAAN,EAAA;EAAC;IAAAO,QAAA;IAAAC,KAAA,EAAAC;EAAA,IAAAJ,EAAuC;EAApB;IAAAK,MAAA;IAAAC;EAAA,IAAAF,EAAkB;EACzF;IAAAG;EAAA,IAAiBT,cAAA;EAEjB,MAAAU,cAAA,GAAuBC,KAAA,CAAAC,OAAA,CAAcR,QAAA,IAAYA,QAAA,CAAAS,GAAA,CAAAC,KAAgC,MAAe;EAEhG,MAAAC,qBAAA,GAA8BR,MAAA,EAAAM,GAAA,CAAAG,CAAA;IAAAC,IAAA,EACtBD,CAAA,CAAAC,IAAA;IAAAC,KAAA,EACCpB,cAAA,CAAekB,CAAA,CAAAR,MAAA,CAAAW,QAAA,EAAmBV,IAAA;EAAA;EAG3C,IAAAS,KAAA,GAAY,KAAKpB,cAAA,CAAeU,MAAA,EAAAY,MAAA,EAAgBX,IAAA,GAAO;EAEvD,MAAAY,eAAA,GAAAC,QAAA,IACEf,QAAA,CAAAM,GAAA,CAAAU,GAAA;IAEI,MAAAC,QAAA,GAAiBT,qBAAA,CAAAU,MAAA,CAAAC,CAAA,IAAoCA,CAAA,CAAAT,IAAA,KAAWD,GAAA;IAAO,OAChEQ,QAAA,EAAAN,KAAA;EAAA,CACT,EAAAS,IAAA,CACM;EAAA,IAINjB,cAAA,CAAAkB,MAAA,IAAwB;IAC1B,MAAAC,IAAA,GAAanB,cAAA,CAAAkB,MAAA,IAAwB;IACrCV,KAAA,CAAAA,CAAA,CAAQA,GAAGR,cAAA,CAAAkB,MAAA,IAAyB9B,cAAA,CAAeU,MAAA,EAAAY,MAAA,EAAgBX,IAAA,OAAWA,IAAA,CAAAqB,CAAA,CAC5E;MAAAC,KAAA,EACSF,IAAA;MAAAG,KAAA,EAAaX,eAAA,CAAgBX,cAAA,CAAAuB,KAAA,KAAwB;IAAA,CAAc,GAC3E;EAHH;IAAA,IAISvB,cAAA,CAAAkB,MAAA,IAAwB;MACjCV,KAAA,CAAAA,CAAA,CAAQA,GAAGR,cAAA,CAAAkB,MAAA,IAAyB9B,cAAA,CAClCY,cAAA,CAAAkB,MAAA,MAA0B,GAAIpB,MAAA,EAAAW,QAAA,GAAmBX,MAAA,EAAAY,MAAQ,EACzDX,IAAA,OACKY,eAAA,CAAgBX,cAAA,GAAiB;IAHxC;EAAA;EAAA,IAAAwB,EAAA;EAAA,IAAA/B,CAAA,QAAAe,KAAA;IAMKgB,EAAA,GAAAC,IAAA,CAAC;MAAAC,QAAA,EAAMlB;IAAA,C;;;;;;SAAPgB,E;CACT;AApCqD,SAAApB,MAAAZ,EAAA;EAGY;IAAAmC;EAAA,IAAAnC,EAAa;EAAA,OAAKmC,SAAA;AAAA","ignoreList":[]}

package/dist/elements/Table/DefaultCell/fields/Checkbox/index.scss

@@ -1,22 +1,24 @@
 @import '../../../../../scss/styles.scss';
 
-.bool-cell {
-  font-size: 1rem;
-  line-height: base(1);
-  border: 0;
-  display: inline-flex;
-  vertical-align: middle;
-  background: var(--theme-elevation-150);
-  color: var(--theme-elevation-800);
-  border-radius: $style-radius-s;
-  padding: 0 base(0.25);
-  [dir='ltr'] & {
-    padding-left: base(0.0875 + 0.25);
-  }
-  [dir='rtl'] & {
-    padding-right: base(0.0875 + 0.25);
-  }
+@layer payload-default {
+  .bool-cell {
+    font-size: 1rem;
+    line-height: base(1);
+    border: 0;
+    display: inline-flex;
+    vertical-align: middle;
+    background: var(--theme-elevation-150);
+    color: var(--theme-elevation-800);
+    border-radius: $style-radius-s;
+    padding: 0 base(0.25);
+    [dir='ltr'] & {
+      padding-left: base(0.0875 + 0.25);
+    }
+    [dir='rtl'] & {
+      padding-right: base(0.0875 + 0.25);
+    }
 
-  background: var(--theme-elevation-100);
-  color: var(--theme-elevation-800);
+    background: var(--theme-elevation-100);
+    color: var(--theme-elevation-800);
+  }
 }

package/dist/elements/Table/DefaultCell/fields/Code/index.js

@@ -7,7 +7,7 @@ export const CodeCell = ({
   cellData,
   nowrap
 }) => {
-  const textToShow = cellData.length > 100 ? `${cellData.substring(0, 100)}\u2026` : cellData;
+  const textToShow = cellData?.length > 100 ? `${cellData.substring(0, 100)}\u2026` : cellData;
   const noWrapStyle = nowrap ? {
     whiteSpace: 'nowrap'
   } : {};

package/dist/elements/Table/DefaultCell/fields/Code/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","CodeCell","cellData","nowrap","textToShow","length","substring","noWrapStyle","whiteSpace","_jsx","className","style"],"sources":["../../../../../../src/elements/Table/DefaultCell/fields/Code/index.tsx"],"sourcesContent":["'use client'\nimport type { CodeFieldClient, DefaultCellComponentProps } from 'payload'\n\nimport React from 'react'\n\nimport './index.scss'\n\nexport interface CodeCellProps extends DefaultCellComponentProps<string, CodeFieldClient> {\n  readonly nowrap?: boolean\n}\n\nexport const CodeCell: React.FC<CodeCellProps> = ({ cellData, nowrap }) => {\n  const textToShow = cellData.length > 100 ? `${cellData.substring(0, 100)}\\u2026` : cellData\n\n  const noWrapStyle: React.CSSProperties = nowrap ? { whiteSpace: 'nowrap' } : {}\n\n  return (\n    <code className=\"code-cell\" style={noWrapStyle}>\n      <span>{textToShow}</span>\n    </code>\n  )\n}\n"],"mappings":"AAAA;;;AAGA,OAAOA,KAAA,MAAW;AAElB,OAAO;AAMP,OAAO,MAAMC,QAAA,GAAoCA,CAAC;EAAEC,QAAQ;EAAEC;AAAM,CAAE;EACpE,MAAMC,UAAA,GAAaF,QAAA,CAASG,MAAM,GAAG,MAAM,GAAGH,QAAA,CAASI,SAAS,CAAC,GAAG,YAAY,GAAGJ,QAAA;EAEnF,MAAMK,WAAA,GAAmCJ,MAAA,GAAS;IAAEK,UAAA,EAAY;EAAS,IAAI,CAAC;EAE9E,oBACEC,IAAA,CAAC;IAAKC,SAAA,EAAU;IAAYC,KAAA,EAAOJ,WAAA;cACjC,aAAAE,IAAA,CAAC;gBAAML;;;AAGb","ignoreList":[]}
+{"version":3,"file":"index.js","names":["React","CodeCell","cellData","nowrap","textToShow","length","substring","noWrapStyle","whiteSpace","_jsx","className","style"],"sources":["../../../../../../src/elements/Table/DefaultCell/fields/Code/index.tsx"],"sourcesContent":["'use client'\nimport type { CodeFieldClient, DefaultCellComponentProps } from 'payload'\n\nimport React from 'react'\n\nimport './index.scss'\n\nexport interface CodeCellProps extends DefaultCellComponentProps<string, CodeFieldClient> {\n  readonly nowrap?: boolean\n}\n\nexport const CodeCell: React.FC<CodeCellProps> = ({ cellData, nowrap }) => {\n  const textToShow = cellData?.length > 100 ? `${cellData.substring(0, 100)}\\u2026` : cellData\n\n  const noWrapStyle: React.CSSProperties = nowrap ? { whiteSpace: 'nowrap' } : {}\n\n  return (\n    <code className=\"code-cell\" style={noWrapStyle}>\n      <span>{textToShow}</span>\n    </code>\n  )\n}\n"],"mappings":"AAAA;;;AAGA,OAAOA,KAAA,MAAW;AAElB,OAAO;AAMP,OAAO,MAAMC,QAAA,GAAoCA,CAAC;EAAEC,QAAQ;EAAEC;AAAM,CAAE;EACpE,MAAMC,UAAA,GAAaF,QAAA,EAAUG,MAAA,GAAS,MAAM,GAAGH,QAAA,CAASI,SAAS,CAAC,GAAG,YAAY,GAAGJ,QAAA;EAEpF,MAAMK,WAAA,GAAmCJ,MAAA,GAAS;IAAEK,UAAA,EAAY;EAAS,IAAI,CAAC;EAE9E,oBACEC,IAAA,CAAC;IAAKC,SAAA,EAAU;IAAYC,KAAA,EAAOJ,WAAA;cACjC,aAAAE,IAAA,CAAC;gBAAML;;;AAGb","ignoreList":[]}

package/dist/elements/Table/DefaultCell/fields/Code/index.scss

@@ -1,27 +1,29 @@
 @import '../../../../../scss/styles.scss';
 
-.code-cell {
-  font-size: 1rem;
-  line-height: base(1);
-  border: 0;
-  display: inline-flex;
-  vertical-align: middle;
-  background: var(--theme-elevation-150);
-  color: var(--theme-elevation-800);
-  border-radius: $style-radius-m;
-  padding: 0 base(0.25);
-  background: var(--theme-elevation-100);
-  color: var(--theme-elevation-800);
+@layer payload-default {
+  .code-cell {
+    font-size: 1rem;
+    line-height: base(1);
+    border: 0;
+    display: inline-flex;
+    vertical-align: middle;
+    background: var(--theme-elevation-150);
+    color: var(--theme-elevation-800);
+    border-radius: $style-radius-m;
+    padding: 0 base(0.25);
+    background: var(--theme-elevation-100);
+    color: var(--theme-elevation-800);
 
-  [dir='ltr'] & {
-    padding-left: base(0.0875 + 0.25);
-  }
+    [dir='ltr'] & {
+      padding-left: base(0.0875 + 0.25);
+    }
 
-  [dir='rtl'] & {
-    padding-right: base(0.0875 + 0.25);
-  }
+    [dir='rtl'] & {
+      padding-right: base(0.0875 + 0.25);
+    }
 
-  &:hover {
-    text-decoration: inherit;
+    &:hover {
+      text-decoration: inherit;
+    }
   }
 }

package/dist/elements/Table/DefaultCell/fields/File/index.d.ts

@@ -1,7 +1,7 @@
-import type { DefaultCellComponentProps, UploadFieldClient } from 'payload';
+import type { DefaultCellComponentProps, TextFieldClient, UploadFieldClient } from 'payload';
 import React from 'react';
 import './index.scss';
-export interface FileCellProps extends DefaultCellComponentProps<any, UploadFieldClient> {
+export interface FileCellProps extends DefaultCellComponentProps<any, TextFieldClient | UploadFieldClient> {
 }
 export declare const FileCell: React.FC<FileCellProps>;
 //# sourceMappingURL=index.d.ts.map

package/dist/elements/Table/DefaultCell/fields/File/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/elements/Table/DefaultCell/fields/File/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,yBAAyB,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAE3E,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,cAAc,CAAA;AAIrB,MAAM,WAAW,aAAc,SAAQ,yBAAyB,CAAC,GAAG,EAAE,iBAAiB,CAAC;CAAG;AAE3F,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAuB5C,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/elements/Table/DefaultCell/fields/File/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,yBAAyB,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAE5F,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,cAAc,CAAA;AAIrB,MAAM,WAAW,aACf,SAAQ,yBAAyB,CAAC,GAAG,EAAE,eAAe,GAAG,iBAAiB,CAAC;CAAG;AAEhF,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAqB5C,CAAA"}