@lax-wp/design-system 0.13.33-beta.2 → 0.13.33-beta.3

package/dist/components/data-display/infinite-table/body/cell/LoaderCell.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"LoaderCell.cjs.js","sources":["../../../../../../src/components/data-display/infinite-table/body/cell/LoaderCell.tsx"],"sourcesContent":["import cn from 'classnames';\nimport React from 'react';\n\nimport { CELL_DEFAULT_RIGHT_OFFSET } from '../../constants';\n\ntype TProps = {\n  cell: {\n    column: {\n      width: number;\n      sticky?: boolean;\n      sequence?: number;\n    };\n  };\n  id: string | number;\n  nextWidthSum: number;\n  isLastCell: boolean;\n  rowHovering: string | number | null;\n  index: number;\n  isFirstStickyCell: boolean;\n};\n\nconst _LoaderCell: React.FC<TProps> = ({ cell, id, nextWidthSum, isLastCell, rowHovering, index, isFirstStickyCell }) => {\n  const isSticky = cell?.column?.sticky;\n\n  const cellClasses = cn('relative h-row', {\n    'bg-neutral-100 dark:bg-black-600': rowHovering === id,\n    'sticky left-0 bg-white dark:bg-black-600': isSticky,\n    'w-full': isLastCell,\n  });\n\n  const contentClasses = cn(\n    'h-row top-0 font-medium font-inter overflow-x-hidden overflow-y-auto whitespace-nowrap text-ellipsis px-4 w-full absolute flex items-center',\n    {\n      'bg-white dark:bg-black-800 border-b border-neutral-200 dark:border-black-700': isSticky,\n    },\n  );\n\n  const boxShadowStyle =\n    isSticky && isFirstStickyCell\n      ? { boxShadow: '-8px 0px 8px rgba(0, 0, 0, 0.02)' }\n      : {};\n\n  const cellStyle = {\n    minWidth: `${cell.column.width}px`,\n    maxWidth: `${cell.column.width}px`,\n    right: isSticky ? `${nextWidthSum}px` : CELL_DEFAULT_RIGHT_OFFSET,\n  };\n\n  return (\n    <td key={index} className={cellClasses} role='cell' style={cellStyle}>\n      <div className={contentClasses} style={boxShadowStyle}>\n        <div className='skeleton bg-neutral-200 dark:bg-black-600 animate-pulse h-4 min-w-[100px] w-full rounded' />\n      </div>\n    </td>\n  );\n};\n\nexport const LoaderCell = React.memo(_LoaderCell);\n"],"names":["_LoaderCell","cell","id","nextWidthSum","isLastCell","rowHovering","index","isFirstStickyCell","isSticky","cellClasses","cn","contentClasses","boxShadowStyle","cellStyle","CELL_DEFAULT_RIGHT_OFFSET","jsx","LoaderCell","React"],"mappings":"8NAqBMA,EAAgC,CAAC,CAAE,KAAAC,EAAM,GAAAC,EAAI,aAAAC,EAAc,WAAAC,EAAY,YAAAC,EAAA,MAAaC,EAAO,kBAAAC,KAAwB,CACvH,MAAMC,EAAWP,GAAM,QAAQ,OAEzBQ,EAAcC,EAAG,iBAAkB,CACvC,mCAAoCL,IAAgBH,EACpD,2CAA4CM,EAC5C,SAAUJ,CAAA,CACX,EAEKO,EAAiBD,EACrB,8IACA,CACE,+EAAgFF,CAAA,CAClF,EAGII,EACJJ,GAAYD,EACR,CAAE,UAAW,kCAAA,EACb,CAAA,EAEAM,EAAY,CAChB,SAAU,GAAGZ,EAAK,OAAO,KAAK,KAC9B,SAAU,GAAGA,EAAK,OAAO,KAAK,KAC9B,MAAOO,EAAW,GAAGL,CAAY,KAAOW,EAAAA,yBAAA,EAG1C,OACEC,MAAC,MAAe,UAAWN,EAAa,KAAK,OAAO,MAAOI,EACzD,SAAAE,EAAAA,IAAC,MAAA,CAAI,UAAWJ,EAAgB,MAAOC,EACrC,SAAAG,EAAAA,IAAC,MAAA,CAAI,UAAU,0FAAA,CAA2F,EAC5G,GAHOT,CAIT,CAEJ,EAEaU,EAAaC,EAAM,KAAKjB,CAAW"}
+{"version":3,"file":"LoaderCell.cjs.js","sources":["../../../../../../src/components/data-display/infinite-table/body/cell/LoaderCell.tsx"],"sourcesContent":["import cn from 'classnames';\nimport React from 'react';\n\ntype TProps = {\n  cell: {\n    column: {\n      width: number;\n      sticky?: boolean;\n      sequence?: number;\n    };\n  };\n  id: string | number;\n  nextWidthSum: number;\n  isLastCell: boolean;\n  rowHovering: string | number | null;\n  index: number;\n  isFirstStickyCell: boolean;\n};\n\nconst _LoaderCell: React.FC<TProps> = ({ cell, id, nextWidthSum, isLastCell, rowHovering, index, isFirstStickyCell }) => {\n  const isSticky = cell?.column?.sticky;\n\n  const cellClasses = cn('relative h-10', {\n    'bg-neutral-100 dark:bg-black-600': rowHovering === id,\n    'sticky left-0 bg-white dark:bg-black-600': isSticky,\n    'w-full': isLastCell,\n  });\n\n  const contentClasses = cn(\n    'h-10 top-0 font-medium font-inter overflow-x-hidden overflow-y-auto whitespace-nowrap text-ellipsis px-4 w-full absolute flex items-center',\n    {\n      'bg-white dark:bg-black-800 border-b border-neutral-200 dark:border-black-700': isSticky,\n    },\n  );\n\n  const boxShadowStyle =\n    isSticky && isFirstStickyCell\n      ? { boxShadow: '-8px 0px 8px rgba(0, 0, 0, 0.02)' }\n      : {};\n\n  const cellStyle = {\n    minWidth: `${cell.column.width}px`,\n    maxWidth: `${cell.column.width}px`,\n    right: isSticky ? `${nextWidthSum}px` : '0px',\n  };\n\n  return (\n    <td key={index} className={cellClasses} role='cell' style={cellStyle}>\n      <div className={contentClasses} style={boxShadowStyle}>\n        <div className='skeleton bg-neutral-200 dark:bg-black-600 animate-pulse h-4 min-w-[100px] w-full rounded' />\n      </div>\n    </td>\n  );\n};\n\nexport const LoaderCell = React.memo(_LoaderCell);\n"],"names":["_LoaderCell","cell","id","nextWidthSum","isLastCell","rowHovering","index","isFirstStickyCell","isSticky","cellClasses","cn","contentClasses","boxShadowStyle","cellStyle","jsx","LoaderCell","React"],"mappings":"0LAmBMA,EAAgC,CAAC,CAAE,KAAAC,EAAM,GAAAC,EAAI,aAAAC,EAAc,WAAAC,EAAY,YAAAC,EAAA,MAAaC,EAAO,kBAAAC,KAAwB,CACvH,MAAMC,EAAWP,GAAM,QAAQ,OAEzBQ,EAAcC,EAAG,gBAAiB,CACtC,mCAAoCL,IAAgBH,EACpD,2CAA4CM,EAC5C,SAAUJ,CAAA,CACX,EAEKO,EAAiBD,EACrB,6IACA,CACE,+EAAgFF,CAAA,CAClF,EAGII,EACJJ,GAAYD,EACR,CAAE,UAAW,kCAAA,EACb,CAAA,EAEAM,EAAY,CAChB,SAAU,GAAGZ,EAAK,OAAO,KAAK,KAC9B,SAAU,GAAGA,EAAK,OAAO,KAAK,KAC9B,MAAOO,EAAW,GAAGL,CAAY,KAAO,KAAA,EAG1C,OACEW,MAAC,MAAe,UAAWL,EAAa,KAAK,OAAO,MAAOI,EACzD,SAAAC,EAAAA,IAAC,MAAA,CAAI,UAAWH,EAAgB,MAAOC,EACrC,SAAAE,EAAAA,IAAC,MAAA,CAAI,UAAU,0FAAA,CAA2F,EAC5G,GAHOR,CAIT,CAEJ,EAEaS,EAAaC,EAAM,KAAKhB,CAAW"}

package/dist/components/data-display/infinite-table/body/cell/LoaderCell.es.js

@@ -1,25 +1,24 @@
 import { jsx as l } from "react/jsx-runtime";
 import o from "../../../../../_virtual/index.es.js";
-import h from "react";
-import { CELL_DEFAULT_RIGHT_OFFSET as w } from "../../constants.es.js";
-const x = ({ cell: t, id: r, nextWidthSum: a, isLastCell: s, rowHovering: i, index: n, isFirstStickyCell: c }) => {
-  const e = t?.column?.sticky, d = o("relative h-row", {
-    "bg-neutral-100 dark:bg-black-600": i === r,
+import x from "react";
+const h = ({ cell: t, id: r, nextWidthSum: a, isLastCell: s, rowHovering: n, index: c, isFirstStickyCell: i }) => {
+  const e = t?.column?.sticky, d = o("relative h-10", {
+    "bg-neutral-100 dark:bg-black-600": n === r,
     "sticky left-0 bg-white dark:bg-black-600": e,
     "w-full": s
-  }), m = o(
-    "h-row top-0 font-medium font-inter overflow-x-hidden overflow-y-auto whitespace-nowrap text-ellipsis px-4 w-full absolute flex items-center",
+  }), b = o(
+    "h-10 top-0 font-medium font-inter overflow-x-hidden overflow-y-auto whitespace-nowrap text-ellipsis px-4 w-full absolute flex items-center",
     {
       "bg-white dark:bg-black-800 border-b border-neutral-200 dark:border-black-700": e
     }
-  ), b = e && c ? { boxShadow: "-8px 0px 8px rgba(0, 0, 0, 0.02)" } : {}, p = {
+  ), m = e && i ? { boxShadow: "-8px 0px 8px rgba(0, 0, 0, 0.02)" } : {}, p = {
     minWidth: `${t.column.width}px`,
     maxWidth: `${t.column.width}px`,
-    right: e ? `${a}px` : w
+    right: e ? `${a}px` : "0px"
   };
-  return /* @__PURE__ */ l("td", { className: d, role: "cell", style: p, children: /* @__PURE__ */ l("div", { className: m, style: b, children: /* @__PURE__ */ l("div", { className: "skeleton bg-neutral-200 dark:bg-black-600 animate-pulse h-4 min-w-[100px] w-full rounded" }) }) }, n);
-}, y = h.memo(x);
+  return /* @__PURE__ */ l("td", { className: d, role: "cell", style: p, children: /* @__PURE__ */ l("div", { className: b, style: m, children: /* @__PURE__ */ l("div", { className: "skeleton bg-neutral-200 dark:bg-black-600 animate-pulse h-4 min-w-[100px] w-full rounded" }) }) }, c);
+}, f = x.memo(h);
 export {
-  y as LoaderCell
+  f as LoaderCell
 };
 //# sourceMappingURL=LoaderCell.es.js.map

package/dist/components/data-display/infinite-table/body/cell/LoaderCell.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"LoaderCell.es.js","sources":["../../../../../../src/components/data-display/infinite-table/body/cell/LoaderCell.tsx"],"sourcesContent":["import cn from 'classnames';\nimport React from 'react';\n\nimport { CELL_DEFAULT_RIGHT_OFFSET } from '../../constants';\n\ntype TProps = {\n  cell: {\n    column: {\n      width: number;\n      sticky?: boolean;\n      sequence?: number;\n    };\n  };\n  id: string | number;\n  nextWidthSum: number;\n  isLastCell: boolean;\n  rowHovering: string | number | null;\n  index: number;\n  isFirstStickyCell: boolean;\n};\n\nconst _LoaderCell: React.FC<TProps> = ({ cell, id, nextWidthSum, isLastCell, rowHovering, index, isFirstStickyCell }) => {\n  const isSticky = cell?.column?.sticky;\n\n  const cellClasses = cn('relative h-row', {\n    'bg-neutral-100 dark:bg-black-600': rowHovering === id,\n    'sticky left-0 bg-white dark:bg-black-600': isSticky,\n    'w-full': isLastCell,\n  });\n\n  const contentClasses = cn(\n    'h-row top-0 font-medium font-inter overflow-x-hidden overflow-y-auto whitespace-nowrap text-ellipsis px-4 w-full absolute flex items-center',\n    {\n      'bg-white dark:bg-black-800 border-b border-neutral-200 dark:border-black-700': isSticky,\n    },\n  );\n\n  const boxShadowStyle =\n    isSticky && isFirstStickyCell\n      ? { boxShadow: '-8px 0px 8px rgba(0, 0, 0, 0.02)' }\n      : {};\n\n  const cellStyle = {\n    minWidth: `${cell.column.width}px`,\n    maxWidth: `${cell.column.width}px`,\n    right: isSticky ? `${nextWidthSum}px` : CELL_DEFAULT_RIGHT_OFFSET,\n  };\n\n  return (\n    <td key={index} className={cellClasses} role='cell' style={cellStyle}>\n      <div className={contentClasses} style={boxShadowStyle}>\n        <div className='skeleton bg-neutral-200 dark:bg-black-600 animate-pulse h-4 min-w-[100px] w-full rounded' />\n      </div>\n    </td>\n  );\n};\n\nexport const LoaderCell = React.memo(_LoaderCell);\n"],"names":["_LoaderCell","cell","id","nextWidthSum","isLastCell","rowHovering","index","isFirstStickyCell","isSticky","cellClasses","cn","contentClasses","boxShadowStyle","cellStyle","CELL_DEFAULT_RIGHT_OFFSET","jsx","LoaderCell","React"],"mappings":";;;;AAqBA,MAAMA,IAAgC,CAAC,EAAE,MAAAC,GAAM,IAAAC,GAAI,cAAAC,GAAc,YAAAC,GAAY,aAAAC,GAAa,OAAAC,GAAO,mBAAAC,QAAwB;AACvH,QAAMC,IAAWP,GAAM,QAAQ,QAEzBQ,IAAcC,EAAG,kBAAkB;AAAA,IACvC,oCAAoCL,MAAgBH;AAAA,IACpD,4CAA4CM;AAAA,IAC5C,UAAUJ;AAAA,EAAA,CACX,GAEKO,IAAiBD;AAAA,IACrB;AAAA,IACA;AAAA,MACE,gFAAgFF;AAAA,IAAA;AAAA,EAClF,GAGII,IACJJ,KAAYD,IACR,EAAE,WAAW,mCAAA,IACb,CAAA,GAEAM,IAAY;AAAA,IAChB,UAAU,GAAGZ,EAAK,OAAO,KAAK;AAAA,IAC9B,UAAU,GAAGA,EAAK,OAAO,KAAK;AAAA,IAC9B,OAAOO,IAAW,GAAGL,CAAY,OAAOW;AAAA,EAAA;AAG1C,SACE,gBAAAC,EAAC,QAAe,WAAWN,GAAa,MAAK,QAAO,OAAOI,GACzD,UAAA,gBAAAE,EAAC,OAAA,EAAI,WAAWJ,GAAgB,OAAOC,GACrC,UAAA,gBAAAG,EAAC,OAAA,EAAI,WAAU,2FAAA,CAA2F,GAC5G,KAHOT,CAIT;AAEJ,GAEaU,IAAaC,EAAM,KAAKjB,CAAW;"}
+{"version":3,"file":"LoaderCell.es.js","sources":["../../../../../../src/components/data-display/infinite-table/body/cell/LoaderCell.tsx"],"sourcesContent":["import cn from 'classnames';\nimport React from 'react';\n\ntype TProps = {\n  cell: {\n    column: {\n      width: number;\n      sticky?: boolean;\n      sequence?: number;\n    };\n  };\n  id: string | number;\n  nextWidthSum: number;\n  isLastCell: boolean;\n  rowHovering: string | number | null;\n  index: number;\n  isFirstStickyCell: boolean;\n};\n\nconst _LoaderCell: React.FC<TProps> = ({ cell, id, nextWidthSum, isLastCell, rowHovering, index, isFirstStickyCell }) => {\n  const isSticky = cell?.column?.sticky;\n\n  const cellClasses = cn('relative h-10', {\n    'bg-neutral-100 dark:bg-black-600': rowHovering === id,\n    'sticky left-0 bg-white dark:bg-black-600': isSticky,\n    'w-full': isLastCell,\n  });\n\n  const contentClasses = cn(\n    'h-10 top-0 font-medium font-inter overflow-x-hidden overflow-y-auto whitespace-nowrap text-ellipsis px-4 w-full absolute flex items-center',\n    {\n      'bg-white dark:bg-black-800 border-b border-neutral-200 dark:border-black-700': isSticky,\n    },\n  );\n\n  const boxShadowStyle =\n    isSticky && isFirstStickyCell\n      ? { boxShadow: '-8px 0px 8px rgba(0, 0, 0, 0.02)' }\n      : {};\n\n  const cellStyle = {\n    minWidth: `${cell.column.width}px`,\n    maxWidth: `${cell.column.width}px`,\n    right: isSticky ? `${nextWidthSum}px` : '0px',\n  };\n\n  return (\n    <td key={index} className={cellClasses} role='cell' style={cellStyle}>\n      <div className={contentClasses} style={boxShadowStyle}>\n        <div className='skeleton bg-neutral-200 dark:bg-black-600 animate-pulse h-4 min-w-[100px] w-full rounded' />\n      </div>\n    </td>\n  );\n};\n\nexport const LoaderCell = React.memo(_LoaderCell);\n"],"names":["_LoaderCell","cell","id","nextWidthSum","isLastCell","rowHovering","index","isFirstStickyCell","isSticky","cellClasses","cn","contentClasses","boxShadowStyle","cellStyle","jsx","LoaderCell","React"],"mappings":";;;AAmBA,MAAMA,IAAgC,CAAC,EAAE,MAAAC,GAAM,IAAAC,GAAI,cAAAC,GAAc,YAAAC,GAAY,aAAAC,GAAa,OAAAC,GAAO,mBAAAC,QAAwB;AACvH,QAAMC,IAAWP,GAAM,QAAQ,QAEzBQ,IAAcC,EAAG,iBAAiB;AAAA,IACtC,oCAAoCL,MAAgBH;AAAA,IACpD,4CAA4CM;AAAA,IAC5C,UAAUJ;AAAA,EAAA,CACX,GAEKO,IAAiBD;AAAA,IACrB;AAAA,IACA;AAAA,MACE,gFAAgFF;AAAA,IAAA;AAAA,EAClF,GAGII,IACJJ,KAAYD,IACR,EAAE,WAAW,mCAAA,IACb,CAAA,GAEAM,IAAY;AAAA,IAChB,UAAU,GAAGZ,EAAK,OAAO,KAAK;AAAA,IAC9B,UAAU,GAAGA,EAAK,OAAO,KAAK;AAAA,IAC9B,OAAOO,IAAW,GAAGL,CAAY,OAAO;AAAA,EAAA;AAG1C,SACE,gBAAAW,EAAC,QAAe,WAAWL,GAAa,MAAK,QAAO,OAAOI,GACzD,UAAA,gBAAAC,EAAC,OAAA,EAAI,WAAWH,GAAgB,OAAOC,GACrC,UAAA,gBAAAE,EAAC,OAAA,EAAI,WAAU,2FAAA,CAA2F,GAC5G,KAHOR,CAIT;AAEJ,GAEaS,IAAaC,EAAM,KAAKhB,CAAW;"}

