@umodeapporg/ui 0.0.0-canary.ca10e69

package/dist/components/UI/DataTable/bulkEditValues.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bulkEditValues.js","sources":["../../../../src/components/UI/DataTable/bulkEditValues.ts"],"sourcesContent":["export const isBulkValueEmpty = (value: unknown): boolean =>\n  Array.isArray(value) ? value.length === 0 : value == null || value === '';\n\n/**\n * Compares a cell draft with the row's current value. Editors produce strings\n * while the document may store numbers, so both sides are compared in textual\n * form; empty (null, '', []) is a single state, so editing and reverting does\n * not count as a change.\n */\nexport const areBulkValuesEqual = (left: unknown, right: unknown): boolean => {\n  if (isBulkValueEmpty(left) && isBulkValueEmpty(right)) return true;\n  if (isBulkValueEmpty(left) !== isBulkValueEmpty(right)) return false;\n\n  const leftEntries = (Array.isArray(left) ? left : [left]).map(String);\n  const rightEntries = (Array.isArray(right) ? right : [right]).map(String);\n\n  return (\n    leftEntries.length === rightEntries.length && leftEntries.every((entry, index) => entry === rightEntries[index])\n  );\n};\n"],"names":[],"mappings":"AAAO,MAAM,mBAAmB,CAAC,UAC/B,MAAM,QAAQ,KAAK,IAAI,MAAM,WAAW,IAAI,SAAS,QAAQ,UAAU;AAQlE,MAAM,qBAAqB,CAAC,MAAe,UAA4B;AAC5E,MAAI,iBAAiB,IAAI,KAAK,iBAAiB,KAAK,EAAG,QAAO;AAC9D,MAAI,iBAAiB,IAAI,MAAM,iBAAiB,KAAK,EAAG,QAAO;AAE/D,QAAM,eAAe,MAAM,QAAQ,IAAI,IAAI,OAAO,CAAC,IAAI,GAAG,IAAI,MAAM;AACpE,QAAM,gBAAgB,MAAM,QAAQ,KAAK,IAAI,QAAQ,CAAC,KAAK,GAAG,IAAI,MAAM;AAExE,SACE,YAAY,WAAW,aAAa,UAAU,YAAY,MAAM,CAAC,OAAO,UAAU,UAAU,aAAa,KAAK,CAAC;AAEnH;"}

package/dist/components/UI/DataTable/cells/DataTableActionsCell.d.ts

@@ -0,0 +1,7 @@
+import { IDataTableActionItem, IDataTableRow } from '../types';
+interface IDataTableActionsCellProps<T extends IDataTableRow> {
+    row: T;
+    actions: Array<IDataTableActionItem<T>>;
+}
+declare const DataTableActionsCell: <T extends IDataTableRow>({ row, actions }: IDataTableActionsCellProps<T>) => import("react").JSX.Element | null;
+export default DataTableActionsCell;

package/dist/components/UI/DataTable/cells/DataTableActionsCell.js

@@ -0,0 +1,55 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import classNames from "classnames";
+import { useTranslation } from "react-i18next";
+import ControlledButton from "../../../Form/ControlledButton.js";
+import ControlledSwitch from "../../../Form/ControlledSwitch.js";
+import { useUiAccess } from "../../access/UiAccessContext.js";
+import ControlledTooltip from "../../ControlledTooltip.js";
+import { MaterialSymbol } from "../../MaterialSymbol/index.js";
+import { formatNumber } from "../../../../helpers/formatHelpers.js";
+const DataTableActionsCell = ({ row, actions }) => {
+  const { t } = useTranslation("ui");
+  const { check } = useUiAccess();
+  const visibleActions = actions.filter((action) => !action.hidden?.(row));
+  if (visibleActions.length === 0) return null;
+  return /* @__PURE__ */ jsx("div", { className: "flex items-center justify-end gap-1", onClick: (event) => event.stopPropagation(), children: visibleActions.map((action) => {
+    const label = typeof action.label === "function" ? action.label(row) : action.label;
+    const icon = typeof action.icon === "function" ? action.icon(row) : action.icon;
+    const count = action.count?.(row);
+    const isDeniedByPermission = Boolean(action.capability) && !check(action.capability ?? [], "any");
+    const isDisabled = isDeniedByPermission || action.disabled?.(row);
+    if (action.toggle) {
+      return /* @__PURE__ */ jsx(ControlledTooltip, { content: isDeniedByPermission ? t("permissions.deniedAction") : label, children: /* @__PURE__ */ jsx("span", { className: "inline-flex px-1", children: /* @__PURE__ */ jsx(
+        ControlledSwitch,
+        {
+          size: "sm",
+          checked: action.toggle(row),
+          disabled: isDisabled,
+          ariaLabel: label,
+          onChange: () => action.onClick(row)
+        }
+      ) }) }, action.key);
+    }
+    return /* @__PURE__ */ jsx(ControlledTooltip, { content: isDeniedByPermission ? t("permissions.deniedAction") : label, children: /* @__PURE__ */ jsx("span", { className: "inline-flex", children: /* @__PURE__ */ jsxs(
+      ControlledButton,
+      {
+        defaultHtmlButton: true,
+        "aria-label": label,
+        disabled: isDisabled,
+        onClick: () => action.onClick(row),
+        className: classNames(
+          "inline-flex cursor-pointer items-center justify-center gap-1 rounded-md p-1.5 transition-colors disabled:cursor-not-allowed",
+          action.danger ? "text-danger-emphasis hover:bg-danger-soft disabled:text-danger-soft" : "text-foreground-subtle hover:bg-muted-hover hover:text-foreground-muted disabled:text-foreground-faint"
+        ),
+        children: [
+          icon && /* @__PURE__ */ jsx(MaterialSymbol, { icon, size: 18 }),
+          typeof count === "number" && /* @__PURE__ */ jsx("span", { className: "text-xs font-semibold", children: formatNumber(count) })
+        ]
+      }
+    ) }) }, action.key);
+  }) });
+};
+export {
+  DataTableActionsCell as default
+};
+//# sourceMappingURL=DataTableActionsCell.js.map

