@payloadcms/ui 3.80.0-internal-debug.7019cc9 → 3.80.0-internal.0311fce

package/dist/elements/Tooltip/index.js

@@ -1,104 +1,71 @@
 'use client';
-import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
+
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React, { useEffect } from 'react';
 import { useIntersect } from '../../hooks/useIntersect.js';
 import './index.scss';
-/**
-   * If the tooltip position should not change depending on if the toolbar is outside the boundingRef. @default false
-   */ export const Tooltip = (props)=>{
-    const { alignCaret = 'center', boundingRef, children, className, delay = 350, position: positionFromProps, show: showFromProps = true, staticPositioning = false } = props;
-    const [show, setShow] = React.useState(showFromProps);
-    const [position, setPosition] = React.useState('top');
-    const getTitleAttribute = (content)=>typeof content === 'string' ? content : '';
-    const [ref, intersectionEntry] = useIntersect({
-        root: boundingRef?.current || null,
-        rootMargin: '-145px 0px 0px 100px',
-        threshold: 0
-    }, staticPositioning);
-    useEffect(()=>{
-        let timerID;
-        // do not use the delay on transition-out
-        if (delay && showFromProps) {
-            timerID = setTimeout(()=>{
-                setShow(showFromProps);
-            }, delay);
-        } else {
-            setShow(showFromProps);
-        }
-        return ()=>{
-            if (timerID) {
-                clearTimeout(timerID);
-            }
-        };
-    }, [
-        showFromProps,
-        delay
-    ]);
-    useEffect(()=>{
-        if (staticPositioning) {
-            return;
-        }
-        setPosition(intersectionEntry?.isIntersecting ? 'top' : 'bottom');
-    }, [
-        intersectionEntry,
-        staticPositioning
-    ]);
-    // The first aside is always on top. The purpose of that is that it can reliably be used for the interaction observer (as it's not moving around), to calculate the position of the actual tooltip.
-    return /*#__PURE__*/ _jsxDEV(React.Fragment, {
-        children: [
-            !staticPositioning && /*#__PURE__*/ _jsxDEV("aside", {
-                "aria-hidden": "true",
-                className: [
-                    'tooltip',
-                    className,
-                    `tooltip--caret-${alignCaret}`,
-                    'tooltip--position-top'
-                ].filter(Boolean).join(' '),
-                ref: ref,
-                style: {
-                    opacity: '0'
-                },
-                children: /*#__PURE__*/ _jsxDEV("div", {
-                    className: "tooltip-content",
-                    children: children
-                }, void 0, false, {
-                    fileName: "src/elements/Tooltip/index.tsx",
-                    lineNumber: 85,
-                    columnNumber: 11
-                }, this)
-            }, void 0, false, {
-                fileName: "src/elements/Tooltip/index.tsx",
-                lineNumber: 77,
-                columnNumber: 9
-            }, this),
-            /*#__PURE__*/ _jsxDEV("aside", {
-                className: [
-                    'tooltip',
-                    className,
-                    show && 'tooltip--show',
-                    `tooltip--caret-${alignCaret}`,
-                    `tooltip--position-${positionFromProps || position}`
-                ].filter(Boolean).join(' '),
-                title: getTitleAttribute(children),
-                children: /*#__PURE__*/ _jsxDEV("div", {
-                    className: "tooltip-content",
-                    children: children
-                }, void 0, false, {
-                    fileName: "src/elements/Tooltip/index.tsx",
-                    lineNumber: 100,
-                    columnNumber: 9
-                }, this)
-            }, void 0, false, {
-                fileName: "src/elements/Tooltip/index.tsx",
-                lineNumber: 88,
-                columnNumber: 7
-            }, this)
-        ]
-    }, void 0, true, {
-        fileName: "src/elements/Tooltip/index.tsx",
-        lineNumber: 75,
-        columnNumber: 5
-    }, this);
+export const Tooltip = props => {
+  const {
+    alignCaret = 'center',
+    boundingRef,
+    children,
+    className,
+    delay = 500,
+    position: positionFromProps,
+    show: showFromProps = true,
+    staticPositioning = false
+  } = props;
+  const [show, setShow] = React.useState(showFromProps);
+  const [position, setPosition] = React.useState('top');
+  const getTitleAttribute = content => typeof content === 'string' ? content : '';
+  const [ref, intersectionEntry] = useIntersect({
+    root: boundingRef?.current || null,
+    rootMargin: '-145px 0px 0px 100px',
+    threshold: 0
+  }, staticPositioning);
+  useEffect(() => {
+    let timerID;
+    // do not use the delay on transition-out
+    if (delay && showFromProps) {
+      timerID = setTimeout(() => {
+        setShow(showFromProps);
+      }, delay);
+    } else {
+      setShow(showFromProps);
+    }
+    return () => {
+      if (timerID) {
+        clearTimeout(timerID);
+      }
+    };
+  }, [showFromProps, delay]);
+  useEffect(() => {
+    if (staticPositioning) {
+      return;
+    }
+    setPosition(intersectionEntry?.isIntersecting ? 'top' : 'bottom');
+  }, [intersectionEntry, staticPositioning]);
+  // The first aside is always on top. The purpose of that is that it can reliably be used for the interaction observer (as it's not moving around), to calculate the position of the actual tooltip.
+  return /*#__PURE__*/_jsxs(React.Fragment, {
+    children: [!staticPositioning && /*#__PURE__*/_jsx("aside", {
+      "aria-hidden": "true",
+      className: ['tooltip', className, `tooltip--caret-${alignCaret}`, 'tooltip--position-top'].filter(Boolean).join(' '),
+      ref: ref,
+      style: {
+        opacity: '0'
+      },
+      children: /*#__PURE__*/_jsx("div", {
+        className: "tooltip-content",
+        children: children
+      })
+    }), /*#__PURE__*/_jsx("aside", {
+      className: ['tooltip', className, show && 'tooltip--show', `tooltip--caret-${alignCaret}`, `tooltip--position-${positionFromProps || position}`].filter(Boolean).join(' '),
+      title: getTitleAttribute(children),
+      children: /*#__PURE__*/_jsx("div", {
+        className: "tooltip-content",
+        children: children
+      })
+    })]
+  });
 };
-
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/Tooltip/index.tsx"],"sourcesContent":["'use client'\nimport React, { useEffect } from 'react'\n\nimport { useIntersect } from '../../hooks/useIntersect.js'\nimport './index.scss'\n\nexport type Props = {\n  alignCaret?: 'center' | 'left' | 'right'\n  boundingRef?: React.RefObject<HTMLElement | null>\n  children: React.ReactNode\n  className?: string\n  delay?: number\n  position?: 'bottom' | 'top'\n  show?: boolean\n  /**\n   * If the tooltip position should not change depending on if the toolbar is outside the boundingRef. @default false\n   */\n  staticPositioning?: boolean\n}\n\nexport const Tooltip: React.FC<Props> = (props) => {\n  const {\n    alignCaret = 'center',\n    boundingRef,\n    children,\n    className,\n    delay = 350,\n    position: positionFromProps,\n    show: showFromProps = true,\n    staticPositioning = false,\n  } = props\n\n  const [show, setShow] = React.useState(showFromProps)\n  const [position, setPosition] = React.useState<'bottom' | 'top'>('top')\n\n  const getTitleAttribute = (content) => (typeof content === 'string' ? content : '')\n\n  const [ref, intersectionEntry] = useIntersect(\n    {\n      root: boundingRef?.current || null,\n      rootMargin: '-145px 0px 0px 100px',\n      threshold: 0,\n    },\n    staticPositioning,\n  )\n\n  useEffect(() => {\n    let timerID: NodeJS.Timeout\n\n    // do not use the delay on transition-out\n    if (delay && showFromProps) {\n      timerID = setTimeout(() => {\n        setShow(showFromProps)\n      }, delay)\n    } else {\n      setShow(showFromProps)\n    }\n\n    return () => {\n      if (timerID) {\n        clearTimeout(timerID)\n      }\n    }\n  }, [showFromProps, delay])\n\n  useEffect(() => {\n    if (staticPositioning) {\n      return\n    }\n    setPosition(intersectionEntry?.isIntersecting ? 'top' : 'bottom')\n  }, [intersectionEntry, staticPositioning])\n\n  // The first aside is always on top. The purpose of that is that it can reliably be used for the interaction observer (as it's not moving around), to calculate the position of the actual tooltip.\n  return (\n    <React.Fragment>\n      {!staticPositioning && (\n        <aside\n          aria-hidden=\"true\"\n          className={['tooltip', className, `tooltip--caret-${alignCaret}`, 'tooltip--position-top']\n            .filter(Boolean)\n            .join(' ')}\n          ref={ref}\n          style={{ opacity: '0' }}\n        >\n          <div className=\"tooltip-content\">{children}</div>\n        </aside>\n      )}\n      <aside\n        className={[\n          'tooltip',\n          className,\n          show && 'tooltip--show',\n          `tooltip--caret-${alignCaret}`,\n          `tooltip--position-${positionFromProps || position}`,\n        ]\n          .filter(Boolean)\n          .join(' ')}\n        title={getTitleAttribute(children)}\n      >\n        <div className=\"tooltip-content\">{children}</div>\n      </aside>\n    </React.Fragment>\n  )\n}\n"],"names":["React","useEffect","useIntersect","Tooltip","props","alignCaret","boundingRef","children","className","delay","position","positionFromProps","show","showFromProps","staticPositioning","setShow","useState","setPosition","getTitleAttribute","content","ref","intersectionEntry","root","current","rootMargin","threshold","timerID","setTimeout","clearTimeout","isIntersecting","Fragment","aside","aria-hidden","filter","Boolean","join","style","opacity","div","title"],"mappings":"AAAA;;AACA,OAAOA,SAASC,SAAS,QAAQ,QAAO;AAExC,SAASC,YAAY,QAAQ,8BAA6B;AAC1D,OAAO,eAAc;AAUnB;;GAEC,GAIH,OAAO,MAAMC,UAA2B,CAACC;IACvC,MAAM,EACJC,aAAa,QAAQ,EACrBC,WAAW,EACXC,QAAQ,EACRC,SAAS,EACTC,QAAQ,GAAG,EACXC,UAAUC,iBAAiB,EAC3BC,MAAMC,gBAAgB,IAAI,EAC1BC,oBAAoB,KAAK,EAC1B,GAAGV;IAEJ,MAAM,CAACQ,MAAMG,QAAQ,GAAGf,MAAMgB,QAAQ,CAACH;IACvC,MAAM,CAACH,UAAUO,YAAY,GAAGjB,MAAMgB,QAAQ,CAAmB;IAEjE,MAAME,oBAAoB,CAACC,UAAa,OAAOA,YAAY,WAAWA,UAAU;IAEhF,MAAM,CAACC,KAAKC,kBAAkB,GAAGnB,aAC/B;QACEoB,MAAMhB,aAAaiB,WAAW;QAC9BC,YAAY;QACZC,WAAW;IACb,GACAX;IAGFb,UAAU;QACR,IAAIyB;QAEJ,yCAAyC;QACzC,IAAIjB,SAASI,eAAe;YAC1Ba,UAAUC,WAAW;gBACnBZ,QAAQF;YACV,GAAGJ;QACL,OAAO;YACLM,QAAQF;QACV;QAEA,OAAO;YACL,IAAIa,SAAS;gBACXE,aAAaF;YACf;QACF;IACF,GAAG;QAACb;QAAeJ;KAAM;IAEzBR,UAAU;QACR,IAAIa,mBAAmB;YACrB;QACF;QACAG,YAAYI,mBAAmBQ,iBAAiB,QAAQ;IAC1D,GAAG;QAACR;QAAmBP;KAAkB;IAEzC,mMAAmM;IACnM,qBACE,QAACd,MAAM8B,QAAQ;;YACZ,CAAChB,mCACA,QAACiB;gBACCC,eAAY;gBACZxB,WAAW;oBAAC;oBAAWA;oBAAW,CAAC,eAAe,EAAEH,YAAY;oBAAE;iBAAwB,CACvF4B,MAAM,CAACC,SACPC,IAAI,CAAC;gBACRf,KAAKA;gBACLgB,OAAO;oBAAEC,SAAS;gBAAI;0BAEtB,cAAA,QAACC;oBAAI9B,WAAU;8BAAmBD;;;;;;;;;;;0BAGtC,QAACwB;gBACCvB,WAAW;oBACT;oBACAA;oBACAI,QAAQ;oBACR,CAAC,eAAe,EAAEP,YAAY;oBAC9B,CAAC,kBAAkB,EAAEM,qBAAqBD,UAAU;iBACrD,CACEuB,MAAM,CAACC,SACPC,IAAI,CAAC;gBACRI,OAAOrB,kBAAkBX;0BAEzB,cAAA,QAAC+B;oBAAI9B,WAAU;8BAAmBD;;;;;;;;;;;;;;;;;AAI1C,EAAC"}
+{"version":3,"file":"index.js","names":["React","useEffect","useIntersect","Tooltip","props","alignCaret","boundingRef","children","className","delay","position","positionFromProps","show","showFromProps","staticPositioning","setShow","useState","setPosition","getTitleAttribute","content","ref","intersectionEntry","root","current","rootMargin","threshold","timerID","setTimeout","clearTimeout","isIntersecting","_jsxs","Fragment","_jsx","filter","Boolean","join","style","opacity","title"],"sources":["../../../src/elements/Tooltip/index.tsx"],"sourcesContent":["'use client'\nimport React, { useEffect } from 'react'\n\nimport { useIntersect } from '../../hooks/useIntersect.js'\nimport './index.scss'\n\nexport type Props = {\n  alignCaret?: 'center' | 'left' | 'right'\n  boundingRef?: React.RefObject<HTMLElement | null>\n  children: React.ReactNode\n  className?: string\n  delay?: number\n  position?: 'bottom' | 'top'\n  show?: boolean\n  /**\n   * If the tooltip position should not change depending on if the toolbar is outside the boundingRef. @default false\n   */\n  staticPositioning?: boolean\n}\n\nexport const Tooltip: React.FC<Props> = (props) => {\n  const {\n    alignCaret = 'center',\n    boundingRef,\n    children,\n    className,\n    delay = 500,\n    position: positionFromProps,\n    show: showFromProps = true,\n    staticPositioning = false,\n  } = props\n\n  const [show, setShow] = React.useState(showFromProps)\n  const [position, setPosition] = React.useState<'bottom' | 'top'>('top')\n\n  const getTitleAttribute = (content) => (typeof content === 'string' ? content : '')\n\n  const [ref, intersectionEntry] = useIntersect(\n    {\n      root: boundingRef?.current || null,\n      rootMargin: '-145px 0px 0px 100px',\n      threshold: 0,\n    },\n    staticPositioning,\n  )\n\n  useEffect(() => {\n    let timerID: NodeJS.Timeout\n\n    // do not use the delay on transition-out\n    if (delay && showFromProps) {\n      timerID = setTimeout(() => {\n        setShow(showFromProps)\n      }, delay)\n    } else {\n      setShow(showFromProps)\n    }\n\n    return () => {\n      if (timerID) {\n        clearTimeout(timerID)\n      }\n    }\n  }, [showFromProps, delay])\n\n  useEffect(() => {\n    if (staticPositioning) {\n      return\n    }\n    setPosition(intersectionEntry?.isIntersecting ? 'top' : 'bottom')\n  }, [intersectionEntry, staticPositioning])\n\n  // The first aside is always on top. The purpose of that is that it can reliably be used for the interaction observer (as it's not moving around), to calculate the position of the actual tooltip.\n  return (\n    <React.Fragment>\n      {!staticPositioning && (\n        <aside\n          aria-hidden=\"true\"\n          className={['tooltip', className, `tooltip--caret-${alignCaret}`, 'tooltip--position-top']\n            .filter(Boolean)\n            .join(' ')}\n          ref={ref}\n          style={{ opacity: '0' }}\n        >\n          <div className=\"tooltip-content\">{children}</div>\n        </aside>\n      )}\n      <aside\n        className={[\n          'tooltip',\n          className,\n          show && 'tooltip--show',\n          `tooltip--caret-${alignCaret}`,\n          `tooltip--position-${positionFromProps || position}`,\n        ]\n          .filter(Boolean)\n          .join(' ')}\n        title={getTitleAttribute(children)}\n      >\n        <div className=\"tooltip-content\">{children}</div>\n      </aside>\n    </React.Fragment>\n  )\n}\n"],"mappings":"AAAA;;;AACA,OAAOA,KAAA,IAASC,SAAS,QAAQ;AAEjC,SAASC,YAAY,QAAQ;AAC7B,OAAO;AAgBP,OAAO,MAAMC,OAAA,GAA4BC,KAAA;EACvC,MAAM;IACJC,UAAA,GAAa,QAAQ;IACrBC,WAAW;IACXC,QAAQ;IACRC,SAAS;IACTC,KAAA,GAAQ,GAAG;IACXC,QAAA,EAAUC,iBAAiB;IAC3BC,IAAA,EAAMC,aAAA,GAAgB,IAAI;IAC1BC,iBAAA,GAAoB;EAAK,CAC1B,GAAGV,KAAA;EAEJ,MAAM,CAACQ,IAAA,EAAMG,OAAA,CAAQ,GAAGf,KAAA,CAAMgB,QAAQ,CAACH,aAAA;EACvC,MAAM,CAACH,QAAA,EAAUO,WAAA,CAAY,GAAGjB,KAAA,CAAMgB,QAAQ,CAAmB;EAEjE,MAAME,iBAAA,GAAqBC,OAAA,IAAa,OAAOA,OAAA,KAAY,WAAWA,OAAA,GAAU;EAEhF,MAAM,CAACC,GAAA,EAAKC,iBAAA,CAAkB,GAAGnB,YAAA,CAC/B;IACEoB,IAAA,EAAMhB,WAAA,EAAaiB,OAAA,IAAW;IAC9BC,UAAA,EAAY;IACZC,SAAA,EAAW;EACb,GACAX,iBAAA;EAGFb,SAAA,CAAU;IACR,IAAIyB,OAAA;IAEJ;IACA,IAAIjB,KAAA,IAASI,aAAA,EAAe;MAC1Ba,OAAA,GAAUC,UAAA,CAAW;QACnBZ,OAAA,CAAQF,aAAA;MACV,GAAGJ,KAAA;IACL,OAAO;MACLM,OAAA,CAAQF,aAAA;IACV;IAEA,OAAO;MACL,IAAIa,OAAA,EAAS;QACXE,YAAA,CAAaF,OAAA;MACf;IACF;EACF,GAAG,CAACb,aAAA,EAAeJ,KAAA,CAAM;EAEzBR,SAAA,CAAU;IACR,IAAIa,iBAAA,EAAmB;MACrB;IACF;IACAG,WAAA,CAAYI,iBAAA,EAAmBQ,cAAA,GAAiB,QAAQ;EAC1D,GAAG,CAACR,iBAAA,EAAmBP,iBAAA,CAAkB;EAEzC;EACA,oBACEgB,KAAA,CAAC9B,KAAA,CAAM+B,QAAQ;eACZ,CAACjB,iBAAA,iBACAkB,IAAA,CAAC;MACC,eAAY;MACZxB,SAAA,EAAW,CAAC,WAAWA,SAAA,EAAW,kBAAkBH,UAAA,EAAY,EAAE,wBAAwB,CACvF4B,MAAM,CAACC,OAAA,EACPC,IAAI,CAAC;MACRf,GAAA,EAAKA,GAAA;MACLgB,KAAA,EAAO;QAAEC,OAAA,EAAS;MAAI;gBAEtB,aAAAL,IAAA,CAAC;QAAIxB,SAAA,EAAU;kBAAmBD;;qBAGtCyB,IAAA,CAAC;MACCxB,SAAA,EAAW,CACT,WACAA,SAAA,EACAI,IAAA,IAAQ,iBACR,kBAAkBP,UAAA,EAAY,EAC9B,qBAAqBM,iBAAA,IAAqBD,QAAA,EAAU,CACrD,CACEuB,MAAM,CAACC,OAAA,EACPC,IAAI,CAAC;MACRG,KAAA,EAAOpB,iBAAA,CAAkBX,QAAA;gBAEzB,aAAAyB,IAAA,CAAC;QAAIxB,SAAA,EAAU;kBAAmBD;;;;AAI1C","ignoreList":[]}

package/dist/elements/Tooltip/index.scss

@@ -33,6 +33,7 @@
       opacity: 1;
       transition: opacity 0.2s ease-in-out;
       cursor: default;
+      z-index: 10000;
     }
 
     &--caret-center {
@@ -83,19 +84,4 @@
       display: none;
     }
   }
-
-  html[data-theme='light'] {
-    .tooltip:not(.field-error) {
-      background-color: var(--theme-elevation-100);
-      color: var(--theme-elevation-1000);
-    }
-
-    .tooltip--position-top:not(.field-error):after {
-      border-top-color: var(--theme-elevation-100);
-    }
-
-    .tooltip--position-bottom:not(.field-error):after {
-      border-bottom-color: var(--theme-elevation-100);
-    }
-  }
 }

package/dist/elements/Translation/index.js

@@ -1,52 +1,43 @@
-import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
-const RecursiveTranslation = ({ elements, translationString })=>{
-    const regex = /(<[^>]+>.*?<\/[^>]+>)/g;
-    const sections = translationString.split(regex);
-    return /*#__PURE__*/ _jsxDEV("span", {
-        children: sections.map((section, index)=>{
-            if (elements && section.startsWith('<') && section.endsWith('>')) {
-                const elementKey = section[1];
-                const Element = elements[elementKey];
-                if (Element) {
-                    const regex = new RegExp(`<${elementKey}>(.*?)<\/${elementKey}>`, 'g');
-                    const children = section.replace(regex, (_, group)=>group);
-                    return /*#__PURE__*/ _jsxDEV(Element, {
-                        children: /*#__PURE__*/ _jsxDEV(RecursiveTranslation, {
-                            translationString: children
-                        }, void 0, false, {
-                            fileName: "src/elements/Translation/index.tsx",
-                            lineNumber: 25,
-                            columnNumber: 17
-                        }, this)
-                    }, index, false, {
-                        fileName: "src/elements/Translation/index.tsx",
-                        lineNumber: 24,
-                        columnNumber: 15
-                    }, this);
-                }
-            }
-            return section;
-        })
-    }, void 0, false, {
-        fileName: "src/elements/Translation/index.tsx",
-        lineNumber: 13,
-        columnNumber: 5
-    }, this);
+const RecursiveTranslation = ({
+  elements,
+  translationString
+}) => {
+  const regex = /(<[^>]+>.*?<\/[^>]+>)/g;
+  const sections = translationString.split(regex);
+  return /*#__PURE__*/_jsx("span", {
+    children: sections.map((section, index) => {
+      if (elements && section.startsWith('<') && section.endsWith('>')) {
+        const elementKey = section[1];
+        const Element = elements[elementKey];
+        if (Element) {
+          const regex = new RegExp(`<${elementKey}>(.*?)<\/${elementKey}>`, 'g');
+          const children = section.replace(regex, (_, group) => group);
+          return /*#__PURE__*/_jsx(Element, {
+            children: /*#__PURE__*/_jsx(RecursiveTranslation, {
+              translationString: children
+            })
+          }, index);
+        }
+      }
+      return section;
+    })
+  });
 };
-export const Translation = ({ elements, i18nKey, t, variables })=>{
-    const stringWithVariables = t(i18nKey, variables || {});
-    if (!elements) {
-        return stringWithVariables;
-    }
-    return /*#__PURE__*/ _jsxDEV(RecursiveTranslation, {
-        elements: elements,
-        translationString: stringWithVariables
-    }, void 0, false, {
-        fileName: "src/elements/Translation/index.tsx",
-        lineNumber: 51,
-        columnNumber: 10
-    }, this);
+export const Translation = ({
+  elements,
+  i18nKey,
+  t,
+  variables
+}) => {
+  const stringWithVariables = t(i18nKey, variables || {});
+  if (!elements) {
+    return stringWithVariables;
+  }
+  return /*#__PURE__*/_jsx(RecursiveTranslation, {
+    elements: elements,
+    translationString: stringWithVariables
+  });
 };
-
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/Translation/index.tsx"],"sourcesContent":["import type { ClientTranslationKeys, TFunction } from '@payloadcms/translations'\n\nimport * as React from 'react'\n\nconst RecursiveTranslation: React.FC<{\n  elements?: Record<string, React.FC<{ children: React.ReactNode }>>\n  translationString: string\n}> = ({ elements, translationString }) => {\n  const regex = /(<[^>]+>.*?<\\/[^>]+>)/g\n  const sections = translationString.split(regex)\n\n  return (\n    <span>\n      {sections.map((section, index) => {\n        if (elements && section.startsWith('<') && section.endsWith('>')) {\n          const elementKey = section[1]\n          const Element = elements[elementKey]\n\n          if (Element) {\n            const regex = new RegExp(`<${elementKey}>(.*?)<\\/${elementKey}>`, 'g')\n            const children = section.replace(regex, (_, group) => group)\n\n            return (\n              <Element key={index}>\n                <RecursiveTranslation translationString={children} />\n              </Element>\n            )\n          }\n        }\n\n        return section\n      })}\n    </span>\n  )\n}\n\nexport type TranslationProps = {\n  elements?: Record<string, React.FC<{ children: React.ReactNode }>>\n  i18nKey: ClientTranslationKeys\n  t: TFunction\n  variables?: Record<string, unknown>\n}\n\nexport const Translation: React.FC<TranslationProps> = ({ elements, i18nKey, t, variables }) => {\n  const stringWithVariables = t(i18nKey, variables || {})\n\n  if (!elements) {\n    return stringWithVariables\n  }\n\n  return <RecursiveTranslation elements={elements} translationString={stringWithVariables} />\n}\n"],"names":["React","RecursiveTranslation","elements","translationString","regex","sections","split","span","map","section","index","startsWith","endsWith","elementKey","Element","RegExp","children","replace","_","group","Translation","i18nKey","t","variables","stringWithVariables"],"mappings":";AAEA,YAAYA,WAAW,QAAO;AAE9B,MAAMC,uBAGD,CAAC,EAAEC,QAAQ,EAAEC,iBAAiB,EAAE;IACnC,MAAMC,QAAQ;IACd,MAAMC,WAAWF,kBAAkBG,KAAK,CAACF;IAEzC,qBACE,QAACG;kBACEF,SAASG,GAAG,CAAC,CAACC,SAASC;YACtB,IAAIR,YAAYO,QAAQE,UAAU,CAAC,QAAQF,QAAQG,QAAQ,CAAC,MAAM;gBAChE,MAAMC,aAAaJ,OAAO,CAAC,EAAE;gBAC7B,MAAMK,UAAUZ,QAAQ,CAACW,WAAW;gBAEpC,IAAIC,SAAS;oBACX,MAAMV,QAAQ,IAAIW,OAAO,CAAC,CAAC,EAAEF,WAAW,SAAS,EAAEA,WAAW,CAAC,CAAC,EAAE;oBAClE,MAAMG,WAAWP,QAAQQ,OAAO,CAACb,OAAO,CAACc,GAAGC,QAAUA;oBAEtD,qBACE,QAACL;kCACC,cAAA,QAACb;4BAAqBE,mBAAmBa;;;;;;uBAD7BN;;;;;gBAIlB;YACF;YAEA,OAAOD;QACT;;;;;;AAGN;AASA,OAAO,MAAMW,cAA0C,CAAC,EAAElB,QAAQ,EAAEmB,OAAO,EAAEC,CAAC,EAAEC,SAAS,EAAE;IACzF,MAAMC,sBAAsBF,EAAED,SAASE,aAAa,CAAC;IAErD,IAAI,CAACrB,UAAU;QACb,OAAOsB;IACT;IAEA,qBAAO,QAACvB;QAAqBC,UAAUA;QAAUC,mBAAmBqB;;;;;;AACtE,EAAC"}
+{"version":3,"file":"index.js","names":["React","RecursiveTranslation","elements","translationString","regex","sections","split","_jsx","map","section","index","startsWith","endsWith","elementKey","Element","RegExp","children","replace","_","group","Translation","i18nKey","t","variables","stringWithVariables"],"sources":["../../../src/elements/Translation/index.tsx"],"sourcesContent":["import type { ClientTranslationKeys, TFunction } from '@payloadcms/translations'\n\nimport * as React from 'react'\n\nconst RecursiveTranslation: React.FC<{\n  elements?: Record<string, React.FC<{ children: React.ReactNode }>>\n  translationString: string\n}> = ({ elements, translationString }) => {\n  const regex = /(<[^>]+>.*?<\\/[^>]+>)/g\n  const sections = translationString.split(regex)\n\n  return (\n    <span>\n      {sections.map((section, index) => {\n        if (elements && section.startsWith('<') && section.endsWith('>')) {\n          const elementKey = section[1]\n          const Element = elements[elementKey]\n\n          if (Element) {\n            const regex = new RegExp(`<${elementKey}>(.*?)<\\/${elementKey}>`, 'g')\n            const children = section.replace(regex, (_, group) => group)\n\n            return (\n              <Element key={index}>\n                <RecursiveTranslation translationString={children} />\n              </Element>\n            )\n          }\n        }\n\n        return section\n      })}\n    </span>\n  )\n}\n\nexport type TranslationProps = {\n  elements?: Record<string, React.FC<{ children: React.ReactNode }>>\n  i18nKey: ClientTranslationKeys\n  t: TFunction\n  variables?: Record<string, unknown>\n}\n\nexport const Translation: React.FC<TranslationProps> = ({ elements, i18nKey, t, variables }) => {\n  const stringWithVariables = t(i18nKey, variables || {})\n\n  if (!elements) {\n    return stringWithVariables\n  }\n\n  return <RecursiveTranslation elements={elements} translationString={stringWithVariables} />\n}\n"],"mappings":";AAEA,YAAYA,KAAA,MAAW;AAEvB,MAAMC,oBAAA,GAGDA,CAAC;EAAEC,QAAQ;EAAEC;AAAiB,CAAE;EACnC,MAAMC,KAAA,GAAQ;EACd,MAAMC,QAAA,GAAWF,iBAAA,CAAkBG,KAAK,CAACF,KAAA;EAEzC,oBACEG,IAAA,CAAC;cACEF,QAAA,CAASG,GAAG,CAAC,CAACC,OAAA,EAASC,KAAA;MACtB,IAAIR,QAAA,IAAYO,OAAA,CAAQE,UAAU,CAAC,QAAQF,OAAA,CAAQG,QAAQ,CAAC,MAAM;QAChE,MAAMC,UAAA,GAAaJ,OAAO,CAAC,EAAE;QAC7B,MAAMK,OAAA,GAAUZ,QAAQ,CAACW,UAAA,CAAW;QAEpC,IAAIC,OAAA,EAAS;UACX,MAAMV,KAAA,GAAQ,IAAIW,MAAA,CAAO,IAAIF,UAAA,YAAsBA,UAAA,GAAa,EAAE;UAClE,MAAMG,QAAA,GAAWP,OAAA,CAAQQ,OAAO,CAACb,KAAA,EAAO,CAACc,CAAA,EAAGC,KAAA,KAAUA,KAAA;UAEtD,oBACEZ,IAAA,CAACO,OAAA;sBACC,aAAAP,IAAA,CAACN,oBAAA;cAAqBE,iBAAA,EAAmBa;;aAD7BN,KAAA;QAIlB;MACF;MAEA,OAAOD,OAAA;IACT;;AAGN;AASA,OAAO,MAAMW,WAAA,GAA0CA,CAAC;EAAElB,QAAQ;EAAEmB,OAAO;EAAEC,CAAC;EAAEC;AAAS,CAAE;EACzF,MAAMC,mBAAA,GAAsBF,CAAA,CAAED,OAAA,EAASE,SAAA,IAAa,CAAC;EAErD,IAAI,CAACrB,QAAA,EAAU;IACb,OAAOsB,mBAAA;EACT;EAEA,oBAAOjB,IAAA,CAACN,oBAAA;IAAqBC,QAAA,EAAUA,QAAA;IAAUC,iBAAA,EAAmBqB;;AACtE","ignoreList":[]}

package/dist/elements/TrashBanner/index.js

@@ -1,5 +1,6 @@
 'use client';
-import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
+
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { getTranslation } from '@payloadcms/translations';
 import React from 'react';
 import { TrashIcon } from '../../icons/Trash/index.js';
@@ -8,37 +9,29 @@ import { useDocumentInfo } from '../../providers/DocumentInfo/index.js';
 import { useTranslation } from '../../providers/Translation/index.js';
 import './index.scss';
 const baseClass = 'trash-banner';
-export const TrashBanner = ()=>{
-    const { getEntityConfig } = useConfig();
-    const { collectionSlug } = useDocumentInfo();
-    const collectionConfig = getEntityConfig({
-        collectionSlug
-    });
-    const { labels } = collectionConfig;
-    const { i18n } = useTranslation();
-    return /*#__PURE__*/ _jsxDEV("div", {
-        className: baseClass,
-        children: [
-            /*#__PURE__*/ _jsxDEV(TrashIcon, {}, void 0, false, {
-                fileName: "src/elements/TrashBanner/index.tsx",
-                lineNumber: 23,
-                columnNumber: 7
-            }, this),
-            /*#__PURE__*/ _jsxDEV("p", {
-                children: i18n.t('general:documentIsTrashed', {
-                    label: `${getTranslation(labels?.singular, i18n)}`
-                })
-            }, void 0, false, {
-                fileName: "src/elements/TrashBanner/index.tsx",
-                lineNumber: 24,
-                columnNumber: 7
-            }, this)
-        ]
-    }, void 0, true, {
-        fileName: "src/elements/TrashBanner/index.tsx",
-        lineNumber: 22,
-        columnNumber: 5
-    }, this);
+export const TrashBanner = () => {
+  const {
+    getEntityConfig
+  } = useConfig();
+  const {
+    collectionSlug
+  } = useDocumentInfo();
+  const collectionConfig = getEntityConfig({
+    collectionSlug
+  });
+  const {
+    labels
+  } = collectionConfig;
+  const {
+    i18n
+  } = useTranslation();
+  return _jsxs("div", {
+    className: baseClass,
+    children: [_jsx(TrashIcon, {}), _jsx("p", {
+      children: i18n.t("general:documentIsTrashed", {
+        label: `${getTranslation(labels?.singular, i18n)}`
+      })
+    })]
+  });
 };
-
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/TrashBanner/index.tsx"],"sourcesContent":["'use client'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport React from 'react'\n\nimport { TrashIcon } from '../../icons/Trash/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport './index.scss'\n\nconst baseClass = 'trash-banner'\n\nexport const TrashBanner: React.FC = () => {\n  const { getEntityConfig } = useConfig()\n  const { collectionSlug } = useDocumentInfo()\n  const collectionConfig = getEntityConfig({ collectionSlug })\n\n  const { labels } = collectionConfig\n  const { i18n } = useTranslation()\n  return (\n    <div className={baseClass}>\n      <TrashIcon />\n      <p>\n        {i18n.t('general:documentIsTrashed', {\n          label: `${getTranslation(labels?.singular, i18n)}`,\n        })}\n      </p>\n    </div>\n  )\n}\n"],"names":["getTranslation","React","TrashIcon","useConfig","useDocumentInfo","useTranslation","baseClass","TrashBanner","getEntityConfig","collectionSlug","collectionConfig","labels","i18n","div","className","p","t","label","singular"],"mappings":"AAAA;;AAEA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,OAAOC,WAAW,QAAO;AAEzB,SAASC,SAAS,QAAQ,6BAA4B;AACtD,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,SAASC,eAAe,QAAQ,wCAAuC;AACvE,SAASC,cAAc,QAAQ,uCAAsC;AACrE,OAAO,eAAc;AAErB,MAAMC,YAAY;AAElB,OAAO,MAAMC,cAAwB;IACnC,MAAM,EAAEC,eAAe,EAAE,GAAGL;IAC5B,MAAM,EAAEM,cAAc,EAAE,GAAGL;IAC3B,MAAMM,mBAAmBF,gBAAgB;QAAEC;IAAe;IAE1D,MAAM,EAAEE,MAAM,EAAE,GAAGD;IACnB,MAAM,EAAEE,IAAI,EAAE,GAAGP;IACjB,qBACE,QAACQ;QAAIC,WAAWR;;0BACd,QAACJ;;;;;0BACD,QAACa;0BACEH,KAAKI,CAAC,CAAC,6BAA6B;oBACnCC,OAAO,GAAGjB,eAAeW,QAAQO,UAAUN,OAAO;gBACpD;;;;;;;;;;;;AAIR,EAAC"}
+{"version":3,"file":"index.js","names":["getTranslation","React","TrashIcon","useConfig","useDocumentInfo","useTranslation","baseClass","TrashBanner","getEntityConfig","collectionSlug","collectionConfig","labels","i18n","_jsxs","className","children","_jsx","t","label","singular"],"sources":["../../../src/elements/TrashBanner/index.tsx"],"sourcesContent":["'use client'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport React from 'react'\n\nimport { TrashIcon } from '../../icons/Trash/index.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport './index.scss'\n\nconst baseClass = 'trash-banner'\n\nexport const TrashBanner: React.FC = () => {\n  const { getEntityConfig } = useConfig()\n  const { collectionSlug } = useDocumentInfo()\n  const collectionConfig = getEntityConfig({ collectionSlug })\n\n  const { labels } = collectionConfig\n  const { i18n } = useTranslation()\n  return (\n    <div className={baseClass}>\n      <TrashIcon />\n      <p>\n        {i18n.t('general:documentIsTrashed', {\n          label: `${getTranslation(labels?.singular, i18n)}`,\n        })}\n      </p>\n    </div>\n  )\n}\n"],"mappings":"AAAA;;;AAEA,SAASA,cAAc,QAAQ;AAC/B,OAAOC,KAAA,MAAW;AAElB,SAASC,SAAS,QAAQ;AAC1B,SAASC,SAAS,QAAQ;AAC1B,SAASC,eAAe,QAAQ;AAChC,SAASC,cAAc,QAAQ;AAC/B,OAAO;AAEP,MAAMC,SAAA,GAAY;AAElB,OAAO,MAAMC,WAAA,GAAwBA,CAAA;EACnC;IAAAC;EAAA,IAA4BL,SAAA;EAC5B;IAAAM;EAAA,IAA2BL,eAAA;EAC3B,MAAAM,gBAAA,GAAyBF,eAAA;IAAAC;EAAA,CAAiC;EAE1D;IAAAE;EAAA,IAAmBD,gBAAA;EACnB;IAAAE;EAAA,IAAiBP,cAAA;EAAA,OAEfQ,KAAA,CAAC;IAAAC,SAAA,EAAAR,SAAA;IAAAS,QAAA,GACCC,IAAA,CAAAd,SAAA,IAAC,GACDc,IAAA,CAAC;MAAAD,QAAA,EACEH,IAAA,CAAAK,CAAA,CAAO;QAAAC,KAAA,EACC,GAAGlB,cAAA,CAAeW,MAAA,EAAAQ,QAAA,EAAkBP,IAAA;MAAO,CACpD;IAAA,C;;CAIR","ignoreList":[]}

package/dist/elements/Tree/LoadMore/LoadMoreButton.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+type LoadMoreButtonProps = {
+    id: string;
+    onLoadMore: (() => Promise<void>) | (() => void);
+};
+export declare const LoadMoreButton: React.FC<LoadMoreButtonProps>;
+export {};
+//# sourceMappingURL=LoadMoreButton.d.ts.map

package/dist/elements/Tree/LoadMore/LoadMoreButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoadMoreButton.d.ts","sourceRoot":"","sources":["../../../../src/elements/Tree/LoadMore/LoadMoreButton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA8B,MAAM,OAAO,CAAA;AAKlD,KAAK,mBAAmB,GAAG;IACzB,EAAE,EAAE,MAAM,CAAA;IACV,UAAU,EAAE,CAAC,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,MAAM,IAAI,CAAC,CAAA;CACjD,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAyBxD,CAAA"}

package/dist/elements/Tree/LoadMore/LoadMoreButton.js

@@ -0,0 +1,36 @@
+'use client';
+
+import { jsx as _jsx } from "react/jsx-runtime";
+import React, { useCallback, useRef } from 'react';
+import { useTranslation } from '../../../providers/Translation/index.js';
+import { useFocusableItem } from '../TreeFocusContext.js';
+export const LoadMoreButton = ({
+  id,
+  onLoadMore
+}) => {
+  const {
+    t
+  } = useTranslation();
+  const buttonRef = useRef(null);
+  const {
+    handleFocus,
+    tabIndex
+  } = useFocusableItem({
+    id,
+    type: 'load-more',
+    ref: buttonRef
+  });
+  const handleClick = useCallback(async () => {
+    await onLoadMore();
+  }, [onLoadMore]);
+  return /*#__PURE__*/_jsx("button", {
+    className: "tree__load-more-button",
+    onClick: handleClick,
+    onFocus: handleFocus,
+    ref: buttonRef,
+    tabIndex: tabIndex,
+    type: "button",
+    children: t('general:loadMore')
+  });
+};
+//# sourceMappingURL=LoadMoreButton.js.map

package/dist/elements/Tree/LoadMore/LoadMoreButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoadMoreButton.js","names":["React","useCallback","useRef","useTranslation","useFocusableItem","LoadMoreButton","id","onLoadMore","t","buttonRef","handleFocus","tabIndex","type","ref","handleClick","_jsx","className","onClick","onFocus"],"sources":["../../../../src/elements/Tree/LoadMore/LoadMoreButton.tsx"],"sourcesContent":["'use client'\n\nimport React, { useCallback, useRef } from 'react'\n\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport { useFocusableItem } from '../TreeFocusContext.js'\n\ntype LoadMoreButtonProps = {\n  id: string\n  onLoadMore: (() => Promise<void>) | (() => void)\n}\n\nexport const LoadMoreButton: React.FC<LoadMoreButtonProps> = ({ id, onLoadMore }) => {\n  const { t } = useTranslation()\n  const buttonRef = useRef<HTMLButtonElement>(null)\n  const { handleFocus, tabIndex } = useFocusableItem({\n    id,\n    type: 'load-more',\n    ref: buttonRef,\n  })\n\n  const handleClick = useCallback(async () => {\n    await onLoadMore()\n  }, [onLoadMore])\n\n  return (\n    <button\n      className=\"tree__load-more-button\"\n      onClick={handleClick}\n      onFocus={handleFocus}\n      ref={buttonRef}\n      tabIndex={tabIndex}\n      type=\"button\"\n    >\n      {t('general:loadMore')}\n    </button>\n  )\n}\n"],"mappings":"AAAA;;;AAEA,OAAOA,KAAA,IAASC,WAAW,EAAEC,MAAM,QAAQ;AAE3C,SAASC,cAAc,QAAQ;AAC/B,SAASC,gBAAgB,QAAQ;AAOjC,OAAO,MAAMC,cAAA,GAAgDA,CAAC;EAAEC,EAAE;EAAEC;AAAU,CAAE;EAC9E,MAAM;IAAEC;EAAC,CAAE,GAAGL,cAAA;EACd,MAAMM,SAAA,GAAYP,MAAA,CAA0B;EAC5C,MAAM;IAAEQ,WAAW;IAAEC;EAAQ,CAAE,GAAGP,gBAAA,CAAiB;IACjDE,EAAA;IACAM,IAAA,EAAM;IACNC,GAAA,EAAKJ;EACP;EAEA,MAAMK,WAAA,GAAcb,WAAA,CAAY;IAC9B,MAAMM,UAAA;EACR,GAAG,CAACA,UAAA,CAAW;EAEf,oBACEQ,IAAA,CAAC;IACCC,SAAA,EAAU;IACVC,OAAA,EAASH,WAAA;IACTI,OAAA,EAASR,WAAA;IACTG,GAAA,EAAKJ,SAAA;IACLE,QAAA,EAAUA,QAAA;IACVC,IAAA,EAAK;cAEJJ,CAAA,CAAE;;AAGT","ignoreList":[]}

package/dist/elements/Tree/LoadMore/index.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import './index.scss';
+type LoadMoreProps = {
+    currentCount: number;
+    depth: number;
+    id: string;
+    onLoadMore: (() => Promise<void>) | (() => void);
+    totalDocs: number;
+};
+export declare const LoadMore: React.FC<LoadMoreProps>;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/elements/Tree/LoadMore/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/Tree/LoadMore/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,cAAc,CAAA;AAErB,KAAK,aAAa,GAAG;IACnB,YAAY,EAAE,MAAM,CAAA;IACpB,KAAK,EAAE,MAAM,CAAA;IACb,EAAE,EAAE,MAAM,CAAA;IACV,UAAU,EAAE,CAAC,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,MAAM,IAAI,CAAC,CAAA;IAChD,SAAS,EAAE,MAAM,CAAA;CAClB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAiB5C,CAAA"}

package/dist/elements/Tree/LoadMore/index.js

@@ -0,0 +1,29 @@
+'use client';
+
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
+import { LoadMoreRow } from '../../LoadMoreRow/index.js';
+import { LoadMoreButton } from './LoadMoreButton.js';
+import './index.scss';
+export const LoadMore = ({
+  id,
+  currentCount,
+  depth,
+  onLoadMore,
+  totalDocs
+}) => {
+  return /*#__PURE__*/_jsx(LoadMoreRow, {
+    className: "tree__load-more",
+    currentCount: currentCount,
+    hasMore: currentCount < totalDocs,
+    loadMoreButton: /*#__PURE__*/_jsx(LoadMoreButton, {
+      id: id,
+      onLoadMore: onLoadMore
+    }),
+    style: {
+      '--tree-depth': depth
+    },
+    totalDocs: totalDocs
+  });
+};
+//# sourceMappingURL=index.js.map

package/dist/elements/Tree/LoadMore/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["React","LoadMoreRow","LoadMoreButton","LoadMore","id","currentCount","depth","onLoadMore","totalDocs","_jsx","className","hasMore","loadMoreButton","style"],"sources":["../../../../src/elements/Tree/LoadMore/index.tsx"],"sourcesContent":["'use client'\n\nimport React from 'react'\n\nimport { LoadMoreRow } from '../../LoadMoreRow/index.js'\nimport { LoadMoreButton } from './LoadMoreButton.js'\nimport './index.scss'\n\ntype LoadMoreProps = {\n  currentCount: number\n  depth: number\n  id: string\n  onLoadMore: (() => Promise<void>) | (() => void)\n  totalDocs: number\n}\n\nexport const LoadMore: React.FC<LoadMoreProps> = ({\n  id,\n  currentCount,\n  depth,\n  onLoadMore,\n  totalDocs,\n}) => {\n  return (\n    <LoadMoreRow\n      className=\"tree__load-more\"\n      currentCount={currentCount}\n      hasMore={currentCount < totalDocs}\n      loadMoreButton={<LoadMoreButton id={id} onLoadMore={onLoadMore} />}\n      style={{ '--tree-depth': depth } as React.CSSProperties}\n      totalDocs={totalDocs}\n    />\n  )\n}\n"],"mappings":"AAAA;;;AAEA,OAAOA,KAAA,MAAW;AAElB,SAASC,WAAW,QAAQ;AAC5B,SAASC,cAAc,QAAQ;AAC/B,OAAO;AAUP,OAAO,MAAMC,QAAA,GAAoCA,CAAC;EAChDC,EAAE;EACFC,YAAY;EACZC,KAAK;EACLC,UAAU;EACVC;AAAS,CACV;EACC,oBACEC,IAAA,CAACR,WAAA;IACCS,SAAA,EAAU;IACVL,YAAA,EAAcA,YAAA;IACdM,OAAA,EAASN,YAAA,GAAeG,SAAA;IACxBI,cAAA,eAAgBH,IAAA,CAACP,cAAA;MAAeE,EAAA,EAAIA,EAAA;MAAIG,UAAA,EAAYA;;IACpDM,KAAA,EAAO;MAAE,gBAAgBP;IAAM;IAC/BE,SAAA,EAAWA;;AAGjB","ignoreList":[]}

package/dist/elements/Tree/LoadMore/index.scss

@@ -0,0 +1,26 @@
+// Tree-specific overrides for the shared LoadMoreRow component
+
+.tree__load-more.load-more-row {
+  padding: var(--tree-node-padding-y) var(--tree-node-padding-x);
+  padding-left: calc(var(--tree-depth, 0) * var(--tree-indent));
+  height: var(--tree-node-content-height);
+  position: relative;
+  margin-bottom: var(--tree-row-gap);
+  padding-top: 0;
+
+  .load-more-row__connector {
+    margin-left: 2px;
+  }
+}
+
+// Tree-specific button styling (uses native button for focus management)
+.tree__load-more-button {
+  background: none;
+  border: none;
+  padding: 0;
+  color: var(--theme-text);
+  font-size: inherit;
+  font-family: inherit;
+  cursor: pointer;
+  text-decoration: underline;
+}

package/dist/elements/Tree/TreeConnector.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+type TreeConnectorProps = {
+    className?: string;
+};
+export declare const TreeConnector: React.FC<TreeConnectorProps>;
+export {};
+//# sourceMappingURL=TreeConnector.d.ts.map

package/dist/elements/Tree/TreeConnector.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TreeConnector.d.ts","sourceRoot":"","sources":["../../../src/elements/Tree/TreeConnector.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,KAAK,kBAAkB,GAAG;IACxB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAkBtD,CAAA"}

package/dist/elements/Tree/TreeConnector.js

@@ -0,0 +1,23 @@
+'use client';
+
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
+export const TreeConnector = ({
+  className
+}) => {
+  return /*#__PURE__*/_jsx("svg", {
+    className: className,
+    fill: "none",
+    height: "9",
+    viewBox: "0 0 9 9",
+    width: "9",
+    xmlns: "http://www.w3.org/2000/svg",
+    children: /*#__PURE__*/_jsx("path", {
+      d: "M7.59062 7.83333H3.16667C2.45942 7.83333 1.78115 7.55238 1.28105 7.05229C0.780951 6.55219 0.5 5.87391 0.5 5.16667V0.5",
+      stroke: "currentColor",
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    })
+  });
+};
+//# sourceMappingURL=TreeConnector.js.map

package/dist/elements/Tree/TreeConnector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TreeConnector.js","names":["React","TreeConnector","className","_jsx","fill","height","viewBox","width","xmlns","d","stroke","strokeLinecap","strokeLinejoin"],"sources":["../../../src/elements/Tree/TreeConnector.tsx"],"sourcesContent":["'use client'\n\nimport React from 'react'\n\ntype TreeConnectorProps = {\n  className?: string\n}\n\nexport const TreeConnector: React.FC<TreeConnectorProps> = ({ className }) => {\n  return (\n    <svg\n      className={className}\n      fill=\"none\"\n      height=\"9\"\n      viewBox=\"0 0 9 9\"\n      width=\"9\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <path\n        d=\"M7.59062 7.83333H3.16667C2.45942 7.83333 1.78115 7.55238 1.28105 7.05229C0.780951 6.55219 0.5 5.87391 0.5 5.16667V0.5\"\n        stroke=\"currentColor\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n    </svg>\n  )\n}\n"],"mappings":"AAAA;;;AAEA,OAAOA,KAAA,MAAW;AAMlB,OAAO,MAAMC,aAAA,GAA8CA,CAAC;EAAEC;AAAS,CAAE;EACvE,oBACEC,IAAA,CAAC;IACCD,SAAA,EAAWA,SAAA;IACXE,IAAA,EAAK;IACLC,MAAA,EAAO;IACPC,OAAA,EAAQ;IACRC,KAAA,EAAM;IACNC,KAAA,EAAM;cAEN,aAAAL,IAAA,CAAC;MACCM,CAAA,EAAE;MACFC,MAAA,EAAO;MACPC,aAAA,EAAc;MACdC,cAAA,EAAe;;;AAIvB","ignoreList":[]}