package/dist/components/data-display/infinite-table/body/cell/PendingEditCell.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),L=require("../../../../../utils/formatters.cjs.js"),$=require("@mui/icons-material"),B=require("../../../../../_virtual/index.cjs.js"),u=require("react"),D=require("react-dom"),T=(e,i)=>{if(typeof e=="boolean")return e?"Yes":"No";if(e==null||e==="")return"-";const s=String(e);if(/^\d{4}-\d{2}-\d{2}(T\d{2}:\d{2}(:\d{2})?)?/.test(s)){const n=s.includes("T"),r=L.formatDate(s,{withTime:n,skipTimezone:!0});if(r)return r.length>20?r.substring(0,20)+"...":r}const o=s.length>20?s.substring(0,20)+"...":s;return i?`${o} ${i}`:o},F=({rowId:e,rowIndex:i,pendingEdits:s,tableHeaders:d,rowHasPendingEdits:o,rowHovering:n,isInlineEditing:r,is_read:M,is_modified:R,is_row_modified:v,is_deleted:m,is_added:x,is_incomplete:p,showNewItem:P,onScrollToCell:S})=>{const[q,b]=u.useState(!1),[k,C]=u.useState({top:0,left:0}),l=u.useRef(null),g=u.useRef(null),f=s?.[e],h=u.useMemo(()=>f?Object.entries(f).map(([t,c])=>{const w=d?.find(O=>O.key===t),z=w?.Header||w?.display_name||t;return{columnKey:t,fieldName:z,value:c.value,originalValue:c.originalValue,meta:c.meta,originalMeta:c.originalMeta}}):[],[f,d]),V=t=>{b(!1),l.current&&(clearTimeout(l.current),l.current=null),S?.(e,t,i)},y=()=>{if(o){if(l.current&&(clearTimeout(l.current),l.current=null),g.current){const t=g.current.getBoundingClientRect();C({top:t.top+t.height/2,left:t.right+8})}b(!0)}},j=()=>{l.current=setTimeout(()=>{b(!1)},300)},N=B({"bg-primary-50 dark:bg-primary-900":r,"bg-neutral-100 dark:bg-black-600":n===e&&!r&&!m&&!x,"bg-error-200 dark:bg-error-900":n===e&&!r&&m,"bg-success-100 dark:bg-success-800":n===e&&!r&&x,"bg-primary-50 dark:bg-black-700":!p&&!M&&P&&n!==e&&!r,"bg-warning-50 dark:bg-black-500":(p||R||v)&&n!==e&&!r,"bg-error-100 dark:bg-error-975":m&&n!==e&&!r,"bg-success-50 dark:bg-success-900":x&&n!==e&&!r});return a.jsxs("td",{className:`min-w-[28px] w-[28px] sticky left-0 z-30 ${N||"bg-white dark:bg-black-800"} h-row`,children:[a.jsx("div",{ref:g,className:"w-full h-row flex items-center justify-center cursor-pointer",onMouseEnter:y,onMouseLeave:j,children:o&&a.jsx("div",{className:"w-5 h-5 rounded-full bg-warning-100 dark:bg-warning-900 flex items-center justify-center shadow-sm border border-warning-200 dark:border-warning-700",children:a.jsx($.EditNoteOutlined,{sx:{fontSize:14},className:"text-warning-600 dark:text-warning-400"})})}),q&&h.length>0&&D.createPortal(a.jsxs("div",{className:"fixed bg-white dark:bg-black-700 rounded-lg shadow-xl border border-neutral-200 dark:border-black-600 py-2 min-w-[200px] max-w-[280px]",style:{top:k.top,left:k.left,transform:"translateY(-50%)",zIndex:99999},onMouseEnter:y,onMouseLeave:j,children:[a.jsxs("div",{className:"px-3 py-1.5 text-xs font-semibold text-neutral-500 dark:text-neutral-400 uppercase tracking-wider border-b border-neutral-100 dark:border-black-600",children:["Pending Changes (",h.length,")"]}),a.jsx("div",{className:"max-h-48 overflow-y-auto",children:h.map((t,c)=>a.jsxs("button",{onClick:()=>V(t.columnKey),className:"w-full px-3 py-2 text-left hover:bg-neutral-50 dark:hover:bg-black-600 transition-colors cursor-pointer",children:[a.jsx("div",{className:"text-xs font-medium text-neutral-700 dark:text-neutral-300 mb-1",children:t.fieldName}),a.jsxs("div",{className:"flex items-center gap-1.5 text-xs",children:[a.jsx("span",{className:"text-neutral-400 dark:text-neutral-500 line-through truncate max-w-[80px]",children:T(t.originalValue,t.originalMeta?.currency_code)}),a.jsx("span",{className:"text-neutral-400 dark:text-neutral-500 flex-shrink-0",children:"→"}),a.jsx("span",{className:"text-primary-600 dark:text-primary-400 font-medium truncate max-w-[80px]",children:T(t.value,t.meta?.currency_code)})]})]},c))})]}),document.getElementById("full-screen-container")||document.body)]})};exports.PendingEditCell=F;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),L=require("../../../../../utils/formatters.cjs.js"),$=require("@mui/icons-material"),B=require("../../../../../_virtual/index.cjs.js"),u=require("react"),D=require("react-dom"),M=(e,i)=>{if(typeof e=="boolean")return e?"Yes":"No";if(e==null||e==="")return"-";const s=String(e);if(/^\d{4}-\d{2}-\d{2}(T\d{2}:\d{2}(:\d{2})?)?/.test(s)){const n=s.includes("T"),r=L.formatDate(s,{withTime:n,skipTimezone:!0});if(r)return r.length>20?r.substring(0,20)+"...":r}const o=s.length>20?s.substring(0,20)+"...":s;return i?`${o} ${i}`:o},F=({rowId:e,rowIndex:i,pendingEdits:s,tableHeaders:d,rowHasPendingEdits:o,rowHovering:n,isInlineEditing:r,is_read:w,is_modified:R,is_row_modified:v,is_deleted:m,is_added:x,is_incomplete:p,showNewItem:P,onScrollToCell:S})=>{const[q,b]=u.useState(!1),[k,C]=u.useState({top:0,left:0}),l=u.useRef(null),g=u.useRef(null),f=s?.[e],h=u.useMemo(()=>f?Object.entries(f).map(([t,c])=>{const T=d?.find(O=>O.key===t),z=T?.Header||T?.display_name||t;return{columnKey:t,fieldName:z,value:c.value,originalValue:c.originalValue,meta:c.meta,originalMeta:c.originalMeta}}):[],[f,d]),V=t=>{b(!1),l.current&&(clearTimeout(l.current),l.current=null),S?.(e,t,i)},y=()=>{if(o){if(l.current&&(clearTimeout(l.current),l.current=null),g.current){const t=g.current.getBoundingClientRect();C({top:t.top+t.height/2,left:t.right+8})}b(!0)}},j=()=>{l.current=setTimeout(()=>{b(!1)},300)},N=B({"bg-primary-50 dark:bg-primary-900":r,"bg-neutral-100 dark:bg-black-600":n===e&&!r&&!m&&!x,"bg-error-200 dark:bg-error-900":n===e&&!r&&m,"bg-success-100 dark:bg-success-800":n===e&&!r&&x,"bg-primary-50 dark:bg-black-700":!p&&!w&&P&&n!==e&&!r,"bg-warning-50 dark:bg-black-500":(p||R||v)&&n!==e&&!r,"bg-error-100 dark:bg-error-975":m&&n!==e&&!r,"bg-success-50 dark:bg-success-900":x&&n!==e&&!r});return a.jsxs("td",{className:`min-w-[28px] w-[28px] sticky left-0 z-30 ${N||"bg-white dark:bg-black-800"} h-[39px]`,children:[a.jsx("div",{ref:g,className:"w-full h-[39px] flex items-center justify-center cursor-pointer",onMouseEnter:y,onMouseLeave:j,children:o&&a.jsx("div",{className:"w-5 h-5 rounded-full bg-warning-100 dark:bg-warning-900 flex items-center justify-center shadow-sm border border-warning-200 dark:border-warning-700",children:a.jsx($.EditNoteOutlined,{sx:{fontSize:14},className:"text-warning-600 dark:text-warning-400"})})}),q&&h.length>0&&D.createPortal(a.jsxs("div",{className:"fixed bg-white dark:bg-black-700 rounded-lg shadow-xl border border-neutral-200 dark:border-black-600 py-2 min-w-[200px] max-w-[280px]",style:{top:k.top,left:k.left,transform:"translateY(-50%)",zIndex:99999},onMouseEnter:y,onMouseLeave:j,children:[a.jsxs("div",{className:"px-3 py-1.5 text-xs font-semibold text-neutral-500 dark:text-neutral-400 uppercase tracking-wider border-b border-neutral-100 dark:border-black-600",children:["Pending Changes (",h.length,")"]}),a.jsx("div",{className:"max-h-48 overflow-y-auto",children:h.map((t,c)=>a.jsxs("button",{onClick:()=>V(t.columnKey),className:"w-full px-3 py-2 text-left hover:bg-neutral-50 dark:hover:bg-black-600 transition-colors cursor-pointer",children:[a.jsx("div",{className:"text-xs font-medium text-neutral-700 dark:text-neutral-300 mb-1",children:t.fieldName}),a.jsxs("div",{className:"flex items-center gap-1.5 text-xs",children:[a.jsx("span",{className:"text-neutral-400 dark:text-neutral-500 line-through truncate max-w-[80px]",children:M(t.originalValue,t.originalMeta?.currency_code)}),a.jsx("span",{className:"text-neutral-400 dark:text-neutral-500 flex-shrink-0",children:"→"}),a.jsx("span",{className:"text-primary-600 dark:text-primary-400 font-medium truncate max-w-[80px]",children:M(t.value,t.meta?.currency_code)})]})]},c))})]}),document.getElementById("full-screen-container")||document.body)]})};exports.PendingEditCell=F;
 //# sourceMappingURL=PendingEditCell.cjs.js.map

