@payloadcms/ui 4.0.0-internal.7b031c8 → 4.0.0-internal.7d5c665

package/dist/elements/DocumentDrawer/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/elements/DocumentDrawer/types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/elements/DocumentDrawer/types.ts"],"names":[],"mappings":"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"}

package/dist/elements/DocumentDrawer/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":[],"sources":["../../../src/elements/DocumentDrawer/types.ts"],"sourcesContent":["import type { Data, DefaultDocumentIDType, FormState, Operation } from 'payload'\nimport type React from 'react'\nimport type { HTMLAttributes } from 'react'\n\nimport type { Props as DrawerProps } from '../Drawer/types.js'\nimport type { DocumentDrawerContextProps } from './Provider.js'\n\nexport type DocumentDrawerProps = {\n  readonly AfterFields?: React.ReactNode\n  /**\n   * The slug of the collection to which the document belongs.\n   */\n  readonly collectionSlug: string\n  readonly disableActions?: boolean\n  readonly drawerSlug?: string\n  /**\n   * The ID of the document to be edited.\n   * When provided, will be fetched and displayed in the drawer.\n   * If omitted, will render the \"create new\" view for the given collection.\n   */\n  readonly id?: DefaultDocumentIDType | null\n  readonly initialData?: Data\n  /**\n   * @deprecated\n   */\n  readonly initialState?: FormState\n  readonly overrideEntityVisibility?: boolean\n  readonly redirectAfterCreate?: boolean\n  readonly redirectAfterDelete?: boolean\n  readonly redirectAfterDuplicate?: boolean\n  readonly redirectAfterRestore?: boolean\n} & Pick<DocumentDrawerContextProps, 'onDelete' | 'onDuplicate' | 'onSave'> &\n  Pick<DrawerProps, 'Header'>\n\nexport type DocumentTogglerProps = {\n  readonly buttonStyle?: 'dashed' | 'destructive' | 'ghost' | 'pill' | 'primary' | 'secondary'\n  readonly children?: React.ReactNode\n  readonly className?: string\n  readonly collectionSlug: string\n  readonly disabled?: boolean\n  readonly drawerSlug?: string\n  readonly extraButtonProps?: Record<string, any>\n  readonly onClick?: () => void\n  readonly operation: Operation\n  readonly tooltip?: string\n} & Readonly<HTMLAttributes<HTMLButtonElement>>\n\nexport type UseDocumentDrawerContext = {\n  closeDrawer: () => void\n  drawerDepth: number\n  drawerSlug: string\n  isDrawerOpen: boolean\n  openDrawer: () => void\n  toggleDrawer: () => void\n}\n\nexport type UseDocumentDrawer = (\n  args: {\n    /**\n     * Optional custom drawer slug. If provided, this will be used instead of auto-generating one.\n     * Useful for ensuring stable slugs in contexts where component remounting can cause issues.\n     */\n    drawerSlug?: string\n  } & Pick<DocumentDrawerProps, 'collectionSlug' | 'id' | 'overrideEntityVisibility'>,\n) => [\n  // drawer\n  React.FC<\n    {\n      children?: React.ReactNode\n    } & Omit<DocumentDrawerProps, 'collectionSlug' | 'operation'>\n  >,\n  // toggler\n  React.FC<\n    {\n      children?: React.ReactNode\n    } & Omit<DocumentTogglerProps, 'collectionSlug' | 'operation'>\n  >,\n  // context\n  UseDocumentDrawerContext,\n]\n"],"mappings":"AAwDA","ignoreList":[]}
+{"version":3,"file":"types.js","names":[],"sources":["../../../src/elements/DocumentDrawer/types.ts"],"sourcesContent":["import type { Data, DefaultDocumentIDType, Operation } from 'payload'\nimport type React from 'react'\nimport type { HTMLAttributes } from 'react'\n\nimport type { Props as DrawerProps } from '../Drawer/types.js'\nimport type { DocumentDrawerContextProps } from './Provider.js'\n\nexport type DocumentDrawerProps = {\n  readonly AfterFields?: React.ReactNode\n  /**\n   * The slug of the collection to which the document belongs.\n   */\n  readonly collectionSlug: string\n  readonly disableActions?: boolean\n  readonly drawerSlug?: string\n  /**\n   * The ID of the document to be edited.\n   * When provided, will be fetched and displayed in the drawer.\n   * If omitted, will render the \"create new\" view for the given collection.\n   */\n  readonly id?: DefaultDocumentIDType | null\n  readonly initialData?: Data\n  readonly overrideEntityVisibility?: boolean\n  readonly redirectAfterCreate?: boolean\n  readonly redirectAfterDelete?: boolean\n  readonly redirectAfterDuplicate?: boolean\n  readonly redirectAfterRestore?: boolean\n} & Pick<DocumentDrawerContextProps, 'onDelete' | 'onDuplicate' | 'onSave'> &\n  Pick<DrawerProps, 'Header'>\n\nexport type DocumentTogglerProps = {\n  readonly buttonStyle?:\n    | 'dashed'\n    | 'destructive'\n    | 'ghost'\n    | 'link'\n    | 'pill'\n    | 'primary'\n    | 'secondary'\n  readonly children?: React.ReactNode\n  readonly className?: string\n  readonly collectionSlug: string\n  readonly disabled?: boolean\n  readonly drawerSlug?: string\n  readonly extraButtonProps?: Record<string, any>\n  readonly onClick?: () => void\n  readonly operation: Operation\n  readonly tooltip?: string\n} & Readonly<HTMLAttributes<HTMLButtonElement>>\n\nexport type UseDocumentDrawerContext = {\n  closeDrawer: () => void\n  drawerDepth: number\n  drawerSlug: string\n  isDrawerOpen: boolean\n  openDrawer: () => void\n  toggleDrawer: () => void\n}\n\nexport type UseDocumentDrawer = (\n  args: {\n    /**\n     * Optional custom drawer slug. If provided, this will be used instead of auto-generating one.\n     * Useful for ensuring stable slugs in contexts where component remounting can cause issues.\n     */\n    drawerSlug?: string\n  } & Pick<DocumentDrawerProps, 'collectionSlug' | 'id' | 'overrideEntityVisibility'>,\n) => [\n  // drawer\n  React.FC<\n    {\n      children?: React.ReactNode\n    } & Omit<DocumentDrawerProps, 'collectionSlug' | 'operation'>\n  >,\n  // toggler\n  React.FC<\n    {\n      children?: React.ReactNode\n    } & Omit<DocumentTogglerProps, 'collectionSlug' | 'operation'>\n  >,\n  // context\n  UseDocumentDrawerContext,\n]\n"],"mappings":"AA2DA","ignoreList":[]}

package/dist/elements/DocumentFields/RequiredFieldsInfo/index.css

@@ -0,0 +1,40 @@
+@layer payload-default {
+  .document-fields .document-fields__edit:has(> .required-fields-info) {
+    position: relative;
+  }
+
+  .required-fields-info {
+    position: absolute;
+    inset-block-start: var(--spacer-2);
+    inset-inline-end: var(--gutter-h);
+    width: fit-content;
+  }
+
+  .document-fields__edit:has(> .required-fields-info):dir(ltr)
+    > .document-fields__fields
+    > .field-type:first-child
+    .field-error.tooltip--caret-right {
+    translate: max(calc(-1 * var(--spacer-5)), calc(var(--spacer-1) - var(--tooltip-x))) 0;
+  }
+
+  .document-fields__edit:has(> .required-fields-info):dir(rtl)
+    > .document-fields__fields
+    > .field-type:first-child
+    .field-error.tooltip--caret-left {
+    translate: min(var(--spacer-5), calc(100vw - var(--tooltip-x) - 100% - var(--spacer-1))) 0;
+  }
+
+  .required-fields-info__content {
+    position: fixed;
+    inset: auto;
+    margin: var(--spacer-0);
+    padding: var(--spacer-2-5);
+    max-inline-size: min(calc(var(--spacer-6) * 8), calc(100vw - var(--spacer-4)));
+    color: var(--color-text);
+    background: var(--color-bg);
+    border: var(--stroke-width-small) solid var(--color-border);
+    border-radius: var(--radius-medium);
+    box-shadow: var(--elevation-300-tooltip);
+    font: inherit;
+  }
+}

package/dist/elements/DocumentFields/RequiredFieldsInfo/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import './index.css';
+export declare const RequiredFieldsInfo: () => React.JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/elements/DocumentFields/RequiredFieldsInfo/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/DocumentFields/RequiredFieldsInfo/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAmD,MAAM,OAAO,CAAA;AAKvE,OAAO,aAAa,CAAA;AAEpB,eAAO,MAAM,kBAAkB,yBA+E9B,CAAA"}

package/dist/elements/DocumentFields/RequiredFieldsInfo/index.js

@@ -0,0 +1,88 @@
+'use client';
+
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { autoUpdate, computePosition, flip, offset, shift } from '@floating-ui/dom';
+import React, { useId, useLayoutEffect, useRef, useState } from 'react';
+import { InfoIcon } from '../../../icons/Info/index.js';
+import { useTranslation } from '../../../providers/Translation/index.js';
+import { Button } from '../../Button/index.js';
+import './index.css';
+export const RequiredFieldsInfo = () => {
+  const {
+    t
+  } = useTranslation();
+  const id = useId();
+  const buttonRef = useRef(null);
+  const popoverRef = useRef(null);
+  const [isOpen, setIsOpen] = useState(false);
+  const explanation = t('general:requiredFields');
+  useLayoutEffect(() => {
+    const button = buttonRef.current;
+    const popover = popoverRef.current;
+    if (!isOpen || !button || !popover) {
+      return;
+    }
+    const dismissOnEscape = event => {
+      if (event.key === 'Escape') {
+        event.preventDefault();
+        event.stopPropagation();
+        popover.hidePopover();
+      }
+    };
+    // Dismiss this help before Escape reaches a containing drawer.
+    document.addEventListener('keydown', dismissOnEscape, true);
+    const cleanup = autoUpdate(button, popover, () => {
+      void computePosition(button, popover, {
+        middleware: [offset(6), flip(), shift({
+          padding: 8
+        })],
+        placement: 'bottom-end',
+        strategy: 'fixed'
+      }).then(({
+        x,
+        y
+      }) => {
+        Object.assign(popover.style, {
+          left: `${x}px`,
+          top: `${y}px`
+        });
+      });
+    });
+    return () => {
+      cleanup();
+      document.removeEventListener('keydown', dismissOnEscape, true);
+    };
+  }, [isOpen]);
+  const open = () => popoverRef.current?.showPopover();
+  return /*#__PURE__*/_jsxs("div", {
+    className: "required-fields-info",
+    children: [/*#__PURE__*/_jsx(Button, {
+      "aria-controls": id,
+      "aria-expanded": isOpen,
+      "aria-label": explanation,
+      buttonStyle: "ghost",
+      extraButtonProps: {
+        onBlur: () => popoverRef.current?.hidePopover(),
+        onFocus: open,
+        onPointerEnter: open,
+        title: undefined
+      },
+      icon: /*#__PURE__*/_jsx("span", {
+        "aria-hidden": "true",
+        children: /*#__PURE__*/_jsx(InfoIcon, {})
+      }),
+      margin: false,
+      onClick: open,
+      ref: buttonRef,
+      type: "button"
+    }), /*#__PURE__*/_jsx("div", {
+      className: "required-fields-info__content",
+      id: id,
+      onToggle: event_0 => setIsOpen(event_0.newState === 'open'),
+      popover: "auto",
+      ref: popoverRef,
+      children: explanation
+    })]
+  });
+};
+//# sourceMappingURL=index.js.map

package/dist/elements/DocumentFields/RequiredFieldsInfo/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["autoUpdate","computePosition","flip","offset","shift","React","useId","useLayoutEffect","useRef","useState","InfoIcon","useTranslation","Button","RequiredFieldsInfo","t","id","buttonRef","popoverRef","isOpen","setIsOpen","explanation","button","current","popover","dismissOnEscape","event","key","preventDefault","stopPropagation","hidePopover","document","addEventListener","cleanup","middleware","padding","placement","strategy","then","x","y","Object","assign","style","left","top","removeEventListener","open","showPopover","_jsxs","className","_jsx","buttonStyle","extraButtonProps","onBlur","onFocus","onPointerEnter","title","undefined","icon","margin","onClick","ref","type","onToggle","newState"],"sources":["../../../../src/elements/DocumentFields/RequiredFieldsInfo/index.tsx"],"sourcesContent":["'use client'\n\nimport { autoUpdate, computePosition, flip, offset, shift } from '@floating-ui/dom'\nimport React, { useId, useLayoutEffect, useRef, useState } from 'react'\n\nimport { InfoIcon } from '../../../icons/Info/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport { Button } from '../../Button/index.js'\nimport './index.css'\n\nexport const RequiredFieldsInfo = () => {\n  const { t } = useTranslation()\n  const id = useId()\n  const buttonRef = useRef<HTMLButtonElement>(null)\n  const popoverRef = useRef<HTMLDivElement>(null)\n  const [isOpen, setIsOpen] = useState(false)\n  const explanation = t('general:requiredFields')\n\n  useLayoutEffect(() => {\n    const button = buttonRef.current\n    const popover = popoverRef.current\n\n    if (!isOpen || !button || !popover) {\n      return\n    }\n\n    const dismissOnEscape = (event: KeyboardEvent) => {\n      if (event.key === 'Escape') {\n        event.preventDefault()\n        event.stopPropagation()\n        popover.hidePopover()\n      }\n    }\n\n    // Dismiss this help before Escape reaches a containing drawer.\n    document.addEventListener('keydown', dismissOnEscape, true)\n\n    const cleanup = autoUpdate(button, popover, () => {\n      void computePosition(button, popover, {\n        middleware: [offset(6), flip(), shift({ padding: 8 })],\n        placement: 'bottom-end',\n        strategy: 'fixed',\n      }).then(({ x, y }) => {\n        Object.assign(popover.style, { left: `${x}px`, top: `${y}px` })\n      })\n    })\n\n    return () => {\n      cleanup()\n      document.removeEventListener('keydown', dismissOnEscape, true)\n    }\n  }, [isOpen])\n\n  const open = () => popoverRef.current?.showPopover()\n\n  return (\n    <div className=\"required-fields-info\">\n      <Button\n        aria-controls={id}\n        aria-expanded={isOpen}\n        aria-label={explanation}\n        buttonStyle=\"ghost\"\n        extraButtonProps={{\n          onBlur: () => popoverRef.current?.hidePopover(),\n          onFocus: open,\n          onPointerEnter: open,\n          title: undefined,\n        }}\n        icon={\n          <span aria-hidden=\"true\">\n            <InfoIcon />\n          </span>\n        }\n        margin={false}\n        onClick={open}\n        ref={buttonRef}\n        type=\"button\"\n      />\n      <div\n        className=\"required-fields-info__content\"\n        id={id}\n        onToggle={(event) => setIsOpen(event.newState === 'open')}\n        popover=\"auto\"\n        ref={popoverRef}\n      >\n        {explanation}\n      </div>\n    </div>\n  )\n}\n"],"mappings":"AAAA;;;AAEA,SAASA,UAAU,EAAEC,eAAe,EAAEC,IAAI,EAAEC,MAAM,EAAEC,KAAK,QAAQ;AACjE,OAAOC,KAAA,IAASC,KAAK,EAAEC,eAAe,EAAEC,MAAM,EAAEC,QAAQ,QAAQ;AAEhE,SAASC,QAAQ,QAAQ;AACzB,SAASC,cAAc,QAAQ;AAC/B,SAASC,MAAM,QAAQ;AACvB,OAAO;AAEP,OAAO,MAAMC,kBAAA,GAAqBA,CAAA;EAChC,MAAM;IAAEC;EAAC,CAAE,GAAGH,cAAA;EACd,MAAMI,EAAA,GAAKT,KAAA;EACX,MAAMU,SAAA,GAAYR,MAAA,CAA0B;EAC5C,MAAMS,UAAA,GAAaT,MAAA,CAAuB;EAC1C,MAAM,CAACU,MAAA,EAAQC,SAAA,CAAU,GAAGV,QAAA,CAAS;EACrC,MAAMW,WAAA,GAAcN,CAAA,CAAE;EAEtBP,eAAA,CAAgB;IACd,MAAMc,MAAA,GAASL,SAAA,CAAUM,OAAO;IAChC,MAAMC,OAAA,GAAUN,UAAA,CAAWK,OAAO;IAElC,IAAI,CAACJ,MAAA,IAAU,CAACG,MAAA,IAAU,CAACE,OAAA,EAAS;MAClC;IACF;IAEA,MAAMC,eAAA,GAAmBC,KAAA;MACvB,IAAIA,KAAA,CAAMC,GAAG,KAAK,UAAU;QAC1BD,KAAA,CAAME,cAAc;QACpBF,KAAA,CAAMG,eAAe;QACrBL,OAAA,CAAQM,WAAW;MACrB;IACF;IAEA;IACAC,QAAA,CAASC,gBAAgB,CAAC,WAAWP,eAAA,EAAiB;IAEtD,MAAMQ,OAAA,GAAUhC,UAAA,CAAWqB,MAAA,EAAQE,OAAA,EAAS;MAC1C,KAAKtB,eAAA,CAAgBoB,MAAA,EAAQE,OAAA,EAAS;QACpCU,UAAA,EAAY,CAAC9B,MAAA,CAAO,IAAID,IAAA,IAAQE,KAAA,CAAM;UAAE8B,OAAA,EAAS;QAAE,GAAG;QACtDC,SAAA,EAAW;QACXC,QAAA,EAAU;MACZ,GAAGC,IAAI,CAAC,CAAC;QAAEC,CAAC;QAAEC;MAAC,CAAE;QACfC,MAAA,CAAOC,MAAM,CAAClB,OAAA,CAAQmB,KAAK,EAAE;UAAEC,IAAA,EAAM,GAAGL,CAAA,IAAK;UAAEM,GAAA,EAAK,GAAGL,CAAA;QAAM;MAC/D;IACF;IAEA,OAAO;MACLP,OAAA;MACAF,QAAA,CAASe,mBAAmB,CAAC,WAAWrB,eAAA,EAAiB;IAC3D;EACF,GAAG,CAACN,MAAA,CAAO;EAEX,MAAM4B,IAAA,GAAOA,CAAA,KAAM7B,UAAA,CAAWK,OAAO,EAAEyB,WAAA;EAEvC,oBACEC,KAAA,CAAC;IAAIC,SAAA,EAAU;4BACbC,IAAA,CAACtC,MAAA;MACC,iBAAeG,EAAA;MACf,iBAAeG,MAAA;MACf,cAAYE,WAAA;MACZ+B,WAAA,EAAY;MACZC,gBAAA,EAAkB;QAChBC,MAAA,EAAQA,CAAA,KAAMpC,UAAA,CAAWK,OAAO,EAAEO,WAAA;QAClCyB,OAAA,EAASR,IAAA;QACTS,cAAA,EAAgBT,IAAA;QAChBU,KAAA,EAAOC;MACT;MACAC,IAAA,eACER,IAAA,CAAC;QAAK,eAAY;kBAChB,aAAAA,IAAA,CAACxC,QAAA;;MAGLiD,MAAA,EAAQ;MACRC,OAAA,EAASd,IAAA;MACTe,GAAA,EAAK7C,SAAA;MACL8C,IAAA,EAAK;qBAEPZ,IAAA,CAAC;MACCD,SAAA,EAAU;MACVlC,EAAA,EAAIA,EAAA;MACJgD,QAAA,EAAWtC,OAAA,IAAUN,SAAA,CAAUM,OAAA,CAAMuC,QAAQ,KAAK;MAClDzC,OAAA,EAAQ;MACRsC,GAAA,EAAK5C,UAAA;gBAEJG;;;AAIT","ignoreList":[]}