package/dist/components/UI/DataTable/cells/DataTableActionsCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableActionsCell.js","sources":["../../../../../src/components/UI/DataTable/cells/DataTableActionsCell.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { useTranslation } from 'react-i18next';\n\nimport ControlledButton from '@/components/Form/ControlledButton';\nimport ControlledSwitch from '@/components/Form/ControlledSwitch';\nimport { useUiAccess } from '@/components/UI/access/UiAccessContext';\nimport ControlledTooltip from '@/components/UI/ControlledTooltip';\nimport { MaterialSymbol } from '@/components/UI/MaterialSymbol';\nimport { formatNumber } from '@/helpers/formatHelpers';\n\nimport type { IDataTableActionItem, IDataTableRow } from '../types';\n\ninterface IDataTableActionsCellProps<T extends IDataTableRow> {\n  row: T;\n  actions: Array<IDataTableActionItem<T>>;\n}\n\nconst DataTableActionsCell = <T extends IDataTableRow>({ row, actions }: IDataTableActionsCellProps<T>) => {\n  const { t } = useTranslation('ui');\n  const { check } = useUiAccess();\n\n  const visibleActions = actions.filter((action) => !action.hidden?.(row));\n\n  if (visibleActions.length === 0) return null;\n\n  return (\n    <div className=\"flex items-center justify-end gap-1\" onClick={(event) => event.stopPropagation()}>\n      {visibleActions.map((action) => {\n        const label = typeof action.label === 'function' ? action.label(row) : action.label;\n        const icon = typeof action.icon === 'function' ? action.icon(row) : action.icon;\n        const count = action.count?.(row);\n        const isDeniedByPermission = Boolean(action.capability) && !check(action.capability ?? [], 'any');\n        const isDisabled = isDeniedByPermission || action.disabled?.(row);\n\n        if (action.toggle) {\n          return (\n            <ControlledTooltip key={action.key} content={isDeniedByPermission ? t('permissions.deniedAction') : label}>\n              <span className=\"inline-flex px-1\">\n                <ControlledSwitch\n                  size=\"sm\"\n                  checked={action.toggle(row)}\n                  disabled={isDisabled}\n                  ariaLabel={label}\n                  onChange={() => action.onClick(row)}\n                />\n              </span>\n            </ControlledTooltip>\n          );\n        }\n\n        return (\n          <ControlledTooltip key={action.key} content={isDeniedByPermission ? t('permissions.deniedAction') : label}>\n            <span className=\"inline-flex\">\n              <ControlledButton\n                defaultHtmlButton\n                aria-label={label}\n                disabled={isDisabled}\n                onClick={() => action.onClick(row)}\n                className={classNames(\n                  'inline-flex cursor-pointer items-center justify-center gap-1 rounded-md p-1.5 transition-colors disabled:cursor-not-allowed',\n                  action.danger\n                    ? 'text-danger-emphasis hover:bg-danger-soft disabled:text-danger-soft'\n                    : 'text-foreground-subtle hover:bg-muted-hover hover:text-foreground-muted disabled:text-foreground-faint',\n                )}\n              >\n                {icon && <MaterialSymbol icon={icon} size={18} />}\n                {typeof count === 'number' && <span className=\"text-xs font-semibold\">{formatNumber(count)}</span>}\n              </ControlledButton>\n            </span>\n          </ControlledTooltip>\n        );\n      })}\n    </div>\n  );\n};\n\nexport default DataTableActionsCell;\n"],"names":[],"mappings":";;;;;;;;;AAiBA,MAAM,uBAAuB,CAA0B,EAAE,KAAK,cAA6C;AACzG,QAAM,EAAE,EAAA,IAAM,eAAe,IAAI;AACjC,QAAM,EAAE,MAAA,IAAU,YAAA;AAElB,QAAM,iBAAiB,QAAQ,OAAO,CAAC,WAAW,CAAC,OAAO,SAAS,GAAG,CAAC;AAEvE,MAAI,eAAe,WAAW,EAAG,QAAO;AAExC,SACE,oBAAC,OAAA,EAAI,WAAU,uCAAsC,SAAS,CAAC,UAAU,MAAM,gBAAA,GAC5E,UAAA,eAAe,IAAI,CAAC,WAAW;AAC9B,UAAM,QAAQ,OAAO,OAAO,UAAU,aAAa,OAAO,MAAM,GAAG,IAAI,OAAO;AAC9E,UAAM,OAAO,OAAO,OAAO,SAAS,aAAa,OAAO,KAAK,GAAG,IAAI,OAAO;AAC3E,UAAM,QAAQ,OAAO,QAAQ,GAAG;AAChC,UAAM,uBAAuB,QAAQ,OAAO,UAAU,KAAK,CAAC,MAAM,OAAO,cAAc,CAAA,GAAI,KAAK;AAChG,UAAM,aAAa,wBAAwB,OAAO,WAAW,GAAG;AAEhE,QAAI,OAAO,QAAQ;AACjB,aACE,oBAAC,mBAAA,EAAmC,SAAS,uBAAuB,EAAE,0BAA0B,IAAI,OAClG,UAAA,oBAAC,QAAA,EAAK,WAAU,oBACd,UAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,SAAS,OAAO,OAAO,GAAG;AAAA,UAC1B,UAAU;AAAA,UACV,WAAW;AAAA,UACX,UAAU,MAAM,OAAO,QAAQ,GAAG;AAAA,QAAA;AAAA,MAAA,GAEtC,EAAA,GATsB,OAAO,GAU/B;AAAA,IAEJ;AAEA,WACE,oBAAC,mBAAA,EAAmC,SAAS,uBAAuB,EAAE,0BAA0B,IAAI,OAClG,UAAA,oBAAC,QAAA,EAAK,WAAU,eACd,UAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,mBAAiB;AAAA,QACjB,cAAY;AAAA,QACZ,UAAU;AAAA,QACV,SAAS,MAAM,OAAO,QAAQ,GAAG;AAAA,QACjC,WAAW;AAAA,UACT;AAAA,UACA,OAAO,SACH,wEACA;AAAA,QAAA;AAAA,QAGL,UAAA;AAAA,UAAA,QAAQ,oBAAC,gBAAA,EAAe,MAAY,MAAM,IAAI;AAAA,UAC9C,OAAO,UAAU,YAAY,oBAAC,UAAK,WAAU,yBAAyB,UAAA,aAAa,KAAK,EAAA,CAAE;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA,GAE/F,EAAA,GAjBsB,OAAO,GAkB/B;AAAA,EAEJ,CAAC,EAAA,CACH;AAEJ;"}

package/dist/components/UI/DataTable/cells/DataTableCell.d.ts

@@ -0,0 +1,15 @@
+import { IDataTableColumnConfig, IDataTableRow } from '../types';
+interface IDataTableCellProps<T extends IDataTableRow> {
+    column: IDataTableColumnConfig<T>;
+    row: T;
+    /** TanStack row id, the grid coordinate of this cell in the spreadsheet layer. */
+    gridRowId?: string;
+    /** When present and the column is `editable`, the cell renders a controlled editor. */
+    onCellChange?: (row: T, columnId: string, value: unknown) => void;
+    /** Forwarded to the editable cell: Enter moves focus to the next editable input. */
+    keyboardNav?: boolean;
+    /** Forwarded to the editable cell: the value shows as text until the cell is clicked. */
+    clickToEdit?: boolean;
+}
+declare const DataTableCell: <T extends IDataTableRow>({ column, row, gridRowId, onCellChange, keyboardNav, clickToEdit, }: IDataTableCellProps<T>) => import("react").JSX.Element;
+export default DataTableCell;

package/dist/components/UI/DataTable/cells/DataTableCell.js

@@ -0,0 +1,63 @@
+import { jsx, Fragment } from "react/jsx-runtime";
+import DataTableCodeCell from "./DataTableCodeCell.js";
+import DataTableColorCell from "./DataTableColorCell.js";
+import DataTableCountCell from "./DataTableCountCell.js";
+import DataTableDateCell from "./DataTableDateCell.js";
+import DataTableEditableCell from "./DataTableEditableCell.js";
+import DataTableEmpenhoCell from "./DataTableEmpenhoCell.js";
+import DataTableOriginCell from "./DataTableOriginCell.js";
+import DataTableStatusCell from "./DataTableStatusCell.js";
+import DataTableTagCell from "./DataTableTagCell.js";
+import DataTableTextCell from "./DataTableTextCell.js";
+import DataTableThumbnailCell from "./DataTableThumbnailCell.js";
+const DataTableCell = ({
+  column,
+  row,
+  gridRowId,
+  onCellChange,
+  keyboardNav,
+  clickToEdit
+}) => {
+  if (column.editable && onCellChange) {
+    return /* @__PURE__ */ jsx(
+      DataTableEditableCell,
+      {
+        column,
+        row,
+        gridRowId,
+        onCellChange,
+        keyboardNav,
+        clickToEdit
+      }
+    );
+  }
+  if (column.render) return /* @__PURE__ */ jsx(Fragment, { children: column.render(row) });
+  const value = column.accessor?.(row);
+  switch (column.type) {
+    case "code":
+      return /* @__PURE__ */ jsx(DataTableCodeCell, { value });
+    case "color":
+      return /* @__PURE__ */ jsx(DataTableColorCell, { value });
+    case "thumbnail":
+      return /* @__PURE__ */ jsx(DataTableThumbnailCell, { value });
+    case "badgeStatus":
+      return /* @__PURE__ */ jsx(DataTableStatusCell, { value });
+    case "origin":
+      return /* @__PURE__ */ jsx(DataTableOriginCell, { value });
+    case "tag":
+      return /* @__PURE__ */ jsx(DataTableTagCell, { value });
+    case "count":
+      return /* @__PURE__ */ jsx(DataTableCountCell, { value });
+    case "commitment":
+      return /* @__PURE__ */ jsx(DataTableEmpenhoCell, { value });
+    case "date":
+      return /* @__PURE__ */ jsx(DataTableDateCell, { value });
+    case "text":
+    default:
+      return /* @__PURE__ */ jsx(DataTableTextCell, { value });
+  }
+};
+export {
+  DataTableCell as default
+};
+//# sourceMappingURL=DataTableCell.js.map

