@lax-wp/design-system 0.13.67 → 0.13.69

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

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),w=require("antd"),O=require("../../../../../providers/design-system-provider/hooks.cjs.js"),B=require("../../../../../_virtual/index.cjs.js"),p=require("react"),R=require("../../constants.cjs.js");let b=null;const $=({checkboxConfig:t,id:e,rowHovering:r,isDisabled:j,is_read:C,is_modified:S,is_row_modified:i,is_deleted:u,is_added:n,isDraggingOver:M,showNewItem:T,currentData:a,bgColor:m,is_incomplete:x,isInlineEditing:c,hasPendingEditsColumn:q,rowHasPendingEdits:y})=>{const _=O.useTableConfig()?.t?.("Save or cancel pending changes first")??"Save or cancel pending changes first",l=p.useRef(null),F=s=>{if(s.key!=="Enter")return;s.preventDefault();const k=s.currentTarget.form;if(!k)return;const N=new Event("submit",{bubbles:!0,cancelable:!0});k.dispatchEvent(N);const g=k.querySelector('button[type="submit"]');g&&g.click()},f=typeof t?.checkboxMetadata=="object"&&t?.checkboxMetadata!==null&&t?.checkboxMetadata.checkedIds?.includes(e)||t?.checkedIds?.includes(e),d=j||y||t?.checkboxMetadata?.checkedIds?.includes(e);p.useLayoutEffect(()=>{b!==e||d||l.current&&document.activeElement!==l.current&&l.current.focus({preventScroll:!0})},[e,d,f]);const h=B({"bg-primary-50 dark:bg-primary-900":c,"bg-neutral-100 dark:bg-black-600":r===e&&!c&&!(u||a?.is_deleted)&&!(n||a?.is_added),"bg-error-200 dark:bg-error-900":r===e&&!c&&(u||a?.is_deleted),"bg-success-100 dark:bg-success-800":r===e&&!c&&(n||a?.is_added),"bg-primary-50 dark:bg-black-700":!x&&!C&&T&&r!==e&&!c,"bg-warning-50 dark:bg-black-500":(x||S||i||a?.is_row_modified)&&r!==e&&!c,"bg-error-100 dark:bg-error-975":(u||a?.is_deleted)&&r!==e&&!c,"bg-success-50 dark:bg-success-900":(n||a?.is_added)&&r!==e&&!c,"bg-primary-50":M&&!c,...m&&!c&&{[m]:!0}});return o.jsx("td",{className:`min-w-[40px] sticky right-0 z-30 ${h||"bg-white dark:bg-black-800"} h-row`,style:{left:q?R.CHECKBOX_PENDING_EDITS_LEFT_OFFSET:"0"},children:o.jsxs("div",{className:"absolute w-full h-row inset-0 px-2.5 z-30 flex items-center justify-center",style:{boxShadow:"8px 0px 8px 0px rgba(0, 0, 0, 0.02)"},children:[o.jsx(w.Tooltip,{title:y?_:t?.checkboxMetadata?.tooltip&&t?.checkboxMetadata?.checkedIds?.includes(e)?t?.checkboxMetadata?.tooltip:"",children:o.jsx("input",{ref:l,id:`checkbox-table-search-${e}`,type:"checkbox",className:`w-4 h-4 text-primary-600 appearance-none border border-gray-400 dark:border-neutral-400 rounded-[4px] checked:appearance-auto focus:ring-primary-500 dark:focus:ring-primary-600 focus:ring-2 cursor-pointer ${h}`,onChange:s=>t?.onItemCheck(s,e),onKeyDown:F,onFocus:()=>{b=e},onBlur:()=>{b===e&&(b=null)},checked:f,disabled:d},`checkbox-table-search-${e}`)}),o.jsx("label",{htmlFor:"checkbox-table-search-1",className:"sr-only dark:text-neutral-200",children:"checkbox"})]})})},E=p.memo($);exports.CheckboxCell=E;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),_=require("antd"),B=require("../../../../../providers/design-system-provider/hooks.cjs.js"),R=require("../../../../../_virtual/index.cjs.js"),x=require("react"),$=require("../../constants.cjs.js");let b=null;const K=({checkboxConfig:t,id:e,rowHovering:r,isDisabled:S,is_read:M,is_modified:m,is_row_modified:y,is_deleted:u,is_added:n,isDraggingOver:T,showNewItem:q,currentData:a,bgColor:f,is_incomplete:d,isInlineEditing:c,hasPendingEditsColumn:w,rowHasPendingEdits:g})=>{const F=B.useTableConfig()?.t?.("Save or cancel pending changes first")??"Save or cancel pending changes first",l=x.useRef(null),N=s=>{if(s.key!=="Enter")return;s.preventDefault();const p=s.currentTarget.form;if(!p)return;const O=new Event("submit",{bubbles:!0,cancelable:!0});p.dispatchEvent(O);const C=p.querySelector('button[type="submit"]');C&&C.click()},j=typeof t?.checkboxMetadata=="object"&&t?.checkboxMetadata!==null&&t?.checkboxMetadata.checkedIds?.includes(e)||t?.checkedIds?.includes(e),h=S||g||t?.checkboxMetadata?.checkedIds?.includes(e);x.useLayoutEffect(()=>{b!==e||h||l.current&&document.activeElement!==l.current&&l.current.focus({preventScroll:!0})},[e,h,j]);const k=R({"bg-primary-50 dark:bg-primary-900":c,"bg-neutral-100 dark:bg-black-600":r===e&&!c&&!(u||a?.is_deleted)&&!(n||a?.is_added),"bg-error-200 dark:bg-error-900":r===e&&!c&&(u||a?.is_deleted),"bg-success-100 dark:bg-success-800":r===e&&!c&&(n||a?.is_added),"bg-warning-100 dark:bg-warning-950":r===e&&!c&&(d||m||y||a?.is_row_modified),"bg-primary-50 dark:bg-black-700":!d&&!M&&q&&r!==e&&!c,"bg-warning-50 dark:bg-orange-900":(d||m||y||a?.is_row_modified)&&r!==e&&!c,"bg-error-100 dark:bg-error-975":(u||a?.is_deleted)&&r!==e&&!c,"bg-success-50 dark:bg-success-900":(n||a?.is_added)&&r!==e&&!c,"bg-primary-50":T&&!c,...f&&!c&&{[f]:!0}});return o.jsx("td",{className:`min-w-[40px] sticky right-0 z-30 ${k||"bg-white dark:bg-black-800"} h-row`,style:{left:w?$.CHECKBOX_PENDING_EDITS_LEFT_OFFSET:"0"},children:o.jsxs("div",{className:"absolute w-full h-row inset-0 px-2.5 z-30 flex items-center justify-center",style:{boxShadow:"8px 0px 8px 0px rgba(0, 0, 0, 0.02)"},children:[o.jsx(_.Tooltip,{title:g?F:t?.checkboxMetadata?.tooltip&&t?.checkboxMetadata?.checkedIds?.includes(e)?t?.checkboxMetadata?.tooltip:"",children:o.jsx("input",{ref:l,id:`checkbox-table-search-${e}`,type:"checkbox",className:`w-4 h-4 text-primary-600 appearance-none border border-gray-400 dark:border-neutral-400 rounded-[4px] checked:appearance-auto focus:ring-primary-500 dark:focus:ring-primary-600 focus:ring-2 cursor-pointer ${k}`,onChange:s=>t?.onItemCheck(s,e),onKeyDown:N,onFocus:()=>{b=e},onBlur:()=>{b===e&&(b=null)},checked:j,disabled:h},`checkbox-table-search-${e}`)}),o.jsx("label",{htmlFor:"checkbox-table-search-1",className:"sr-only dark:text-neutral-200",children:"checkbox"})]})})},z=x.memo(K);exports.CheckboxCell=z;
 //# sourceMappingURL=CheckboxCell.cjs.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"CheckboxCell.cjs.js","sources":["../../../../../../src/components/data-display/infinite-table/body/cell/CheckboxCell.tsx"],"sourcesContent":["import { Tooltip } from 'antd';\nimport { useTableConfig } from '../../../../../providers/design-system-provider/hooks';\nimport cn from 'classnames';\nimport React from 'react';\n\nimport { CHECKBOX_PENDING_EDITS_LEFT_OFFSET } from '../../constants';\n\ntype HighlightType = 'SUCCESS' | 'WARNING' | 'ERROR';\n\ntype CheckboxMetadata = {\n  checkedIds: string[];\n  tooltip: string;\n  highlight: HighlightType;\n};\n\ntype TCheckboxCellProps = {\n  checkboxConfig: {\n    checkboxMetadata: CheckboxMetadata;\n    checkedIds: string[];\n    selectionDisabledRowIds: CheckboxMetadata;\n    onItemCheck: (event: React.ChangeEvent<HTMLInputElement>, id: string) => void;\n  };\n  id: string;\n  rowHovering?: string;\n  isDisabled?: boolean;\n  is_read?: boolean;\n  is_modified?: boolean;\n  is_row_modified?: boolean;\n  is_deleted?: boolean;\n  is_added?: boolean;\n  isDraggingOver?: boolean;\n  showNewItem?: boolean;\n  currentData?: Record<string, unknown>;\n  bgColor?: string;\n  is_incomplete?: boolean;\n  isInlineEditing?: boolean;\n  hasPendingEditsColumn?: boolean;\n  rowHasPendingEdits?: boolean;\n};\n\nlet lastFocusedCheckboxId: string | null = null;\n\nconst CheckboxCellBase = ({\n  checkboxConfig,\n  id,\n  rowHovering,\n  isDisabled,\n  is_read,\n  is_modified,\n  is_row_modified,\n  is_deleted,\n  is_added,\n  isDraggingOver,\n  showNewItem,\n  currentData,\n  bgColor: bgColorProp,\n  is_incomplete,\n  isInlineEditing,\n  hasPendingEditsColumn,\n  rowHasPendingEdits,\n}: TCheckboxCellProps) => {\n  const tableConfig = useTableConfig();\n  const pendingEditsTooltip = tableConfig?.t?.('Save or cancel pending changes first') ?? 'Save or cancel pending changes first';\n  const inputRef = React.useRef<HTMLInputElement>(null);\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n    if (event.key !== 'Enter') return;\n    event.preventDefault();\n    const formEl = event.currentTarget.form;\n    if (!formEl) return;\n\n    const submitEvent = new Event('submit', { bubbles: true, cancelable: true });\n    formEl.dispatchEvent(submitEvent);\n\n    const submitBtn = formEl.querySelector<HTMLButtonElement>('button[type=\"submit\"]');\n    if (submitBtn) {\n      submitBtn.click();\n    }\n  };\n\n  const isCheckedObject = typeof checkboxConfig?.checkboxMetadata === 'object' && checkboxConfig?.checkboxMetadata !== null;\n  const checkedValue = (isCheckedObject && checkboxConfig?.checkboxMetadata.checkedIds?.includes(id)) || checkboxConfig?.checkedIds?.includes(id);\n  const isInputDisabled = isDisabled || rowHasPendingEdits || checkboxConfig?.checkboxMetadata?.checkedIds?.includes(id);\n\n  React.useLayoutEffect(() => {\n    if (lastFocusedCheckboxId !== id || isInputDisabled) return;\n    if (inputRef.current && document.activeElement !== inputRef.current) {\n      inputRef.current.focus({ preventScroll: true });\n    }\n  }, [id, isInputDisabled, checkedValue]);\n\n  const bgColor = cn({\n    'bg-primary-50 dark:bg-primary-900': isInlineEditing,\n    'bg-neutral-100 dark:bg-black-600': rowHovering === id && !isInlineEditing && !(is_deleted || currentData?.is_deleted) && !(is_added || currentData?.is_added),\n    'bg-error-200 dark:bg-error-900': rowHovering === id && !isInlineEditing && (is_deleted || currentData?.is_deleted),\n    'bg-success-100 dark:bg-success-800': rowHovering === id && !isInlineEditing && (is_added || currentData?.is_added),\n    'bg-primary-50 dark:bg-black-700': !is_incomplete && !is_read && showNewItem && rowHovering !== id && !isInlineEditing,\n    'bg-warning-50 dark:bg-black-500':\n      (is_incomplete || is_modified || is_row_modified || currentData?.is_row_modified) && rowHovering !== id && !isInlineEditing,\n    'bg-error-100 dark:bg-error-975': (is_deleted || currentData?.is_deleted) && rowHovering !== id && !isInlineEditing,\n    'bg-success-50 dark:bg-success-900': (is_added || currentData?.is_added) && rowHovering !== id && !isInlineEditing,\n    'bg-primary-50': isDraggingOver && !isInlineEditing,\n    ...(bgColorProp && !isInlineEditing && { [bgColorProp]: true }),\n  });\n\n  return (\n    <td\n      className={`min-w-[40px] sticky right-0 z-30 ${bgColor ? bgColor : 'bg-white dark:bg-black-800'} h-row`}\n      style={{ left: hasPendingEditsColumn ? CHECKBOX_PENDING_EDITS_LEFT_OFFSET : '0' }}\n    >\n      <div\n        className={`absolute w-full h-row inset-0 px-2.5 z-30 flex items-center justify-center`}\n        style={{ boxShadow: '8px 0px 8px 0px rgba(0, 0, 0, 0.02)' }}\n      >\n        <Tooltip\n          title={\n            rowHasPendingEdits\n              ? pendingEditsTooltip\n              : checkboxConfig?.checkboxMetadata?.tooltip && checkboxConfig?.checkboxMetadata?.checkedIds?.includes(id)\n              ? checkboxConfig?.checkboxMetadata?.tooltip\n              : ''\n          }\n        >\n          <input\n            ref={inputRef}\n            key={`checkbox-table-search-${id}`}\n            id={`checkbox-table-search-${id}`}\n            type='checkbox'\n            className={`w-4 h-4 text-primary-600 appearance-none border border-gray-400 dark:border-neutral-400 rounded-[4px] checked:appearance-auto focus:ring-primary-500 dark:focus:ring-primary-600 focus:ring-2 cursor-pointer ${bgColor}`}\n            onChange={(event) => checkboxConfig?.onItemCheck(event, id)}\n            onKeyDown={handleKeyDown}\n            onFocus={() => { lastFocusedCheckboxId = id; }}\n            onBlur={() => { if (lastFocusedCheckboxId === id) lastFocusedCheckboxId = null; }}\n            checked={checkedValue}\n            disabled={isInputDisabled}\n          />\n        </Tooltip>\n        <label htmlFor='checkbox-table-search-1' className='sr-only dark:text-neutral-200'>\n          {'checkbox'}\n        </label>\n      </div>\n    </td>\n  );\n};\n\nexport const CheckboxCell = React.memo(CheckboxCellBase);\n"],"names":["lastFocusedCheckboxId","CheckboxCellBase","checkboxConfig","id","rowHovering","isDisabled","is_read","is_modified","is_row_modified","is_deleted","is_added","isDraggingOver","showNewItem","currentData","bgColorProp","is_incomplete","isInlineEditing","hasPendingEditsColumn","rowHasPendingEdits","pendingEditsTooltip","useTableConfig","inputRef","React","handleKeyDown","event","formEl","submitEvent","submitBtn","checkedValue","isInputDisabled","bgColor","cn","jsx","CHECKBOX_PENDING_EDITS_LEFT_OFFSET","jsxs","Tooltip","CheckboxCell"],"mappings":"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"}