package/dist/elements/DocumentFields/index.css

@@ -8,7 +8,7 @@
   .document-fields--has-sidebar {
     --main-width: 66.66%;
     --main-border: var(--stroke-width-small) solid var(--color-border);
-    --main-field-margin: calc(var(--gutter-h) * -1);
+    --main-field-margin: calc(var(--gutter-h) * -1 * var(--field-border-bleed, 1));
   }
 
   .document-fields--has-sidebar:has(
@@ -41,12 +41,12 @@
   }
 
   .document-fields--has-sidebar .document-fields__fields > .tabs-field {
-    margin-right: var(--main-field-margin);
+    margin-inline-end: var(--main-field-margin);
   }
 
   /* Extend group border to the main/sidebar divider */
   .document-fields--has-sidebar .document-fields__fields > .group-field::before {
-    right: calc(var(--gutter-h) * -1);
+    inset-inline-end: calc(var(--gutter-h) * -1 * var(--field-border-bleed, 1));
   }
 
   .document-fields__main {
@@ -136,6 +136,7 @@
     padding-bottom: 0;
   }
 
+  /* stylelint-disable-next-line plugin/no-max-width-media-query -- TODO: pre-existing; migrate to a mobile-first min-width query */
   @media (max-width: 1024px) {
     .document-fields {
       display: block;
@@ -154,7 +155,7 @@
     }
 
     .document-fields--has-sidebar .document-fields__fields > .tabs-field {
-      margin-right: calc(var(--gutter-h) * -1);
+      margin-inline-end: calc(var(--gutter-h) * -1 * var(--field-border-bleed, 1));
     }
 
     .document-fields__main {
@@ -185,6 +186,7 @@
     }
   }
 