package/dist/components/UI/DataTable/cells/DataTableCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableCell.js","sources":["../../../../../src/components/UI/DataTable/cells/DataTableCell.tsx"],"sourcesContent":["import type {\n  IDataTableColorValue,\n  IDataTableColumnConfig,\n  IDataTableOriginValue,\n  IDataTableRow,\n  IDataTableStatusValue,\n  IDataTableTagValue,\n  IDataTableThumbnailValue,\n} from '../types';\n\nimport DataTableCodeCell from './DataTableCodeCell';\nimport DataTableColorCell from './DataTableColorCell';\nimport DataTableCountCell from './DataTableCountCell';\nimport DataTableDateCell from './DataTableDateCell';\nimport DataTableEditableCell from './DataTableEditableCell';\nimport DataTableEmpenhoCell from './DataTableEmpenhoCell';\nimport DataTableOriginCell from './DataTableOriginCell';\nimport DataTableStatusCell from './DataTableStatusCell';\nimport DataTableTagCell from './DataTableTagCell';\nimport DataTableTextCell from './DataTableTextCell';\nimport DataTableThumbnailCell from './DataTableThumbnailCell';\n\ninterface IDataTableCellProps<T extends IDataTableRow> {\n  column: IDataTableColumnConfig<T>;\n  row: T;\n  /** TanStack row id, the grid coordinate of this cell in the spreadsheet layer. */\n  gridRowId?: string;\n  /** When present and the column is `editable`, the cell renders a controlled editor. */\n  onCellChange?: (row: T, columnId: string, value: unknown) => void;\n  /** Forwarded to the editable cell: Enter moves focus to the next editable input. */\n  keyboardNav?: boolean;\n  /** Forwarded to the editable cell: the value shows as text until the cell is clicked. */\n  clickToEdit?: boolean;\n}\n\nconst DataTableCell = <T extends IDataTableRow>({\n  column,\n  row,\n  gridRowId,\n  onCellChange,\n  keyboardNav,\n  clickToEdit,\n}: IDataTableCellProps<T>) => {\n  if (column.editable && onCellChange) {\n    return (\n      <DataTableEditableCell\n        column={column}\n        row={row}\n        gridRowId={gridRowId}\n        onCellChange={onCellChange}\n        keyboardNav={keyboardNav}\n        clickToEdit={clickToEdit}\n      />\n    );\n  }\n\n  if (column.render) return <>{column.render(row)}</>;\n\n  const value = column.accessor?.(row);\n\n  switch (column.type) {\n    case 'code':\n      return <DataTableCodeCell value={value as string} />;\n    case 'color':\n      return <DataTableColorCell value={value as IDataTableColorValue} />;\n    case 'thumbnail':\n      return <DataTableThumbnailCell value={value as IDataTableThumbnailValue} />;\n    case 'badgeStatus':\n      return <DataTableStatusCell value={value as IDataTableStatusValue} />;\n    case 'origin':\n      return <DataTableOriginCell value={value as IDataTableOriginValue} />;\n    case 'tag':\n      return <DataTableTagCell value={value as IDataTableTagValue} />;\n    case 'count':\n      return <DataTableCountCell value={value as number} />;\n    case 'commitment':\n      return <DataTableEmpenhoCell value={value as number} />;\n    case 'date':\n      return <DataTableDateCell value={value as string} />;\n    case 'text':\n    default:\n      return <DataTableTextCell value={value as string} />;\n  }\n};\n\nexport default DataTableCell;\n"],"names":[],"mappings":";;;;;;;;;;;;AAmCA,MAAM,gBAAgB,CAA0B;AAAA,EAC9C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAA8B;AAC5B,MAAI,OAAO,YAAY,cAAc;AACnC,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AAEA,MAAI,OAAO,OAAQ,wCAAU,UAAA,OAAO,OAAO,GAAG,GAAE;AAEhD,QAAM,QAAQ,OAAO,WAAW,GAAG;AAEnC,UAAQ,OAAO,MAAA;AAAA,IACb,KAAK;AACH,aAAO,oBAAC,qBAAkB,OAAwB;AAAA,IACpD,KAAK;AACH,aAAO,oBAAC,sBAAmB,OAAsC;AAAA,IACnE,KAAK;AACH,aAAO,oBAAC,0BAAuB,OAA0C;AAAA,IAC3E,KAAK;AACH,aAAO,oBAAC,uBAAoB,OAAuC;AAAA,IACrE,KAAK;AACH,aAAO,oBAAC,uBAAoB,OAAuC;AAAA,IACrE,KAAK;AACH,aAAO,oBAAC,oBAAiB,OAAoC;AAAA,IAC/D,KAAK;AACH,aAAO,oBAAC,sBAAmB,OAAwB;AAAA,IACrD,KAAK;AACH,aAAO,oBAAC,wBAAqB,OAAwB;AAAA,IACvD,KAAK;AACH,aAAO,oBAAC,qBAAkB,OAAwB;AAAA,IACpD,KAAK;AAAA,IACL;AACE,aAAO,oBAAC,qBAAkB,OAAwB;AAAA,EAAA;AAExD;"}

package/dist/components/UI/DataTable/cells/DataTableCodeCell.d.ts

@@ -0,0 +1,6 @@
+interface IDataTableCodeCellProps {
+    value: string | null | undefined;
+    className?: string;
+}
+declare const DataTableCodeCell: React.FC<IDataTableCodeCellProps>;
+export default DataTableCodeCell;

package/dist/components/UI/DataTable/cells/DataTableCodeCell.js

@@ -0,0 +1,7 @@
+import { jsx } from "react/jsx-runtime";
+import classNames from "classnames";
+const DataTableCodeCell = ({ value, className }) => /* @__PURE__ */ jsx("span", { className: classNames("block truncate font-mono text-xs text-foreground-subtle", className), children: value?.length ? value : "-" });
+export {
+  DataTableCodeCell as default
+};
+//# sourceMappingURL=DataTableCodeCell.js.map

package/dist/components/UI/DataTable/cells/DataTableCodeCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableCodeCell.js","sources":["../../../../../src/components/UI/DataTable/cells/DataTableCodeCell.tsx"],"sourcesContent":["import classNames from 'classnames';\n\ninterface IDataTableCodeCellProps {\n  value: string | null | undefined;\n  className?: string;\n}\n\nconst DataTableCodeCell: React.FC<IDataTableCodeCellProps> = ({ value, className }) => (\n  <span className={classNames('block truncate font-mono text-xs text-foreground-subtle', className)}>\n    {value?.length ? value : '-'}\n  </span>\n);\n\nexport default DataTableCodeCell;\n"],"names":[],"mappings":";;AAOA,MAAM,oBAAuD,CAAC,EAAE,OAAO,UAAA,MACrE,oBAAC,QAAA,EAAK,WAAW,WAAW,2DAA2D,SAAS,GAC7F,UAAA,OAAO,SAAS,QAAQ,IAAA,CAC3B;"}