package/dist/components/data-display/infinite-table/body/cell/PendingEditCell.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"PendingEditCell.cjs.js","sources":["../../../../../../src/components/data-display/infinite-table/body/cell/PendingEditCell.tsx"],"sourcesContent":["import { formatDate } from '../../../../../utils/formatters';\nimport { EditNoteOutlined } from '@mui/icons-material';\nimport cn from 'classnames';\nimport React, { useMemo, useRef, useState } from 'react';\nimport { createPortal } from 'react-dom';\n\ntype TPendingEditCellProps = {\n  rowId: string;\n  rowIndex: number;\n  pendingEdits:\n    | Record<string, Record<string, { value: unknown; originalValue?: unknown; meta?: { currency_code?: string | null; [key: string]: unknown | null } | null; originalMeta?: { currency_code?: string | null; [key: string]: unknown | null } | null }>>\n    | undefined;\n  tableHeaders: Array<{ key?: string; Header?: string; display_name?: string }> | undefined;\n  rowHasPendingEdits: boolean;\n  rowHovering?: string;\n  isInlineEditing?: boolean;\n  is_read?: boolean;\n  is_modified?: boolean;\n  is_row_modified?: boolean;\n  is_deleted?: boolean;\n  is_added?: boolean;\n  is_incomplete?: boolean;\n  showNewItem?: boolean;\n  onScrollToCell?: (targetRowId: string, columnKey: string, targetRowIndex: number) => void;\n};\n\nconst formatValue = (val: unknown, currencyCode?: string | null): string => {\n  if (typeof val === 'boolean') return val ? 'Yes' : 'No';\n  if (val === null || val === undefined || val === '') return '-';\n\n  const strVal = String(val);\n  const dateRegex = /^\\d{4}-\\d{2}-\\d{2}(T\\d{2}:\\d{2}(:\\d{2})?)?/;\n  if (dateRegex.test(strVal)) {\n    const hasTime = strVal.includes('T');\n    const formatted = formatDate(strVal, { withTime: hasTime, skipTimezone: true });\n    if (formatted) {\n      return formatted.length > 20 ? formatted.substring(0, 20) + '...' : formatted;\n    }\n  }\n\n  const display = strVal.length > 20 ? strVal.substring(0, 20) + '...' : strVal;\n  if (currencyCode) return `${display} ${currencyCode}`;\n  return display;\n};\n\nexport const PendingEditCell: React.FC<TPendingEditCellProps> = ({\n  rowId,\n  rowIndex,\n  pendingEdits,\n  tableHeaders,\n  rowHasPendingEdits,\n  rowHovering,\n  isInlineEditing,\n  is_read,\n  is_modified,\n  is_row_modified,\n  is_deleted,\n  is_added,\n  is_incomplete,\n  showNewItem,\n  onScrollToCell,\n}) => {\n  const [showTooltip, setShowTooltip] = useState(false);\n  const [tooltipPosition, setTooltipPosition] = useState({ top: 0, left: 0 });\n  const hideTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const iconRef = useRef<HTMLDivElement>(null);\n\n  const rowPendingEdits = pendingEdits?.[rowId];\n\n  const editedFields = useMemo(\n    () =>\n      rowPendingEdits\n        ? Object.entries(rowPendingEdits).map(([columnKey, edit]) => {\n            const column = tableHeaders?.find((col) => col.key === columnKey);\n            const fieldName = column?.Header || column?.display_name || columnKey;\n            return { columnKey, fieldName, value: edit.value, originalValue: edit.originalValue, meta: edit.meta, originalMeta: edit.originalMeta };\n          })\n        : [],\n    [rowPendingEdits, tableHeaders],\n  );\n\n  const handleFieldClick = (columnKey: string) => {\n    setShowTooltip(false);\n    if (hideTimeoutRef.current) { clearTimeout(hideTimeoutRef.current); hideTimeoutRef.current = null; }\n    onScrollToCell?.(rowId, columnKey, rowIndex);\n  };\n\n  const handleMouseEnter = () => {\n    if (!rowHasPendingEdits) return;\n    if (hideTimeoutRef.current) { clearTimeout(hideTimeoutRef.current); hideTimeoutRef.current = null; }\n    if (iconRef.current) {\n      const rect = iconRef.current.getBoundingClientRect();\n      setTooltipPosition({ top: rect.top + rect.height / 2, left: rect.right + 8 });\n    }\n    setShowTooltip(true);\n  };\n\n  const handleMouseLeave = () => {\n    hideTimeoutRef.current = setTimeout(() => { setShowTooltip(false); }, 300);\n  };\n\n  const bgColor = cn({\n    'bg-primary-50 dark:bg-primary-900': isInlineEditing,\n    'bg-neutral-100 dark:bg-black-600': rowHovering === rowId && !isInlineEditing && !is_deleted && !is_added,\n    'bg-error-200 dark:bg-error-900': rowHovering === rowId && !isInlineEditing && is_deleted,\n    'bg-success-100 dark:bg-success-800': rowHovering === rowId && !isInlineEditing && is_added,\n    'bg-primary-50 dark:bg-black-700': !is_incomplete && !is_read && showNewItem && rowHovering !== rowId && !isInlineEditing,\n    'bg-warning-50 dark:bg-black-500': (is_incomplete || is_modified || is_row_modified) && rowHovering !== rowId && !isInlineEditing,\n    'bg-error-100 dark:bg-error-975': is_deleted && rowHovering !== rowId && !isInlineEditing,\n    'bg-success-50 dark:bg-success-900': is_added && rowHovering !== rowId && !isInlineEditing,\n  });\n\n  return (\n    <td className={`min-w-[28px] w-[28px] sticky left-0 z-30 ${bgColor ? bgColor : 'bg-white dark:bg-black-800'} h-row`}>\n      <div ref={iconRef} className='w-full h-row flex items-center justify-center cursor-pointer' onMouseEnter={handleMouseEnter} onMouseLeave={handleMouseLeave}>\n        {rowHasPendingEdits && (\n          <div className='w-5 h-5 rounded-full bg-warning-100 dark:bg-warning-900 flex items-center justify-center shadow-sm border border-warning-200 dark:border-warning-700'>\n            <EditNoteOutlined sx={{ fontSize: 14 }} className='text-warning-600 dark:text-warning-400' />\n          </div>\n        )}\n      </div>\n      {showTooltip && editedFields.length > 0 &&\n        createPortal(\n          <div\n            className='fixed bg-white dark:bg-black-700 rounded-lg shadow-xl border border-neutral-200 dark:border-black-600 py-2 min-w-[200px] max-w-[280px]'\n            style={{ top: tooltipPosition.top, left: tooltipPosition.left, transform: 'translateY(-50%)', zIndex: 99999 }}\n            onMouseEnter={handleMouseEnter}\n            onMouseLeave={handleMouseLeave}\n          >\n            <div className='px-3 py-1.5 text-xs font-semibold text-neutral-500 dark:text-neutral-400 uppercase tracking-wider border-b border-neutral-100 dark:border-black-600'>\n              Pending Changes ({editedFields.length})\n            </div>\n            <div className='max-h-48 overflow-y-auto'>\n              {editedFields.map((field, idx) => (\n                <button key={idx} onClick={() => handleFieldClick(field.columnKey)} className='w-full px-3 py-2 text-left hover:bg-neutral-50 dark:hover:bg-black-600 transition-colors cursor-pointer'>\n                  <div className='text-xs font-medium text-neutral-700 dark:text-neutral-300 mb-1'>{field.fieldName}</div>\n                  <div className='flex items-center gap-1.5 text-xs'>\n                    <span className='text-neutral-400 dark:text-neutral-500 line-through truncate max-w-[80px]'>{formatValue(field.originalValue, field.originalMeta?.currency_code)}</span>\n                    <span className='text-neutral-400 dark:text-neutral-500 flex-shrink-0'>→</span>\n                    <span className='text-primary-600 dark:text-primary-400 font-medium truncate max-w-[80px]'>{formatValue(field.value, field.meta?.currency_code)}</span>\n                  </div>\n                </button>\n              ))}\n            </div>\n          </div>,\n          document.getElementById('full-screen-container') || document.body,\n        )}\n    </td>\n  );\n};\n"],"names":["formatValue","val","currencyCode","strVal","hasTime","formatted","formatDate","display","PendingEditCell","rowId","rowIndex","pendingEdits","tableHeaders","rowHasPendingEdits","rowHovering","isInlineEditing","is_read","is_modified","is_row_modified","is_deleted","is_added","is_incomplete","showNewItem","onScrollToCell","showTooltip","setShowTooltip","useState","tooltipPosition","setTooltipPosition","hideTimeoutRef","useRef","iconRef","rowPendingEdits","editedFields","useMemo","columnKey","edit","column","col","fieldName","handleFieldClick","handleMouseEnter","rect","handleMouseLeave","bgColor","cn","jsx","EditNoteOutlined","createPortal","jsxs","field","idx"],"mappings":"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"}
+{"version":3,"file":"PendingEditCell.cjs.js","sources":["../../../../../../src/components/data-display/infinite-table/body/cell/PendingEditCell.tsx"],"sourcesContent":["import { formatDate } from '../../../../../utils/formatters';\nimport { EditNoteOutlined } from '@mui/icons-material';\nimport cn from 'classnames';\nimport React, { useMemo, useRef, useState } from 'react';\nimport { createPortal } from 'react-dom';\n\ntype TPendingEditCellProps = {\n  rowId: string;\n  rowIndex: number;\n  pendingEdits:\n    | Record<string, Record<string, { value: unknown; originalValue?: unknown; meta?: { currency_code?: string | null; [key: string]: unknown | null } | null; originalMeta?: { currency_code?: string | null; [key: string]: unknown | null } | null }>>\n    | undefined;\n  tableHeaders: Array<{ key?: string; Header?: string; display_name?: string }> | undefined;\n  rowHasPendingEdits: boolean;\n  rowHovering?: string;\n  isInlineEditing?: boolean;\n  is_read?: boolean;\n  is_modified?: boolean;\n  is_row_modified?: boolean;\n  is_deleted?: boolean;\n  is_added?: boolean;\n  is_incomplete?: boolean;\n  showNewItem?: boolean;\n  onScrollToCell?: (targetRowId: string, columnKey: string, targetRowIndex: number) => void;\n};\n\nconst formatValue = (val: unknown, currencyCode?: string | null): string => {\n  if (typeof val === 'boolean') return val ? 'Yes' : 'No';\n  if (val === null || val === undefined || val === '') return '-';\n\n  const strVal = String(val);\n  const dateRegex = /^\\d{4}-\\d{2}-\\d{2}(T\\d{2}:\\d{2}(:\\d{2})?)?/;\n  if (dateRegex.test(strVal)) {\n    const hasTime = strVal.includes('T');\n    const formatted = formatDate(strVal, { withTime: hasTime, skipTimezone: true });\n    if (formatted) {\n      return formatted.length > 20 ? formatted.substring(0, 20) + '...' : formatted;\n    }\n  }\n\n  const display = strVal.length > 20 ? strVal.substring(0, 20) + '...' : strVal;\n  if (currencyCode) return `${display} ${currencyCode}`;\n  return display;\n};\n\nexport const PendingEditCell: React.FC<TPendingEditCellProps> = ({\n  rowId,\n  rowIndex,\n  pendingEdits,\n  tableHeaders,\n  rowHasPendingEdits,\n  rowHovering,\n  isInlineEditing,\n  is_read,\n  is_modified,\n  is_row_modified,\n  is_deleted,\n  is_added,\n  is_incomplete,\n  showNewItem,\n  onScrollToCell,\n}) => {\n  const [showTooltip, setShowTooltip] = useState(false);\n  const [tooltipPosition, setTooltipPosition] = useState({ top: 0, left: 0 });\n  const hideTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const iconRef = useRef<HTMLDivElement>(null);\n\n  const rowPendingEdits = pendingEdits?.[rowId];\n\n  const editedFields = useMemo(\n    () =>\n      rowPendingEdits\n        ? Object.entries(rowPendingEdits).map(([columnKey, edit]) => {\n            const column = tableHeaders?.find((col) => col.key === columnKey);\n            const fieldName = column?.Header || column?.display_name || columnKey;\n            return { columnKey, fieldName, value: edit.value, originalValue: edit.originalValue, meta: edit.meta, originalMeta: edit.originalMeta };\n          })\n        : [],\n    [rowPendingEdits, tableHeaders],\n  );\n\n  const handleFieldClick = (columnKey: string) => {\n    setShowTooltip(false);\n    if (hideTimeoutRef.current) { clearTimeout(hideTimeoutRef.current); hideTimeoutRef.current = null; }\n    onScrollToCell?.(rowId, columnKey, rowIndex);\n  };\n\n  const handleMouseEnter = () => {\n    if (!rowHasPendingEdits) return;\n    if (hideTimeoutRef.current) { clearTimeout(hideTimeoutRef.current); hideTimeoutRef.current = null; }\n    if (iconRef.current) {\n      const rect = iconRef.current.getBoundingClientRect();\n      setTooltipPosition({ top: rect.top + rect.height / 2, left: rect.right + 8 });\n    }\n    setShowTooltip(true);\n  };\n\n  const handleMouseLeave = () => {\n    hideTimeoutRef.current = setTimeout(() => { setShowTooltip(false); }, 300);\n  };\n\n  const bgColor = cn({\n    'bg-primary-50 dark:bg-primary-900': isInlineEditing,\n    'bg-neutral-100 dark:bg-black-600': rowHovering === rowId && !isInlineEditing && !is_deleted && !is_added,\n    'bg-error-200 dark:bg-error-900': rowHovering === rowId && !isInlineEditing && is_deleted,\n    'bg-success-100 dark:bg-success-800': rowHovering === rowId && !isInlineEditing && is_added,\n    'bg-primary-50 dark:bg-black-700': !is_incomplete && !is_read && showNewItem && rowHovering !== rowId && !isInlineEditing,\n    'bg-warning-50 dark:bg-black-500': (is_incomplete || is_modified || is_row_modified) && rowHovering !== rowId && !isInlineEditing,\n    'bg-error-100 dark:bg-error-975': is_deleted && rowHovering !== rowId && !isInlineEditing,\n    'bg-success-50 dark:bg-success-900': is_added && rowHovering !== rowId && !isInlineEditing,\n  });\n\n  return (\n    <td className={`min-w-[28px] w-[28px] sticky left-0 z-30 ${bgColor ? bgColor : 'bg-white dark:bg-black-800'} h-[39px]`}>\n      <div ref={iconRef} className='w-full h-[39px] flex items-center justify-center cursor-pointer' onMouseEnter={handleMouseEnter} onMouseLeave={handleMouseLeave}>\n        {rowHasPendingEdits && (\n          <div className='w-5 h-5 rounded-full bg-warning-100 dark:bg-warning-900 flex items-center justify-center shadow-sm border border-warning-200 dark:border-warning-700'>\n            <EditNoteOutlined sx={{ fontSize: 14 }} className='text-warning-600 dark:text-warning-400' />\n          </div>\n        )}\n      </div>\n      {showTooltip && editedFields.length > 0 &&\n        createPortal(\n          <div\n            className='fixed bg-white dark:bg-black-700 rounded-lg shadow-xl border border-neutral-200 dark:border-black-600 py-2 min-w-[200px] max-w-[280px]'\n            style={{ top: tooltipPosition.top, left: tooltipPosition.left, transform: 'translateY(-50%)', zIndex: 99999 }}\n            onMouseEnter={handleMouseEnter}\n            onMouseLeave={handleMouseLeave}\n          >\n            <div className='px-3 py-1.5 text-xs font-semibold text-neutral-500 dark:text-neutral-400 uppercase tracking-wider border-b border-neutral-100 dark:border-black-600'>\n              Pending Changes ({editedFields.length})\n            </div>\n            <div className='max-h-48 overflow-y-auto'>\n              {editedFields.map((field, idx) => (\n                <button key={idx} onClick={() => handleFieldClick(field.columnKey)} className='w-full px-3 py-2 text-left hover:bg-neutral-50 dark:hover:bg-black-600 transition-colors cursor-pointer'>\n                  <div className='text-xs font-medium text-neutral-700 dark:text-neutral-300 mb-1'>{field.fieldName}</div>\n                  <div className='flex items-center gap-1.5 text-xs'>\n                    <span className='text-neutral-400 dark:text-neutral-500 line-through truncate max-w-[80px]'>{formatValue(field.originalValue, field.originalMeta?.currency_code)}</span>\n                    <span className='text-neutral-400 dark:text-neutral-500 flex-shrink-0'>→</span>\n                    <span className='text-primary-600 dark:text-primary-400 font-medium truncate max-w-[80px]'>{formatValue(field.value, field.meta?.currency_code)}</span>\n                  </div>\n                </button>\n              ))}\n            </div>\n          </div>,\n          document.getElementById('full-screen-container') || document.body,\n        )}\n    </td>\n  );\n};\n"],"names":["formatValue","val","currencyCode","strVal","hasTime","formatted","formatDate","display","PendingEditCell","rowId","rowIndex","pendingEdits","tableHeaders","rowHasPendingEdits","rowHovering","isInlineEditing","is_read","is_modified","is_row_modified","is_deleted","is_added","is_incomplete","showNewItem","onScrollToCell","showTooltip","setShowTooltip","useState","tooltipPosition","setTooltipPosition","hideTimeoutRef","useRef","iconRef","rowPendingEdits","editedFields","useMemo","columnKey","edit","column","col","fieldName","handleFieldClick","handleMouseEnter","rect","handleMouseLeave","bgColor","cn","jsx","EditNoteOutlined","createPortal","jsxs","field","idx"],"mappings":"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"}

package/dist/components/data-display/infinite-table/body/cell/PendingEditCell.es.js