+  /* stylelint-disable-next-line plugin/no-max-width-media-query -- TODO: pre-existing; migrate to a mobile-first min-width query */
   @media (max-width: 768px) {
     .document-fields__sidebar-wrap {
       min-width: initial;
@@ -212,7 +214,7 @@
     }
 
     .document-fields--has-sidebar .document-fields__fields > .tabs-field {
-      margin-right: calc(var(--gutter-h) * -1);
+      margin-inline-end: calc(var(--gutter-h) * -1 * var(--field-border-bleed, 1));
     }
 
     .document-fields {

package/dist/elements/DocumentHeader/Tabs/Tab/index.d.ts

@@ -12,5 +12,6 @@ export declare const DefaultDocumentTab: React.FC<{
     tabConfig: {
         readonly Pill_Component?: React.FC;
     } & DocumentTabConfig;
+    user?: PayloadRequest['user'];
 }>;
 //# sourceMappingURL=index.d.ts.map

package/dist/elements/DocumentHeader/Tabs/Tab/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/elements/DocumentHeader/Tabs/Tab/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,iBAAiB,EAEjB,cAAc,EACd,yBAAyB,EACzB,qBAAqB,EACrB,oBAAoB,EACrB,MAAM,SAAS,CAAA;AAChB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAO9B,OAAO,aAAa,CAAA;AAEpB,eAAO,MAAM,SAAS,YAAY,CAAA;AAElC,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC;IACxC,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,gBAAgB,CAAC,EAAE,yBAAyB,CAAA;IAC5C,YAAY,CAAC,EAAE,qBAAqB,CAAA;IACpC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,oBAAoB,CAAA;IAClC,GAAG,EAAE,cAAc,CAAA;IACnB,SAAS,EAAE;QAAE,QAAQ,CAAC,cAAc,CAAC,EAAE,KAAK,CAAC,EAAE,CAAA;KAAE,GAAG,iBAAiB,CAAA;CACtE,CAmEA,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/elements/DocumentHeader/Tabs/Tab/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,iBAAiB,EAEjB,cAAc,EACd,yBAAyB,EACzB,qBAAqB,EACrB,oBAAoB,EACrB,MAAM,SAAS,CAAA;AAChB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAO9B,OAAO,aAAa,CAAA;AAEpB,eAAO,MAAM,SAAS,YAAY,CAAA;AAElC,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC;IACxC,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,gBAAgB,CAAC,EAAE,yBAAyB,CAAA;IAC5C,YAAY,CAAC,EAAE,qBAAqB,CAAA;IACpC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,oBAAoB,CAAA;IAClC,GAAG,EAAE,cAAc,CAAA;IACnB,SAAS,EAAE;QAAE,QAAQ,CAAC,cAAc,CAAC,EAAE,KAAK,CAAC,EAAE,CAAA;KAAE,GAAG,iBAAiB,CAAA;IACrE,IAAI,CAAC,EAAE,cAAc,CAAC,MAAM,CAAC,CAAA;CAC9B,CAmEA,CAAA"}

package/dist/elements/DocumentHeader/Tabs/Tab/index.js

@@ -19,7 +19,8 @@ export const DefaultDocumentTab = props => {
       newTab,
       Pill,
       Pill_Component
-    }
+    },
+    user
   } = props;
   let href = typeof tabHref === 'string' ? tabHref : '';
   let isActive = typeof tabIsActive === 'boolean' ? tabIsActive : false;
@@ -41,7 +42,6 @@ export const DefaultDocumentTab = props => {
   }) : label;
   return /*#__PURE__*/_jsx(DocumentTabLink, {
     adminRoute: req.payload.config.routes.admin,
-    ariaLabel: labelToRender,
     baseClass: baseClass,
     href: href,
     isActive: isActive,
@@ -59,7 +59,7 @@ export const DefaultDocumentTab = props => {
             permissions,
             req,
             server: req.server,
-            user: req.user
+            user
           }
         })]
       }) : null]