package/dist/components/UI/DataTable/cells/DataTableColorCell.d.ts

@@ -0,0 +1,7 @@
+import { IDataTableColorValue } from '../types';
+interface IDataTableColorCellProps {
+    value: IDataTableColorValue | null | undefined;
+}
+/** Sem cor atribuída é um traço; cor atribuída sem código vira o cinza padrão, nunca um vazio. */
+declare const DataTableColorCell: React.FC<IDataTableColorCellProps>;
+export default DataTableColorCell;

package/dist/components/UI/DataTable/cells/DataTableColorCell.js

@@ -0,0 +1,10 @@
+import { jsx } from "react/jsx-runtime";
+import Colors from "../../Colors.js";
+const DataTableColorCell = ({ value }) => {
+  if (!value?.hex && !value?.label) return /* @__PURE__ */ jsx("span", { className: "text-sm text-foreground-faint", children: "-" });
+  return /* @__PURE__ */ jsx(Colors, { colors: value.hex ? [value.hex] : [], isSquare: true, label: value.label, className: "size-6 min-h-6 min-w-6" });
+};
+export {
+  DataTableColorCell as default
+};
+//# sourceMappingURL=DataTableColorCell.js.map

package/dist/components/UI/DataTable/cells/DataTableColorCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableColorCell.js","sources":["../../../../../src/components/UI/DataTable/cells/DataTableColorCell.tsx"],"sourcesContent":["import Colors from '@/components/UI/Colors';\n\nimport type { IDataTableColorValue } from '../types';\n\ninterface IDataTableColorCellProps {\n  value: IDataTableColorValue | null | undefined;\n}\n\n/** Sem cor atribuída é um traço; cor atribuída sem código vira o cinza padrão, nunca um vazio. */\nconst DataTableColorCell: React.FC<IDataTableColorCellProps> = ({ value }) => {\n  if (!value?.hex && !value?.label) return <span className=\"text-sm text-foreground-faint\">-</span>;\n\n  return (\n    <Colors colors={value.hex ? [value.hex] : []} isSquare label={value.label} className=\"size-6 min-h-6 min-w-6\" />\n  );\n};\n\nexport default DataTableColorCell;\n"],"names":[],"mappings":";;AASA,MAAM,qBAAyD,CAAC,EAAE,YAAY;AAC5E,MAAI,CAAC,OAAO,OAAO,CAAC,OAAO,MAAO,QAAO,oBAAC,QAAA,EAAK,WAAU,iCAAgC,UAAA,IAAA,CAAC;AAE1F,6BACG,QAAA,EAAO,QAAQ,MAAM,MAAM,CAAC,MAAM,GAAG,IAAI,CAAA,GAAI,UAAQ,MAAC,OAAO,MAAM,OAAO,WAAU,0BAAyB;AAElH;"}

package/dist/components/UI/DataTable/cells/DataTableCountCell.d.ts

@@ -0,0 +1,5 @@
+interface IDataTableCountCellProps {
+    value: number | null | undefined;
+}
+declare const DataTableCountCell: React.FC<IDataTableCountCellProps>;
+export default DataTableCountCell;

package/dist/components/UI/DataTable/cells/DataTableCountCell.js

@@ -0,0 +1,7 @@
+import { jsx } from "react/jsx-runtime";
+import { formatNumber } from "../../../../helpers/formatHelpers.js";
+const DataTableCountCell = ({ value }) => /* @__PURE__ */ jsx("span", { className: "text-sm tabular-nums text-foreground", children: formatNumber(value ?? 0) });
+export {
+  DataTableCountCell as default
+};
+//# sourceMappingURL=DataTableCountCell.js.map

package/dist/components/UI/DataTable/cells/DataTableCountCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableCountCell.js","sources":["../../../../../src/components/UI/DataTable/cells/DataTableCountCell.tsx"],"sourcesContent":["import { formatNumber } from '@/helpers/formatHelpers';\n\ninterface IDataTableCountCellProps {\n  value: number | null | undefined;\n}\n\nconst DataTableCountCell: React.FC<IDataTableCountCellProps> = ({ value }) => (\n  <span className=\"text-sm tabular-nums text-foreground\">{formatNumber(value ?? 0)}</span>\n);\n\nexport default DataTableCountCell;\n"],"names":[],"mappings":";;AAMA,MAAM,qBAAyD,CAAC,EAAE,YAChE,oBAAC,QAAA,EAAK,WAAU,wCAAwC,UAAA,aAAa,SAAS,CAAC,EAAA,CAAE;"}

package/dist/components/UI/DataTable/cells/DataTableDateCell.d.ts

@@ -0,0 +1,5 @@
+interface IDataTableDateCellProps {
+    value: string | Date | null | undefined;
+}
+declare const DataTableDateCell: React.FC<IDataTableDateCellProps>;
+export default DataTableDateCell;

package/dist/components/UI/DataTable/cells/DataTableDateCell.js

@@ -0,0 +1,12 @@
+import { jsx } from "react/jsx-runtime";
+import { formatDate } from "../../../../helpers/dateHelpers.js";
+const DataTableDateCell = ({ value }) => {
+  if (!value) return /* @__PURE__ */ jsx("span", { className: "text-sm text-foreground-faint", children: "-" });
+  const parsed = value instanceof Date ? value : new Date(value);
+  if (Number.isNaN(parsed.getTime())) return /* @__PURE__ */ jsx("span", { className: "text-sm text-foreground-faint", children: "-" });
+  return /* @__PURE__ */ jsx("span", { className: "text-sm text-foreground", children: formatDate(parsed) });
+};
+export {
+  DataTableDateCell as default
+};
+//# sourceMappingURL=DataTableDateCell.js.map

package/dist/components/UI/DataTable/cells/DataTableDateCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableDateCell.js","sources":["../../../../../src/components/UI/DataTable/cells/DataTableDateCell.tsx"],"sourcesContent":["import { formatDate } from '@/helpers/dateHelpers';\n\ninterface IDataTableDateCellProps {\n  value: string | Date | null | undefined;\n}\n\nconst DataTableDateCell: React.FC<IDataTableDateCellProps> = ({ value }) => {\n  if (!value) return <span className=\"text-sm text-foreground-faint\">-</span>;\n\n  const parsed = value instanceof Date ? value : new Date(value);\n\n  if (Number.isNaN(parsed.getTime())) return <span className=\"text-sm text-foreground-faint\">-</span>;\n\n  return <span className=\"text-sm text-foreground\">{formatDate(parsed)}</span>;\n};\n\nexport default DataTableDateCell;\n"],"names":[],"mappings":";;AAMA,MAAM,oBAAuD,CAAC,EAAE,YAAY;AAC1E,MAAI,CAAC,MAAO,4BAAQ,QAAA,EAAK,WAAU,iCAAgC,UAAA,KAAC;AAEpE,QAAM,SAAS,iBAAiB,OAAO,QAAQ,IAAI,KAAK,KAAK;AAE7D,MAAI,OAAO,MAAM,OAAO,QAAA,CAAS,EAAG,QAAO,oBAAC,QAAA,EAAK,WAAU,iCAAgC,UAAA,IAAA,CAAC;AAE5F,6BAAQ,QAAA,EAAK,WAAU,2BAA2B,UAAA,WAAW,MAAM,GAAE;AACvE;"}