+{"version":3,"file":"CheckboxCell.cjs.js","sources":["../../../../../../src/components/data-display/infinite-table/body/cell/CheckboxCell.tsx"],"sourcesContent":["import { Tooltip } from 'antd';\nimport { useTableConfig } from '../../../../../providers/design-system-provider/hooks';\nimport cn from 'classnames';\nimport React from 'react';\n\nimport { CHECKBOX_PENDING_EDITS_LEFT_OFFSET } from '../../constants';\n\ntype HighlightType = 'SUCCESS' | 'WARNING' | 'ERROR';\n\ntype CheckboxMetadata = {\n  checkedIds: string[];\n  tooltip: string;\n  highlight: HighlightType;\n};\n\ntype TCheckboxCellProps = {\n  checkboxConfig: {\n    checkboxMetadata: CheckboxMetadata;\n    checkedIds: string[];\n    selectionDisabledRowIds: CheckboxMetadata;\n    onItemCheck: (event: React.ChangeEvent<HTMLInputElement>, id: string) => void;\n  };\n  id: string;\n  rowHovering?: string;\n  isDisabled?: boolean;\n  is_read?: boolean;\n  is_modified?: boolean;\n  is_row_modified?: boolean;\n  is_deleted?: boolean;\n  is_added?: boolean;\n  isDraggingOver?: boolean;\n  showNewItem?: boolean;\n  currentData?: Record<string, unknown>;\n  bgColor?: string;\n  is_incomplete?: boolean;\n  isInlineEditing?: boolean;\n  hasPendingEditsColumn?: boolean;\n  rowHasPendingEdits?: boolean;\n};\n\nlet lastFocusedCheckboxId: string | null = null;\n\nconst CheckboxCellBase = ({\n  checkboxConfig,\n  id,\n  rowHovering,\n  isDisabled,\n  is_read,\n  is_modified,\n  is_row_modified,\n  is_deleted,\n  is_added,\n  isDraggingOver,\n  showNewItem,\n  currentData,\n  bgColor: bgColorProp,\n  is_incomplete,\n  isInlineEditing,\n  hasPendingEditsColumn,\n  rowHasPendingEdits,\n}: TCheckboxCellProps) => {\n  const tableConfig = useTableConfig();\n  const pendingEditsTooltip = tableConfig?.t?.('Save or cancel pending changes first') ?? 'Save or cancel pending changes first';\n  const inputRef = React.useRef<HTMLInputElement>(null);\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n    if (event.key !== 'Enter') return;\n    event.preventDefault();\n    const formEl = event.currentTarget.form;\n    if (!formEl) return;\n\n    const submitEvent = new Event('submit', { bubbles: true, cancelable: true });\n    formEl.dispatchEvent(submitEvent);\n\n    const submitBtn = formEl.querySelector<HTMLButtonElement>('button[type=\"submit\"]');\n    if (submitBtn) {\n      submitBtn.click();\n    }\n  };\n\n  const isCheckedObject = typeof checkboxConfig?.checkboxMetadata === 'object' && checkboxConfig?.checkboxMetadata !== null;\n  const checkedValue = (isCheckedObject && checkboxConfig?.checkboxMetadata.checkedIds?.includes(id)) || checkboxConfig?.checkedIds?.includes(id);\n  const isInputDisabled = isDisabled || rowHasPendingEdits || checkboxConfig?.checkboxMetadata?.checkedIds?.includes(id);\n\n  React.useLayoutEffect(() => {\n    if (lastFocusedCheckboxId !== id || isInputDisabled) return;\n    if (inputRef.current && document.activeElement !== inputRef.current) {\n      inputRef.current.focus({ preventScroll: true });\n    }\n  }, [id, isInputDisabled, checkedValue]);\n\n  const bgColor = cn({\n    'bg-primary-50 dark:bg-primary-900': isInlineEditing,\n    'bg-neutral-100 dark:bg-black-600': rowHovering === id && !isInlineEditing && !(is_deleted || currentData?.is_deleted) && !(is_added || currentData?.is_added),\n    'bg-error-200 dark:bg-error-900': rowHovering === id && !isInlineEditing && (is_deleted || currentData?.is_deleted),\n    'bg-success-100 dark:bg-success-800': rowHovering === id && !isInlineEditing && (is_added || currentData?.is_added),\n    'bg-warning-100 dark:bg-warning-950': rowHovering === id && !isInlineEditing && (is_incomplete || is_modified || is_row_modified || currentData?.is_row_modified),\n    'bg-primary-50 dark:bg-black-700': !is_incomplete && !is_read && showNewItem && rowHovering !== id && !isInlineEditing,\n    'bg-warning-50 dark:bg-orange-900':\n      (is_incomplete || is_modified || is_row_modified || currentData?.is_row_modified) && rowHovering !== id && !isInlineEditing,\n    'bg-error-100 dark:bg-error-975': (is_deleted || currentData?.is_deleted) && rowHovering !== id && !isInlineEditing,\n    'bg-success-50 dark:bg-success-900': (is_added || currentData?.is_added) && rowHovering !== id && !isInlineEditing,\n    'bg-primary-50': isDraggingOver && !isInlineEditing,\n    ...(bgColorProp && !isInlineEditing && { [bgColorProp]: true }),\n  });\n\n  return (\n    <td\n      className={`min-w-[40px] sticky right-0 z-30 ${bgColor ? bgColor : 'bg-white dark:bg-black-800'} h-row`}\n      style={{ left: hasPendingEditsColumn ? CHECKBOX_PENDING_EDITS_LEFT_OFFSET : '0' }}\n    >\n      <div\n        className={`absolute w-full h-row inset-0 px-2.5 z-30 flex items-center justify-center`}\n        style={{ boxShadow: '8px 0px 8px 0px rgba(0, 0, 0, 0.02)' }}\n      >\n        <Tooltip\n          title={\n            rowHasPendingEdits\n              ? pendingEditsTooltip\n              : checkboxConfig?.checkboxMetadata?.tooltip && checkboxConfig?.checkboxMetadata?.checkedIds?.includes(id)\n              ? checkboxConfig?.checkboxMetadata?.tooltip\n              : ''\n          }\n        >\n          <input\n            ref={inputRef}\n            key={`checkbox-table-search-${id}`}\n            id={`checkbox-table-search-${id}`}\n            type='checkbox'\n            className={`w-4 h-4 text-primary-600 appearance-none border border-gray-400 dark:border-neutral-400 rounded-[4px] checked:appearance-auto focus:ring-primary-500 dark:focus:ring-primary-600 focus:ring-2 cursor-pointer ${bgColor}`}\n            onChange={(event) => checkboxConfig?.onItemCheck(event, id)}\n            onKeyDown={handleKeyDown}\n            onFocus={() => { lastFocusedCheckboxId = id; }}\n            onBlur={() => { if (lastFocusedCheckboxId === id) lastFocusedCheckboxId = null; }}\n            checked={checkedValue}\n            disabled={isInputDisabled}\n          />\n        </Tooltip>\n        <label htmlFor='checkbox-table-search-1' className='sr-only dark:text-neutral-200'>\n          {'checkbox'}\n        </label>\n      </div>\n    </td>\n  );\n};\n\nexport const CheckboxCell = React.memo(CheckboxCellBase);\n"],"names":["lastFocusedCheckboxId","CheckboxCellBase","checkboxConfig","id","rowHovering","isDisabled","is_read","is_modified","is_row_modified","is_deleted","is_added","isDraggingOver","showNewItem","currentData","bgColorProp","is_incomplete","isInlineEditing","hasPendingEditsColumn","rowHasPendingEdits","pendingEditsTooltip","useTableConfig","inputRef","React","handleKeyDown","event","formEl","submitEvent","submitBtn","checkedValue","isInputDisabled","bgColor","cn","jsx","CHECKBOX_PENDING_EDITS_LEFT_OFFSET","jsxs","Tooltip","CheckboxCell"],"mappings":"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"}

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