package/dist/elements/DocumentHeader/Tabs/Tab/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["Fragment","DocumentTabLink","RenderServerComponent","baseClass","DefaultDocumentTab","props","apiURL","collectionConfig","globalConfig","permissions","req","tabConfig","href","tabHref","isActive","tabIsActive","label","newTab","Pill","Pill_Component","collection","global","routes","payload","config","labelToRender","t","i18n","_jsx","adminRoute","admin","ariaLabel","_jsxs","className","Component","Fallback","importMap","serverProps","server","user"],"sources":["../../../../../src/elements/DocumentHeader/Tabs/Tab/index.tsx"],"sourcesContent":["import type {\n  DocumentTabConfig,\n  DocumentTabServerPropsOnly,\n  PayloadRequest,\n  SanitizedCollectionConfig,\n  SanitizedGlobalConfig,\n  SanitizedPermissions,\n} from 'payload'\nimport type React from 'react'\n\nimport { Fragment } from 'react'\n\n// eslint-disable-next-line payload/no-imports-from-exports-dir -- Server component must reference exports dir for proper client boundary\nimport { DocumentTabLink } from '../../../../exports/client/index.js'\nimport { RenderServerComponent } from '../../../RenderServerComponent/index.js'\nimport './index.css'\n\nexport const baseClass = 'doc-tab'\n\nexport const DefaultDocumentTab: React.FC<{\n  apiURL?: string\n  collectionConfig?: SanitizedCollectionConfig\n  globalConfig?: SanitizedGlobalConfig\n  path?: string\n  permissions?: SanitizedPermissions\n  req: PayloadRequest\n  tabConfig: { readonly Pill_Component?: React.FC } & DocumentTabConfig\n}> = (props) => {\n  const {\n    apiURL,\n    collectionConfig,\n    globalConfig,\n    permissions,\n    req,\n    tabConfig: { href: tabHref, isActive: tabIsActive, label, newTab, Pill, Pill_Component },\n  } = props\n\n  let href = typeof tabHref === 'string' ? tabHref : ''\n  let isActive = typeof tabIsActive === 'boolean' ? tabIsActive : false\n\n  if (typeof tabHref === 'function') {\n    href = tabHref({\n      apiURL,\n      collection: collectionConfig,\n      global: globalConfig,\n      routes: req.payload.config.routes,\n    })\n  }\n\n  if (typeof tabIsActive === 'function') {\n    isActive = tabIsActive({\n      href,\n    })\n  }\n\n  const labelToRender =\n    typeof label === 'function'\n      ? label({\n          t: req.i18n.t,\n        })\n      : label\n\n  return (\n    <DocumentTabLink\n      adminRoute={req.payload.config.routes.admin}\n      ariaLabel={labelToRender}\n      baseClass={baseClass}\n      href={href}\n      isActive={isActive}\n      newTab={newTab}\n    >\n      <span className={`${baseClass}__label`}>\n        {labelToRender}\n        {Pill || Pill_Component ? (\n          <Fragment>\n            &nbsp;\n            {RenderServerComponent({\n              Component: Pill,\n              Fallback: Pill_Component,\n              importMap: req.payload.importMap,\n              serverProps: {\n                i18n: req.i18n,\n                payload: req.payload,\n                permissions,\n                req,\n                server: req.server,\n                user: req.user,\n              } satisfies DocumentTabServerPropsOnly,\n            })}\n          </Fragment>\n        ) : null}\n      </span>\n    </DocumentTabLink>\n  )\n}\n"],"mappings":";AAUA,SAASA,QAAQ,QAAQ;AAEzB;AACA,SAASC,eAAe,QAAQ;AAChC,SAASC,qBAAqB,QAAQ;AACtC,OAAO;AAEP,OAAO,MAAMC,SAAA,GAAY;AAEzB,OAAO,MAAMC,kBAAA,GAQPC,KAAA;EACJ,MAAM;IACJC,MAAM;IACNC,gBAAgB;IAChBC,YAAY;IACZC,WAAW;IACXC,GAAG;IACHC,SAAA,EAAW;MAAEC,IAAA,EAAMC,OAAO;MAAEC,QAAA,EAAUC,WAAW;MAAEC,KAAK;MAAEC,MAAM;MAAEC,IAAI;MAAEC;IAAc;EAAE,CACzF,GAAGd,KAAA;EAEJ,IAAIO,IAAA,GAAO,OAAOC,OAAA,KAAY,WAAWA,OAAA,GAAU;EACnD,IAAIC,QAAA,GAAW,OAAOC,WAAA,KAAgB,YAAYA,WAAA,GAAc;EAEhE,IAAI,OAAOF,OAAA,KAAY,YAAY;IACjCD,IAAA,GAAOC,OAAA,CAAQ;MACbP,MAAA;MACAc,UAAA,EAAYb,gBAAA;MACZc,MAAA,EAAQb,YAAA;MACRc,MAAA,EAAQZ,GAAA,CAAIa,OAAO,CAACC,MAAM,CAACF;IAC7B;EACF;EAEA,IAAI,OAAOP,WAAA,KAAgB,YAAY;IACrCD,QAAA,GAAWC,WAAA,CAAY;MACrBH;IACF;EACF;EAEA,MAAMa,aAAA,GACJ,OAAOT,KAAA,KAAU,aACbA,KAAA,CAAM;IACJU,CAAA,EAAGhB,GAAA,CAAIiB,IAAI,CAACD;EACd,KACAV,KAAA;EAEN,oBACEY,IAAA,CAAC3B,eAAA;IACC4B,UAAA,EAAYnB,GAAA,CAAIa,OAAO,CAACC,MAAM,CAACF,MAAM,CAACQ,KAAK;IAC3CC,SAAA,EAAWN,aAAA;IACXtB,SAAA,EAAWA,SAAA;IACXS,IAAA,EAAMA,IAAA;IACNE,QAAA,EAAUA,QAAA;IACVG,MAAA,EAAQA,MAAA;cAER,aAAAe,KAAA,CAAC;MAAKC,SAAA,EAAW,GAAG9B,SAAA,SAAkB;iBACnCsB,aAAA,EACAP,IAAA,IAAQC,cAAA,gBACPa,KAAA,CAAChC,QAAA;mBAAS,KAEPE,qBAAA,CAAsB;UACrBgC,SAAA,EAAWhB,IAAA;UACXiB,QAAA,EAAUhB,cAAA;UACViB,SAAA,EAAW1B,GAAA,CAAIa,OAAO,CAACa,SAAS;UAChCC,WAAA,EAAa;YACXV,IAAA,EAAMjB,GAAA,CAAIiB,IAAI;YACdJ,OAAA,EAASb,GAAA,CAAIa,OAAO;YACpBd,WAAA;YACAC,GAAA;YACA4B,MAAA,EAAQ5B,GAAA,CAAI4B,MAAM;YAClBC,IAAA,EAAM7B,GAAA,CAAI6B;UACZ;QACF;WAEA;;;AAIZ","ignoreList":[]}
+{"version":3,"file":"index.js","names":["Fragment","DocumentTabLink","RenderServerComponent","baseClass","DefaultDocumentTab","props","apiURL","collectionConfig","globalConfig","permissions","req","tabConfig","href","tabHref","isActive","tabIsActive","label","newTab","Pill","Pill_Component","user","collection","global","routes","payload","config","labelToRender","t","i18n","_jsx","adminRoute","admin","_jsxs","className","Component","Fallback","importMap","serverProps","server"],"sources":["../../../../../src/elements/DocumentHeader/Tabs/Tab/index.tsx"],"sourcesContent":["import type {\n  DocumentTabConfig,\n  DocumentTabServerPropsOnly,\n  PayloadRequest,\n  SanitizedCollectionConfig,\n  SanitizedGlobalConfig,\n  SanitizedPermissions,\n} from 'payload'\nimport type React from 'react'\n\nimport { Fragment } from 'react'\n\n// eslint-disable-next-line payload/no-imports-from-exports-dir -- Server component must reference exports dir for proper client boundary\nimport { DocumentTabLink } from '../../../../exports/client/index.js'\nimport { RenderServerComponent } from '../../../RenderServerComponent/index.js'\nimport './index.css'\n\nexport const baseClass = 'doc-tab'\n\nexport const DefaultDocumentTab: React.FC<{\n  apiURL?: string\n  collectionConfig?: SanitizedCollectionConfig\n  globalConfig?: SanitizedGlobalConfig\n  path?: string\n  permissions?: SanitizedPermissions\n  req: PayloadRequest\n  tabConfig: { readonly Pill_Component?: React.FC } & DocumentTabConfig\n  user?: PayloadRequest['user']\n}> = (props) => {\n  const {\n    apiURL,\n    collectionConfig,\n    globalConfig,\n    permissions,\n    req,\n    tabConfig: { href: tabHref, isActive: tabIsActive, label, newTab, Pill, Pill_Component },\n    user,\n  } = props\n\n  let href = typeof tabHref === 'string' ? tabHref : ''\n  let isActive = typeof tabIsActive === 'boolean' ? tabIsActive : false\n\n  if (typeof tabHref === 'function') {\n    href = tabHref({\n      apiURL,\n      collection: collectionConfig,\n      global: globalConfig,\n      routes: req.payload.config.routes,\n    })\n  }\n\n  if (typeof tabIsActive === 'function') {\n    isActive = tabIsActive({\n      href,\n    })\n  }\n\n  const labelToRender =\n    typeof label === 'function'\n      ? label({\n          t: req.i18n.t,\n        })\n      : label\n\n  return (\n    <DocumentTabLink\n      adminRoute={req.payload.config.routes.admin}\n      baseClass={baseClass}\n      href={href}\n      isActive={isActive}\n      newTab={newTab}\n    >\n      <span className={`${baseClass}__label`}>\n        {labelToRender}\n        {Pill || Pill_Component ? (\n          <Fragment>\n            &nbsp;\n            {RenderServerComponent({\n              Component: Pill,\n              Fallback: Pill_Component,\n              importMap: req.payload.importMap,\n              serverProps: {\n                i18n: req.i18n,\n                payload: req.payload,\n                permissions,\n                req,\n                server: req.server,\n                user,\n              } satisfies DocumentTabServerPropsOnly,\n            })}\n          </Fragment>\n        ) : null}\n      </span>\n    </DocumentTabLink>\n  )\n}\n"],"mappings":";AAUA,SAASA,QAAQ,QAAQ;AAEzB;AACA,SAASC,eAAe,QAAQ;AAChC,SAASC,qBAAqB,QAAQ;AACtC,OAAO;AAEP,OAAO,MAAMC,SAAA,GAAY;AAEzB,OAAO,MAAMC,kBAAA,GASPC,KAAA;EACJ,MAAM;IACJC,MAAM;IACNC,gBAAgB;IAChBC,YAAY;IACZC,WAAW;IACXC,GAAG;IACHC,SAAA,EAAW;MAAEC,IAAA,EAAMC,OAAO;MAAEC,QAAA,EAAUC,WAAW;MAAEC,KAAK;MAAEC,MAAM;MAAEC,IAAI;MAAEC;IAAc,CAAE;IACxFC;EAAI,CACL,GAAGf,KAAA;EAEJ,IAAIO,IAAA,GAAO,OAAOC,OAAA,KAAY,WAAWA,OAAA,GAAU;EACnD,IAAIC,QAAA,GAAW,OAAOC,WAAA,KAAgB,YAAYA,WAAA,GAAc;EAEhE,IAAI,OAAOF,OAAA,KAAY,YAAY;IACjCD,IAAA,GAAOC,OAAA,CAAQ;MACbP,MAAA;MACAe,UAAA,EAAYd,gBAAA;MACZe,MAAA,EAAQd,YAAA;MACRe,MAAA,EAAQb,GAAA,CAAIc,OAAO,CAACC,MAAM,CAACF;IAC7B;EACF;EAEA,IAAI,OAAOR,WAAA,KAAgB,YAAY;IACrCD,QAAA,GAAWC,WAAA,CAAY;MACrBH;IACF;EACF;EAEA,MAAMc,aAAA,GACJ,OAAOV,KAAA,KAAU,aACbA,KAAA,CAAM;IACJW,CAAA,EAAGjB,GAAA,CAAIkB,IAAI,CAACD;EACd,KACAX,KAAA;EAEN,oBACEa,IAAA,CAAC5B,eAAA;IACC6B,UAAA,EAAYpB,GAAA,CAAIc,OAAO,CAACC,MAAM,CAACF,MAAM,CAACQ,KAAK;IAC3C5B,SAAA,EAAWA,SAAA;IACXS,IAAA,EAAMA,IAAA;IACNE,QAAA,EAAUA,QAAA;IACVG,MAAA,EAAQA,MAAA;cAER,aAAAe,KAAA,CAAC;MAAKC,SAAA,EAAW,GAAG9B,SAAA,SAAkB;iBACnCuB,aAAA,EACAR,IAAA,IAAQC,cAAA,gBACPa,KAAA,CAAChC,QAAA;mBAAS,KAEPE,qBAAA,CAAsB;UACrBgC,SAAA,EAAWhB,IAAA;UACXiB,QAAA,EAAUhB,cAAA;UACViB,SAAA,EAAW1B,GAAA,CAAIc,OAAO,CAACY,SAAS;UAChCC,WAAA,EAAa;YACXT,IAAA,EAAMlB,GAAA,CAAIkB,IAAI;YACdJ,OAAA,EAASd,GAAA,CAAIc,OAAO;YACpBf,WAAA;YACAC,GAAA;YACA4B,MAAA,EAAQ5B,GAAA,CAAI4B,MAAM;YAClBlB;UACF;QACF;WAEA;;;AAIZ","ignoreList":[]}

package/dist/elements/DocumentHeader/Tabs/index.css

@@ -12,6 +12,7 @@
     padding: var(--spacer-1) 0;
   }
 
+  /* stylelint-disable-next-line plugin/no-max-width-media-query -- TODO: pre-existing; migrate to a mobile-first min-width query */
   @media (max-width: 768px) {
     .doc-tabs {
       width: 100%;

package/dist/elements/DocumentHeader/Tabs/index.d.ts

@@ -6,5 +6,6 @@ export declare const DocumentTabs: React.FC<{
     globalConfig: SanitizedGlobalConfig;
     permissions: SanitizedPermissions;
     req: PayloadRequest;
+    user?: PayloadRequest['user'];
 }>;
 //# sourceMappingURL=index.d.ts.map

package/dist/elements/DocumentHeader/Tabs/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/DocumentHeader/Tabs/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAGV,cAAc,EACd,yBAAyB,EACzB,qBAAqB,EACrB,oBAAoB,EACrB,MAAM,SAAS,CAAA;AAEhB,OAAO,KAAK,MAAM,OAAO,CAAA;AAOzB,OAAO,aAAa,CAAA;AAIpB,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC;IAClC,gBAAgB,EAAE,yBAAyB,CAAA;IAC3C,YAAY,EAAE,qBAAqB,CAAA;IACnC,WAAW,EAAE,oBAAoB,CAAA;IACjC,GAAG,EAAE,cAAc,CAAA;CACpB,CA8DA,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/DocumentHeader/Tabs/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAGV,cAAc,EACd,yBAAyB,EACzB,qBAAqB,EACrB,oBAAoB,EACrB,MAAM,SAAS,CAAA;AAEhB,OAAO,KAAK,MAAM,OAAO,CAAA;AAOzB,OAAO,aAAa,CAAA;AAIpB,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC;IAClC,gBAAgB,EAAE,yBAAyB,CAAA;IAC3C,YAAY,EAAE,qBAAqB,CAAA;IACnC,WAAW,EAAE,oBAAoB,CAAA;IACjC,GAAG,EAAE,cAAc,CAAA;IACnB,IAAI,CAAC,EAAE,cAAc,CAAC,MAAM,CAAC,CAAA;CAC9B,CA+DA,CAAA"}

package/dist/elements/DocumentHeader/Tabs/index.js

@@ -11,7 +11,8 @@ export const DocumentTabs = ({
   collectionConfig,
   globalConfig,
   permissions,
-  req
+  req,
+  user
 }) => {
   const {
     config
@@ -60,7 +61,7 @@ export const DocumentTabs = ({
                   permissions,
                   req,
                   server: req.server,
-                  user: req.user
+                  user
                 }
               });
             }
@@ -70,7 +71,8 @@ export const DocumentTabs = ({
               path: viewPath,
               permissions: permissions,
               req: req,
-              tabConfig: tabConfig
+              tabConfig: tabConfig,
+              user: user
             }, `tab-${index}`);
           })
         })