package/dist/components/UI/DataTable/cells/DataTableEditableCell.d.ts

@@ -0,0 +1,23 @@
+import { IDataTableColumnConfig, IDataTableRow } from '../types';
+interface IDataTableEditableCellProps<T extends IDataTableRow> {
+    column: IDataTableColumnConfig<T>;
+    row: T;
+    /** TanStack row id: present only inside a spreadsheet-enabled table. */
+    gridRowId?: string;
+    onCellChange: (row: T, columnId: string, value: unknown) => void;
+    /** When true, pressing Enter moves focus to the next editable input (DOM order). */
+    keyboardNav?: boolean;
+    /** When true, the cell shows the value as text until it is clicked. */
+    clickToEdit?: boolean;
+}
+/**
+ * Controlled inline editor for a single cell. Reads the current value from the
+ * host-owned row via `column.editable.getValue` and reports every edit through
+ * `onCellChange`; the host re-renders with the updated row. Validation is derived
+ * from the current value on each render, so no local state is kept.
+ *
+ * With `clickToEdit`, the cell renders the value as text and only swaps in the editor
+ * once clicked, no editor is mounted before that.
+ */
+declare const DataTableEditableCell: <T extends IDataTableRow>({ column, row, gridRowId, onCellChange, keyboardNav, clickToEdit, }: IDataTableEditableCellProps<T>) => string | number | boolean | Iterable<import('react').ReactNode> | import("react").JSX.Element | null | undefined;
+export default DataTableEditableCell;

package/dist/components/UI/DataTable/cells/DataTableEditableCell.js

@@ -0,0 +1,242 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useRef, useState, useEffect } from "react";
+import classNames from "classnames";
+import { useTranslation } from "react-i18next";
+import DatePicker from "../../../DateTime/DatePicker.js";
+import ControlledInput from "../../../Form/ControlledInput.js";
+import { ControlledSelect } from "../../../Form/ControlledSelect.js";
+import ControlledTooltip from "../../ControlledTooltip.js";
+import { MaterialSymbol } from "../../MaterialSymbol/index.js";
+import { formatIsoDate } from "../../../../helpers/dateHelpers.js";
+import { useHoverCapable } from "../../../../hooks/useHoverCapable.js";
+import { useInlineEditor } from "../../../../hooks/useInlineEditor.js";
+import { useGridStoreApi, useGridCellState } from "../grid/GridProvider.js";
+import { GRID_CELL_EDITING } from "../grid/gridTypes.js";
+import { useGridEditMode } from "../grid/useGridInstance.js";
+import { useDataTableCellEditing, buildEditableCellKey, EDITABLE_CELL_ATTR } from "../useCellEditingState.js";
+const EDITABLE_INPUT_ATTR = "data-datatable-editable-input";
+const isSameEditableValue = (current, previous) => {
+  if (Array.isArray(current) || Array.isArray(previous)) {
+    if (!Array.isArray(current) || !Array.isArray(previous)) return false;
+    return current.length === previous.length && current.every((entry, index) => entry === previous[index]);
+  }
+  return current === previous;
+};
+const resolveDecimalSeparator = (language) => {
+  const separator = 1.1.toLocaleString(language || "pt-BR").replace(/\d/g, "");
+  return separator || ".";
+};
+const focusNextEditableInput = (current) => {
+  const inputs = Array.from(document.querySelectorAll(`[${EDITABLE_INPUT_ATTR}]`));
+  const index = inputs.indexOf(current);
+  if (index === -1) return;
+  inputs[index + 1]?.focus();
+};
+const DataTableEditableCell = ({
+  column,
+  row,
+  gridRowId,
+  onCellChange,
+  keyboardNav = false,
+  clickToEdit = false
+}) => {
+  const { t, i18n } = useTranslation("ui");
+  const hoverCapable = useHoverCapable();
+  const cellEditing = useDataTableCellEditing();
+  const gridStore = useGridStoreApi();
+  const gridCellState = useGridCellState(gridRowId ?? "", column.id);
+  const cellKey = buildEditableCellKey(row.id, column.id);
+  const isGridEditModeOn = useGridEditMode(gridStore);
+  const hasGrid = !!gridStore && !!gridRowId;
+  const isGridCell = hasGrid && isGridEditModeOn;
+  const isEditing = isGridCell ? (gridCellState & GRID_CELL_EDITING) !== 0 : clickToEdit ? cellEditing?.editingCellKey === cellKey : true;
+  const showsReadView = isGridCell || clickToEdit;
+  const { containerRef, handleKeyDown } = useInlineEditor(
+    Boolean(!isGridCell && clickToEdit && isEditing),
+    () => cellEditing?.stopEditing(),
+    (direction) => cellEditing?.navigate(cellKey, direction)
+  );
+  const editable = column.editable;
+  const valueBeforeEditRef = useRef(null);
+  const wasEditingRef = useRef(false);
+  const [draftText, setDraftText] = useState(null);
+  useEffect(() => {
+    if (!isEditing) setDraftText(null);
+  }, [isEditing]);
+  useEffect(() => {
+    if (!isGridCell || !editable) return;
+    if (isEditing) {
+      if (wasEditingRef.current) return;
+      wasEditingRef.current = true;
+      valueBeforeEditRef.current = editable.getValue(row);
+      const typedSeed = gridStore?.getState().editingSeed;
+      if (typedSeed == null) return;
+      setDraftText(typedSeed);
+      onCellChange(row, column.id, typedSeed);
+      return;
+    }
+    if (!wasEditingRef.current) return;
+    wasEditingRef.current = false;
+    if (gridStore?.getState().editingOutcome !== "cancel") return;
+    if (isSameEditableValue(editable.getValue(row), valueBeforeEditRef.current)) return;
+    onCellChange(row, column.id, valueBeforeEditRef.current);
+  }, [isEditing, isGridCell, editable, gridStore, onCellChange, row, column.id]);
+  if (!editable) return null;
+  const rawValue = editable.getValue(row);
+  const disabled = editable.disabled?.(row) ?? false;
+  const error = editable.validate?.(rawValue, row) ?? null;
+  const arrayValue = Array.isArray(rawValue) ? rawValue.map(String) : [];
+  const stringValue = rawValue == null || Array.isArray(rawValue) ? "" : String(rawValue);
+  const editorOptions = editable.getOptions?.(row) ?? editable.options;
+  const selectOptions = Array.isArray(editorOptions) ? editorOptions : [];
+  const decimalValue = editable.type === "number" && typeof rawValue === "number" ? stringValue.replace(".", resolveDecimalSeparator(i18n.language)) : stringValue;
+  const renderEditor = () => {
+    if (editable.renderEditor) {
+      return editable.renderEditor({
+        value: rawValue,
+        onChange: (nextValue) => onCellChange(row, column.id, nextValue),
+        disabled,
+        label: column.header,
+        row
+      });
+    }
+    if (editable.type === "multiselect") {
+      return /* @__PURE__ */ jsx(
+        ControlledSelect,
+        {
+          className: "w-full [&_.controlled-select-container]:!min-w-0 [&_.controlled-select-input]:!min-w-0",
+          options: selectOptions,
+          selectedValue: arrayValue,
+          onChangeHook: (selected) => onCellChange(row, column.id, Array.isArray(selected) ? selected : [selected]),
+          multiple: true,
+          searchable: true,
+          clearable: true,
+          disabled,
+          error: !!error
+        }
+      );
+    }
+    if (editable.type === "select") {
+      return (
+        // `ControlledSelect` ships hard min-widths (`min-w-52` on the field and the MT
+        // container's `min-w-[200px]`) that overflow narrow table cells and spill into
+        // the neighbouring column; force both to shrink so the editor fits its column
+        // like the text/number editors do.
+        /* @__PURE__ */ jsx(
+          ControlledSelect,
+          {
+            className: "w-full [&_.controlled-select-container]:!min-w-0 [&_.controlled-select-input]:!min-w-0",
+            options: selectOptions,
+            selectedValue: stringValue,
+            onChangeHook: (selected) => onCellChange(row, column.id, selected),
+            multiple: false,
+            searchable: true,
+            clearable: true,
+            disabled,
+            error: !!error
+          }
+        )
+      );
+    }
+    if (editable.type === "date") {
+      const parsed = stringValue ? new Date(stringValue) : void 0;
+      const startValue = parsed && !Number.isNaN(parsed.getTime()) ? parsed : void 0;
+      return /* @__PURE__ */ jsx(
+        DatePicker,
+        {
+          startValue,
+          onUpdate: (value) => onCellChange(row, column.id, value ?? null),
+          disabled
+        }
+      );
+    }
+    return /* @__PURE__ */ jsx(
+      ControlledInput,
+      {
+        value: draftText ?? decimalValue,
+        onChange: (event) => {
+          setDraftText(event.target.value);
+          onCellChange(row, column.id, event.target.value);
+        },
+        onBlur: () => setDraftText(null),
+        onKeyDown: keyboardNav && !isGridCell ? (event) => {
+          if (event.key === "Enter") {
+            event.preventDefault();
+            focusNextEditableInput(event.currentTarget);
+          }
+        } : void 0,
+        inputMode: editable.type === "number" ? "decimal" : void 0,
+        disabled,
+        error: !!error,
+        errorMessage: error ?? void 0,
+        "aria-label": column.header,
+        ...{ [EDITABLE_INPUT_ATTR]: "" },
+        containerClassName: "min-w-0"
+      }
+    );
+  };
+  if (!hasGrid && (!showsReadView || !cellEditing)) return renderEditor();
+  const resolveOptionLabel = (optionValue) => (editable.options ?? []).find((option) => String(option.value) === optionValue)?.label ?? optionValue;
+  const resolveDisplayText = () => {
+    if (editable.displayValue) return editable.displayValue(row);
+    if (editable.type === "multiselect") return arrayValue.map(resolveOptionLabel).join(", ");
+    if (stringValue === "") return "";
+    if (editable.type === "select") return resolveOptionLabel(stringValue);
+    if (editable.type === "date") return formatIsoDate(stringValue);
+    return decimalValue;
+  };
+  const displayText = resolveDisplayText();
+  const displayContent = !editable.displayValue && column.render ? column.render(row) : /* @__PURE__ */ jsx("span", { className: classNames("min-w-0 flex-1 truncate", displayText === "" && "text-foreground-faint"), children: displayText === "" ? "-" : displayText });
+  const showsEditAffordance = !disabled && (!hasGrid || isGridEditModeOn);
+  const readCell = /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: classNames(
+        // A mesma altura do editor (h-10), para a linha não pular quando a célula é aberta.
+        "flex min-h-10 w-full items-center gap-1 rounded-md border border-transparent px-2 py-1.5 text-sm",
+        disabled && "text-foreground-faint",
+        !disabled && !showsEditAffordance && "text-foreground",
+        showsEditAffordance && "group cursor-pointer text-foreground transition-colors hover:border-brand-border hover:bg-brand-soft/50",
+        error && "border-danger-border"
+      ),
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "min-w-0 flex-1 truncate", children: displayContent }),
+        showsEditAffordance && // On touch there is no hover, so a hover-only pencil means the cell never
+        // advertises that it can be edited. Keep it visible (dimmed) there instead.
+        /* @__PURE__ */ jsx(
+          MaterialSymbol,
+          {
+            icon: "edit",
+            size: 13,
+            className: classNames(
+              "shrink-0 text-brand-emphasis transition-opacity",
+              hoverCapable ? "opacity-0 group-hover:opacity-100" : "opacity-60"
+            )
+          }
+        )
+      ]
+    }
+  );
+  if (hasGrid && !isGridEditModeOn) return readCell;
+  if (isGridCell) return isEditing ? renderEditor() : readCell;
+  if (!cellEditing) return renderEditor();
+  return /* @__PURE__ */ jsx("div", { ref: containerRef, onKeyDown: handleKeyDown, ...{ [EDITABLE_CELL_ATTR]: cellKey }, children: isEditing ? renderEditor() : disabled ? readCell : /* @__PURE__ */ jsx(ControlledTooltip, { content: t("dataTable.editCell"), children: /* @__PURE__ */ jsx(
+    "div",
+    {
+      role: "button",
+      tabIndex: 0,
+      onClick: () => cellEditing.startEditing(cellKey),
+      onKeyDown: (event) => {
+        if (event.key !== "Enter" && event.key !== " ") return;
+        event.preventDefault();
+        cellEditing.startEditing(cellKey);
+      },
+      className: "rounded-md focus:outline-none focus-visible:ring-1 focus-visible:ring-brand-border",
+      children: readCell
+    }
+  ) }) });
+};
+export {
+  DataTableEditableCell as default
+};
+//# sourceMappingURL=DataTableEditableCell.js.map