@@ -1,59 +1,60 @@
 import { jsx as l, jsxs as O } from "react/jsx-runtime";
 import { Tooltip as $ } from "antd";
-import { useTableConfig as i } from "../../../../../providers/design-system-provider/hooks.es.js";
-import E from "../../../../../_virtual/index.es.js";
-import h from "react";
-import { CHECKBOX_PENDING_EDITS_LEFT_OFFSET as K } from "../../constants.es.js";
+import { useTableConfig as K } from "../../../../../providers/design-system-provider/hooks.es.js";
+import R from "../../../../../_virtual/index.es.js";
+import m from "react";
+import { CHECKBOX_PENDING_EDITS_LEFT_OFFSET as z } from "../../constants.es.js";
 let b = null;
-const R = ({
-  checkboxConfig: r,
+const E = ({
+  checkboxConfig: c,
   id: e,
   rowHovering: t,
-  isDisabled: C,
-  is_read: M,
-  is_modified: S,
-  is_row_modified: T,
+  isDisabled: S,
+  is_read: T,
+  is_modified: f,
+  is_row_modified: x,
   is_deleted: u,
-  is_added: d,
-  isDraggingOver: _,
-  showNewItem: j,
+  is_added: p,
+  isDraggingOver: j,
+  showNewItem: w,
   currentData: a,
-  bgColor: k,
-  is_incomplete: f,
-  isInlineEditing: c,
+  bgColor: y,
+  is_incomplete: d,
+  isInlineEditing: r,
   hasPendingEditsColumn: F,
-  rowHasPendingEdits: x
+  rowHasPendingEdits: g
 }) => {
-  const N = i()?.t?.("Save or cancel pending changes first") ?? "Save or cancel pending changes first", o = h.useRef(null), w = (s) => {
+  const N = K()?.t?.("Save or cancel pending changes first") ?? "Save or cancel pending changes first", o = m.useRef(null), _ = (s) => {
     if (s.key !== "Enter") return;
     s.preventDefault();
-    const m = s.currentTarget.form;
-    if (!m) return;
+    const k = s.currentTarget.form;
+    if (!k) return;
     const B = new Event("submit", { bubbles: !0, cancelable: !0 });
-    m.dispatchEvent(B);
-    const g = m.querySelector('button[type="submit"]');
-    g && g.click();
-  }, y = typeof r?.checkboxMetadata == "object" && r?.checkboxMetadata !== null && r?.checkboxMetadata.checkedIds?.includes(e) || r?.checkedIds?.includes(e), p = C || x || r?.checkboxMetadata?.checkedIds?.includes(e);
-  h.useLayoutEffect(() => {
-    b !== e || p || o.current && document.activeElement !== o.current && o.current.focus({ preventScroll: !0 });
-  }, [e, p, y]);
-  const n = E({
-    "bg-primary-50 dark:bg-primary-900": c,
-    "bg-neutral-100 dark:bg-black-600": t === e && !c && !(u || a?.is_deleted) && !(d || a?.is_added),
-    "bg-error-200 dark:bg-error-900": t === e && !c && (u || a?.is_deleted),
-    "bg-success-100 dark:bg-success-800": t === e && !c && (d || a?.is_added),
-    "bg-primary-50 dark:bg-black-700": !f && !M && j && t !== e && !c,
-    "bg-warning-50 dark:bg-black-500": (f || S || T || a?.is_row_modified) && t !== e && !c,
-    "bg-error-100 dark:bg-error-975": (u || a?.is_deleted) && t !== e && !c,
-    "bg-success-50 dark:bg-success-900": (d || a?.is_added) && t !== e && !c,
-    "bg-primary-50": _ && !c,
-    ...k && !c && { [k]: !0 }
+    k.dispatchEvent(B);
+    const M = k.querySelector('button[type="submit"]');
+    M && M.click();
+  }, C = typeof c?.checkboxMetadata == "object" && c?.checkboxMetadata !== null && c?.checkboxMetadata.checkedIds?.includes(e) || c?.checkedIds?.includes(e), n = S || g || c?.checkboxMetadata?.checkedIds?.includes(e);
+  m.useLayoutEffect(() => {
+    b !== e || n || o.current && document.activeElement !== o.current && o.current.focus({ preventScroll: !0 });
+  }, [e, n, C]);
+  const h = R({
+    "bg-primary-50 dark:bg-primary-900": r,
+    "bg-neutral-100 dark:bg-black-600": t === e && !r && !(u || a?.is_deleted) && !(p || a?.is_added),
+    "bg-error-200 dark:bg-error-900": t === e && !r && (u || a?.is_deleted),
+    "bg-success-100 dark:bg-success-800": t === e && !r && (p || a?.is_added),
+    "bg-warning-100 dark:bg-warning-950": t === e && !r && (d || f || x || a?.is_row_modified),
+    "bg-primary-50 dark:bg-black-700": !d && !T && w && t !== e && !r,
+    "bg-warning-50 dark:bg-orange-900": (d || f || x || a?.is_row_modified) && t !== e && !r,
+    "bg-error-100 dark:bg-error-975": (u || a?.is_deleted) && t !== e && !r,
+    "bg-success-50 dark:bg-success-900": (p || a?.is_added) && t !== e && !r,
+    "bg-primary-50": j && !r,
+    ...y && !r && { [y]: !0 }
   });
   return /* @__PURE__ */ l(
     "td",
     {
-      className: `min-w-[40px] sticky right-0 z-30 ${n || "bg-white dark:bg-black-800"} h-row`,
-      style: { left: F ? K : "0" },
+      className: `min-w-[40px] sticky right-0 z-30 ${h || "bg-white dark:bg-black-800"} h-row`,
+      style: { left: F ? z : "0" },
       children: /* @__PURE__ */ O(
         "div",
         {
@@ -63,24 +64,24 @@ const R = ({
             /* @__PURE__ */ l(
               $,
               {
-                title: x ? N : r?.checkboxMetadata?.tooltip && r?.checkboxMetadata?.checkedIds?.includes(e) ? r?.checkboxMetadata?.tooltip : "",
+                title: g ? N : c?.checkboxMetadata?.tooltip && c?.checkboxMetadata?.checkedIds?.includes(e) ? c?.checkboxMetadata?.tooltip : "",
                 children: /* @__PURE__ */ l(
                   "input",
                   {
                     ref: o,
                     id: `checkbox-table-search-${e}`,
                     type: "checkbox",
-                    className: `w-4 h-4 text-primary-600 appearance-none border border-gray-400 dark:border-neutral-400 rounded-[4px] checked:appearance-auto focus:ring-primary-500 dark:focus:ring-primary-600 focus:ring-2 cursor-pointer ${n}`,
-                    onChange: (s) => r?.onItemCheck(s, e),
-                    onKeyDown: w,
+                    className: `w-4 h-4 text-primary-600 appearance-none border border-gray-400 dark:border-neutral-400 rounded-[4px] checked:appearance-auto focus:ring-primary-500 dark:focus:ring-primary-600 focus:ring-2 cursor-pointer ${h}`,
+                    onChange: (s) => c?.onItemCheck(s, e),
+                    onKeyDown: _,
                     onFocus: () => {
                       b = e;
                     },
                     onBlur: () => {
                       b === e && (b = null);
                     },
-                    checked: y,
-                    disabled: p
+                    checked: C,
+                    disabled: n
                   },
                   `checkbox-table-search-${e}`
                 )
@@ -92,8 +93,8 @@ const R = ({
       )
     }
   );
-}, D = h.memo(R);
+}, Q = m.memo(E);
 export {
-  D as CheckboxCell
+  Q as CheckboxCell
 };
 //# sourceMappingURL=CheckboxCell.es.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"CheckboxCell.es.js","sources":["../../../../../../src/components/data-display/infinite-table/body/cell/CheckboxCell.tsx"],"sourcesContent":["import { Tooltip } from 'antd';\nimport { useTableConfig } from '../../../../../providers/design-system-provider/hooks';\nimport cn from 'classnames';\nimport React from 'react';\n\nimport { CHECKBOX_PENDING_EDITS_LEFT_OFFSET } from '../../constants';\n\ntype HighlightType = 'SUCCESS' | 'WARNING' | 'ERROR';\n\ntype CheckboxMetadata = {\n  checkedIds: string[];\n  tooltip: string;\n  highlight: HighlightType;\n};\n\ntype TCheckboxCellProps = {\n  checkboxConfig: {\n    checkboxMetadata: CheckboxMetadata;\n    checkedIds: string[];\n    selectionDisabledRowIds: CheckboxMetadata;\n    onItemCheck: (event: React.ChangeEvent<HTMLInputElement>, id: string) => void;\n  };\n  id: string;\n  rowHovering?: string;\n  isDisabled?: boolean;\n  is_read?: boolean;\n  is_modified?: boolean;\n  is_row_modified?: boolean;\n  is_deleted?: boolean;\n  is_added?: boolean;\n  isDraggingOver?: boolean;\n  showNewItem?: boolean;\n  currentData?: Record<string, unknown>;\n  bgColor?: string;\n  is_incomplete?: boolean;\n  isInlineEditing?: boolean;\n  hasPendingEditsColumn?: boolean;\n  rowHasPendingEdits?: boolean;\n};\n\nlet lastFocusedCheckboxId: string | null = null;\n\nconst CheckboxCellBase = ({\n  checkboxConfig,\n  id,\n  rowHovering,\n  isDisabled,\n  is_read,\n  is_modified,\n  is_row_modified,\n  is_deleted,\n  is_added,\n  isDraggingOver,\n  showNewItem,\n  currentData,\n  bgColor: bgColorProp,\n  is_incomplete,\n  isInlineEditing,\n  hasPendingEditsColumn,\n  rowHasPendingEdits,\n}: TCheckboxCellProps) => {\n  const tableConfig = useTableConfig();\n  const pendingEditsTooltip = tableConfig?.t?.('Save or cancel pending changes first') ?? 'Save or cancel pending changes first';\n  const inputRef = React.useRef<HTMLInputElement>(null);\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n    if (event.key !== 'Enter') return;\n    event.preventDefault();\n    const formEl = event.currentTarget.form;\n    if (!formEl) return;\n\n    const submitEvent = new Event('submit', { bubbles: true, cancelable: true });\n    formEl.dispatchEvent(submitEvent);\n\n    const submitBtn = formEl.querySelector<HTMLButtonElement>('button[type=\"submit\"]');\n    if (submitBtn) {\n      submitBtn.click();\n    }\n  };\n\n  const isCheckedObject = typeof checkboxConfig?.checkboxMetadata === 'object' && checkboxConfig?.checkboxMetadata !== null;\n  const checkedValue = (isCheckedObject && checkboxConfig?.checkboxMetadata.checkedIds?.includes(id)) || checkboxConfig?.checkedIds?.includes(id);\n  const isInputDisabled = isDisabled || rowHasPendingEdits || checkboxConfig?.checkboxMetadata?.checkedIds?.includes(id);\n\n  React.useLayoutEffect(() => {\n    if (lastFocusedCheckboxId !== id || isInputDisabled) return;\n    if (inputRef.current && document.activeElement !== inputRef.current) {\n      inputRef.current.focus({ preventScroll: true });\n    }\n  }, [id, isInputDisabled, checkedValue]);\n\n  const bgColor = cn({\n    'bg-primary-50 dark:bg-primary-900': isInlineEditing,\n    'bg-neutral-100 dark:bg-black-600': rowHovering === id && !isInlineEditing && !(is_deleted || currentData?.is_deleted) && !(is_added || currentData?.is_added),\n    'bg-error-200 dark:bg-error-900': rowHovering === id && !isInlineEditing && (is_deleted || currentData?.is_deleted),\n    'bg-success-100 dark:bg-success-800': rowHovering === id && !isInlineEditing && (is_added || currentData?.is_added),\n    'bg-primary-50 dark:bg-black-700': !is_incomplete && !is_read && showNewItem && rowHovering !== id && !isInlineEditing,\n    'bg-warning-50 dark:bg-black-500':\n      (is_incomplete || is_modified || is_row_modified || currentData?.is_row_modified) && rowHovering !== id && !isInlineEditing,\n    'bg-error-100 dark:bg-error-975': (is_deleted || currentData?.is_deleted) && rowHovering !== id && !isInlineEditing,\n    'bg-success-50 dark:bg-success-900': (is_added || currentData?.is_added) && rowHovering !== id && !isInlineEditing,\n    'bg-primary-50': isDraggingOver && !isInlineEditing,\n    ...(bgColorProp && !isInlineEditing && { [bgColorProp]: true }),\n  });\n\n  return (\n    <td\n      className={`min-w-[40px] sticky right-0 z-30 ${bgColor ? bgColor : 'bg-white dark:bg-black-800'} h-row`}\n      style={{ left: hasPendingEditsColumn ? CHECKBOX_PENDING_EDITS_LEFT_OFFSET : '0' }}\n    >\n      <div\n        className={`absolute w-full h-row inset-0 px-2.5 z-30 flex items-center justify-center`}\n        style={{ boxShadow: '8px 0px 8px 0px rgba(0, 0, 0, 0.02)' }}\n      >\n        <Tooltip\n          title={\n            rowHasPendingEdits\n              ? pendingEditsTooltip\n              : checkboxConfig?.checkboxMetadata?.tooltip && checkboxConfig?.checkboxMetadata?.checkedIds?.includes(id)\n              ? checkboxConfig?.checkboxMetadata?.tooltip\n              : ''\n          }\n        >\n          <input\n            ref={inputRef}\n            key={`checkbox-table-search-${id}`}\n            id={`checkbox-table-search-${id}`}\n            type='checkbox'\n            className={`w-4 h-4 text-primary-600 appearance-none border border-gray-400 dark:border-neutral-400 rounded-[4px] checked:appearance-auto focus:ring-primary-500 dark:focus:ring-primary-600 focus:ring-2 cursor-pointer ${bgColor}`}\n            onChange={(event) => checkboxConfig?.onItemCheck(event, id)}\n            onKeyDown={handleKeyDown}\n            onFocus={() => { lastFocusedCheckboxId = id; }}\n            onBlur={() => { if (lastFocusedCheckboxId === id) lastFocusedCheckboxId = null; }}\n            checked={checkedValue}\n            disabled={isInputDisabled}\n          />\n        </Tooltip>\n        <label htmlFor='checkbox-table-search-1' className='sr-only dark:text-neutral-200'>\n          {'checkbox'}\n        </label>\n      </div>\n    </td>\n  );\n};\n\nexport const CheckboxCell = React.memo(CheckboxCellBase);\n"],"names":["lastFocusedCheckboxId","CheckboxCellBase","checkboxConfig","id","rowHovering","isDisabled","is_read","is_modified","is_row_modified","is_deleted","is_added","isDraggingOver","showNewItem","currentData","bgColorProp","is_incomplete","isInlineEditing","hasPendingEditsColumn","rowHasPendingEdits","pendingEditsTooltip","useTableConfig","inputRef","React","handleKeyDown","event","formEl","submitEvent","submitBtn","checkedValue","isInputDisabled","bgColor","cn","jsx","CHECKBOX_PENDING_EDITS_LEFT_OFFSET","jsxs","Tooltip","CheckboxCell"],"mappings":"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"}
+{"version":3,"file":"CheckboxCell.es.js","sources":["../../../../../../src/components/data-display/infinite-table/body/cell/CheckboxCell.tsx"],"sourcesContent":["import { Tooltip } from 'antd';\nimport { useTableConfig } from '../../../../../providers/design-system-provider/hooks';\nimport cn from 'classnames';\nimport React from 'react';\n\nimport { CHECKBOX_PENDING_EDITS_LEFT_OFFSET } from '../../constants';\n\ntype HighlightType = 'SUCCESS' | 'WARNING' | 'ERROR';\n\ntype CheckboxMetadata = {\n  checkedIds: string[];\n  tooltip: string;\n  highlight: HighlightType;\n};\n\ntype TCheckboxCellProps = {\n  checkboxConfig: {\n    checkboxMetadata: CheckboxMetadata;\n    checkedIds: string[];\n    selectionDisabledRowIds: CheckboxMetadata;\n    onItemCheck: (event: React.ChangeEvent<HTMLInputElement>, id: string) => void;\n  };\n  id: string;\n  rowHovering?: string;\n  isDisabled?: boolean;\n  is_read?: boolean;\n  is_modified?: boolean;\n  is_row_modified?: boolean;\n  is_deleted?: boolean;\n  is_added?: boolean;\n  isDraggingOver?: boolean;\n  showNewItem?: boolean;\n  currentData?: Record<string, unknown>;\n  bgColor?: string;\n  is_incomplete?: boolean;\n  isInlineEditing?: boolean;\n  hasPendingEditsColumn?: boolean;\n  rowHasPendingEdits?: boolean;\n};\n\nlet lastFocusedCheckboxId: string | null = null;\n\nconst CheckboxCellBase = ({\n  checkboxConfig,\n  id,\n  rowHovering,\n  isDisabled,\n  is_read,\n  is_modified,\n  is_row_modified,\n  is_deleted,\n  is_added,\n  isDraggingOver,\n  showNewItem,\n  currentData,\n  bgColor: bgColorProp,\n  is_incomplete,\n  isInlineEditing,\n  hasPendingEditsColumn,\n  rowHasPendingEdits,\n}: TCheckboxCellProps) => {\n  const tableConfig = useTableConfig();\n  const pendingEditsTooltip = tableConfig?.t?.('Save or cancel pending changes first') ?? 'Save or cancel pending changes first';\n  const inputRef = React.useRef<HTMLInputElement>(null);\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n    if (event.key !== 'Enter') return;\n    event.preventDefault();\n    const formEl = event.currentTarget.form;\n    if (!formEl) return;\n\n    const submitEvent = new Event('submit', { bubbles: true, cancelable: true });\n    formEl.dispatchEvent(submitEvent);\n\n    const submitBtn = formEl.querySelector<HTMLButtonElement>('button[type=\"submit\"]');\n    if (submitBtn) {\n      submitBtn.click();\n    }\n  };\n\n  const isCheckedObject = typeof checkboxConfig?.checkboxMetadata === 'object' && checkboxConfig?.checkboxMetadata !== null;\n  const checkedValue = (isCheckedObject && checkboxConfig?.checkboxMetadata.checkedIds?.includes(id)) || checkboxConfig?.checkedIds?.includes(id);\n  const isInputDisabled = isDisabled || rowHasPendingEdits || checkboxConfig?.checkboxMetadata?.checkedIds?.includes(id);\n\n  React.useLayoutEffect(() => {\n    if (lastFocusedCheckboxId !== id || isInputDisabled) return;\n    if (inputRef.current && document.activeElement !== inputRef.current) {\n      inputRef.current.focus({ preventScroll: true });\n    }\n  }, [id, isInputDisabled, checkedValue]);\n\n  const bgColor = cn({\n    'bg-primary-50 dark:bg-primary-900': isInlineEditing,\n    'bg-neutral-100 dark:bg-black-600': rowHovering === id && !isInlineEditing && !(is_deleted || currentData?.is_deleted) && !(is_added || currentData?.is_added),\n    'bg-error-200 dark:bg-error-900': rowHovering === id && !isInlineEditing && (is_deleted || currentData?.is_deleted),\n    'bg-success-100 dark:bg-success-800': rowHovering === id && !isInlineEditing && (is_added || currentData?.is_added),\n    'bg-warning-100 dark:bg-warning-950': rowHovering === id && !isInlineEditing && (is_incomplete || is_modified || is_row_modified || currentData?.is_row_modified),\n    'bg-primary-50 dark:bg-black-700': !is_incomplete && !is_read && showNewItem && rowHovering !== id && !isInlineEditing,\n    'bg-warning-50 dark:bg-orange-900':\n      (is_incomplete || is_modified || is_row_modified || currentData?.is_row_modified) && rowHovering !== id && !isInlineEditing,\n    'bg-error-100 dark:bg-error-975': (is_deleted || currentData?.is_deleted) && rowHovering !== id && !isInlineEditing,\n    'bg-success-50 dark:bg-success-900': (is_added || currentData?.is_added) && rowHovering !== id && !isInlineEditing,\n    'bg-primary-50': isDraggingOver && !isInlineEditing,\n    ...(bgColorProp && !isInlineEditing && { [bgColorProp]: true }),\n  });\n\n  return (\n    <td\n      className={`min-w-[40px] sticky right-0 z-30 ${bgColor ? bgColor : 'bg-white dark:bg-black-800'} h-row`}\n      style={{ left: hasPendingEditsColumn ? CHECKBOX_PENDING_EDITS_LEFT_OFFSET : '0' }}\n    >\n      <div\n        className={`absolute w-full h-row inset-0 px-2.5 z-30 flex items-center justify-center`}\n        style={{ boxShadow: '8px 0px 8px 0px rgba(0, 0, 0, 0.02)' }}\n      >\n        <Tooltip\n          title={\n            rowHasPendingEdits\n              ? pendingEditsTooltip\n              : checkboxConfig?.checkboxMetadata?.tooltip && checkboxConfig?.checkboxMetadata?.checkedIds?.includes(id)\n              ? checkboxConfig?.checkboxMetadata?.tooltip\n              : ''\n          }\n        >\n          <input\n            ref={inputRef}\n            key={`checkbox-table-search-${id}`}\n            id={`checkbox-table-search-${id}`}\n            type='checkbox'\n            className={`w-4 h-4 text-primary-600 appearance-none border border-gray-400 dark:border-neutral-400 rounded-[4px] checked:appearance-auto focus:ring-primary-500 dark:focus:ring-primary-600 focus:ring-2 cursor-pointer ${bgColor}`}\n            onChange={(event) => checkboxConfig?.onItemCheck(event, id)}\n            onKeyDown={handleKeyDown}\n            onFocus={() => { lastFocusedCheckboxId = id; }}\n            onBlur={() => { if (lastFocusedCheckboxId === id) lastFocusedCheckboxId = null; }}\n            checked={checkedValue}\n            disabled={isInputDisabled}\n          />\n        </Tooltip>\n        <label htmlFor='checkbox-table-search-1' className='sr-only dark:text-neutral-200'>\n          {'checkbox'}\n        </label>\n      </div>\n    </td>\n  );\n};\n\nexport const CheckboxCell = React.memo(CheckboxCellBase);\n"],"names":["lastFocusedCheckboxId","CheckboxCellBase","checkboxConfig","id","rowHovering","isDisabled","is_read","is_modified","is_row_modified","is_deleted","is_added","isDraggingOver","showNewItem","currentData","bgColorProp","is_incomplete","isInlineEditing","hasPendingEditsColumn","rowHasPendingEdits","pendingEditsTooltip","useTableConfig","inputRef","React","handleKeyDown","event","formEl","submitEvent","submitBtn","checkedValue","isInputDisabled","bgColor","cn","jsx","CHECKBOX_PENDING_EDITS_LEFT_OFFSET","jsxs","Tooltip","CheckboxCell"],"mappings":"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"}

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"),R=(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:P,is_modified:k,is_row_modified:y,is_deleted:m,is_added:x,is_incomplete:b,showNewItem:S,onScrollToCell:q})=>{const[v,g]=u.useState(!1),[j,C]=u.useState({top:0,left:0}),l=u.useRef(null),f=u.useRef(null),h=s?.[e],p=u.useMemo(()=>h?Object.entries(h).map(([t,c])=>{const M=d?.find(O=>O.key===t),z=M?.Header||M?.display_name||t;return{columnKey:t,fieldName:z,value:c.value,originalValue:c.originalValue,meta:c.meta,originalMeta:c.originalMeta}}):[],[h,d]),V=t=>{g(!1),l.current&&(clearTimeout(l.current),l.current=null),q?.(e,t,i)},N=()=>{if(o){if(l.current&&(clearTimeout(l.current),l.current=null),f.current){const t=f.current.getBoundingClientRect();C({top:t.top+t.height/2,left:t.right+8})}g(!0)}},T=()=>{l.current=setTimeout(()=>{g(!1)},300)},w=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-warning-100 dark:bg-warning-950":n===e&&!r&&(b||k||y),"bg-primary-50 dark:bg-black-700":!b&&!P&&S&&n!==e&&!r,"bg-warning-50 dark:bg-orange-900":(b||k||y)&&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 ${w||"bg-white dark:bg-black-800"} h-row`,children:[a.jsx("div",{ref:f,className:"w-full h-row flex items-center justify-center cursor-pointer",onMouseEnter:N,onMouseLeave:T,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"})})}),v&&p.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:j.top,left:j.left,transform:"translateY(-50%)",zIndex:99999},onMouseEnter:N,onMouseLeave:T,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 (",p.length,")"]}),a.jsx("div",{className:"max-h-48 overflow-y-auto",children:p.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:R(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:R(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-warning-100 dark:bg-warning-950': rowHovering === rowId && !isInlineEditing && (is_incomplete || is_modified || is_row_modified),\n    'bg-primary-50 dark:bg-black-700': !is_incomplete && !is_read && showNewItem && rowHovering !== rowId && !isInlineEditing,\n    'bg-warning-50 dark:bg-orange-900': (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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"}

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

@@ -2,9 +2,9 @@ import { jsxs as u, jsx as o } from "react/jsx-runtime";
 import { formatDate as O } from "../../../../../utils/formatters.es.js";
 import { EditNoteOutlined as Y } from "@mui/icons-material";
 import D from "../../../../../_virtual/index.es.js";
-import { useState as M, useRef as v, useMemo as q } from "react";
+import { useState as j, useRef as v, useMemo as q } from "react";
 import { createPortal as A } from "react-dom";
-const R = (e, i) => {
+const C = (e, i) => {
   if (typeof e == "boolean") return e ? "Yes" : "No";
   if (e == null || e === "") return "-";
   const n = String(e);
@@ -23,67 +23,68 @@ const R = (e, i) => {
   rowHasPendingEdits: c,
   rowHovering: a,
   isInlineEditing: r,
-  is_read: j,
-  is_modified: C,
-  is_row_modified: P,
+  is_read: P,
+  is_modified: k,
+  is_row_modified: y,
   is_deleted: d,
   is_added: b,
-  is_incomplete: h,
+  is_incomplete: g,
   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] = j(!1), [N, L] = j({ top: 0, left: 0 }), l = v(null), p = v(null), x = n?.[e], h = q(
+    () => x ? Object.entries(x).map(([t, s]) => {
+      const R = m?.find((F) => F.key === t), B = R?.Header || R?.display_name || t;
       return { columnKey: t, fieldName: B, value: s.value, originalValue: s.originalValue, meta: s.meta, originalMeta: s.originalMeta };
     }) : [],
-    [p, m]
+    [x, m]
   ), $ = (t) => {
     f(!1), l.current && (clearTimeout(l.current), l.current = null), z?.(e, t, i);
-  }, y = () => {
+  }, w = () => {
     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);
     }
-  }, N = () => {
+  }, T = () => {
     l.current = setTimeout(() => {
       f(!1);
     }, 300);
-  }, w = D({
+  }, M = 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,
     "bg-success-100 dark:bg-success-800": a === e && !r && b,
-    "bg-primary-50 dark:bg-black-700": !h && !j && V && a !== e && !r,
-    "bg-warning-50 dark:bg-black-500": (h || C || P) && a !== e && !r,
+    "bg-warning-100 dark:bg-warning-950": a === e && !r && (g || k || y),
+    "bg-primary-50 dark:bg-black-700": !g && !P && V && a !== e && !r,
+    "bg-warning-50 dark:bg-orange-900": (g || k || y) && a !== e && !r,
     "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" }) }) }),
-    S && x.length > 0 && A(
+  return /* @__PURE__ */ u("td", { className: `min-w-[28px] w-[28px] sticky left-0 z-30 ${M || "bg-white dark:bg-black-800"} h-row`, children: [
+    /* @__PURE__ */ o("div", { ref: p, className: "w-full h-row flex items-center justify-center cursor-pointer", onMouseEnter: w, onMouseLeave: T, 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 && h.length > 0 && A(
       /* @__PURE__ */ u(
         "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: N,
+          style: { top: N.top, left: N.left, transform: "translateY(-50%)", zIndex: 99999 },
+          onMouseEnter: w,
+          onMouseLeave: T,
           children: [
             /* @__PURE__ */ u("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 (",
-              x.length,
+              h.length,
               ")"
             ] }),
-            /* @__PURE__ */ o("div", { className: "max-h-48 overflow-y-auto", children: x.map((t, s) => /* @__PURE__ */ u("button", { onClick: () => $(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: [
+            /* @__PURE__ */ o("div", { className: "max-h-48 overflow-y-auto", children: h.map((t, s) => /* @__PURE__ */ u("button", { onClick: () => $(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: [
               /* @__PURE__ */ o("div", { className: "text-xs font-medium text-neutral-700 dark:text-neutral-300 mb-1", children: t.fieldName }),
               /* @__PURE__ */ u("div", { className: "flex items-center gap-1.5 text-xs", children: [
-                /* @__PURE__ */ o("span", { className: "text-neutral-400 dark:text-neutral-500 line-through truncate max-w-[80px]", children: R(t.originalValue, t.originalMeta?.currency_code) }),
+                /* @__PURE__ */ o("span", { className: "text-neutral-400 dark:text-neutral-500 line-through truncate max-w-[80px]", children: C(t.originalValue, t.originalMeta?.currency_code) }),
                 /* @__PURE__ */ o("span", { className: "text-neutral-400 dark:text-neutral-500 flex-shrink-0", children: "→" }),
-                /* @__PURE__ */ o("span", { className: "text-primary-600 dark:text-primary-400 font-medium truncate max-w-[80px]", children: R(t.value, t.meta?.currency_code) })
+                /* @__PURE__ */ o("span", { className: "text-primary-600 dark:text-primary-400 font-medium truncate max-w-[80px]", children: C(t.value, t.meta?.currency_code) })
               ] })
             ] }, s)) })
           ]

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-warning-100 dark:bg-warning-950': rowHovering === rowId && !isInlineEditing && (is_incomplete || is_modified || is_row_modified),\n    'bg-primary-50 dark:bg-black-700': !is_incomplete && !is_read && showNewItem && rowHovering !== rowId && !isInlineEditing,\n    'bg-warning-50 dark:bg-orange-900': (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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"}

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

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react/jsx-runtime"),q=require("../../../../tooltip/Tooltip.cjs.js"),S=require("../../../../../providers/design-system-provider/hooks.cjs.js"),j=require("../../../../../_virtual/index.cjs.js"),x=require("react"),T=({disableOptionsForRowIndex:C,tableActions:g,index:l,is_read:f,showNewItem:k,is_modified:p,is_row_modified:i,is_deleted:c,currentData:e,is_added:o,rowData:d,id:s,rowHovering:t,isDisabled:n,bgColor:b,is_incomplete:m,isInlineEditing:r,rowHasPendingEdits:a})=>{const R=S.useTableConfig()?.t?.("Save or cancel pending changes first")??"Save or cancel pending changes first",h=x.useMemo(()=>r?"bg-primary-50 dark:bg-primary-900":b||(c||e?.is_deleted?"bg-error-100 dark:bg-error-975":m||p||i||e?.is_row_modified?"bg-warning-50 dark:bg-black-500":o||e?.is_added?"bg-success-50 dark:bg-success-900":!f&&k&&!n?"bg-primary-50 dark:bg-black-700":"bg-white dark:bg-black-800"),[m,f,k,p,i,c,e,o,b,r,n]),y=C===l||n||a;return u.jsxs("td",{"aria-disabled":y,className:j("px-2.5 relative h-row",h,y&&"cursor-not-allowed opacity-50"),children:[g(d,l),u.jsx(q,{title:a?R:"",children:u.jsx("div",{className:j("absolute top-0 left-0 flex items-center justify-center w-full z-20",{[h]:t!==s||r},{"bg-warning-100 dark:bg-warning-900":t===s&&!r&&!(c||e?.is_deleted)&&!(o||e?.is_added)},{"bg-error-200 dark:bg-error-900":t===s&&!r&&(c||e?.is_deleted)},{"bg-success-100 dark:bg-success-800":t===s&&!r&&(o||e?.is_added)},a&&"pointer-events-none"),children:g(d,l)})})]})},v=x.memo(T);exports.RowActionCell=v;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const k=require("react/jsx-runtime"),S=require("../../../../tooltip/Tooltip.cjs.js"),T=require("../../../../../providers/design-system-provider/hooks.cjs.js"),C=require("../../../../../_virtual/index.cjs.js"),R=require("react"),v=({disableOptionsForRowIndex:d,tableActions:p,index:l,is_read:h,showNewItem:y,is_modified:t,is_row_modified:a,is_deleted:s,currentData:r,is_added:b,rowData:j,id:c,rowHovering:o,isDisabled:n,bgColor:u,is_incomplete:g,isInlineEditing:e,rowHasPendingEdits:f})=>{const q=T.useTableConfig()?.t?.("Save or cancel pending changes first")??"Save or cancel pending changes first",m=R.useMemo(()=>e?"bg-primary-50 dark:bg-primary-900":u||(s||r?.is_deleted?"bg-error-100 dark:bg-error-975":g||t||a||r?.is_row_modified?"bg-warning-50 dark:bg-orange-900":b||r?.is_added?"bg-success-50 dark:bg-success-900":!h&&y&&!n?"bg-primary-50 dark:bg-black-700":"bg-white dark:bg-black-800"),[g,h,y,t,a,s,r,b,u,e,n]),x=d===l||n||f;return k.jsxs("td",{"aria-disabled":x,className:C("px-2.5 relative h-row",m,x&&"cursor-not-allowed opacity-50"),children:[p(j,l),k.jsx(S,{title:f?q:"",children:k.jsx("div",{className:C("absolute top-0 left-0 flex items-center justify-center w-full h-full z-20",{[m]:o!==c||e},{"bg-neutral-100 dark:bg-black-600":o===c&&!e&&!(s||r?.is_deleted)&&!(b||r?.is_added)},{"bg-error-200 dark:bg-error-900":o===c&&!e&&(s||r?.is_deleted)},{"bg-success-100 dark:bg-success-800":o===c&&!e&&(b||r?.is_added)},{"bg-warning-100 dark:bg-warning-950":o===c&&!e&&(g||t||a||r?.is_row_modified)},f&&"pointer-events-none"),children:p(j,l)})})]})},w=R.memo(v);exports.RowActionCell=w;
 //# sourceMappingURL=RowActionCell.cjs.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"RowActionCell.cjs.js","sources":["../../../../../../src/components/data-display/infinite-table/body/cell/RowActionCell.tsx"],"sourcesContent":["import Tooltip from '../../../../tooltip/Tooltip';\nimport { useTableConfig } from '../../../../../providers/design-system-provider/hooks';\nimport cn from 'classnames';\nimport React, { useMemo } from 'react';\n\ntype TProps = {\n  disableOptionsForRowIndex: number | null;\n  tableActions: (rowData: Record<string, unknown>, index: number) => JSX.Element;\n  index: number;\n  is_read: boolean;\n  showNewItem: boolean;\n  is_modified: boolean;\n  is_row_modified: boolean;\n  is_deleted: boolean;\n  currentData: Record<string, unknown>;\n  is_added: boolean;\n  rowData: Record<string, unknown>;\n  id: string | number;\n  rowHovering: string | number | null;\n  isDisabled?: boolean;\n  bgColor?: string;\n  is_incomplete: boolean;\n  isInlineEditing?: boolean;\n  rowHasPendingEdits?: boolean;\n};\n\nconst RowActionCellInner: React.FC<TProps> = ({\n  disableOptionsForRowIndex,\n  tableActions,\n  index,\n  is_read,\n  showNewItem,\n  is_modified,\n  is_row_modified,\n  is_deleted,\n  currentData,\n  is_added,\n  rowData,\n  id,\n  rowHovering,\n  isDisabled,\n  bgColor,\n  is_incomplete,\n  isInlineEditing,\n  rowHasPendingEdits,\n}) => {\n  const tableConfig = useTableConfig();\n  const pendingEditsTooltip = tableConfig?.t?.('Save or cancel pending changes first') ?? 'Save or cancel pending changes first';\n\n  const backgroundColorClass = useMemo(() => {\n    if (isInlineEditing) return 'bg-primary-50 dark:bg-primary-900';\n    if (bgColor) return bgColor;\n    if (is_deleted || currentData?.is_deleted) return 'bg-error-100 dark:bg-error-975';\n    if (is_incomplete || is_modified || is_row_modified || currentData?.is_row_modified) return 'bg-warning-50 dark:bg-black-500';\n    if (is_added || currentData?.is_added) return 'bg-success-50 dark:bg-success-900';\n    if (!is_read && showNewItem && !isDisabled) return 'bg-primary-50 dark:bg-black-700';\n    return 'bg-white dark:bg-black-800';\n  }, [is_incomplete, is_read, showNewItem, is_modified, is_row_modified, is_deleted, currentData, is_added, bgColor, isInlineEditing, isDisabled]);\n\n  const isRowDisabled = disableOptionsForRowIndex === index || isDisabled || rowHasPendingEdits;\n\n  return (\n    <td aria-disabled={isRowDisabled} className={cn('px-2.5 relative h-row', backgroundColorClass, isRowDisabled && 'cursor-not-allowed opacity-50')}>\n      {tableActions(rowData, index)}\n      <Tooltip title={rowHasPendingEdits ? pendingEditsTooltip : ''}>\n        <div\n          className={cn(\n            'absolute top-0 left-0 flex items-center justify-center w-full z-20',\n            { [backgroundColorClass]: rowHovering !== id || isInlineEditing },\n            { 'bg-warning-100 dark:bg-warning-900': rowHovering === id && !isInlineEditing && !(is_deleted || currentData?.is_deleted) && !(is_added || currentData?.is_added) },\n            { 'bg-error-200 dark:bg-error-900': rowHovering === id && !isInlineEditing && (is_deleted || currentData?.is_deleted) },\n            { 'bg-success-100 dark:bg-success-800': rowHovering === id && !isInlineEditing && (is_added || currentData?.is_added) },\n            rowHasPendingEdits && 'pointer-events-none',\n          )}\n        >\n          {tableActions(rowData, index)}\n        </div>\n      </Tooltip>\n    </td>\n  );\n};\n\nexport const RowActionCell = React.memo(RowActionCellInner);\n"],"names":["RowActionCellInner","disableOptionsForRowIndex","tableActions","index","is_read","showNewItem","is_modified","is_row_modified","is_deleted","currentData","is_added","rowData","id","rowHovering","isDisabled","bgColor","is_incomplete","isInlineEditing","rowHasPendingEdits","pendingEditsTooltip","useTableConfig","backgroundColorClass","useMemo","isRowDisabled","jsxs","cn","jsx","Tooltip","RowActionCell","React"],"mappings":"oTA0BMA,EAAuC,CAAC,CAC5C,0BAAAC,EACA,aAAAC,EAAA,MACAC,EACA,QAAAC,EACA,YAAAC,EACA,YAAAC,EACA,gBAAAC,EACA,WAAAC,EACA,YAAAC,EACA,SAAAC,EACA,QAAAC,EACA,GAAAC,EACA,YAAAC,EACA,WAAAC,EACA,QAAAC,EACA,cAAAC,EACA,gBAAAC,EACA,mBAAAC,CACF,IAAM,CAEJ,MAAMC,EADcC,EAAAA,eAAA,GACqB,IAAI,sCAAsC,GAAK,uCAElFC,EAAuBC,EAAAA,QAAQ,IAC/BL,EAAwB,oCACxBF,IACAP,GAAcC,GAAa,WAAmB,iCAC9CO,GAAiBV,GAAeC,GAAmBE,GAAa,gBAAwB,kCACxFC,GAAYD,GAAa,SAAiB,oCAC1C,CAACL,GAAWC,GAAe,CAACS,EAAmB,kCAC5C,8BACN,CAACE,EAAeZ,EAASC,EAAaC,EAAaC,EAAiBC,EAAYC,EAAaC,EAAUK,EAASE,EAAiBH,CAAU,CAAC,EAEzIS,EAAgBtB,IAA8BE,GAASW,GAAcI,EAE3E,OACEM,EAAAA,KAAC,KAAA,CAAG,gBAAeD,EAAe,UAAWE,EAAG,wBAAyBJ,EAAsBE,GAAiB,+BAA+B,EAC5I,SAAA,CAAArB,EAAaS,EAASR,CAAK,EAC5BuB,EAAAA,IAACC,EAAA,CAAQ,MAAOT,EAAqBC,EAAsB,GACzD,SAAAO,EAAAA,IAAC,MAAA,CACC,UAAWD,EACT,qEACA,CAAE,CAACJ,CAAoB,EAAGR,IAAgBD,GAAMK,CAAA,EAChD,CAAE,qCAAsCJ,IAAgBD,GAAM,CAACK,GAAmB,EAAET,GAAcC,GAAa,aAAe,EAAEC,GAAYD,GAAa,SAAA,EACzJ,CAAE,iCAAkCI,IAAgBD,GAAM,CAACK,IAAoBT,GAAcC,GAAa,WAAA,EAC1G,CAAE,qCAAsCI,IAAgBD,GAAM,CAACK,IAAoBP,GAAYD,GAAa,SAAA,EAC5GS,GAAsB,qBAAA,EAGvB,SAAAhB,EAAaS,EAASR,CAAK,CAAA,CAAA,CAC9B,CACF,CAAA,EACF,CAEJ,EAEayB,EAAgBC,EAAM,KAAK7B,CAAkB"}
+{"version":3,"file":"RowActionCell.cjs.js","sources":["../../../../../../src/components/data-display/infinite-table/body/cell/RowActionCell.tsx"],"sourcesContent":["import Tooltip from '../../../../tooltip/Tooltip';\nimport { useTableConfig } from '../../../../../providers/design-system-provider/hooks';\nimport cn from 'classnames';\nimport React, { useMemo } from 'react';\n\ntype TProps = {\n  disableOptionsForRowIndex: number | null;\n  tableActions: (rowData: Record<string, unknown>, index: number) => JSX.Element;\n  index: number;\n  is_read: boolean;\n  showNewItem: boolean;\n  is_modified: boolean;\n  is_row_modified: boolean;\n  is_deleted: boolean;\n  currentData: Record<string, unknown>;\n  is_added: boolean;\n  rowData: Record<string, unknown>;\n  id: string | number;\n  rowHovering: string | number | null;\n  isDisabled?: boolean;\n  bgColor?: string;\n  is_incomplete: boolean;\n  isInlineEditing?: boolean;\n  rowHasPendingEdits?: boolean;\n};\n\nconst RowActionCellInner: React.FC<TProps> = ({\n  disableOptionsForRowIndex,\n  tableActions,\n  index,\n  is_read,\n  showNewItem,\n  is_modified,\n  is_row_modified,\n  is_deleted,\n  currentData,\n  is_added,\n  rowData,\n  id,\n  rowHovering,\n  isDisabled,\n  bgColor,\n  is_incomplete,\n  isInlineEditing,\n  rowHasPendingEdits,\n}) => {\n  const tableConfig = useTableConfig();\n  const pendingEditsTooltip = tableConfig?.t?.('Save or cancel pending changes first') ?? 'Save or cancel pending changes first';\n\n  const backgroundColorClass = useMemo(() => {\n    if (isInlineEditing) return 'bg-primary-50 dark:bg-primary-900';\n    if (bgColor) return bgColor;\n    if (is_deleted || currentData?.is_deleted) return 'bg-error-100 dark:bg-error-975';\n    if (is_incomplete || is_modified || is_row_modified || currentData?.is_row_modified) return 'bg-warning-50 dark:bg-orange-900';\n    if (is_added || currentData?.is_added) return 'bg-success-50 dark:bg-success-900';\n    if (!is_read && showNewItem && !isDisabled) return 'bg-primary-50 dark:bg-black-700';\n    return 'bg-white dark:bg-black-800';\n  }, [is_incomplete, is_read, showNewItem, is_modified, is_row_modified, is_deleted, currentData, is_added, bgColor, isInlineEditing, isDisabled]);\n\n  const isRowDisabled = disableOptionsForRowIndex === index || isDisabled || rowHasPendingEdits;\n\n  return (\n    <td aria-disabled={isRowDisabled} className={cn('px-2.5 relative h-row', backgroundColorClass, isRowDisabled && 'cursor-not-allowed opacity-50')}>\n      {tableActions(rowData, index)}\n      <Tooltip title={rowHasPendingEdits ? pendingEditsTooltip : ''}>\n        <div\n          className={cn(\n            'absolute top-0 left-0 flex items-center justify-center w-full h-full z-20',\n            { [backgroundColorClass]: rowHovering !== id || isInlineEditing },\n            { 'bg-neutral-100 dark:bg-black-600': rowHovering === id && !isInlineEditing && !(is_deleted || currentData?.is_deleted) && !(is_added || currentData?.is_added) },\n            { 'bg-error-200 dark:bg-error-900': rowHovering === id && !isInlineEditing && (is_deleted || currentData?.is_deleted) },\n            { 'bg-success-100 dark:bg-success-800': rowHovering === id && !isInlineEditing && (is_added || currentData?.is_added) },\n            { 'bg-warning-100 dark:bg-warning-950': rowHovering === id && !isInlineEditing && (is_incomplete || is_modified || is_row_modified || currentData?.is_row_modified) },\n            rowHasPendingEdits && 'pointer-events-none',\n          )}\n        >\n          {tableActions(rowData, index)}\n        </div>\n      </Tooltip>\n    </td>\n  );\n};\n\nexport const RowActionCell = React.memo(RowActionCellInner);\n"],"names":["RowActionCellInner","disableOptionsForRowIndex","tableActions","index","is_read","showNewItem","is_modified","is_row_modified","is_deleted","currentData","is_added","rowData","id","rowHovering","isDisabled","bgColor","is_incomplete","isInlineEditing","rowHasPendingEdits","pendingEditsTooltip","useTableConfig","backgroundColorClass","useMemo","isRowDisabled","jsxs","cn","jsx","Tooltip","RowActionCell","React"],"mappings":"oTA0BMA,EAAuC,CAAC,CAC5C,0BAAAC,EACA,aAAAC,EAAA,MACAC,EACA,QAAAC,EACA,YAAAC,EACA,YAAAC,EACA,gBAAAC,EACA,WAAAC,EACA,YAAAC,EACA,SAAAC,EACA,QAAAC,EACA,GAAAC,EACA,YAAAC,EACA,WAAAC,EACA,QAAAC,EACA,cAAAC,EACA,gBAAAC,EACA,mBAAAC,CACF,IAAM,CAEJ,MAAMC,EADcC,EAAAA,eAAA,GACqB,IAAI,sCAAsC,GAAK,uCAElFC,EAAuBC,EAAAA,QAAQ,IAC/BL,EAAwB,oCACxBF,IACAP,GAAcC,GAAa,WAAmB,iCAC9CO,GAAiBV,GAAeC,GAAmBE,GAAa,gBAAwB,mCACxFC,GAAYD,GAAa,SAAiB,oCAC1C,CAACL,GAAWC,GAAe,CAACS,EAAmB,kCAC5C,8BACN,CAACE,EAAeZ,EAASC,EAAaC,EAAaC,EAAiBC,EAAYC,EAAaC,EAAUK,EAASE,EAAiBH,CAAU,CAAC,EAEzIS,EAAgBtB,IAA8BE,GAASW,GAAcI,EAE3E,OACEM,EAAAA,KAAC,KAAA,CAAG,gBAAeD,EAAe,UAAWE,EAAG,wBAAyBJ,EAAsBE,GAAiB,+BAA+B,EAC5I,SAAA,CAAArB,EAAaS,EAASR,CAAK,EAC5BuB,EAAAA,IAACC,EAAA,CAAQ,MAAOT,EAAqBC,EAAsB,GACzD,SAAAO,EAAAA,IAAC,MAAA,CACC,UAAWD,EACT,4EACA,CAAE,CAACJ,CAAoB,EAAGR,IAAgBD,GAAMK,CAAA,EAChD,CAAE,mCAAoCJ,IAAgBD,GAAM,CAACK,GAAmB,EAAET,GAAcC,GAAa,aAAe,EAAEC,GAAYD,GAAa,SAAA,EACvJ,CAAE,iCAAkCI,IAAgBD,GAAM,CAACK,IAAoBT,GAAcC,GAAa,WAAA,EAC1G,CAAE,qCAAsCI,IAAgBD,GAAM,CAACK,IAAoBP,GAAYD,GAAa,SAAA,EAC5G,CAAE,qCAAsCI,IAAgBD,GAAM,CAACK,IAAoBD,GAAiBV,GAAeC,GAAmBE,GAAa,gBAAA,EACnJS,GAAsB,qBAAA,EAGvB,SAAAhB,EAAaS,EAASR,CAAK,CAAA,CAAA,CAC9B,CACF,CAAA,EACF,CAEJ,EAEayB,EAAgBC,EAAM,KAAK7B,CAAkB"}