package/dist/elements/DocumentHeader/Tabs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","ShouldRenderTabs","RenderServerComponent","DefaultDocumentTab","getTabs","baseClass","DocumentTabs","collectionConfig","globalConfig","permissions","req","config","payload","tabs","_jsx","className","map","tab","tabConfig","viewPath","index","condition","meetsCondition","Component","clientProps","path","importMap","key","serverProps","i18n","server","user"],"sources":["../../../../src/elements/DocumentHeader/Tabs/index.tsx"],"sourcesContent":["import type {\n  DocumentTabClientProps,\n  DocumentTabServerPropsOnly,\n  PayloadRequest,\n  SanitizedCollectionConfig,\n  SanitizedGlobalConfig,\n  SanitizedPermissions,\n} from 'payload'\n\nimport React from 'react'\n\n// eslint-disable-next-line payload/no-imports-from-exports-dir -- Server component must reference exports dir for proper client boundary\nimport { ShouldRenderTabs } from '../../../exports/client/index.js'\nimport { RenderServerComponent } from '../../RenderServerComponent/index.js'\nimport { DefaultDocumentTab } from './Tab/index.js'\nimport { getTabs } from './tabs/index.js'\nimport './index.css'\n\nconst baseClass = 'doc-tabs'\n\nexport const DocumentTabs: React.FC<{\n  collectionConfig: SanitizedCollectionConfig\n  globalConfig: SanitizedGlobalConfig\n  permissions: SanitizedPermissions\n  req: PayloadRequest\n}> = ({ collectionConfig, globalConfig, permissions, req }) => {\n  const { config } = req.payload\n\n  const tabs = getTabs({\n    collectionConfig,\n    globalConfig,\n  })\n\n  return (\n    <ShouldRenderTabs>\n      <div className={baseClass}>\n        <div className={`${baseClass}__tabs-container`}>\n          <ul className={`${baseClass}__tabs`}>\n            {tabs?.map(({ tab: tabConfig, viewPath }, index) => {\n              const { condition } = tabConfig || {}\n\n              const meetsCondition =\n                !condition ||\n                condition({ collectionConfig, config, globalConfig, permissions, req })\n\n              if (!meetsCondition) {\n                return null\n              }\n\n              if (tabConfig?.Component) {\n                return RenderServerComponent({\n                  clientProps: {\n                    path: viewPath,\n                  } satisfies DocumentTabClientProps,\n                  Component: tabConfig.Component,\n                  importMap: req.payload.importMap,\n                  key: `tab-${index}`,\n                  serverProps: {\n                    collectionConfig,\n                    globalConfig,\n                    i18n: req.i18n,\n                    payload: req.payload,\n                    permissions,\n                    req,\n                    server: req.server,\n                    user: req.user,\n                  } satisfies DocumentTabServerPropsOnly,\n                })\n              }\n\n              return (\n                <DefaultDocumentTab\n                  collectionConfig={collectionConfig}\n                  globalConfig={globalConfig}\n                  key={`tab-${index}`}\n                  path={viewPath}\n                  permissions={permissions}\n                  req={req}\n                  tabConfig={tabConfig}\n                />\n              )\n            })}\n          </ul>\n        </div>\n      </div>\n    </ShouldRenderTabs>\n  )\n}\n"],"mappings":";AASA,OAAOA,KAAA,MAAW;AAElB;AACA,SAASC,gBAAgB,QAAQ;AACjC,SAASC,qBAAqB,QAAQ;AACtC,SAASC,kBAAkB,QAAQ;AACnC,SAASC,OAAO,QAAQ;AACxB,OAAO;AAEP,MAAMC,SAAA,GAAY;AAElB,OAAO,MAAMC,YAAA,GAKRA,CAAC;EAAEC,gBAAgB;EAAEC,YAAY;EAAEC,WAAW;EAAEC;AAAG,CAAE;EACxD,MAAM;IAAEC;EAAM,CAAE,GAAGD,GAAA,CAAIE,OAAO;EAE9B,MAAMC,IAAA,GAAOT,OAAA,CAAQ;IACnBG,gBAAA;IACAC;EACF;EAEA,oBACEM,IAAA,CAACb,gBAAA;cACC,aAAAa,IAAA,CAAC;MAAIC,SAAA,EAAWV,SAAA;gBACd,aAAAS,IAAA,CAAC;QAAIC,SAAA,EAAW,GAAGV,SAAA,kBAA2B;kBAC5C,aAAAS,IAAA,CAAC;UAAGC,SAAA,EAAW,GAAGV,SAAA,QAAiB;oBAChCQ,IAAA,EAAMG,GAAA,CAAI,CAAC;YAAEC,GAAA,EAAKC,SAAS;YAAEC;UAAQ,CAAE,EAAEC,KAAA;YACxC,MAAM;cAAEC;YAAS,CAAE,GAAGH,SAAA,IAAa,CAAC;YAEpC,MAAMI,cAAA,GACJ,CAACD,SAAA,IACDA,SAAA,CAAU;cAAEd,gBAAA;cAAkBI,MAAA;cAAQH,YAAA;cAAcC,WAAA;cAAaC;YAAI;YAEvE,IAAI,CAACY,cAAA,EAAgB;cACnB,OAAO;YACT;YAEA,IAAIJ,SAAA,EAAWK,SAAA,EAAW;cACxB,OAAOrB,qBAAA,CAAsB;gBAC3BsB,WAAA,EAAa;kBACXC,IAAA,EAAMN;gBACR;gBACAI,SAAA,EAAWL,SAAA,CAAUK,SAAS;gBAC9BG,SAAA,EAAWhB,GAAA,CAAIE,OAAO,CAACc,SAAS;gBAChCC,GAAA,EAAK,OAAOP,KAAA,EAAO;gBACnBQ,WAAA,EAAa;kBACXrB,gBAAA;kBACAC,YAAA;kBACAqB,IAAA,EAAMnB,GAAA,CAAImB,IAAI;kBACdjB,OAAA,EAASF,GAAA,CAAIE,OAAO;kBACpBH,WAAA;kBACAC,GAAA;kBACAoB,MAAA,EAAQpB,GAAA,CAAIoB,MAAM;kBAClBC,IAAA,EAAMrB,GAAA,CAAIqB;gBACZ;cACF;YACF;YAEA,oBACEjB,IAAA,CAACX,kBAAA;cACCI,gBAAA,EAAkBA,gBAAA;cAClBC,YAAA,EAAcA,YAAA;cAEdiB,IAAA,EAAMN,QAAA;cACNV,WAAA,EAAaA,WAAA;cACbC,GAAA,EAAKA,GAAA;cACLQ,SAAA,EAAWA;eAJN,OAAOE,KAAA,EAAO;UAOzB;;;;;AAMZ","ignoreList":[]}
+{"version":3,"file":"index.js","names":["React","ShouldRenderTabs","RenderServerComponent","DefaultDocumentTab","getTabs","baseClass","DocumentTabs","collectionConfig","globalConfig","permissions","req","user","config","payload","tabs","_jsx","className","map","tab","tabConfig","viewPath","index","condition","meetsCondition","Component","clientProps","path","importMap","key","serverProps","i18n","server"],"sources":["../../../../src/elements/DocumentHeader/Tabs/index.tsx"],"sourcesContent":["import type {\n  DocumentTabClientProps,\n  DocumentTabServerPropsOnly,\n  PayloadRequest,\n  SanitizedCollectionConfig,\n  SanitizedGlobalConfig,\n  SanitizedPermissions,\n} from 'payload'\n\nimport React from 'react'\n\n// eslint-disable-next-line payload/no-imports-from-exports-dir -- Server component must reference exports dir for proper client boundary\nimport { ShouldRenderTabs } from '../../../exports/client/index.js'\nimport { RenderServerComponent } from '../../RenderServerComponent/index.js'\nimport { DefaultDocumentTab } from './Tab/index.js'\nimport { getTabs } from './tabs/index.js'\nimport './index.css'\n\nconst baseClass = 'doc-tabs'\n\nexport const DocumentTabs: React.FC<{\n  collectionConfig: SanitizedCollectionConfig\n  globalConfig: SanitizedGlobalConfig\n  permissions: SanitizedPermissions\n  req: PayloadRequest\n  user?: PayloadRequest['user']\n}> = ({ collectionConfig, globalConfig, permissions, req, user }) => {\n  const { config } = req.payload\n\n  const tabs = getTabs({\n    collectionConfig,\n    globalConfig,\n  })\n\n  return (\n    <ShouldRenderTabs>\n      <div className={baseClass}>\n        <div className={`${baseClass}__tabs-container`}>\n          <ul className={`${baseClass}__tabs`}>\n            {tabs?.map(({ tab: tabConfig, viewPath }, index) => {\n              const { condition } = tabConfig || {}\n\n              const meetsCondition =\n                !condition ||\n                condition({ collectionConfig, config, globalConfig, permissions, req })\n\n              if (!meetsCondition) {\n                return null\n              }\n\n              if (tabConfig?.Component) {\n                return RenderServerComponent({\n                  clientProps: {\n                    path: viewPath,\n                  } satisfies DocumentTabClientProps,\n                  Component: tabConfig.Component,\n                  importMap: req.payload.importMap,\n                  key: `tab-${index}`,\n                  serverProps: {\n                    collectionConfig,\n                    globalConfig,\n                    i18n: req.i18n,\n                    payload: req.payload,\n                    permissions,\n                    req,\n                    server: req.server,\n                    user,\n                  } satisfies DocumentTabServerPropsOnly,\n                })\n              }\n\n              return (\n                <DefaultDocumentTab\n                  collectionConfig={collectionConfig}\n                  globalConfig={globalConfig}\n                  key={`tab-${index}`}\n                  path={viewPath}\n                  permissions={permissions}\n                  req={req}\n                  tabConfig={tabConfig}\n                  user={user}\n                />\n              )\n            })}\n          </ul>\n        </div>\n      </div>\n    </ShouldRenderTabs>\n  )\n}\n"],"mappings":";AASA,OAAOA,KAAA,MAAW;AAElB;AACA,SAASC,gBAAgB,QAAQ;AACjC,SAASC,qBAAqB,QAAQ;AACtC,SAASC,kBAAkB,QAAQ;AACnC,SAASC,OAAO,QAAQ;AACxB,OAAO;AAEP,MAAMC,SAAA,GAAY;AAElB,OAAO,MAAMC,YAAA,GAMRA,CAAC;EAAEC,gBAAgB;EAAEC,YAAY;EAAEC,WAAW;EAAEC,GAAG;EAAEC;AAAI,CAAE;EAC9D,MAAM;IAAEC;EAAM,CAAE,GAAGF,GAAA,CAAIG,OAAO;EAE9B,MAAMC,IAAA,GAAOV,OAAA,CAAQ;IACnBG,gBAAA;IACAC;EACF;EAEA,oBACEO,IAAA,CAACd,gBAAA;cACC,aAAAc,IAAA,CAAC;MAAIC,SAAA,EAAWX,SAAA;gBACd,aAAAU,IAAA,CAAC;QAAIC,SAAA,EAAW,GAAGX,SAAA,kBAA2B;kBAC5C,aAAAU,IAAA,CAAC;UAAGC,SAAA,EAAW,GAAGX,SAAA,QAAiB;oBAChCS,IAAA,EAAMG,GAAA,CAAI,CAAC;YAAEC,GAAA,EAAKC,SAAS;YAAEC;UAAQ,CAAE,EAAEC,KAAA;YACxC,MAAM;cAAEC;YAAS,CAAE,GAAGH,SAAA,IAAa,CAAC;YAEpC,MAAMI,cAAA,GACJ,CAACD,SAAA,IACDA,SAAA,CAAU;cAAEf,gBAAA;cAAkBK,MAAA;cAAQJ,YAAA;cAAcC,WAAA;cAAaC;YAAI;YAEvE,IAAI,CAACa,cAAA,EAAgB;cACnB,OAAO;YACT;YAEA,IAAIJ,SAAA,EAAWK,SAAA,EAAW;cACxB,OAAOtB,qBAAA,CAAsB;gBAC3BuB,WAAA,EAAa;kBACXC,IAAA,EAAMN;gBACR;gBACAI,SAAA,EAAWL,SAAA,CAAUK,SAAS;gBAC9BG,SAAA,EAAWjB,GAAA,CAAIG,OAAO,CAACc,SAAS;gBAChCC,GAAA,EAAK,OAAOP,KAAA,EAAO;gBACnBQ,WAAA,EAAa;kBACXtB,gBAAA;kBACAC,YAAA;kBACAsB,IAAA,EAAMpB,GAAA,CAAIoB,IAAI;kBACdjB,OAAA,EAASH,GAAA,CAAIG,OAAO;kBACpBJ,WAAA;kBACAC,GAAA;kBACAqB,MAAA,EAAQrB,GAAA,CAAIqB,MAAM;kBAClBpB;gBACF;cACF;YACF;YAEA,oBACEI,IAAA,CAACZ,kBAAA;cACCI,gBAAA,EAAkBA,gBAAA;cAClBC,YAAA,EAAcA,YAAA;cAEdkB,IAAA,EAAMN,QAAA;cACNX,WAAA,EAAaA,WAAA;cACbC,GAAA,EAAKA,GAAA;cACLS,SAAA,EAAWA,SAAA;cACXR,IAAA,EAAMA;eALD,OAAOU,KAAA,EAAO;UAQzB;;;;;AAMZ","ignoreList":[]}