package/dist/components/UI/DataTable/cells/DataTableEditableCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableEditableCell.js","sources":["../../../../../src/components/UI/DataTable/cells/DataTableEditableCell.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport classNames from 'classnames';\nimport { useTranslation } from 'react-i18next';\n\nimport DatePicker from '@/components/DateTime/DatePicker';\nimport ControlledInput from '@/components/Form/ControlledInput';\nimport { ControlledSelect } from '@/components/Form/ControlledSelect';\nimport ControlledTooltip from '@/components/UI/ControlledTooltip';\nimport { MaterialSymbol } from '@/components/UI/MaterialSymbol';\nimport { formatIsoDate } from '@/helpers/dateHelpers';\nimport { useHoverCapable } from '@/hooks/useHoverCapable';\nimport { useInlineEditor } from '@/hooks/useInlineEditor';\n\nimport { useGridCellState, useGridStoreApi } from '../grid/GridProvider';\nimport { GRID_CELL_EDITING } from '../grid/gridTypes';\nimport { useGridEditMode } from '../grid/useGridInstance';\nimport type { IDataTableColumnConfig, IDataTableRow } from '../types';\nimport { buildEditableCellKey, EDITABLE_CELL_ATTR, useDataTableCellEditing } from '../useCellEditingState';\n\n/**\n * Marks the typeable editable inputs so `keyboardNav` can walk them in DOM order.\n * Only text/number inputs opt in; date and select cells drive their own popovers\n * and fall back to native Tab traversal.\n */\nconst EDITABLE_INPUT_ATTR = 'data-datatable-editable-input';\n\ntype TEditableValue = string | number | Array<string> | null;\n\n/** Multi-select devolve um array novo a cada leitura, então `===` nunca casaria. */\nconst isSameEditableValue = (current: TEditableValue, previous: TEditableValue): boolean => {\n  if (Array.isArray(current) || Array.isArray(previous)) {\n    if (!Array.isArray(current) || !Array.isArray(previous)) return false;\n    return current.length === previous.length && current.every((entry, index) => entry === previous[index]);\n  }\n\n  return current === previous;\n};\n\n/** `,` for pt-BR, `.` for en: derived from the locale itself, no language table. */\nconst resolveDecimalSeparator = (language: string): string => {\n  const separator = (1.1).toLocaleString(language || 'pt-BR').replace(/\\d/g, '');\n  return separator || '.';\n};\n\nconst focusNextEditableInput = (current: HTMLElement): void => {\n  const inputs = Array.from(document.querySelectorAll<HTMLElement>(`[${EDITABLE_INPUT_ATTR}]`));\n  const index = inputs.indexOf(current);\n  if (index === -1) return;\n  inputs[index + 1]?.focus();\n};\n\ninterface IDataTableEditableCellProps<T extends IDataTableRow> {\n  column: IDataTableColumnConfig<T>;\n  row: T;\n  /** TanStack row id: present only inside a spreadsheet-enabled table. */\n  gridRowId?: string;\n  onCellChange: (row: T, columnId: string, value: unknown) => void;\n  /** When true, pressing Enter moves focus to the next editable input (DOM order). */\n  keyboardNav?: boolean;\n  /** When true, the cell shows the value as text until it is clicked. */\n  clickToEdit?: boolean;\n}\n\n/**\n * Controlled inline editor for a single cell. Reads the current value from the\n * host-owned row via `column.editable.getValue` and reports every edit through\n * `onCellChange`; the host re-renders with the updated row. Validation is derived\n * from the current value on each render, so no local state is kept.\n *\n * With `clickToEdit`, the cell renders the value as text and only swaps in the editor\n * once clicked, no editor is mounted before that.\n */\nconst DataTableEditableCell = <T extends IDataTableRow>({\n  column,\n  row,\n  gridRowId,\n  onCellChange,\n  keyboardNav = false,\n  clickToEdit = false,\n}: IDataTableEditableCellProps<T>) => {\n  const { t, i18n } = useTranslation('ui');\n  const hoverCapable = useHoverCapable();\n  const cellEditing = useDataTableCellEditing();\n  const gridStore = useGridStoreApi();\n  const gridCellState = useGridCellState(gridRowId ?? '', column.id);\n  const cellKey = buildEditableCellKey(row.id, column.id);\n\n  // Inside a spreadsheet-enabled table the grid store owns the editing state, so\n  // the legacy click-to-edit context and its document listener stay out of the way.\n  const isGridEditModeOn = useGridEditMode(gridStore);\n  const hasGrid = !!gridStore && !!gridRowId;\n  const isGridCell = hasGrid && isGridEditModeOn;\n  const isEditing = isGridCell\n    ? (gridCellState & GRID_CELL_EDITING) !== 0\n    : clickToEdit\n      ? cellEditing?.editingCellKey === cellKey\n      : true;\n  const showsReadView = isGridCell || clickToEdit;\n\n  const { containerRef, handleKeyDown } = useInlineEditor(\n    Boolean(!isGridCell && clickToEdit && isEditing),\n    () => cellEditing?.stopEditing(),\n    (direction) => cellEditing?.navigate(cellKey, direction),\n  );\n\n  const editable = column.editable;\n  const valueBeforeEditRef = useRef<string | number | Array<string> | null>(null);\n  const wasEditingRef = useRef(false);\n\n  // The cell is controlled by the value the host ALREADY parsed, so a half-typed\n  // decimal is erased on the same keystroke: `1,` parses to the number 1 and comes\n  // back as `\"1\"`, taking with it the separator just typed. The draft holds the exact\n  // text while the field is focused; the host still receives every keystroke and\n  // remains the source of truth.\n  const [draftText, setDraftText] = useState<string | null>(null);\n\n  useEffect(() => {\n    if (!isEditing) setDraftText(null);\n  }, [isEditing]);\n\n  // Escape restores what the cell held when the editor opened. The editing model is\n  // controlled (every keystroke already reached the host), so cancelling means\n  // writing the snapshot back, not dropping local state.\n  useEffect(() => {\n    if (!isGridCell || !editable) return;\n\n    if (isEditing) {\n      if (wasEditingRef.current) return;\n      wasEditingRef.current = true;\n      valueBeforeEditRef.current = editable.getValue(row);\n\n      // The key that opened the editor IS the new value, so the first keystroke is not lost.\n      const typedSeed = gridStore?.getState().editingSeed;\n      if (typedSeed == null) return;\n      setDraftText(typedSeed);\n      onCellChange(row, column.id, typedSeed);\n      return;\n    }\n\n    if (!wasEditingRef.current) return;\n    wasEditingRef.current = false;\n\n    if (gridStore?.getState().editingOutcome !== 'cancel') return;\n    if (isSameEditableValue(editable.getValue(row), valueBeforeEditRef.current)) return;\n\n    onCellChange(row, column.id, valueBeforeEditRef.current);\n  }, [isEditing, isGridCell, editable, gridStore, onCellChange, row, column.id]);\n\n  if (!editable) return null;\n\n  const rawValue = editable.getValue(row);\n  const disabled = editable.disabled?.(row) ?? false;\n  const error = editable.validate?.(rawValue, row) ?? null;\n  const arrayValue = Array.isArray(rawValue) ? rawValue.map(String) : [];\n  const stringValue = rawValue == null || Array.isArray(rawValue) ? '' : String(rawValue);\n  const editorOptions = editable.getOptions?.(row) ?? editable.options;\n  const selectOptions = Array.isArray(editorOptions) ? editorOptions : [];\n\n  // `String()` on a number always writes a dot, so a pt-BR user would get back a\n  // separator that is not theirs. Hosts that keep the raw text (the edit buffer) are\n  // untouched: only an actual number reaches this branch.\n  const decimalValue =\n    editable.type === 'number' && typeof rawValue === 'number'\n      ? stringValue.replace('.', resolveDecimalSeparator(i18n.language))\n      : stringValue;\n\n  const renderEditor = () => {\n    if (editable.renderEditor) {\n      return editable.renderEditor({\n        value: rawValue,\n        onChange: (nextValue) => onCellChange(row, column.id, nextValue),\n        disabled,\n        label: column.header,\n        row,\n      });\n    }\n\n    if (editable.type === 'multiselect') {\n      return (\n        <ControlledSelect\n          className=\"w-full [&_.controlled-select-container]:!min-w-0 [&_.controlled-select-input]:!min-w-0\"\n          options={selectOptions}\n          selectedValue={arrayValue}\n          onChangeHook={(selected) => onCellChange(row, column.id, Array.isArray(selected) ? selected : [selected])}\n          multiple\n          searchable\n          clearable\n          disabled={disabled}\n          error={!!error}\n        />\n      );\n    }\n\n    if (editable.type === 'select') {\n      return (\n        // `ControlledSelect` ships hard min-widths (`min-w-52` on the field and the MT\n        // container's `min-w-[200px]`) that overflow narrow table cells and spill into\n        // the neighbouring column; force both to shrink so the editor fits its column\n        // like the text/number editors do.\n        <ControlledSelect\n          className=\"w-full [&_.controlled-select-container]:!min-w-0 [&_.controlled-select-input]:!min-w-0\"\n          options={selectOptions}\n          selectedValue={stringValue}\n          onChangeHook={(selected) => onCellChange(row, column.id, selected)}\n          multiple={false}\n          searchable\n          clearable\n          disabled={disabled}\n          error={!!error}\n        />\n      );\n    }\n\n    if (editable.type === 'date') {\n      const parsed = stringValue ? new Date(stringValue) : undefined;\n      const startValue = parsed && !Number.isNaN(parsed.getTime()) ? parsed : undefined;\n\n      return (\n        <DatePicker\n          startValue={startValue}\n          onUpdate={(value) => onCellChange(row, column.id, value ?? null)}\n          disabled={disabled}\n        />\n      );\n    }\n\n    // `number` renders a text input with a decimal input mode rather than\n    // `type=\"number\"`, so pt-BR comma decimals are not blocked by the browser; the\n    // host parses the raw string it receives in `onCellChange`.\n    return (\n      <ControlledInput\n        value={draftText ?? decimalValue}\n        onChange={(event) => {\n          setDraftText(event.target.value);\n          onCellChange(row, column.id, event.target.value);\n        }}\n        onBlur={() => setDraftText(null)}\n        onKeyDown={\n          keyboardNav && !isGridCell\n            ? (event) => {\n                if (event.key === 'Enter') {\n                  event.preventDefault();\n                  focusNextEditableInput(event.currentTarget);\n                }\n              }\n            : undefined\n        }\n        inputMode={editable.type === 'number' ? 'decimal' : undefined}\n        disabled={disabled}\n        error={!!error}\n        errorMessage={error ?? undefined}\n        aria-label={column.header}\n        {...{ [EDITABLE_INPUT_ATTR]: '' }}\n        // The Material-Tailwind input container ships a hard `min-w-[200px]` that\n        // overflows narrow table cells; force it to shrink so the editor fits its\n        // column (the cell padding then provides the gap between adjacent inputs).\n        containerClassName=\"min-w-0\"\n      />\n    );\n  };\n\n  if (!hasGrid && (!showsReadView || !cellEditing)) return renderEditor();\n\n  const resolveOptionLabel = (optionValue: string): string =>\n    (editable.options ?? []).find((option) => String(option.value) === optionValue)?.label ?? optionValue;\n\n  const resolveDisplayText = (): string => {\n    if (editable.displayValue) return editable.displayValue(row);\n    if (editable.type === 'multiselect') return arrayValue.map(resolveOptionLabel).join(', ');\n    if (stringValue === '') return '';\n    if (editable.type === 'select') return resolveOptionLabel(stringValue);\n    if (editable.type === 'date') return formatIsoDate(stringValue);\n    return decimalValue;\n  };\n\n  const displayText = resolveDisplayText();\n\n  // Uma coluna com renderização própria (chip de etapa, status, thumbnail) mantém\n  // esse visual no modo de leitura: só o editor aberto troca a célula por um input.\n  const displayContent =\n    !editable.displayValue && column.render ? (\n      column.render(row)\n    ) : (\n      <span className={classNames('min-w-0 flex-1 truncate', displayText === '' && 'text-foreground-faint')}>\n        {displayText === '' ? '-' : displayText}\n      </span>\n    );\n\n  // Com o grid montado mas o modo de edição desligado, a célula é só o valor: sem\n  // lápis, sem realce e sem clique, para não prometer uma edição que não abre.\n  const showsEditAffordance = !disabled && (!hasGrid || isGridEditModeOn);\n\n  const readCell = (\n    <div\n      className={classNames(\n        // A mesma altura do editor (h-10), para a linha não pular quando a célula é aberta.\n        'flex min-h-10 w-full items-center gap-1 rounded-md border border-transparent px-2 py-1.5 text-sm',\n        disabled && 'text-foreground-faint',\n        !disabled && !showsEditAffordance && 'text-foreground',\n        showsEditAffordance &&\n          'group cursor-pointer text-foreground transition-colors hover:border-brand-border hover:bg-brand-soft/50',\n        error && 'border-danger-border',\n      )}\n    >\n      <div className=\"min-w-0 flex-1 truncate\">{displayContent}</div>\n      {showsEditAffordance && (\n        // On touch there is no hover, so a hover-only pencil means the cell never\n        // advertises that it can be edited. Keep it visible (dimmed) there instead.\n        <MaterialSymbol\n          icon=\"edit\"\n          size={13}\n          className={classNames(\n            'shrink-0 text-brand-emphasis transition-opacity',\n            hoverCapable ? 'opacity-0 group-hover:opacity-100' : 'opacity-60',\n          )}\n        />\n      )}\n    </div>\n  );\n\n  // Fora do modo de edição a tabela é de leitura: nenhum editor fica montado.\n  if (hasGrid && !isGridEditModeOn) return readCell;\n\n  // The `<td>` owns the gestures that open the editor: a click, Enter, F2 or typing.\n  if (isGridCell) return isEditing ? renderEditor() : readCell;\n\n  if (!cellEditing) return renderEditor();\n\n  return (\n    <div ref={containerRef} onKeyDown={handleKeyDown} {...{ [EDITABLE_CELL_ATTR]: cellKey }}>\n      {isEditing ? (\n        renderEditor()\n      ) : disabled ? (\n        readCell\n      ) : (\n        <ControlledTooltip content={t('dataTable.editCell')}>\n          <div\n            role=\"button\"\n            tabIndex={0}\n            onClick={() => cellEditing.startEditing(cellKey)}\n            onKeyDown={(event) => {\n              if (event.key !== 'Enter' && event.key !== ' ') return;\n              event.preventDefault();\n              cellEditing.startEditing(cellKey);\n            }}\n            className=\"rounded-md focus:outline-none focus-visible:ring-1 focus-visible:ring-brand-border\"\n          >\n            {readCell}\n          </div>\n        </ControlledTooltip>\n      )}\n    </div>\n  );\n};\n\nexport default DataTableEditableCell;\n"],"names":[],"mappings":"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"}

package/dist/components/UI/DataTable/cells/DataTableEmpenhoCell.d.ts

@@ -0,0 +1,10 @@
+interface IDataTableEmpenhoCellProps {
+    value: number | null | undefined;
+}
+/**
+ * Placeholder renderer for empenho counts. The clickable behavior (opening the
+ * linked products/materials) is intentionally NOT wired yet. The business
+ * definition is still pending. For now it renders the count as plain text.
+ */
+declare const DataTableEmpenhoCell: React.FC<IDataTableEmpenhoCellProps>;
+export default DataTableEmpenhoCell;

package/dist/components/UI/DataTable/cells/DataTableEmpenhoCell.js

@@ -0,0 +1,7 @@
+import { jsx } from "react/jsx-runtime";
+import { formatNumber } from "../../../../helpers/formatHelpers.js";
+const DataTableEmpenhoCell = ({ value }) => /* @__PURE__ */ jsx("span", { className: "text-sm tabular-nums text-foreground", children: formatNumber(value ?? 0) });
+export {
+  DataTableEmpenhoCell as default
+};
+//# sourceMappingURL=DataTableEmpenhoCell.js.map

package/dist/components/UI/DataTable/cells/DataTableEmpenhoCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableEmpenhoCell.js","sources":["../../../../../src/components/UI/DataTable/cells/DataTableEmpenhoCell.tsx"],"sourcesContent":["import { formatNumber } from '@/helpers/formatHelpers';\n\ninterface IDataTableEmpenhoCellProps {\n  value: number | null | undefined;\n}\n\n/**\n * Placeholder renderer for empenho counts. The clickable behavior (opening the\n * linked products/materials) is intentionally NOT wired yet. The business\n * definition is still pending. For now it renders the count as plain text.\n */\nconst DataTableEmpenhoCell: React.FC<IDataTableEmpenhoCellProps> = ({ value }) => (\n  <span className=\"text-sm tabular-nums text-foreground\">{formatNumber(value ?? 0)}</span>\n);\n\nexport default DataTableEmpenhoCell;\n"],"names":[],"mappings":";;AAWA,MAAM,uBAA6D,CAAC,EAAE,YACpE,oBAAC,QAAA,EAAK,WAAU,wCAAwC,UAAA,aAAa,SAAS,CAAC,EAAA,CAAE;"}

package/dist/components/UI/DataTable/cells/DataTableOriginCell.d.ts

@@ -0,0 +1,6 @@
+import { IDataTableOriginValue } from '../types';
+interface IDataTableOriginCellProps {
+    value: IDataTableOriginValue | null | undefined;
+}
+declare const DataTableOriginCell: React.FC<IDataTableOriginCellProps>;
+export default DataTableOriginCell;