@@ -32,18 +32,18 @@ const R = (e, i) => {
   showNewItem: V,
   onScrollToCell: z
 }) => {
-  const [S, f] = M(!1), [k, L] = M({ top: 0, left: 0 }), l = v(null), g = v(null), p = n?.[e], x = q(
-    () => p ? Object.entries(p).map(([t, s]) => {
-      const T = m?.find((F) => F.key === t), B = T?.Header || T?.display_name || t;
+  const [S, f] = M(!1), [k, L] = M({ top: 0, left: 0 }), l = v(null), p = v(null), g = n?.[e], x = q(
+    () => g ? Object.entries(g).map(([t, s]) => {
+      const w = m?.find((F) => F.key === t), B = w?.Header || w?.display_name || t;
       return { columnKey: t, fieldName: B, value: s.value, originalValue: s.originalValue, meta: s.meta, originalMeta: s.originalMeta };
     }) : [],
-    [p, m]
+    [g, m]
   ), $ = (t) => {
     f(!1), l.current && (clearTimeout(l.current), l.current = null), z?.(e, t, i);
   }, y = () => {
     if (c) {
-      if (l.current && (clearTimeout(l.current), l.current = null), g.current) {
-        const t = g.current.getBoundingClientRect();
+      if (l.current && (clearTimeout(l.current), l.current = null), p.current) {
+        const t = p.current.getBoundingClientRect();
         L({ top: t.top + t.height / 2, left: t.right + 8 });
       }
       f(!0);
@@ -52,7 +52,7 @@ const R = (e, i) => {
     l.current = setTimeout(() => {
       f(!1);
     }, 300);
-  }, w = D({
+  }, T = D({
     "bg-primary-50 dark:bg-primary-900": r,
     "bg-neutral-100 dark:bg-black-600": a === e && !r && !d && !b,
     "bg-error-200 dark:bg-error-900": a === e && !r && d,
@@ -62,8 +62,8 @@ const R = (e, i) => {
     "bg-error-100 dark:bg-error-975": d && a !== e && !r,
     "bg-success-50 dark:bg-success-900": b && a !== e && !r
   });
-  return /* @__PURE__ */ u("td", { className: `min-w-[28px] w-[28px] sticky left-0 z-30 ${w || "bg-white dark:bg-black-800"} h-row`, children: [
-    /* @__PURE__ */ o("div", { ref: g, className: "w-full h-row flex items-center justify-center cursor-pointer", onMouseEnter: y, onMouseLeave: N, children: c && /* @__PURE__ */ o("div", { className: "w-5 h-5 rounded-full bg-warning-100 dark:bg-warning-900 flex items-center justify-center shadow-sm border border-warning-200 dark:border-warning-700", children: /* @__PURE__ */ o(Y, { sx: { fontSize: 14 }, className: "text-warning-600 dark:text-warning-400" }) }) }),
+  return /* @__PURE__ */ u("td", { className: `min-w-[28px] w-[28px] sticky left-0 z-30 ${T || "bg-white dark:bg-black-800"} h-[39px]`, children: [
+    /* @__PURE__ */ o("div", { ref: p, className: "w-full h-[39px] flex items-center justify-center cursor-pointer", onMouseEnter: y, onMouseLeave: N, children: c && /* @__PURE__ */ o("div", { className: "w-5 h-5 rounded-full bg-warning-100 dark:bg-warning-900 flex items-center justify-center shadow-sm border border-warning-200 dark:border-warning-700", children: /* @__PURE__ */ o(Y, { sx: { fontSize: 14 }, className: "text-warning-600 dark:text-warning-400" }) }) }),
     S && x.length > 0 && A(
       /* @__PURE__ */ u(
         "div",

package/dist/components/data-display/infinite-table/body/cell/PendingEditCell.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"PendingEditCell.es.js","sources":["../../../../../../src/components/data-display/infinite-table/body/cell/PendingEditCell.tsx"],"sourcesContent":["import { formatDate } from '../../../../../utils/formatters';\nimport { EditNoteOutlined } from '@mui/icons-material';\nimport cn from 'classnames';\nimport React, { useMemo, useRef, useState } from 'react';\nimport { createPortal } from 'react-dom';\n\ntype TPendingEditCellProps = {\n  rowId: string;\n  rowIndex: number;\n  pendingEdits:\n    | Record<string, Record<string, { value: unknown; originalValue?: unknown; meta?: { currency_code?: string | null; [key: string]: unknown | null } | null; originalMeta?: { currency_code?: string | null; [key: string]: unknown | null } | null }>>\n    | undefined;\n  tableHeaders: Array<{ key?: string; Header?: string; display_name?: string }> | undefined;\n  rowHasPendingEdits: boolean;\n  rowHovering?: string;\n  isInlineEditing?: boolean;\n  is_read?: boolean;\n  is_modified?: boolean;\n  is_row_modified?: boolean;\n  is_deleted?: boolean;\n  is_added?: boolean;\n  is_incomplete?: boolean;\n  showNewItem?: boolean;\n  onScrollToCell?: (targetRowId: string, columnKey: string, targetRowIndex: number) => void;\n};\n\nconst formatValue = (val: unknown, currencyCode?: string | null): string => {\n  if (typeof val === 'boolean') return val ? 'Yes' : 'No';\n  if (val === null || val === undefined || val === '') return '-';\n\n  const strVal = String(val);\n  const dateRegex = /^\\d{4}-\\d{2}-\\d{2}(T\\d{2}:\\d{2}(:\\d{2})?)?/;\n  if (dateRegex.test(strVal)) {\n    const hasTime = strVal.includes('T');\n    const formatted = formatDate(strVal, { withTime: hasTime, skipTimezone: true });\n    if (formatted) {\n      return formatted.length > 20 ? formatted.substring(0, 20) + '...' : formatted;\n    }\n  }\n\n  const display = strVal.length > 20 ? strVal.substring(0, 20) + '...' : strVal;\n  if (currencyCode) return `${display} ${currencyCode}`;\n  return display;\n};\n\nexport const PendingEditCell: React.FC<TPendingEditCellProps> = ({\n  rowId,\n  rowIndex,\n  pendingEdits,\n  tableHeaders,\n  rowHasPendingEdits,\n  rowHovering,\n  isInlineEditing,\n  is_read,\n  is_modified,\n  is_row_modified,\n  is_deleted,\n  is_added,\n  is_incomplete,\n  showNewItem,\n  onScrollToCell,\n}) => {\n  const [showTooltip, setShowTooltip] = useState(false);\n  const [tooltipPosition, setTooltipPosition] = useState({ top: 0, left: 0 });\n  const hideTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const iconRef = useRef<HTMLDivElement>(null);\n\n  const rowPendingEdits = pendingEdits?.[rowId];\n\n  const editedFields = useMemo(\n    () =>\n      rowPendingEdits\n        ? Object.entries(rowPendingEdits).map(([columnKey, edit]) => {\n            const column = tableHeaders?.find((col) => col.key === columnKey);\n            const fieldName = column?.Header || column?.display_name || columnKey;\n            return { columnKey, fieldName, value: edit.value, originalValue: edit.originalValue, meta: edit.meta, originalMeta: edit.originalMeta };\n          })\n        : [],\n    [rowPendingEdits, tableHeaders],\n  );\n\n  const handleFieldClick = (columnKey: string) => {\n    setShowTooltip(false);\n    if (hideTimeoutRef.current) { clearTimeout(hideTimeoutRef.current); hideTimeoutRef.current = null; }\n    onScrollToCell?.(rowId, columnKey, rowIndex);\n  };\n\n  const handleMouseEnter = () => {\n    if (!rowHasPendingEdits) return;\n    if (hideTimeoutRef.current) { clearTimeout(hideTimeoutRef.current); hideTimeoutRef.current = null; }\n    if (iconRef.current) {\n      const rect = iconRef.current.getBoundingClientRect();\n      setTooltipPosition({ top: rect.top + rect.height / 2, left: rect.right + 8 });\n    }\n    setShowTooltip(true);\n  };\n\n  const handleMouseLeave = () => {\n    hideTimeoutRef.current = setTimeout(() => { setShowTooltip(false); }, 300);\n  };\n\n  const bgColor = cn({\n    'bg-primary-50 dark:bg-primary-900': isInlineEditing,\n    'bg-neutral-100 dark:bg-black-600': rowHovering === rowId && !isInlineEditing && !is_deleted && !is_added,\n    'bg-error-200 dark:bg-error-900': rowHovering === rowId && !isInlineEditing && is_deleted,\n    'bg-success-100 dark:bg-success-800': rowHovering === rowId && !isInlineEditing && is_added,\n    'bg-primary-50 dark:bg-black-700': !is_incomplete && !is_read && showNewItem && rowHovering !== rowId && !isInlineEditing,\n    'bg-warning-50 dark:bg-black-500': (is_incomplete || is_modified || is_row_modified) && rowHovering !== rowId && !isInlineEditing,\n    'bg-error-100 dark:bg-error-975': is_deleted && rowHovering !== rowId && !isInlineEditing,\n    'bg-success-50 dark:bg-success-900': is_added && rowHovering !== rowId && !isInlineEditing,\n  });\n\n  return (\n    <td className={`min-w-[28px] w-[28px] sticky left-0 z-30 ${bgColor ? bgColor : 'bg-white dark:bg-black-800'} h-row`}>\n      <div ref={iconRef} className='w-full h-row flex items-center justify-center cursor-pointer' onMouseEnter={handleMouseEnter} onMouseLeave={handleMouseLeave}>\n        {rowHasPendingEdits && (\n          <div className='w-5 h-5 rounded-full bg-warning-100 dark:bg-warning-900 flex items-center justify-center shadow-sm border border-warning-200 dark:border-warning-700'>\n            <EditNoteOutlined sx={{ fontSize: 14 }} className='text-warning-600 dark:text-warning-400' />\n          </div>\n        )}\n      </div>\n      {showTooltip && editedFields.length > 0 &&\n        createPortal(\n          <div\n            className='fixed bg-white dark:bg-black-700 rounded-lg shadow-xl border border-neutral-200 dark:border-black-600 py-2 min-w-[200px] max-w-[280px]'\n            style={{ top: tooltipPosition.top, left: tooltipPosition.left, transform: 'translateY(-50%)', zIndex: 99999 }}\n            onMouseEnter={handleMouseEnter}\n            onMouseLeave={handleMouseLeave}\n          >\n            <div className='px-3 py-1.5 text-xs font-semibold text-neutral-500 dark:text-neutral-400 uppercase tracking-wider border-b border-neutral-100 dark:border-black-600'>\n              Pending Changes ({editedFields.length})\n            </div>\n            <div className='max-h-48 overflow-y-auto'>\n              {editedFields.map((field, idx) => (\n                <button key={idx} onClick={() => handleFieldClick(field.columnKey)} className='w-full px-3 py-2 text-left hover:bg-neutral-50 dark:hover:bg-black-600 transition-colors cursor-pointer'>\n                  <div className='text-xs font-medium text-neutral-700 dark:text-neutral-300 mb-1'>{field.fieldName}</div>\n                  <div className='flex items-center gap-1.5 text-xs'>\n                    <span className='text-neutral-400 dark:text-neutral-500 line-through truncate max-w-[80px]'>{formatValue(field.originalValue, field.originalMeta?.currency_code)}</span>\n                    <span className='text-neutral-400 dark:text-neutral-500 flex-shrink-0'>→</span>\n                    <span className='text-primary-600 dark:text-primary-400 font-medium truncate max-w-[80px]'>{formatValue(field.value, field.meta?.currency_code)}</span>\n                  </div>\n                </button>\n              ))}\n            </div>\n          </div>,\n          document.getElementById('full-screen-container') || document.body,\n        )}\n    </td>\n  );\n};\n"],"names":["formatValue","val","currencyCode","strVal","hasTime","formatted","formatDate","display","PendingEditCell","rowId","rowIndex","pendingEdits","tableHeaders","rowHasPendingEdits","rowHovering","isInlineEditing","is_read","is_modified","is_row_modified","is_deleted","is_added","is_incomplete","showNewItem","onScrollToCell","showTooltip","setShowTooltip","useState","tooltipPosition","setTooltipPosition","hideTimeoutRef","useRef","iconRef","rowPendingEdits","editedFields","useMemo","columnKey","edit","column","col","fieldName","handleFieldClick","handleMouseEnter","rect","handleMouseLeave","bgColor","cn","jsx","EditNoteOutlined","createPortal","jsxs","field","idx"],"mappings":"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"}
+{"version":3,"file":"PendingEditCell.es.js","sources":["../../../../../../src/components/data-display/infinite-table/body/cell/PendingEditCell.tsx"],"sourcesContent":["import { formatDate } from '../../../../../utils/formatters';\nimport { EditNoteOutlined } from '@mui/icons-material';\nimport cn from 'classnames';\nimport React, { useMemo, useRef, useState } from 'react';\nimport { createPortal } from 'react-dom';\n\ntype TPendingEditCellProps = {\n  rowId: string;\n  rowIndex: number;\n  pendingEdits:\n    | Record<string, Record<string, { value: unknown; originalValue?: unknown; meta?: { currency_code?: string | null; [key: string]: unknown | null } | null; originalMeta?: { currency_code?: string | null; [key: string]: unknown | null } | null }>>\n    | undefined;\n  tableHeaders: Array<{ key?: string; Header?: string; display_name?: string }> | undefined;\n  rowHasPendingEdits: boolean;\n  rowHovering?: string;\n  isInlineEditing?: boolean;\n  is_read?: boolean;\n  is_modified?: boolean;\n  is_row_modified?: boolean;\n  is_deleted?: boolean;\n  is_added?: boolean;\n  is_incomplete?: boolean;\n  showNewItem?: boolean;\n  onScrollToCell?: (targetRowId: string, columnKey: string, targetRowIndex: number) => void;\n};\n\nconst formatValue = (val: unknown, currencyCode?: string | null): string => {\n  if (typeof val === 'boolean') return val ? 'Yes' : 'No';\n  if (val === null || val === undefined || val === '') return '-';\n\n  const strVal = String(val);\n  const dateRegex = /^\\d{4}-\\d{2}-\\d{2}(T\\d{2}:\\d{2}(:\\d{2})?)?/;\n  if (dateRegex.test(strVal)) {\n    const hasTime = strVal.includes('T');\n    const formatted = formatDate(strVal, { withTime: hasTime, skipTimezone: true });\n    if (formatted) {\n      return formatted.length > 20 ? formatted.substring(0, 20) + '...' : formatted;\n    }\n  }\n\n  const display = strVal.length > 20 ? strVal.substring(0, 20) + '...' : strVal;\n  if (currencyCode) return `${display} ${currencyCode}`;\n  return display;\n};\n\nexport const PendingEditCell: React.FC<TPendingEditCellProps> = ({\n  rowId,\n  rowIndex,\n  pendingEdits,\n  tableHeaders,\n  rowHasPendingEdits,\n  rowHovering,\n  isInlineEditing,\n  is_read,\n  is_modified,\n  is_row_modified,\n  is_deleted,\n  is_added,\n  is_incomplete,\n  showNewItem,\n  onScrollToCell,\n}) => {\n  const [showTooltip, setShowTooltip] = useState(false);\n  const [tooltipPosition, setTooltipPosition] = useState({ top: 0, left: 0 });\n  const hideTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const iconRef = useRef<HTMLDivElement>(null);\n\n  const rowPendingEdits = pendingEdits?.[rowId];\n\n  const editedFields = useMemo(\n    () =>\n      rowPendingEdits\n        ? Object.entries(rowPendingEdits).map(([columnKey, edit]) => {\n            const column = tableHeaders?.find((col) => col.key === columnKey);\n            const fieldName = column?.Header || column?.display_name || columnKey;\n            return { columnKey, fieldName, value: edit.value, originalValue: edit.originalValue, meta: edit.meta, originalMeta: edit.originalMeta };\n          })\n        : [],\n    [rowPendingEdits, tableHeaders],\n  );\n\n  const handleFieldClick = (columnKey: string) => {\n    setShowTooltip(false);\n    if (hideTimeoutRef.current) { clearTimeout(hideTimeoutRef.current); hideTimeoutRef.current = null; }\n    onScrollToCell?.(rowId, columnKey, rowIndex);\n  };\n\n  const handleMouseEnter = () => {\n    if (!rowHasPendingEdits) return;\n    if (hideTimeoutRef.current) { clearTimeout(hideTimeoutRef.current); hideTimeoutRef.current = null; }\n    if (iconRef.current) {\n      const rect = iconRef.current.getBoundingClientRect();\n      setTooltipPosition({ top: rect.top + rect.height / 2, left: rect.right + 8 });\n    }\n    setShowTooltip(true);\n  };\n\n  const handleMouseLeave = () => {\n    hideTimeoutRef.current = setTimeout(() => { setShowTooltip(false); }, 300);\n  };\n\n  const bgColor = cn({\n    'bg-primary-50 dark:bg-primary-900': isInlineEditing,\n    'bg-neutral-100 dark:bg-black-600': rowHovering === rowId && !isInlineEditing && !is_deleted && !is_added,\n    'bg-error-200 dark:bg-error-900': rowHovering === rowId && !isInlineEditing && is_deleted,\n    'bg-success-100 dark:bg-success-800': rowHovering === rowId && !isInlineEditing && is_added,\n    'bg-primary-50 dark:bg-black-700': !is_incomplete && !is_read && showNewItem && rowHovering !== rowId && !isInlineEditing,\n    'bg-warning-50 dark:bg-black-500': (is_incomplete || is_modified || is_row_modified) && rowHovering !== rowId && !isInlineEditing,\n    'bg-error-100 dark:bg-error-975': is_deleted && rowHovering !== rowId && !isInlineEditing,\n    'bg-success-50 dark:bg-success-900': is_added && rowHovering !== rowId && !isInlineEditing,\n  });\n\n  return (\n    <td className={`min-w-[28px] w-[28px] sticky left-0 z-30 ${bgColor ? bgColor : 'bg-white dark:bg-black-800'} h-[39px]`}>\n      <div ref={iconRef} className='w-full h-[39px] flex items-center justify-center cursor-pointer' onMouseEnter={handleMouseEnter} onMouseLeave={handleMouseLeave}>\n        {rowHasPendingEdits && (\n          <div className='w-5 h-5 rounded-full bg-warning-100 dark:bg-warning-900 flex items-center justify-center shadow-sm border border-warning-200 dark:border-warning-700'>\n            <EditNoteOutlined sx={{ fontSize: 14 }} className='text-warning-600 dark:text-warning-400' />\n          </div>\n        )}\n      </div>\n      {showTooltip && editedFields.length > 0 &&\n        createPortal(\n          <div\n            className='fixed bg-white dark:bg-black-700 rounded-lg shadow-xl border border-neutral-200 dark:border-black-600 py-2 min-w-[200px] max-w-[280px]'\n            style={{ top: tooltipPosition.top, left: tooltipPosition.left, transform: 'translateY(-50%)', zIndex: 99999 }}\n            onMouseEnter={handleMouseEnter}\n            onMouseLeave={handleMouseLeave}\n          >\n            <div className='px-3 py-1.5 text-xs font-semibold text-neutral-500 dark:text-neutral-400 uppercase tracking-wider border-b border-neutral-100 dark:border-black-600'>\n              Pending Changes ({editedFields.length})\n            </div>\n            <div className='max-h-48 overflow-y-auto'>\n              {editedFields.map((field, idx) => (\n                <button key={idx} onClick={() => handleFieldClick(field.columnKey)} className='w-full px-3 py-2 text-left hover:bg-neutral-50 dark:hover:bg-black-600 transition-colors cursor-pointer'>\n                  <div className='text-xs font-medium text-neutral-700 dark:text-neutral-300 mb-1'>{field.fieldName}</div>\n                  <div className='flex items-center gap-1.5 text-xs'>\n                    <span className='text-neutral-400 dark:text-neutral-500 line-through truncate max-w-[80px]'>{formatValue(field.originalValue, field.originalMeta?.currency_code)}</span>\n                    <span className='text-neutral-400 dark:text-neutral-500 flex-shrink-0'>→</span>\n                    <span className='text-primary-600 dark:text-primary-400 font-medium truncate max-w-[80px]'>{formatValue(field.value, field.meta?.currency_code)}</span>\n                  </div>\n                </button>\n              ))}\n            </div>\n          </div>,\n          document.getElementById('full-screen-container') || document.body,\n        )}\n    </td>\n  );\n};\n"],"names":["formatValue","val","currencyCode","strVal","hasTime","formatted","formatDate","display","PendingEditCell","rowId","rowIndex","pendingEdits","tableHeaders","rowHasPendingEdits","rowHovering","isInlineEditing","is_read","is_modified","is_row_modified","is_deleted","is_added","is_incomplete","showNewItem","onScrollToCell","showTooltip","setShowTooltip","useState","tooltipPosition","setTooltipPosition","hideTimeoutRef","useRef","iconRef","rowPendingEdits","editedFields","useMemo","columnKey","edit","column","col","fieldName","handleFieldClick","handleMouseEnter","rect","handleMouseLeave","bgColor","cn","jsx","EditNoteOutlined","createPortal","jsxs","field","idx"],"mappings":"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"}

package/dist/components/data-display/infinite-table/body/cell/RowOptionsCell.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),S=require("../../../../button/ButtonThreeDots.cjs.js"),X=require("../../../../tooltip/Tooltip.cjs.js"),Y=require("../../../../../providers/design-system-provider/hooks.cjs.js"),v=require("@mui/icons-material"),Z=require("antd"),$=require("../../../../../_virtual/index.cjs.js"),a=require("react"),E=require("../../context.cjs.js"),H=require("./SpinnerCell.cjs.js"),I=require("../../../skeleton/loaders/SingleLineLoader.cjs.js"),ee=({rowId:s,rowOptions:l,disableOption:g,rowHovering:r,is_read:R,showNewItem:N,is_modified:T,is_row_modified:L,currentData:o,is_deleted:i,is_added:d,isDraggingOver:F,rowAdditionalActions:x,rowData:w,index:n,bgColor:k,setRowHovering:c,is_incomplete:m,isInlineEditing:t,onConfirmEdit:B,onCancelEdit:P,rowHasPendingEdits:M})=>{const f=Y.useTableConfig(),j=$({"bg-primary-50 dark:bg-primary-900":t,"bg-neutral-100 dark:bg-black-600":r===s&&!t&&!(i||o?.is_deleted)&&!(d||o?.is_added),"bg-error-200 dark:bg-error-900":r===s&&!t&&(i||o?.is_deleted),"bg-success-100 dark:bg-success-800":r===s&&!t&&(d||o?.is_added),"bg-primary-50 dark:bg-black-700":!m&&!R&&N&&r!==s&&!t,"bg-warning-50 dark:bg-black-500":(m||T||L||o?.is_row_modified)&&r!==s&&!t,"bg-error-100 dark:bg-error-975":(i||o?.is_deleted)&&r!==s&&!t,"bg-success-50 dark:bg-success-900":(d||o?.is_added)&&r!==s&&!t,"bg-primary-50":F&&!t,...k&&!t&&{[k]:!0}}),_=a.useCallback(()=>c(s),[c,s]),A=a.useCallback(()=>c(null),[c]),{asyncRowOptionsFilter:p,disableOptionsForRowIndex:u=null,fieldOperationLoading:V}=a.useContext(E.TableContext),z=f?.t?.("Save or cancel pending changes first")??"Save or cancel pending changes first",D=f?.getRowOptionsDropdownProps?.(),b=!!V,[G,y]=a.useState(!!p),[J,C]=a.useState(l),K=l?l.filter(h=>h.isVisible!==!1).length:0,Q=async h=>{if(y(!0),h&&p)try{const O=await p(s),W=l?l.filter(q=>Object.keys(O).includes(q.key)?O[q.key]:!0):[];C(W)}catch{C([])}y(!1)},U=e.jsx("div",{className:"min-w-[140px] max-w-[200px] justify-start whitespace-nowrap items-center py-2 px-1 gap-2","aria-disabled":!0,children:e.jsx(I,{repeat:l?.length||1,lineHeight:"15px"})});return e.jsx("td",{className:`sticky left-0 right-0 z-10 ${j||"bg-white dark:bg-black-800"} h-row`,onMouseEnter:_,onMouseLeave:A,children:e.jsxs("div",{className:"h-full gap-2 top-0 font-medium font-inter overflow-hidden whitespace-nowrap text-ellipsis px-1 w-full flex items-center",children:[e.jsx("div",{className:`${u===n?"opacity-50":""}`,"aria-disabled":u===n,children:x?x(w,n,r===s):null}),t?e.jsxs("div",{className:`flex items-center gap-2 ${b?"pointer-events-none opacity-50":""}`,children:[e.jsx("div",{className:"cursor-pointer hover:bg-neutral-100 dark:hover:bg-black-600 rounded p-0.5",onClick:()=>!b&&P?.(),children:e.jsx(v.CloseRounded,{sx:{height:20,width:20,color:"#667085"}})}),e.jsx("div",{className:"cursor-pointer hover:bg-neutral-100 dark:hover:bg-black-600 rounded p-0.5",onClick:()=>!b&&B?.(),children:e.jsx(v.CheckRounded,{sx:{height:20,width:20,color:"var(--color-primary-600)"}})})]}):l?e.jsx(e.Fragment,{children:u===n?e.jsx(H.SpinnerCell,{}):M?e.jsx(X,{title:z,children:e.jsx("span",{children:e.jsx(S.ButtonThreeDots,{disabled:!0})})}):e.jsx(Z.Dropdown,{menu:{items:G?[{label:U,key:"loading"}]:J},trigger:["click"],overlayClassName:"row-option-cell table-row-option-dropdown",onOpenChange:Q,disabled:g||K===0,...D||{},children:e.jsx(S.ButtonThreeDots,{disabled:g})})}):null]})})};exports.RowOptionsCell=ee;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),S=require("../../../../button/ButtonThreeDots.cjs.js"),X=require("../../../../tooltip/Tooltip.cjs.js"),Y=require("../../../../../providers/design-system-provider/hooks.cjs.js"),v=require("@mui/icons-material"),Z=require("antd"),$=require("../../../../../_virtual/index.cjs.js"),a=require("react"),E=require("../../context.cjs.js"),H=require("./SpinnerCell.cjs.js"),I=require("../../../skeleton/loaders/SingleLineLoader.cjs.js"),ee=({rowId:s,rowOptions:l,disableOption:g,rowHovering:r,is_read:R,showNewItem:N,is_modified:T,is_row_modified:L,currentData:o,is_deleted:i,is_added:d,isDraggingOver:F,rowAdditionalActions:x,rowData:B,index:n,bgColor:k,setRowHovering:c,is_incomplete:m,isInlineEditing:t,onConfirmEdit:P,onCancelEdit:w,rowHasPendingEdits:M})=>{const f=Y.useTableConfig(),j=$({"bg-primary-50 dark:bg-primary-900":t,"bg-neutral-100 dark:bg-black-600":r===s&&!t&&!(i||o?.is_deleted)&&!(d||o?.is_added),"bg-error-200 dark:bg-error-900":r===s&&!t&&(i||o?.is_deleted),"bg-success-100 dark:bg-success-800":r===s&&!t&&(d||o?.is_added),"bg-primary-50 dark:bg-black-700":!m&&!R&&N&&r!==s&&!t,"bg-warning-50 dark:bg-black-500":(m||T||L||o?.is_row_modified)&&r!==s&&!t,"bg-error-100 dark:bg-error-975":(i||o?.is_deleted)&&r!==s&&!t,"bg-success-50 dark:bg-success-900":(d||o?.is_added)&&r!==s&&!t,"bg-primary-50":F&&!t,...k&&!t&&{[k]:!0}}),_=a.useCallback(()=>c(s),[c,s]),A=a.useCallback(()=>c(null),[c]),{asyncRowOptionsFilter:p,disableOptionsForRowIndex:u=null,fieldOperationLoading:V}=a.useContext(E.TableContext),z=f?.t?.("Save or cancel pending changes first")??"Save or cancel pending changes first",D=f?.getRowOptionsDropdownProps?.(),b=!!V,[G,y]=a.useState(!!p),[J,C]=a.useState(l),K=l?l.filter(h=>h.isVisible!==!1).length:0,Q=async h=>{if(y(!0),h&&p)try{const O=await p(s),W=l?l.filter(q=>Object.keys(O).includes(q.key)?O[q.key]:!0):[];C(W)}catch{C([])}y(!1)},U=e.jsx("div",{className:"min-w-[140px] max-w-[200px] justify-start whitespace-nowrap items-center py-2 px-1 gap-2","aria-disabled":!0,children:e.jsx(I,{repeat:l?.length||1,lineHeight:"15px"})});return e.jsx("td",{className:`sticky left-0 right-0 z-10 ${j||"bg-white dark:bg-black-800"} h-[39px]`,onMouseEnter:_,onMouseLeave:A,children:e.jsxs("div",{className:"h-full gap-2 top-0 font-medium font-inter overflow-hidden whitespace-nowrap text-ellipsis px-1 w-full flex items-center",children:[e.jsx("div",{className:`${u===n?"opacity-50":""}`,"aria-disabled":u===n,children:x?x(B,n,r===s):null}),t?e.jsxs("div",{className:`flex items-center gap-2 ${b?"pointer-events-none opacity-50":""}`,children:[e.jsx("div",{className:"cursor-pointer hover:bg-neutral-100 dark:hover:bg-black-600 rounded p-0.5",onClick:()=>!b&&w?.(),children:e.jsx(v.CloseRounded,{sx:{height:20,width:20,color:"#667085"}})}),e.jsx("div",{className:"cursor-pointer hover:bg-neutral-100 dark:hover:bg-black-600 rounded p-0.5",onClick:()=>!b&&P?.(),children:e.jsx(v.CheckRounded,{sx:{height:20,width:20,color:"var(--color-primary-600)"}})})]}):l?e.jsx(e.Fragment,{children:u===n?e.jsx(H.SpinnerCell,{}):M?e.jsx(X,{title:z,children:e.jsx("span",{children:e.jsx(S.ButtonThreeDots,{disabled:!0})})}):e.jsx(Z.Dropdown,{menu:{items:G?[{label:U,key:"loading"}]:J},trigger:["click"],overlayClassName:"row-option-cell table-row-option-dropdown",onOpenChange:Q,disabled:g||K===0,...D||{},children:e.jsx(S.ButtonThreeDots,{disabled:g})})}):null]})})};exports.RowOptionsCell=ee;
 //# sourceMappingURL=RowOptionsCell.cjs.js.map

package/dist/components/data-display/infinite-table/body/cell/RowOptionsCell.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"RowOptionsCell.cjs.js","sources":["../../../../../../src/components/data-display/infinite-table/body/cell/RowOptionsCell.tsx"],"sourcesContent":["import { SingleLineLoader } from '../../../../data-display/skeleton/loaders';\nimport { ButtonThreeDots } from '../../../../button/ButtonThreeDots';\nimport Tooltip from '../../../../tooltip/Tooltip';\nimport { useTableConfig } from '../../../../../providers/design-system-provider/hooks';\nimport { CheckRounded, CloseRounded } from '@mui/icons-material';\nimport { Dropdown } from 'antd';\nimport cn from 'classnames';\nimport { useCallback, useContext, useState } from 'react';\n\nimport { TableContext } from '../../context';\nimport { SpinnerCell } from './SpinnerCell';\n\ntype TProps = {\n  rowId: string | number;\n  rowOptions: Array<{ key: string; label: React.ReactNode; isVisible?: boolean; [k: string]: unknown }>;\n  disableOption: boolean;\n  rowHovering: string | number | null;\n  is_read: boolean;\n  showNewItem: boolean;\n  is_modified: boolean;\n  is_row_modified: boolean;\n  currentData: Record<string, unknown>;\n  is_deleted: boolean;\n  is_added: boolean;\n  isDraggingOver: boolean;\n  rowData: Record<string, unknown>;\n  index: number;\n  rowAdditionalActions: (rowData: Record<string, unknown>, index: number, isHovering: boolean) => React.ReactNode;\n  bgColor?: string;\n  setRowHovering: (rowId: string | number | null) => void;\n  is_incomplete?: boolean;\n  isInlineEditing?: boolean;\n  onConfirmEdit?: () => void;\n  onCancelEdit?: () => void;\n  rowHasPendingEdits?: boolean;\n};\n\nexport const RowOptionsCell = ({\n  rowId, rowOptions, disableOption, rowHovering, is_read, showNewItem, is_modified, is_row_modified, currentData,\n  is_deleted, is_added, isDraggingOver, rowAdditionalActions, rowData, index, bgColor: bgColorProp, setRowHovering,\n  is_incomplete, isInlineEditing, onConfirmEdit, onCancelEdit, rowHasPendingEdits,\n}: TProps) => {\n  const tableConfig = useTableConfig();\n  const bgColor = cn({\n    'bg-primary-50 dark:bg-primary-900': isInlineEditing,\n    'bg-neutral-100 dark:bg-black-600': rowHovering === rowId && !isInlineEditing && !(is_deleted || currentData?.is_deleted) && !(is_added || currentData?.is_added),\n    'bg-error-200 dark:bg-error-900': rowHovering === rowId && !isInlineEditing && (is_deleted || currentData?.is_deleted),\n    'bg-success-100 dark:bg-success-800': rowHovering === rowId && !isInlineEditing && (is_added || currentData?.is_added),\n    'bg-primary-50 dark:bg-black-700': !is_incomplete && !is_read && showNewItem && rowHovering !== rowId && !isInlineEditing,\n    'bg-warning-50 dark:bg-black-500': (is_incomplete || is_modified || is_row_modified || currentData?.is_row_modified) && rowHovering !== rowId && !isInlineEditing,\n    'bg-error-100 dark:bg-error-975': (is_deleted || currentData?.is_deleted) && rowHovering !== rowId && !isInlineEditing,\n    'bg-success-50 dark:bg-success-900': (is_added || currentData?.is_added) && rowHovering !== rowId && !isInlineEditing,\n    'bg-primary-50': isDraggingOver && !isInlineEditing,\n    ...(bgColorProp && !isInlineEditing && { [bgColorProp]: true }),\n  });\n\n  const onMouseEnter = useCallback(() => setRowHovering(rowId), [setRowHovering, rowId]);\n  const onMouseLeave = useCallback(() => setRowHovering(null), [setRowHovering]);\n\n  const { asyncRowOptionsFilter, disableOptionsForRowIndex = null, fieldOperationLoading } = useContext(TableContext);\n  const pendingEditsTooltip = tableConfig?.t?.('Save or cancel pending changes first') ?? 'Save or cancel pending changes first';\n  const rowOptionsDropdownProps = tableConfig?.getRowOptionsDropdownProps?.();\n  const isAnyFieldOperationLoading = Boolean(fieldOperationLoading);\n  const [isOptionLoading, setIsOptionLoading] = useState(!!asyncRowOptionsFilter);\n  const [filteredRowOptions, setFilteredRowOptions] = useState(rowOptions);\n  const visibleRowOptions = rowOptions ? rowOptions.filter((option) => option.isVisible !== false).length : 0;\n\n  const handleDropdownVisibleChange = async (visible: boolean) => {\n    setIsOptionLoading(true);\n    if (visible && asyncRowOptionsFilter) {\n      try {\n        const buttonState = await asyncRowOptionsFilter(rowId);\n        const filteredOptions = rowOptions ? rowOptions.filter((option) => { const existOnAPI = Object.keys(buttonState).includes(option.key); return existOnAPI ? buttonState[option.key] : true; }) : [];\n        setFilteredRowOptions(filteredOptions);\n      } catch { setFilteredRowOptions([]); }\n    }\n    setIsOptionLoading(false);\n  };\n\n  const getSkeleton = (\n    <div className={`min-w-[140px] max-w-[200px] justify-start whitespace-nowrap items-center py-2 px-1 gap-2`} aria-disabled={true}>\n      <SingleLineLoader repeat={rowOptions?.length || 1} lineHeight='15px' />\n    </div>\n  );\n\n  return (\n    <td className={`sticky left-0 right-0 z-10 ${bgColor ? bgColor : 'bg-white dark:bg-black-800'} h-row`} onMouseEnter={onMouseEnter} onMouseLeave={onMouseLeave}>\n      <div className={`h-full gap-2 top-0 font-medium font-inter overflow-hidden whitespace-nowrap text-ellipsis px-1 w-full flex items-center`}>\n        <div className={`${disableOptionsForRowIndex === index ? 'opacity-50' : ''}`} aria-disabled={disableOptionsForRowIndex === index}>\n          {rowAdditionalActions ? rowAdditionalActions(rowData, index, rowHovering === rowId) : null}\n        </div>\n        {isInlineEditing ? (\n          <div className={`flex items-center gap-2 ${isAnyFieldOperationLoading ? 'pointer-events-none opacity-50' : ''}`}>\n            <div className='cursor-pointer hover:bg-neutral-100 dark:hover:bg-black-600 rounded p-0.5' onClick={() => !isAnyFieldOperationLoading && onCancelEdit?.()}>\n              <CloseRounded sx={{ height: 20, width: 20, color: '#667085' }} />\n            </div>\n            <div className='cursor-pointer hover:bg-neutral-100 dark:hover:bg-black-600 rounded p-0.5' onClick={() => !isAnyFieldOperationLoading && onConfirmEdit?.()}>\n              <CheckRounded sx={{ height: 20, width: 20, color: 'var(--color-primary-600)' }} />\n            </div>\n          </div>\n        ) : rowOptions ? (\n          <>\n            {disableOptionsForRowIndex === index ? (\n              <SpinnerCell />\n            ) : rowHasPendingEdits ? (\n              <Tooltip title={pendingEditsTooltip}>\n                <span><ButtonThreeDots disabled /></span>\n              </Tooltip>\n            ) : (\n              <Dropdown\n                menu={{ items: isOptionLoading ? [{ label: getSkeleton, key: 'loading' }] : filteredRowOptions }}\n                trigger={['click']}\n                overlayClassName='row-option-cell table-row-option-dropdown'\n                onOpenChange={handleDropdownVisibleChange}\n                disabled={disableOption || visibleRowOptions === 0}\n                {...(rowOptionsDropdownProps || {})}\n              >\n                <ButtonThreeDots disabled={disableOption} />\n              </Dropdown>\n            )}\n          </>\n        ) : null}\n      </div>\n    </td>\n  );\n};\n"],"names":["RowOptionsCell","rowId","rowOptions","disableOption","rowHovering","is_read","showNewItem","is_modified","is_row_modified","currentData","is_deleted","is_added","isDraggingOver","rowAdditionalActions","rowData","index","bgColorProp","setRowHovering","is_incomplete","isInlineEditing","onConfirmEdit","onCancelEdit","rowHasPendingEdits","tableConfig","useTableConfig","bgColor","cn","onMouseEnter","useCallback","onMouseLeave","asyncRowOptionsFilter","disableOptionsForRowIndex","fieldOperationLoading","useContext","TableContext","pendingEditsTooltip","rowOptionsDropdownProps","isAnyFieldOperationLoading","isOptionLoading","setIsOptionLoading","useState","filteredRowOptions","setFilteredRowOptions","visibleRowOptions","option","handleDropdownVisibleChange","visible","buttonState","filteredOptions","getSkeleton","jsx","SingleLineLoader","jsxs","CloseRounded","CheckRounded","Fragment","SpinnerCell","Tooltip","ButtonThreeDots","Dropdown"],"mappings":"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"}
+{"version":3,"file":"RowOptionsCell.cjs.js","sources":["../../../../../../src/components/data-display/infinite-table/body/cell/RowOptionsCell.tsx"],"sourcesContent":["import { SingleLineLoader } from '../../../../data-display/skeleton/loaders';\nimport { ButtonThreeDots } from '../../../../button/ButtonThreeDots';\nimport Tooltip from '../../../../tooltip/Tooltip';\nimport { useTableConfig } from '../../../../../providers/design-system-provider/hooks';\nimport { CheckRounded, CloseRounded } from '@mui/icons-material';\nimport { Dropdown } from 'antd';\nimport cn from 'classnames';\nimport { useCallback, useContext, useState } from 'react';\n\nimport { TableContext } from '../../context';\nimport { SpinnerCell } from './SpinnerCell';\n\ntype TProps = {\n  rowId: string | number;\n  rowOptions: Array<{ key: string; label: React.ReactNode; isVisible?: boolean; [k: string]: unknown }>;\n  disableOption: boolean;\n  rowHovering: string | number | null;\n  is_read: boolean;\n  showNewItem: boolean;\n  is_modified: boolean;\n  is_row_modified: boolean;\n  currentData: Record<string, unknown>;\n  is_deleted: boolean;\n  is_added: boolean;\n  isDraggingOver: boolean;\n  rowData: Record<string, unknown>;\n  index: number;\n  rowAdditionalActions: (rowData: Record<string, unknown>, index: number, isHovering: boolean) => React.ReactNode;\n  bgColor?: string;\n  setRowHovering: (rowId: string | number | null) => void;\n  is_incomplete?: boolean;\n  isInlineEditing?: boolean;\n  onConfirmEdit?: () => void;\n  onCancelEdit?: () => void;\n  rowHasPendingEdits?: boolean;\n};\n\nexport const RowOptionsCell = ({\n  rowId, rowOptions, disableOption, rowHovering, is_read, showNewItem, is_modified, is_row_modified, currentData,\n  is_deleted, is_added, isDraggingOver, rowAdditionalActions, rowData, index, bgColor: bgColorProp, setRowHovering,\n  is_incomplete, isInlineEditing, onConfirmEdit, onCancelEdit, rowHasPendingEdits,\n}: TProps) => {\n  const tableConfig = useTableConfig();\n  const bgColor = cn({\n    'bg-primary-50 dark:bg-primary-900': isInlineEditing,\n    'bg-neutral-100 dark:bg-black-600': rowHovering === rowId && !isInlineEditing && !(is_deleted || currentData?.is_deleted) && !(is_added || currentData?.is_added),\n    'bg-error-200 dark:bg-error-900': rowHovering === rowId && !isInlineEditing && (is_deleted || currentData?.is_deleted),\n    'bg-success-100 dark:bg-success-800': rowHovering === rowId && !isInlineEditing && (is_added || currentData?.is_added),\n    'bg-primary-50 dark:bg-black-700': !is_incomplete && !is_read && showNewItem && rowHovering !== rowId && !isInlineEditing,\n    'bg-warning-50 dark:bg-black-500': (is_incomplete || is_modified || is_row_modified || currentData?.is_row_modified) && rowHovering !== rowId && !isInlineEditing,\n    'bg-error-100 dark:bg-error-975': (is_deleted || currentData?.is_deleted) && rowHovering !== rowId && !isInlineEditing,\n    'bg-success-50 dark:bg-success-900': (is_added || currentData?.is_added) && rowHovering !== rowId && !isInlineEditing,\n    'bg-primary-50': isDraggingOver && !isInlineEditing,\n    ...(bgColorProp && !isInlineEditing && { [bgColorProp]: true }),\n  });\n\n  const onMouseEnter = useCallback(() => setRowHovering(rowId), [setRowHovering, rowId]);\n  const onMouseLeave = useCallback(() => setRowHovering(null), [setRowHovering]);\n\n  const { asyncRowOptionsFilter, disableOptionsForRowIndex = null, fieldOperationLoading } = useContext(TableContext);\n  const pendingEditsTooltip = tableConfig?.t?.('Save or cancel pending changes first') ?? 'Save or cancel pending changes first';\n  const rowOptionsDropdownProps = tableConfig?.getRowOptionsDropdownProps?.();\n  const isAnyFieldOperationLoading = Boolean(fieldOperationLoading);\n  const [isOptionLoading, setIsOptionLoading] = useState(!!asyncRowOptionsFilter);\n  const [filteredRowOptions, setFilteredRowOptions] = useState(rowOptions);\n  const visibleRowOptions = rowOptions ? rowOptions.filter((option) => option.isVisible !== false).length : 0;\n\n  const handleDropdownVisibleChange = async (visible: boolean) => {\n    setIsOptionLoading(true);\n    if (visible && asyncRowOptionsFilter) {\n      try {\n        const buttonState = await asyncRowOptionsFilter(rowId);\n        const filteredOptions = rowOptions ? rowOptions.filter((option) => { const existOnAPI = Object.keys(buttonState).includes(option.key); return existOnAPI ? buttonState[option.key] : true; }) : [];\n        setFilteredRowOptions(filteredOptions);\n      } catch { setFilteredRowOptions([]); }\n    }\n    setIsOptionLoading(false);\n  };\n\n  const getSkeleton = (\n    <div className={`min-w-[140px] max-w-[200px] justify-start whitespace-nowrap items-center py-2 px-1 gap-2`} aria-disabled={true}>\n      <SingleLineLoader repeat={rowOptions?.length || 1} lineHeight='15px' />\n    </div>\n  );\n\n  return (\n    <td className={`sticky left-0 right-0 z-10 ${bgColor ? bgColor : 'bg-white dark:bg-black-800'} h-[39px]`} onMouseEnter={onMouseEnter} onMouseLeave={onMouseLeave}>\n      <div className={`h-full gap-2 top-0 font-medium font-inter overflow-hidden whitespace-nowrap text-ellipsis px-1 w-full flex items-center`}>\n        <div className={`${disableOptionsForRowIndex === index ? 'opacity-50' : ''}`} aria-disabled={disableOptionsForRowIndex === index}>\n          {rowAdditionalActions ? rowAdditionalActions(rowData, index, rowHovering === rowId) : null}\n        </div>\n        {isInlineEditing ? (\n          <div className={`flex items-center gap-2 ${isAnyFieldOperationLoading ? 'pointer-events-none opacity-50' : ''}`}>\n            <div className='cursor-pointer hover:bg-neutral-100 dark:hover:bg-black-600 rounded p-0.5' onClick={() => !isAnyFieldOperationLoading && onCancelEdit?.()}>\n              <CloseRounded sx={{ height: 20, width: 20, color: '#667085' }} />\n            </div>\n            <div className='cursor-pointer hover:bg-neutral-100 dark:hover:bg-black-600 rounded p-0.5' onClick={() => !isAnyFieldOperationLoading && onConfirmEdit?.()}>\n              <CheckRounded sx={{ height: 20, width: 20, color: 'var(--color-primary-600)' }} />\n            </div>\n          </div>\n        ) : rowOptions ? (\n          <>\n            {disableOptionsForRowIndex === index ? (\n              <SpinnerCell />\n            ) : rowHasPendingEdits ? (\n              <Tooltip title={pendingEditsTooltip}>\n                <span><ButtonThreeDots disabled /></span>\n              </Tooltip>\n            ) : (\n              <Dropdown\n                menu={{ items: isOptionLoading ? [{ label: getSkeleton, key: 'loading' }] : filteredRowOptions }}\n                trigger={['click']}\n                overlayClassName='row-option-cell table-row-option-dropdown'\n                onOpenChange={handleDropdownVisibleChange}\n                disabled={disableOption || visibleRowOptions === 0}\n                {...(rowOptionsDropdownProps || {})}\n              >\n                <ButtonThreeDots disabled={disableOption} />\n              </Dropdown>\n            )}\n          </>\n        ) : null}\n      </div>\n    </td>\n  );\n};\n"],"names":["RowOptionsCell","rowId","rowOptions","disableOption","rowHovering","is_read","showNewItem","is_modified","is_row_modified","currentData","is_deleted","is_added","isDraggingOver","rowAdditionalActions","rowData","index","bgColorProp","setRowHovering","is_incomplete","isInlineEditing","onConfirmEdit","onCancelEdit","rowHasPendingEdits","tableConfig","useTableConfig","bgColor","cn","onMouseEnter","useCallback","onMouseLeave","asyncRowOptionsFilter","disableOptionsForRowIndex","fieldOperationLoading","useContext","TableContext","pendingEditsTooltip","rowOptionsDropdownProps","isAnyFieldOperationLoading","isOptionLoading","setIsOptionLoading","useState","filteredRowOptions","setFilteredRowOptions","visibleRowOptions","option","handleDropdownVisibleChange","visible","buttonState","filteredOptions","getSkeleton","jsx","SingleLineLoader","jsxs","CloseRounded","CheckRounded","Fragment","SpinnerCell","Tooltip","ButtonThreeDots","Dropdown"],"mappings":"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"}

package/dist/components/data-display/infinite-table/body/cell/RowOptionsCell.es.js

@@ -5,60 +5,60 @@ import { useTableConfig as D } from "../../../../../providers/design-system-prov
 import { CloseRounded as E, CheckRounded as H } from "@mui/icons-material";
 import { Dropdown as I } from "antd";
 import ee from "../../../../../_virtual/index.es.js";
-import { useCallback as S, useContext as oe, useState as R } from "react";
-import { TableContext as te } from "../../context.es.js";
+import { useCallback as S, useContext as te, useState as R } from "react";
+import { TableContext as oe } from "../../context.es.js";
 import { SpinnerCell as re } from "./SpinnerCell.es.js";
 import se from "../../../skeleton/loaders/SingleLineLoader.es.js";
 const ue = ({
-  rowId: o,
+  rowId: t,
   rowOptions: s,
   disableOption: h,
   rowHovering: r,
   is_read: F,
   showNewItem: T,
   is_modified: j,
-  is_row_modified: w,
+  is_row_modified: P,
   currentData: a,
   is_deleted: n,
   is_added: i,
-  isDraggingOver: P,
+  isDraggingOver: _,
   rowAdditionalActions: g,
-  rowData: _,
+  rowData: $,
   index: l,
   bgColor: f,
   setRowHovering: c,
   is_incomplete: u,
-  isInlineEditing: t,
-  onConfirmEdit: $,
+  isInlineEditing: o,
+  onConfirmEdit: w,
   onCancelEdit: B,
   rowHasPendingEdits: M
 }) => {
   const k = D(), y = ee({
-    "bg-primary-50 dark:bg-primary-900": t,
-    "bg-neutral-100 dark:bg-black-600": r === o && !t && !(n || a?.is_deleted) && !(i || a?.is_added),
-    "bg-error-200 dark:bg-error-900": r === o && !t && (n || a?.is_deleted),
-    "bg-success-100 dark:bg-success-800": r === o && !t && (i || a?.is_added),
-    "bg-primary-50 dark:bg-black-700": !u && !F && T && r !== o && !t,
-    "bg-warning-50 dark:bg-black-500": (u || j || w || a?.is_row_modified) && r !== o && !t,
-    "bg-error-100 dark:bg-error-975": (n || a?.is_deleted) && r !== o && !t,
-    "bg-success-50 dark:bg-success-900": (i || a?.is_added) && r !== o && !t,
-    "bg-primary-50": P && !t,
-    ...f && !t && { [f]: !0 }
-  }), V = S(() => c(o), [c, o]), z = S(() => c(null), [c]), { asyncRowOptionsFilter: p, disableOptionsForRowIndex: d = null, fieldOperationLoading: A } = oe(te), q = k?.t?.("Save or cancel pending changes first") ?? "Save or cancel pending changes first", G = k?.getRowOptionsDropdownProps?.(), b = !!A, [J, x] = R(!!p), [K, C] = R(s), Q = s ? s.filter((m) => m.isVisible !== !1).length : 0, U = async (m) => {
+    "bg-primary-50 dark:bg-primary-900": o,
+    "bg-neutral-100 dark:bg-black-600": r === t && !o && !(n || a?.is_deleted) && !(i || a?.is_added),
+    "bg-error-200 dark:bg-error-900": r === t && !o && (n || a?.is_deleted),
+    "bg-success-100 dark:bg-success-800": r === t && !o && (i || a?.is_added),
+    "bg-primary-50 dark:bg-black-700": !u && !F && T && r !== t && !o,
+    "bg-warning-50 dark:bg-black-500": (u || j || P || a?.is_row_modified) && r !== t && !o,
+    "bg-error-100 dark:bg-error-975": (n || a?.is_deleted) && r !== t && !o,
+    "bg-success-50 dark:bg-success-900": (i || a?.is_added) && r !== t && !o,
+    "bg-primary-50": _ && !o,
+    ...f && !o && { [f]: !0 }
+  }), V = S(() => c(t), [c, t]), z = S(() => c(null), [c]), { asyncRowOptionsFilter: p, disableOptionsForRowIndex: d = null, fieldOperationLoading: A } = te(oe), q = k?.t?.("Save or cancel pending changes first") ?? "Save or cancel pending changes first", G = k?.getRowOptionsDropdownProps?.(), b = !!A, [J, x] = R(!!p), [K, C] = R(s), Q = s ? s.filter((m) => m.isVisible !== !1).length : 0, U = async (m) => {
     if (x(!0), m && p)
       try {
-        const O = await p(o), X = s ? s.filter((v) => Object.keys(O).includes(v.key) ? O[v.key] : !0) : [];
+        const O = await p(t), X = s ? s.filter((v) => Object.keys(O).includes(v.key) ? O[v.key] : !0) : [];
         C(X);
       } catch {
         C([]);
       }
     x(!1);
   }, W = /* @__PURE__ */ e("div", { className: "min-w-[140px] max-w-[200px] justify-start whitespace-nowrap items-center py-2 px-1 gap-2", "aria-disabled": !0, children: /* @__PURE__ */ e(se, { repeat: s?.length || 1, lineHeight: "15px" }) });
-  return /* @__PURE__ */ e("td", { className: `sticky left-0 right-0 z-10 ${y || "bg-white dark:bg-black-800"} h-row`, onMouseEnter: V, onMouseLeave: z, children: /* @__PURE__ */ N("div", { className: "h-full gap-2 top-0 font-medium font-inter overflow-hidden whitespace-nowrap text-ellipsis px-1 w-full flex items-center", children: [
-    /* @__PURE__ */ e("div", { className: `${d === l ? "opacity-50" : ""}`, "aria-disabled": d === l, children: g ? g(_, l, r === o) : null }),
-    t ? /* @__PURE__ */ N("div", { className: `flex items-center gap-2 ${b ? "pointer-events-none opacity-50" : ""}`, children: [
+  return /* @__PURE__ */ e("td", { className: `sticky left-0 right-0 z-10 ${y || "bg-white dark:bg-black-800"} h-[39px]`, onMouseEnter: V, onMouseLeave: z, children: /* @__PURE__ */ N("div", { className: "h-full gap-2 top-0 font-medium font-inter overflow-hidden whitespace-nowrap text-ellipsis px-1 w-full flex items-center", children: [
+    /* @__PURE__ */ e("div", { className: `${d === l ? "opacity-50" : ""}`, "aria-disabled": d === l, children: g ? g($, l, r === t) : null }),
+    o ? /* @__PURE__ */ N("div", { className: `flex items-center gap-2 ${b ? "pointer-events-none opacity-50" : ""}`, children: [
       /* @__PURE__ */ e("div", { className: "cursor-pointer hover:bg-neutral-100 dark:hover:bg-black-600 rounded p-0.5", onClick: () => !b && B?.(), children: /* @__PURE__ */ e(E, { sx: { height: 20, width: 20, color: "#667085" } }) }),
-      /* @__PURE__ */ e("div", { className: "cursor-pointer hover:bg-neutral-100 dark:hover:bg-black-600 rounded p-0.5", onClick: () => !b && $?.(), children: /* @__PURE__ */ e(H, { sx: { height: 20, width: 20, color: "var(--color-primary-600)" } }) })
+      /* @__PURE__ */ e("div", { className: "cursor-pointer hover:bg-neutral-100 dark:hover:bg-black-600 rounded p-0.5", onClick: () => !b && w?.(), children: /* @__PURE__ */ e(H, { sx: { height: 20, width: 20, color: "var(--color-primary-600)" } }) })
     ] }) : s ? /* @__PURE__ */ e(Y, { children: d === l ? /* @__PURE__ */ e(re, {}) : M ? /* @__PURE__ */ e(Z, { title: q, children: /* @__PURE__ */ e("span", { children: /* @__PURE__ */ e(L, { disabled: !0 }) }) }) : /* @__PURE__ */ e(
       I,
       {

package/dist/components/data-display/infinite-table/body/cell/RowOptionsCell.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"RowOptionsCell.es.js","sources":["../../../../../../src/components/data-display/infinite-table/body/cell/RowOptionsCell.tsx"],"sourcesContent":["import { SingleLineLoader } from '../../../../data-display/skeleton/loaders';\nimport { ButtonThreeDots } from '../../../../button/ButtonThreeDots';\nimport Tooltip from '../../../../tooltip/Tooltip';\nimport { useTableConfig } from '../../../../../providers/design-system-provider/hooks';\nimport { CheckRounded, CloseRounded } from '@mui/icons-material';\nimport { Dropdown } from 'antd';\nimport cn from 'classnames';\nimport { useCallback, useContext, useState } from 'react';\n\nimport { TableContext } from '../../context';\nimport { SpinnerCell } from './SpinnerCell';\n\ntype TProps = {\n  rowId: string | number;\n  rowOptions: Array<{ key: string; label: React.ReactNode; isVisible?: boolean; [k: string]: unknown }>;\n  disableOption: boolean;\n  rowHovering: string | number | null;\n  is_read: boolean;\n  showNewItem: boolean;\n  is_modified: boolean;\n  is_row_modified: boolean;\n  currentData: Record<string, unknown>;\n  is_deleted: boolean;\n  is_added: boolean;\n  isDraggingOver: boolean;\n  rowData: Record<string, unknown>;\n  index: number;\n  rowAdditionalActions: (rowData: Record<string, unknown>, index: number, isHovering: boolean) => React.ReactNode;\n  bgColor?: string;\n  setRowHovering: (rowId: string | number | null) => void;\n  is_incomplete?: boolean;\n  isInlineEditing?: boolean;\n  onConfirmEdit?: () => void;\n  onCancelEdit?: () => void;\n  rowHasPendingEdits?: boolean;\n};\n\nexport const RowOptionsCell = ({\n  rowId, rowOptions, disableOption, rowHovering, is_read, showNewItem, is_modified, is_row_modified, currentData,\n  is_deleted, is_added, isDraggingOver, rowAdditionalActions, rowData, index, bgColor: bgColorProp, setRowHovering,\n  is_incomplete, isInlineEditing, onConfirmEdit, onCancelEdit, rowHasPendingEdits,\n}: TProps) => {\n  const tableConfig = useTableConfig();\n  const bgColor = cn({\n    'bg-primary-50 dark:bg-primary-900': isInlineEditing,\n    'bg-neutral-100 dark:bg-black-600': rowHovering === rowId && !isInlineEditing && !(is_deleted || currentData?.is_deleted) && !(is_added || currentData?.is_added),\n    'bg-error-200 dark:bg-error-900': rowHovering === rowId && !isInlineEditing && (is_deleted || currentData?.is_deleted),\n    'bg-success-100 dark:bg-success-800': rowHovering === rowId && !isInlineEditing && (is_added || currentData?.is_added),\n    'bg-primary-50 dark:bg-black-700': !is_incomplete && !is_read && showNewItem && rowHovering !== rowId && !isInlineEditing,\n    'bg-warning-50 dark:bg-black-500': (is_incomplete || is_modified || is_row_modified || currentData?.is_row_modified) && rowHovering !== rowId && !isInlineEditing,\n    'bg-error-100 dark:bg-error-975': (is_deleted || currentData?.is_deleted) && rowHovering !== rowId && !isInlineEditing,\n    'bg-success-50 dark:bg-success-900': (is_added || currentData?.is_added) && rowHovering !== rowId && !isInlineEditing,\n    'bg-primary-50': isDraggingOver && !isInlineEditing,\n    ...(bgColorProp && !isInlineEditing && { [bgColorProp]: true }),\n  });\n\n  const onMouseEnter = useCallback(() => setRowHovering(rowId), [setRowHovering, rowId]);\n  const onMouseLeave = useCallback(() => setRowHovering(null), [setRowHovering]);\n\n  const { asyncRowOptionsFilter, disableOptionsForRowIndex = null, fieldOperationLoading } = useContext(TableContext);\n  const pendingEditsTooltip = tableConfig?.t?.('Save or cancel pending changes first') ?? 'Save or cancel pending changes first';\n  const rowOptionsDropdownProps = tableConfig?.getRowOptionsDropdownProps?.();\n  const isAnyFieldOperationLoading = Boolean(fieldOperationLoading);\n  const [isOptionLoading, setIsOptionLoading] = useState(!!asyncRowOptionsFilter);\n  const [filteredRowOptions, setFilteredRowOptions] = useState(rowOptions);\n  const visibleRowOptions = rowOptions ? rowOptions.filter((option) => option.isVisible !== false).length : 0;\n\n  const handleDropdownVisibleChange = async (visible: boolean) => {\n    setIsOptionLoading(true);\n    if (visible && asyncRowOptionsFilter) {\n      try {\n        const buttonState = await asyncRowOptionsFilter(rowId);\n        const filteredOptions = rowOptions ? rowOptions.filter((option) => { const existOnAPI = Object.keys(buttonState).includes(option.key); return existOnAPI ? buttonState[option.key] : true; }) : [];\n        setFilteredRowOptions(filteredOptions);\n      } catch { setFilteredRowOptions([]); }\n    }\n    setIsOptionLoading(false);\n  };\n\n  const getSkeleton = (\n    <div className={`min-w-[140px] max-w-[200px] justify-start whitespace-nowrap items-center py-2 px-1 gap-2`} aria-disabled={true}>\n      <SingleLineLoader repeat={rowOptions?.length || 1} lineHeight='15px' />\n    </div>\n  );\n\n  return (\n    <td className={`sticky left-0 right-0 z-10 ${bgColor ? bgColor : 'bg-white dark:bg-black-800'} h-row`} onMouseEnter={onMouseEnter} onMouseLeave={onMouseLeave}>\n      <div className={`h-full gap-2 top-0 font-medium font-inter overflow-hidden whitespace-nowrap text-ellipsis px-1 w-full flex items-center`}>\n        <div className={`${disableOptionsForRowIndex === index ? 'opacity-50' : ''}`} aria-disabled={disableOptionsForRowIndex === index}>\n          {rowAdditionalActions ? rowAdditionalActions(rowData, index, rowHovering === rowId) : null}\n        </div>\n        {isInlineEditing ? (\n          <div className={`flex items-center gap-2 ${isAnyFieldOperationLoading ? 'pointer-events-none opacity-50' : ''}`}>\n            <div className='cursor-pointer hover:bg-neutral-100 dark:hover:bg-black-600 rounded p-0.5' onClick={() => !isAnyFieldOperationLoading && onCancelEdit?.()}>\n              <CloseRounded sx={{ height: 20, width: 20, color: '#667085' }} />\n            </div>\n            <div className='cursor-pointer hover:bg-neutral-100 dark:hover:bg-black-600 rounded p-0.5' onClick={() => !isAnyFieldOperationLoading && onConfirmEdit?.()}>\n              <CheckRounded sx={{ height: 20, width: 20, color: 'var(--color-primary-600)' }} />\n            </div>\n          </div>\n        ) : rowOptions ? (\n          <>\n            {disableOptionsForRowIndex === index ? (\n              <SpinnerCell />\n            ) : rowHasPendingEdits ? (\n              <Tooltip title={pendingEditsTooltip}>\n                <span><ButtonThreeDots disabled /></span>\n              </Tooltip>\n            ) : (\n              <Dropdown\n                menu={{ items: isOptionLoading ? [{ label: getSkeleton, key: 'loading' }] : filteredRowOptions }}\n                trigger={['click']}\n                overlayClassName='row-option-cell table-row-option-dropdown'\n                onOpenChange={handleDropdownVisibleChange}\n                disabled={disableOption || visibleRowOptions === 0}\n                {...(rowOptionsDropdownProps || {})}\n              >\n                <ButtonThreeDots disabled={disableOption} />\n              </Dropdown>\n            )}\n          </>\n        ) : null}\n      </div>\n    </td>\n  );\n};\n"],"names":["RowOptionsCell","rowId","rowOptions","disableOption","rowHovering","is_read","showNewItem","is_modified","is_row_modified","currentData","is_deleted","is_added","isDraggingOver","rowAdditionalActions","rowData","index","bgColorProp","setRowHovering","is_incomplete","isInlineEditing","onConfirmEdit","onCancelEdit","rowHasPendingEdits","tableConfig","useTableConfig","bgColor","cn","onMouseEnter","useCallback","onMouseLeave","asyncRowOptionsFilter","disableOptionsForRowIndex","fieldOperationLoading","useContext","TableContext","pendingEditsTooltip","rowOptionsDropdownProps","isAnyFieldOperationLoading","isOptionLoading","setIsOptionLoading","useState","filteredRowOptions","setFilteredRowOptions","visibleRowOptions","option","handleDropdownVisibleChange","visible","buttonState","filteredOptions","getSkeleton","jsx","SingleLineLoader","jsxs","CloseRounded","CheckRounded","Fragment","SpinnerCell","Tooltip","ButtonThreeDots","Dropdown"],"mappings":"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"}
+{"version":3,"file":"RowOptionsCell.es.js","sources":["../../../../../../src/components/data-display/infinite-table/body/cell/RowOptionsCell.tsx"],"sourcesContent":["import { SingleLineLoader } from '../../../../data-display/skeleton/loaders';\nimport { ButtonThreeDots } from '../../../../button/ButtonThreeDots';\nimport Tooltip from '../../../../tooltip/Tooltip';\nimport { useTableConfig } from '../../../../../providers/design-system-provider/hooks';\nimport { CheckRounded, CloseRounded } from '@mui/icons-material';\nimport { Dropdown } from 'antd';\nimport cn from 'classnames';\nimport { useCallback, useContext, useState } from 'react';\n\nimport { TableContext } from '../../context';\nimport { SpinnerCell } from './SpinnerCell';\n\ntype TProps = {\n  rowId: string | number;\n  rowOptions: Array<{ key: string; label: React.ReactNode; isVisible?: boolean; [k: string]: unknown }>;\n  disableOption: boolean;\n  rowHovering: string | number | null;\n  is_read: boolean;\n  showNewItem: boolean;\n  is_modified: boolean;\n  is_row_modified: boolean;\n  currentData: Record<string, unknown>;\n  is_deleted: boolean;\n  is_added: boolean;\n  isDraggingOver: boolean;\n  rowData: Record<string, unknown>;\n  index: number;\n  rowAdditionalActions: (rowData: Record<string, unknown>, index: number, isHovering: boolean) => React.ReactNode;\n  bgColor?: string;\n  setRowHovering: (rowId: string | number | null) => void;\n  is_incomplete?: boolean;\n  isInlineEditing?: boolean;\n  onConfirmEdit?: () => void;\n  onCancelEdit?: () => void;\n  rowHasPendingEdits?: boolean;\n};\n\nexport const RowOptionsCell = ({\n  rowId, rowOptions, disableOption, rowHovering, is_read, showNewItem, is_modified, is_row_modified, currentData,\n  is_deleted, is_added, isDraggingOver, rowAdditionalActions, rowData, index, bgColor: bgColorProp, setRowHovering,\n  is_incomplete, isInlineEditing, onConfirmEdit, onCancelEdit, rowHasPendingEdits,\n}: TProps) => {\n  const tableConfig = useTableConfig();\n  const bgColor = cn({\n    'bg-primary-50 dark:bg-primary-900': isInlineEditing,\n    'bg-neutral-100 dark:bg-black-600': rowHovering === rowId && !isInlineEditing && !(is_deleted || currentData?.is_deleted) && !(is_added || currentData?.is_added),\n    'bg-error-200 dark:bg-error-900': rowHovering === rowId && !isInlineEditing && (is_deleted || currentData?.is_deleted),\n    'bg-success-100 dark:bg-success-800': rowHovering === rowId && !isInlineEditing && (is_added || currentData?.is_added),\n    'bg-primary-50 dark:bg-black-700': !is_incomplete && !is_read && showNewItem && rowHovering !== rowId && !isInlineEditing,\n    'bg-warning-50 dark:bg-black-500': (is_incomplete || is_modified || is_row_modified || currentData?.is_row_modified) && rowHovering !== rowId && !isInlineEditing,\n    'bg-error-100 dark:bg-error-975': (is_deleted || currentData?.is_deleted) && rowHovering !== rowId && !isInlineEditing,\n    'bg-success-50 dark:bg-success-900': (is_added || currentData?.is_added) && rowHovering !== rowId && !isInlineEditing,\n    'bg-primary-50': isDraggingOver && !isInlineEditing,\n    ...(bgColorProp && !isInlineEditing && { [bgColorProp]: true }),\n  });\n\n  const onMouseEnter = useCallback(() => setRowHovering(rowId), [setRowHovering, rowId]);\n  const onMouseLeave = useCallback(() => setRowHovering(null), [setRowHovering]);\n\n  const { asyncRowOptionsFilter, disableOptionsForRowIndex = null, fieldOperationLoading } = useContext(TableContext);\n  const pendingEditsTooltip = tableConfig?.t?.('Save or cancel pending changes first') ?? 'Save or cancel pending changes first';\n  const rowOptionsDropdownProps = tableConfig?.getRowOptionsDropdownProps?.();\n  const isAnyFieldOperationLoading = Boolean(fieldOperationLoading);\n  const [isOptionLoading, setIsOptionLoading] = useState(!!asyncRowOptionsFilter);\n  const [filteredRowOptions, setFilteredRowOptions] = useState(rowOptions);\n  const visibleRowOptions = rowOptions ? rowOptions.filter((option) => option.isVisible !== false).length : 0;\n\n  const handleDropdownVisibleChange = async (visible: boolean) => {\n    setIsOptionLoading(true);\n    if (visible && asyncRowOptionsFilter) {\n      try {\n        const buttonState = await asyncRowOptionsFilter(rowId);\n        const filteredOptions = rowOptions ? rowOptions.filter((option) => { const existOnAPI = Object.keys(buttonState).includes(option.key); return existOnAPI ? buttonState[option.key] : true; }) : [];\n        setFilteredRowOptions(filteredOptions);\n      } catch { setFilteredRowOptions([]); }\n    }\n    setIsOptionLoading(false);\n  };\n\n  const getSkeleton = (\n    <div className={`min-w-[140px] max-w-[200px] justify-start whitespace-nowrap items-center py-2 px-1 gap-2`} aria-disabled={true}>\n      <SingleLineLoader repeat={rowOptions?.length || 1} lineHeight='15px' />\n    </div>\n  );\n\n  return (\n    <td className={`sticky left-0 right-0 z-10 ${bgColor ? bgColor : 'bg-white dark:bg-black-800'} h-[39px]`} onMouseEnter={onMouseEnter} onMouseLeave={onMouseLeave}>\n      <div className={`h-full gap-2 top-0 font-medium font-inter overflow-hidden whitespace-nowrap text-ellipsis px-1 w-full flex items-center`}>\n        <div className={`${disableOptionsForRowIndex === index ? 'opacity-50' : ''}`} aria-disabled={disableOptionsForRowIndex === index}>\n          {rowAdditionalActions ? rowAdditionalActions(rowData, index, rowHovering === rowId) : null}\n        </div>\n        {isInlineEditing ? (\n          <div className={`flex items-center gap-2 ${isAnyFieldOperationLoading ? 'pointer-events-none opacity-50' : ''}`}>\n            <div className='cursor-pointer hover:bg-neutral-100 dark:hover:bg-black-600 rounded p-0.5' onClick={() => !isAnyFieldOperationLoading && onCancelEdit?.()}>\n              <CloseRounded sx={{ height: 20, width: 20, color: '#667085' }} />\n            </div>\n            <div className='cursor-pointer hover:bg-neutral-100 dark:hover:bg-black-600 rounded p-0.5' onClick={() => !isAnyFieldOperationLoading && onConfirmEdit?.()}>\n              <CheckRounded sx={{ height: 20, width: 20, color: 'var(--color-primary-600)' }} />\n            </div>\n          </div>\n        ) : rowOptions ? (\n          <>\n            {disableOptionsForRowIndex === index ? (\n              <SpinnerCell />\n            ) : rowHasPendingEdits ? (\n              <Tooltip title={pendingEditsTooltip}>\n                <span><ButtonThreeDots disabled /></span>\n              </Tooltip>\n            ) : (\n              <Dropdown\n                menu={{ items: isOptionLoading ? [{ label: getSkeleton, key: 'loading' }] : filteredRowOptions }}\n                trigger={['click']}\n                overlayClassName='row-option-cell table-row-option-dropdown'\n                onOpenChange={handleDropdownVisibleChange}\n                disabled={disableOption || visibleRowOptions === 0}\n                {...(rowOptionsDropdownProps || {})}\n              >\n                <ButtonThreeDots disabled={disableOption} />\n              </Dropdown>\n            )}\n          </>\n        ) : null}\n      </div>\n    </td>\n  );\n};\n"],"names":["RowOptionsCell","rowId","rowOptions","disableOption","rowHovering","is_read","showNewItem","is_modified","is_row_modified","currentData","is_deleted","is_added","isDraggingOver","rowAdditionalActions","rowData","index","bgColorProp","setRowHovering","is_incomplete","isInlineEditing","onConfirmEdit","onCancelEdit","rowHasPendingEdits","tableConfig","useTableConfig","bgColor","cn","onMouseEnter","useCallback","onMouseLeave","asyncRowOptionsFilter","disableOptionsForRowIndex","fieldOperationLoading","useContext","TableContext","pendingEditsTooltip","rowOptionsDropdownProps","isAnyFieldOperationLoading","isOptionLoading","setIsOptionLoading","useState","filteredRowOptions","setFilteredRowOptions","visibleRowOptions","option","handleDropdownVisibleChange","visible","buttonState","filteredOptions","getSkeleton","jsx","SingleLineLoader","jsxs","CloseRounded","CheckRounded","Fragment","SpinnerCell","Tooltip","ButtonThreeDots","Dropdown"],"mappings":"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"}

package/dist/components/data-display/infinite-table/body/cell/SpinnerCell.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../../../../../_virtual/index.cjs.js"),i=require("react"),s=require("../../../../icon/icons.generated.cjs.js"),c=({width:n,size:t=24})=>e.jsx("td",{className:r("sticky left-0 right-0 bg-white dark:bg-black-800",n&&`w-[${n}px]`),children:e.jsx("div",{className:"h-row flex items-center justify-center",children:e.jsx(s.LoadingSpinnerIcon,{size:t-4,className:"inline my-2 text-neutral-600 dark:text-white"})})}),l=i.memo(c);exports.SpinnerCell=l;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../../../../../_virtual/index.cjs.js"),i=require("react"),s=require("../../../../icon/icons.generated.cjs.js"),c=({width:n,size:t=24})=>e.jsx("td",{className:r("sticky left-0 right-0 bg-white dark:bg-black-800",n&&`w-[${n}px]`),children:e.jsx("div",{className:"h-10 flex items-center justify-center",children:e.jsx(s.LoadingSpinnerIcon,{size:t-4,className:"inline my-2 text-neutral-600 dark:text-white"})})}),l=i.memo(c);exports.SpinnerCell=l;
 //# sourceMappingURL=SpinnerCell.cjs.js.map

package/dist/components/data-display/infinite-table/body/cell/SpinnerCell.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"SpinnerCell.cjs.js","sources":["../../../../../../src/components/data-display/infinite-table/body/cell/SpinnerCell.tsx"],"sourcesContent":["import cn from 'classnames';\nimport React from 'react';\nimport { LoadingSpinnerIcon } from '../../../../icon';\n\ntype TProps = {\n  width?: number;\n  size?: number;\n};\n\nconst _SpinnerCell = ({ width, size = 24 }: TProps) => {\n  return (\n    <td className={cn('sticky left-0 right-0 bg-white dark:bg-black-800', width && `w-[${width}px]`)}>\n      <div className='h-row flex items-center justify-center'>\n        <LoadingSpinnerIcon size={size-4} className='inline my-2 text-neutral-600 dark:text-white' />\n      </div>\n    </td>\n  );\n};\n\nexport const SpinnerCell = React.memo(_SpinnerCell);\n"],"names":["_SpinnerCell","width","size","jsx","cn","LoadingSpinnerIcon","SpinnerCell","React"],"mappings":"+OASMA,EAAe,CAAC,CAAE,MAAAC,EAAO,KAAAC,EAAO,MAElCC,EAAAA,IAAC,MAAG,UAAWC,EAAG,mDAAoDH,GAAS,MAAMA,CAAK,KAAK,EAC7F,SAAAE,EAAAA,IAAC,OAAI,UAAU,yCACb,eAACE,EAAAA,mBAAA,CAAmB,KAAMH,EAAK,EAAG,UAAU,8CAAA,CAA+C,CAAA,CAC7F,CAAA,CACF,EAISI,EAAcC,EAAM,KAAKP,CAAY"}
+{"version":3,"file":"SpinnerCell.cjs.js","sources":["../../../../../../src/components/data-display/infinite-table/body/cell/SpinnerCell.tsx"],"sourcesContent":["import cn from 'classnames';\nimport React from 'react';\nimport { LoadingSpinnerIcon } from '../../../../icon';\n\ntype TProps = {\n  width?: number;\n  size?: number;\n};\n\nconst _SpinnerCell = ({ width, size = 24 }: TProps) => {\n  return (\n    <td className={cn('sticky left-0 right-0 bg-white dark:bg-black-800', width && `w-[${width}px]`)}>\n      <div className='h-10 flex items-center justify-center'>\n        <LoadingSpinnerIcon size={size-4} className='inline my-2 text-neutral-600 dark:text-white' />\n      </div>\n    </td>\n  );\n};\n\nexport const SpinnerCell = React.memo(_SpinnerCell);\n"],"names":["_SpinnerCell","width","size","jsx","cn","LoadingSpinnerIcon","SpinnerCell","React"],"mappings":"+OASMA,EAAe,CAAC,CAAE,MAAAC,EAAO,KAAAC,EAAO,MAElCC,EAAAA,IAAC,MAAG,UAAWC,EAAG,mDAAoDH,GAAS,MAAMA,CAAK,KAAK,EAC7F,SAAAE,EAAAA,IAAC,OAAI,UAAU,wCACb,eAACE,EAAAA,mBAAA,CAAmB,KAAMH,EAAK,EAAG,UAAU,8CAAA,CAA+C,CAAA,CAC7F,CAAA,CACF,EAISI,EAAcC,EAAM,KAAKP,CAAY"}

package/dist/components/data-display/infinite-table/body/cell/SpinnerCell.es.js

@@ -2,7 +2,7 @@ import { jsx as e } from "react/jsx-runtime";
 import i from "../../../../../_virtual/index.es.js";
 import n from "react";
 import { LoadingSpinnerIcon as m } from "../../../../icon/icons.generated.es.js";
-const o = ({ width: r, size: t = 24 }) => /* @__PURE__ */ e("td", { className: i("sticky left-0 right-0 bg-white dark:bg-black-800", r && `w-[${r}px]`), children: /* @__PURE__ */ e("div", { className: "h-row flex items-center justify-center", children: /* @__PURE__ */ e(m, { size: t - 4, className: "inline my-2 text-neutral-600 dark:text-white" }) }) }), p = n.memo(o);
+const c = ({ width: t, size: r = 24 }) => /* @__PURE__ */ e("td", { className: i("sticky left-0 right-0 bg-white dark:bg-black-800", t && `w-[${t}px]`), children: /* @__PURE__ */ e("div", { className: "h-10 flex items-center justify-center", children: /* @__PURE__ */ e(m, { size: r - 4, className: "inline my-2 text-neutral-600 dark:text-white" }) }) }), p = n.memo(c);
 export {
   p as SpinnerCell
 };

package/dist/components/data-display/infinite-table/body/cell/SpinnerCell.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"SpinnerCell.es.js","sources":["../../../../../../src/components/data-display/infinite-table/body/cell/SpinnerCell.tsx"],"sourcesContent":["import cn from 'classnames';\nimport React from 'react';\nimport { LoadingSpinnerIcon } from '../../../../icon';\n\ntype TProps = {\n  width?: number;\n  size?: number;\n};\n\nconst _SpinnerCell = ({ width, size = 24 }: TProps) => {\n  return (\n    <td className={cn('sticky left-0 right-0 bg-white dark:bg-black-800', width && `w-[${width}px]`)}>\n      <div className='h-row flex items-center justify-center'>\n        <LoadingSpinnerIcon size={size-4} className='inline my-2 text-neutral-600 dark:text-white' />\n      </div>\n    </td>\n  );\n};\n\nexport const SpinnerCell = React.memo(_SpinnerCell);\n"],"names":["_SpinnerCell","width","size","jsx","cn","LoadingSpinnerIcon","SpinnerCell","React"],"mappings":";;;;AASA,MAAMA,IAAe,CAAC,EAAE,OAAAC,GAAO,MAAAC,IAAO,SAElC,gBAAAC,EAAC,QAAG,WAAWC,EAAG,oDAAoDH,KAAS,MAAMA,CAAK,KAAK,GAC7F,UAAA,gBAAAE,EAAC,SAAI,WAAU,0CACb,4BAACE,GAAA,EAAmB,MAAMH,IAAK,GAAG,WAAU,+CAAA,CAA+C,EAAA,CAC7F,EAAA,CACF,GAISI,IAAcC,EAAM,KAAKP,CAAY;"}
+{"version":3,"file":"SpinnerCell.es.js","sources":["../../../../../../src/components/data-display/infinite-table/body/cell/SpinnerCell.tsx"],"sourcesContent":["import cn from 'classnames';\nimport React from 'react';\nimport { LoadingSpinnerIcon } from '../../../../icon';\n\ntype TProps = {\n  width?: number;\n  size?: number;\n};\n\nconst _SpinnerCell = ({ width, size = 24 }: TProps) => {\n  return (\n    <td className={cn('sticky left-0 right-0 bg-white dark:bg-black-800', width && `w-[${width}px]`)}>\n      <div className='h-10 flex items-center justify-center'>\n        <LoadingSpinnerIcon size={size-4} className='inline my-2 text-neutral-600 dark:text-white' />\n      </div>\n    </td>\n  );\n};\n\nexport const SpinnerCell = React.memo(_SpinnerCell);\n"],"names":["_SpinnerCell","width","size","jsx","cn","LoadingSpinnerIcon","SpinnerCell","React"],"mappings":";;;;AASA,MAAMA,IAAe,CAAC,EAAE,OAAAC,GAAO,MAAAC,IAAO,SAElC,gBAAAC,EAAC,QAAG,WAAWC,EAAG,oDAAoDH,KAAS,MAAMA,CAAK,KAAK,GAC7F,UAAA,gBAAAE,EAAC,SAAI,WAAU,yCACb,4BAACE,GAAA,EAAmB,MAAMH,IAAK,GAAG,WAAU,+CAAA,CAA+C,EAAA,CAC7F,EAAA,CACF,GAISI,IAAcC,EAAM,KAAKP,CAAY;"}