package/dist/elements/DocumentHeader/index.css

@@ -1,7 +1,7 @@
 @layer payload-default {
   .doc-header {
     width: 100%;
-    padding: var(--spacer-2-5) var(--gutter-h);
+    padding: var(--spacer-2) var(--gutter-h) var(--spacer-3);
     position: relative;
     border-bottom: var(--stroke-width-small) solid var(--color-border);
     display: flex;
@@ -23,6 +23,7 @@
     width: 100%;
   }
 
+  /* stylelint-disable-next-line plugin/no-max-width-media-query -- TODO: pre-existing; migrate to a mobile-first min-width query */
   @media (max-width: 768px) {
     .doc-header {
       flex-direction: column;

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

@@ -11,5 +11,6 @@ export declare const DocumentHeader: React.FC<{
     hideTabs?: boolean;
     permissions: SanitizedPermissions;
     req: PayloadRequest;
+    user?: PayloadRequest['user'];
 }>;
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/DocumentHeader/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,cAAc,EACd,yBAAyB,EACzB,qBAAqB,EACrB,oBAAoB,EACrB,MAAM,SAAS,CAAA;AAEhB,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,aAAa,CAAA;AAIpB;;GAEG;AACH,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC;IACpC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,gBAAgB,CAAC,EAAE,yBAAyB,CAAA;IAC5C,YAAY,CAAC,EAAE,qBAAqB,CAAA;IACpC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,WAAW,EAAE,oBAAoB,CAAA;IACjC,GAAG,EAAE,cAAc,CAAA;CACpB,CAiBA,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/DocumentHeader/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,cAAc,EACd,yBAAyB,EACzB,qBAAqB,EACrB,oBAAoB,EACrB,MAAM,SAAS,CAAA;AAEhB,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,aAAa,CAAA;AAIpB;;GAEG;AACH,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC;IACpC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,gBAAgB,CAAC,EAAE,yBAAyB,CAAA;IAC5C,YAAY,CAAC,EAAE,qBAAqB,CAAA;IACpC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,WAAW,EAAE,oBAAoB,CAAA;IACjC,GAAG,EAAE,cAAc,CAAA;IACnB,IAAI,CAAC,EAAE,cAAc,CAAC,MAAM,CAAC,CAAA;CAC9B,CAkBA,CAAA"}

package/dist/elements/DocumentHeader/index.js

@@ -15,7 +15,8 @@ export const DocumentHeader = props => {
     globalConfig,
     hideTabs,
     permissions,
-    req
+    req,
+    user
   } = props;
   return /*#__PURE__*/_jsxs(DocumentHeaderRoot, {
     children: [/*#__PURE__*/_jsx(RenderTitle, {
@@ -24,7 +25,8 @@ export const DocumentHeader = props => {
       collectionConfig: collectionConfig,
       globalConfig: globalConfig,
       permissions: permissions,
-      req: req
+      req: req,
+      user: user
     }), AfterHeader ? /*#__PURE__*/_jsx("div", {
       className: `${baseClass}__after-header`,
       children: AfterHeader

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","DocumentHeaderRoot","RenderTitle","DocumentTabs","baseClass","DocumentHeader","props","AfterHeader","collectionConfig","globalConfig","hideTabs","permissions","req","_jsxs","_jsx","className"],"sources":["../../../src/elements/DocumentHeader/index.tsx"],"sourcesContent":["import type {\n  PayloadRequest,\n  SanitizedCollectionConfig,\n  SanitizedGlobalConfig,\n  SanitizedPermissions,\n} from 'payload'\n\nimport React from 'react'\n\n// eslint-disable-next-line payload/no-imports-from-exports-dir -- Server component must reference exports dir for proper client boundary\nimport { DocumentHeaderRoot, Gutter, RenderTitle } from '../../exports/client/index.js'\nimport { DocumentTabs } from './Tabs/index.js'\nimport './index.css'\n\nconst baseClass = `doc-header`\n\n/**\n * @internal\n */\nexport const DocumentHeader: React.FC<{\n  AfterHeader?: React.ReactNode\n  collectionConfig?: SanitizedCollectionConfig\n  globalConfig?: SanitizedGlobalConfig\n  hideTabs?: boolean\n  permissions: SanitizedPermissions\n  req: PayloadRequest\n}> = (props) => {\n  const { AfterHeader, collectionConfig, globalConfig, hideTabs, permissions, req } = props\n\n  return (\n    <DocumentHeaderRoot>\n      <RenderTitle className={`${baseClass}__title`} />\n      {!hideTabs && (\n        <DocumentTabs\n          collectionConfig={collectionConfig}\n          globalConfig={globalConfig}\n          permissions={permissions}\n          req={req}\n        />\n      )}\n      {AfterHeader ? <div className={`${baseClass}__after-header`}>{AfterHeader}</div> : null}\n    </DocumentHeaderRoot>\n  )\n}\n"],"mappings":";AAOA,OAAOA,KAAA,MAAW;AAElB;AACA,SAASC,kBAAkB,EAAUC,WAAW,QAAQ;AACxD,SAASC,YAAY,QAAQ;AAC7B,OAAO;AAEP,MAAMC,SAAA,GAAY,YAAY;AAE9B;;;AAGA,OAAO,MAAMC,cAAA,GAOPC,KAAA;EACJ,MAAM;IAAEC,WAAW;IAAEC,gBAAgB;IAAEC,YAAY;IAAEC,QAAQ;IAAEC,WAAW;IAAEC;EAAG,CAAE,GAAGN,KAAA;EAEpF,oBACEO,KAAA,CAACZ,kBAAA;4BACCa,IAAA,CAACZ,WAAA;MAAYa,SAAA,EAAW,GAAGX,SAAA;QAC1B,CAACM,QAAA,iBACAI,IAAA,CAACX,YAAA;MACCK,gBAAA,EAAkBA,gBAAA;MAClBC,YAAA,EAAcA,YAAA;MACdE,WAAA,EAAaA,WAAA;MACbC,GAAA,EAAKA;QAGRL,WAAA,gBAAcO,IAAA,CAAC;MAAIC,SAAA,EAAW,GAAGX,SAAA,gBAAyB;gBAAGG;SAAqB;;AAGzF","ignoreList":[]}
+{"version":3,"file":"index.js","names":["React","DocumentHeaderRoot","RenderTitle","DocumentTabs","baseClass","DocumentHeader","props","AfterHeader","collectionConfig","globalConfig","hideTabs","permissions","req","user","_jsxs","_jsx","className"],"sources":["../../../src/elements/DocumentHeader/index.tsx"],"sourcesContent":["import type {\n  PayloadRequest,\n  SanitizedCollectionConfig,\n  SanitizedGlobalConfig,\n  SanitizedPermissions,\n} from 'payload'\n\nimport React from 'react'\n\n// eslint-disable-next-line payload/no-imports-from-exports-dir -- Server component must reference exports dir for proper client boundary\nimport { DocumentHeaderRoot, Gutter, RenderTitle } from '../../exports/client/index.js'\nimport { DocumentTabs } from './Tabs/index.js'\nimport './index.css'\n\nconst baseClass = `doc-header`\n\n/**\n * @internal\n */\nexport const DocumentHeader: React.FC<{\n  AfterHeader?: React.ReactNode\n  collectionConfig?: SanitizedCollectionConfig\n  globalConfig?: SanitizedGlobalConfig\n  hideTabs?: boolean\n  permissions: SanitizedPermissions\n  req: PayloadRequest\n  user?: PayloadRequest['user']\n}> = (props) => {\n  const { AfterHeader, collectionConfig, globalConfig, hideTabs, permissions, req, user } = props\n\n  return (\n    <DocumentHeaderRoot>\n      <RenderTitle className={`${baseClass}__title`} />\n      {!hideTabs && (\n        <DocumentTabs\n          collectionConfig={collectionConfig}\n          globalConfig={globalConfig}\n          permissions={permissions}\n          req={req}\n          user={user}\n        />\n      )}\n      {AfterHeader ? <div className={`${baseClass}__after-header`}>{AfterHeader}</div> : null}\n    </DocumentHeaderRoot>\n  )\n}\n"],"mappings":";AAOA,OAAOA,KAAA,MAAW;AAElB;AACA,SAASC,kBAAkB,EAAUC,WAAW,QAAQ;AACxD,SAASC,YAAY,QAAQ;AAC7B,OAAO;AAEP,MAAMC,SAAA,GAAY,YAAY;AAE9B;;;AAGA,OAAO,MAAMC,cAAA,GAQPC,KAAA;EACJ,MAAM;IAAEC,WAAW;IAAEC,gBAAgB;IAAEC,YAAY;IAAEC,QAAQ;IAAEC,WAAW;IAAEC,GAAG;IAAEC;EAAI,CAAE,GAAGP,KAAA;EAE1F,oBACEQ,KAAA,CAACb,kBAAA;4BACCc,IAAA,CAACb,WAAA;MAAYc,SAAA,EAAW,GAAGZ,SAAA;QAC1B,CAACM,QAAA,iBACAK,IAAA,CAACZ,YAAA;MACCK,gBAAA,EAAkBA,gBAAA;MAClBC,YAAA,EAAcA,YAAA;MACdE,WAAA,EAAaA,WAAA;MACbC,GAAA,EAAKA,GAAA;MACLC,IAAA,EAAMA;QAGTN,WAAA,gBAAcQ,IAAA,CAAC;MAAIC,SAAA,EAAW,GAAGZ,SAAA,gBAAyB;gBAAGG;SAAqB;;AAGzF","ignoreList":[]}

package/dist/elements/DraggableSortable/DraggableSortableItem/types.d.ts

@@ -3,7 +3,7 @@ import type { SyntheticListenerMap } from '@dnd-kit/core/dist/hooks/utilities/in
 import type React from 'react';
 import type { UseDraggableSortableReturn } from '../useDraggableSortable/types.js';
 export type DragHandleProps = {
-    attributes: UseDraggableArguments['attributes'];
+    attributes: React.AriaAttributes & UseDraggableArguments['attributes'];
     listeners: SyntheticListenerMap;
 } & UseDraggableArguments;
 export type ChildFunction = (args: UseDraggableSortableReturn) => React.ReactNode;

package/dist/elements/DraggableSortable/DraggableSortableItem/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/elements/DraggableSortable/DraggableSortableItem/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAA;AAC1D,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,6CAA6C,CAAA;AACvF,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,kCAAkC,CAAA;AAElF,MAAM,MAAM,eAAe,GAAG;IAC5B,UAAU,EAAE,qBAAqB,CAAC,YAAY,CAAC,CAAA;IAC/C,SAAS,EAAE,oBAAoB,CAAA;CAChC,GAAG,qBAAqB,CAAA;AAEzB,MAAM,MAAM,aAAa,GAAG,CAAC,IAAI,EAAE,0BAA0B,KAAK,KAAK,CAAC,SAAS,CAAA;AAEjF,MAAM,MAAM,KAAK,GAAG;IAClB,QAAQ,EAAE,aAAa,CAAA;CACxB,GAAG,qBAAqB,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/elements/DraggableSortable/DraggableSortableItem/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAA;AAC1D,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,6CAA6C,CAAA;AACvF,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,kCAAkC,CAAA;AAElF,MAAM,MAAM,eAAe,GAAG;IAC5B,UAAU,EAAE,KAAK,CAAC,cAAc,GAAG,qBAAqB,CAAC,YAAY,CAAC,CAAA;IACtE,SAAS,EAAE,oBAAoB,CAAA;CAChC,GAAG,qBAAqB,CAAA;AAEzB,MAAM,MAAM,aAAa,GAAG,CAAC,IAAI,EAAE,0BAA0B,KAAK,KAAK,CAAC,SAAS,CAAA;AAEjF,MAAM,MAAM,KAAK,GAAG;IAClB,QAAQ,EAAE,aAAa,CAAA;CACxB,GAAG,qBAAqB,CAAA"}

package/dist/elements/DraggableSortable/DraggableSortableItem/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":[],"sources":["../../../../src/elements/DraggableSortable/DraggableSortableItem/types.ts"],"sourcesContent":["import type { UseDraggableArguments } from '@dnd-kit/core'\nimport type { SyntheticListenerMap } from '@dnd-kit/core/dist/hooks/utilities/index.js'\nimport type React from 'react'\n\nimport type { UseDraggableSortableReturn } from '../useDraggableSortable/types.js'\n\nexport type DragHandleProps = {\n  attributes: UseDraggableArguments['attributes']\n  listeners: SyntheticListenerMap\n} & UseDraggableArguments\n\nexport type ChildFunction = (args: UseDraggableSortableReturn) => React.ReactNode\n\nexport type Props = {\n  children: ChildFunction\n} & UseDraggableArguments\n"],"mappings":"AAaA","ignoreList":[]}
+{"version":3,"file":"types.js","names":[],"sources":["../../../../src/elements/DraggableSortable/DraggableSortableItem/types.ts"],"sourcesContent":["import type { UseDraggableArguments } from '@dnd-kit/core'\nimport type { SyntheticListenerMap } from '@dnd-kit/core/dist/hooks/utilities/index.js'\nimport type React from 'react'\n\nimport type { UseDraggableSortableReturn } from '../useDraggableSortable/types.js'\n\nexport type DragHandleProps = {\n  attributes: React.AriaAttributes & UseDraggableArguments['attributes']\n  listeners: SyntheticListenerMap\n} & UseDraggableArguments\n\nexport type ChildFunction = (args: UseDraggableSortableReturn) => React.ReactNode\n\nexport type Props = {\n  children: ChildFunction\n} & UseDraggableArguments\n"],"mappings":"AAaA","ignoreList":[]}

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/DraggableSortable/index.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAkD,MAAM,OAAO,CAAA;AAEtE,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAEvC,OAAO,aAAa,CAAA;AAEpB,OAAO,EAAE,KAAK,EAAE,CAAA;AAEhB,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA4G7C,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/DraggableSortable/index.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAkD,MAAM,OAAO,CAAA;AAEtE,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAEvC,OAAO,aAAa,CAAA;AAEpB,OAAO,EAAE,KAAK,EAAE,CAAA;AAEhB,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAoH7C,CAAA"}

package/dist/elements/DraggableSortable/index.js

@@ -7,8 +7,9 @@ import { SortableContext, sortableKeyboardCoordinates } from '@dnd-kit/sortable'
 import React, { useCallback, useEffect, useId, useState } from 'react';
 import './index.css';
 export const DraggableSortable = props => {
-  const $ = _c(27);
+  const $ = _c(28);
   const {
+    id,
     children,
     className,
     ids,
@@ -145,7 +146,7 @@ export const DraggableSortable = props => {
   }
   const handleDragStart = t8;
   let t9;
-  if ($[14] !== activeId || $[15] !== children || $[16] !== className || $[17] !== dndContextID || $[18] !== handleDragEnd || $[19] !== handleDragStart || $[20] !== ids || $[21] !== renderDragOverlay || $[22] !== sensors || $[23] !== setNodeRef || $[24] !== sortableContextID || $[25] !== sortingStrategy) {
+  if ($[14] !== activeId || $[15] !== children || $[16] !== className || $[17] !== dndContextID || $[18] !== handleDragEnd || $[19] !== handleDragStart || $[20] !== id || $[21] !== ids || $[22] !== renderDragOverlay || $[23] !== sensors || $[24] !== setNodeRef || $[25] !== sortableContextID || $[26] !== sortingStrategy) {
     t9 = _jsxs(DndContext, {
       collisionDetection: closestCenter,
       id: dndContextID,
@@ -159,6 +160,7 @@ export const DraggableSortable = props => {
         strategy: sortingStrategy,
         children: _jsx("div", {
           className,
+          id,
           ref: setNodeRef,
           children
         })
@@ -173,15 +175,16 @@ export const DraggableSortable = props => {
     $[17] = dndContextID;
     $[18] = handleDragEnd;
     $[19] = handleDragStart;
-    $[20] = ids;
-    $[21] = renderDragOverlay;
-    $[22] = sensors;
-    $[23] = setNodeRef;
-    $[24] = sortableContextID;
-    $[25] = sortingStrategy;
-    $[26] = t9;
+    $[20] = id;
+    $[21] = ids;
+    $[22] = renderDragOverlay;
+    $[23] = sensors;
+    $[24] = setNodeRef;
+    $[25] = sortableContextID;
+    $[26] = sortingStrategy;
+    $[27] = t9;
   } else {
-    t9 = $[26];
+    t9 = $[27];
   }
   return t9;
 };

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","closestCenter","DndContext","DragOverlay","KeyboardSensor","MouseSensor","TouchSensor","useDroppable","useSensor","useSensors","SortableContext","sortableKeyboardCoordinates","React","useCallback","useEffect","useId","useState","DraggableSortable","props","$","children","className","ids","onDragEnd","onDragStart","renderDragOverlay","sortingStrategy","activeId","setActiveId","t0","t1","document","body","classList","add","_temp","dndContextID","sortableContextID","t2","id","setNodeRef","t3","Symbol","for","activationConstraint","distance","t4","delay","tolerance","t5","coordinateGetter","sensors","t6","event","active","over","activatorEvent","stopPropagation","moveFromIndex","findIndex","_id","moveToIndex","_id_0","handleDragEnd","t7","handleDragCancel","t8","event_0","active_0","handleDragStart","t9","_jsxs","collisionDetection","onDragCancel","_jsx","items","strategy","ref","dropAnimation","remove"],"sources":["../../../src/elements/DraggableSortable/index.tsx"],"sourcesContent":["'use client'\nimport type { DragEndEvent, DragStartEvent } from '@dnd-kit/core'\n\nimport {\n  closestCenter,\n  DndContext,\n  DragOverlay,\n  KeyboardSensor,\n  MouseSensor,\n  TouchSensor,\n  useDroppable,\n  useSensor,\n  useSensors,\n} from '@dnd-kit/core'\nimport { SortableContext, sortableKeyboardCoordinates } from '@dnd-kit/sortable'\nimport React, { useCallback, useEffect, useId, useState } from 'react'\n\nimport type { Props } from './types.js'\n\nimport './index.css'\n\nexport { Props }\n\nexport const DraggableSortable: React.FC<Props> = (props) => {\n  const { children, className, ids, onDragEnd, onDragStart, renderDragOverlay, sortingStrategy } =\n    props\n  const [activeId, setActiveId] = useState<null | number | string>(null)\n\n  // The overlay is a different element than the drag handle, so its inline cursor\n  // styles don't carry over. So set a body class to show a grabbing cursor everywhere.\n  useEffect(() => {\n    if (activeId !== null) {\n      document.body.classList.add('is-dragging')\n      return () => {\n        document.body.classList.remove('is-dragging')\n      }\n    }\n  }, [activeId])\n\n  const dndContextID = useId()\n  const sortableContextID = useId()\n\n  const { setNodeRef } = useDroppable({\n    id: dndContextID,\n  })\n\n  const sensors = useSensors(\n    useSensor(MouseSensor, {\n      activationConstraint: {\n        distance: 5,\n      },\n    }),\n    useSensor(TouchSensor, {\n      activationConstraint: {\n        delay: 200,\n        tolerance: 5,\n      },\n    }),\n    useSensor(KeyboardSensor, {\n      coordinateGetter: sortableKeyboardCoordinates,\n    }),\n  )\n\n  const handleDragEnd = useCallback(\n    (event: DragEndEvent) => {\n      const { active, over } = event\n\n      event.activatorEvent.stopPropagation()\n      setActiveId(null)\n\n      if (!active || !over) {\n        return\n      }\n\n      if (typeof onDragEnd === 'function') {\n        onDragEnd({\n          event,\n          moveFromIndex: ids.findIndex((_id) => _id === active.id),\n          moveToIndex: ids.findIndex((_id) => _id === over.id),\n        })\n      }\n    },\n    [onDragEnd, ids],\n  )\n\n  const handleDragCancel = useCallback(() => {\n    setActiveId(null)\n  }, [])\n\n  const handleDragStart = useCallback(\n    (event: DragStartEvent) => {\n      const { active } = event\n\n      if (!active) {\n        return\n      }\n\n      setActiveId(active.id)\n\n      if (typeof onDragStart === 'function') {\n        onDragStart({ id: active.id, event })\n      }\n    },\n    [onDragStart],\n  )\n\n  return (\n    <DndContext\n      collisionDetection={closestCenter}\n      // Provide stable ID to fix hydration issues: https://github.com/clauderic/dnd-kit/issues/926\n      id={dndContextID}\n      onDragCancel={handleDragCancel}\n      onDragEnd={handleDragEnd}\n      onDragStart={handleDragStart}\n      sensors={sensors}\n    >\n      <SortableContext\n        // Provide stable ID to fix hydration issues: https://github.com/clauderic/dnd-kit/issues/926\n        id={sortableContextID}\n        items={ids}\n        strategy={sortingStrategy}\n      >\n        <div className={className} ref={setNodeRef}>\n          {children}\n        </div>\n      </SortableContext>\n      {renderDragOverlay && activeId !== null && (\n        <DragOverlay dropAnimation={null}>{renderDragOverlay(activeId)}</DragOverlay>\n      )}\n    </DndContext>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","closestCenter","DndContext","DragOverlay","KeyboardSensor","MouseSensor","TouchSensor","useDroppable","useSensor","useSensors","SortableContext","sortableKeyboardCoordinates","React","useCallback","useEffect","useId","useState","DraggableSortable","props","$","id","children","className","ids","onDragEnd","onDragStart","renderDragOverlay","sortingStrategy","activeId","setActiveId","t0","t1","document","body","classList","add","_temp","dndContextID","sortableContextID","t2","setNodeRef","t3","Symbol","for","activationConstraint","distance","t4","delay","tolerance","t5","coordinateGetter","sensors","t6","event","active","over","activatorEvent","stopPropagation","moveFromIndex","findIndex","_id","moveToIndex","_id_0","handleDragEnd","t7","handleDragCancel","t8","event_0","active_0","handleDragStart","t9","_jsxs","collisionDetection","onDragCancel","_jsx","items","strategy","ref","dropAnimation","remove"],"sources":["../../../src/elements/DraggableSortable/index.tsx"],"sourcesContent":["'use client'\nimport type { DragEndEvent, DragStartEvent } from '@dnd-kit/core'\n\nimport {\n  closestCenter,\n  DndContext,\n  DragOverlay,\n  KeyboardSensor,\n  MouseSensor,\n  TouchSensor,\n  useDroppable,\n  useSensor,\n  useSensors,\n} from '@dnd-kit/core'\nimport { SortableContext, sortableKeyboardCoordinates } from '@dnd-kit/sortable'\nimport React, { useCallback, useEffect, useId, useState } from 'react'\n\nimport type { Props } from './types.js'\n\nimport './index.css'\n\nexport { Props }\n\nexport const DraggableSortable: React.FC<Props> = (props) => {\n  const {\n    id,\n    children,\n    className,\n    ids,\n    onDragEnd,\n    onDragStart,\n    renderDragOverlay,\n    sortingStrategy,\n  } = props\n  const [activeId, setActiveId] = useState<null | number | string>(null)\n\n  // The overlay is a different element than the drag handle, so its inline cursor\n  // styles don't carry over. So set a body class to show a grabbing cursor everywhere.\n  useEffect(() => {\n    if (activeId !== null) {\n      document.body.classList.add('is-dragging')\n      return () => {\n        document.body.classList.remove('is-dragging')\n      }\n    }\n  }, [activeId])\n\n  const dndContextID = useId()\n  const sortableContextID = useId()\n\n  const { setNodeRef } = useDroppable({\n    id: dndContextID,\n  })\n\n  const sensors = useSensors(\n    useSensor(MouseSensor, {\n      activationConstraint: {\n        distance: 5,\n      },\n    }),\n    useSensor(TouchSensor, {\n      activationConstraint: {\n        delay: 200,\n        tolerance: 5,\n      },\n    }),\n    useSensor(KeyboardSensor, {\n      coordinateGetter: sortableKeyboardCoordinates,\n    }),\n  )\n\n  const handleDragEnd = useCallback(\n    (event: DragEndEvent) => {\n      const { active, over } = event\n\n      event.activatorEvent.stopPropagation()\n      setActiveId(null)\n\n      if (!active || !over) {\n        return\n      }\n\n      if (typeof onDragEnd === 'function') {\n        onDragEnd({\n          event,\n          moveFromIndex: ids.findIndex((_id) => _id === active.id),\n          moveToIndex: ids.findIndex((_id) => _id === over.id),\n        })\n      }\n    },\n    [onDragEnd, ids],\n  )\n\n  const handleDragCancel = useCallback(() => {\n    setActiveId(null)\n  }, [])\n\n  const handleDragStart = useCallback(\n    (event: DragStartEvent) => {\n      const { active } = event\n\n      if (!active) {\n        return\n      }\n\n      setActiveId(active.id)\n\n      if (typeof onDragStart === 'function') {\n        onDragStart({ id: active.id, event })\n      }\n    },\n    [onDragStart],\n  )\n\n  return (\n    <DndContext\n      collisionDetection={closestCenter}\n      // Provide stable ID to fix hydration issues: https://github.com/clauderic/dnd-kit/issues/926\n      id={dndContextID}\n      onDragCancel={handleDragCancel}\n      onDragEnd={handleDragEnd}\n      onDragStart={handleDragStart}\n      sensors={sensors}\n    >\n      <SortableContext\n        // Provide stable ID to fix hydration issues: https://github.com/clauderic/dnd-kit/issues/926\n        id={sortableContextID}\n        items={ids}\n        strategy={sortingStrategy}\n      >\n        <div className={className} id={id} ref={setNodeRef}>\n          {children}\n        </div>\n      </SortableContext>\n      {renderDragOverlay && activeId !== null && (\n        <DragOverlay dropAnimation={null}>{renderDragOverlay(activeId)}</DragOverlay>\n      )}\n    </DndContext>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

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

@@ -5,6 +5,7 @@ export type Props = {
     children: React.ReactNode;
     className?: string;
     droppableRef?: Ref<HTMLElement>;
+    id?: string;
     ids: string[];
     onDragEnd: (e: {
         event: DragEndEvent;

package/dist/elements/DraggableSortable/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/elements/DraggableSortable/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AACjE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AACxD,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAA;AAEhC,MAAM,MAAM,KAAK,GAAG;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,YAAY,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAA;IAC/B,GAAG,EAAE,MAAM,EAAE,CAAA;IACb,SAAS,EAAE,CAAC,CAAC,EAAE;QAAE,KAAK,EAAE,YAAY,CAAC;QAAC,aAAa,EAAE,MAAM,CAAC;QAAC,WAAW,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAA;IAC3F,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE;QAAE,KAAK,EAAE,cAAc,CAAC;QAAC,EAAE,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,KAAK,IAAI,CAAA;IACzE,iBAAiB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM,KAAK,KAAK,CAAC,SAAS,CAAA;IAClE,eAAe,CAAC,EAAE,eAAe,CAAA;CAClC,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/elements/DraggableSortable/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AACjE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AACxD,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAA;AAEhC,MAAM,MAAM,KAAK,GAAG;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,YAAY,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAA;IAC/B,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,GAAG,EAAE,MAAM,EAAE,CAAA;IACb,SAAS,EAAE,CAAC,CAAC,EAAE;QAAE,KAAK,EAAE,YAAY,CAAC;QAAC,aAAa,EAAE,MAAM,CAAC;QAAC,WAAW,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAA;IAC3F,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE;QAAE,KAAK,EAAE,cAAc,CAAC;QAAC,EAAE,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,KAAK,IAAI,CAAA;IACzE,iBAAiB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM,KAAK,KAAK,CAAC,SAAS,CAAA;IAClE,eAAe,CAAC,EAAE,eAAe,CAAA;CAClC,CAAA"}