twico-ui 1.17.0 → 1.17.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.mjs CHANGED
@@ -10038,6 +10038,7 @@ function Datatable({
10038
10038
  [cols, editMode, batchEditKey]
10039
10039
  // eslint-disable-line react-hooks/exhaustive-deps
10040
10040
  );
10041
+ const hasBatchEditor = showBatchEdit && batchEditableCols.length > 0;
10041
10042
  const [batchEdit, setBatchEdit] = React51__default.useState(null);
10042
10043
  const [batchEditPos, openBatchEdit, closeBatchEdit] = useFloating();
10043
10044
  function openBatchEditor(el) {
@@ -10051,7 +10052,7 @@ function Datatable({
10051
10052
  closeBatchEdit();
10052
10053
  };
10053
10054
  const onDown = (e) => {
10054
- if (!e.target.closest(".twc-dt__pop") && !e.target.closest(".twc-dt__batch")) close();
10055
+ if (!e.target.closest(".twc-dt__pop") && !e.target.closest(".twc-dt__batch") && !e.target.closest(".twc-pop")) close();
10055
10056
  };
10056
10057
  const onKey = (e) => {
10057
10058
  if (e.key === "Escape") close();
@@ -10306,6 +10307,8 @@ function Datatable({
10306
10307
  const editable = isColEditable(c);
10307
10308
  const isEditing = editing && editing.key === k && editing.field === c.field;
10308
10309
  const cellActive = selectionMode === "cell" && activeCell && activeCell.key === k && activeCell.field === c.field;
10310
+ const display = c.valueFormatter ? c.valueFormatter(val, row) : val;
10311
+ const cellTitle = !isActions && !c.renderCell && !isEditing && (typeof display === "string" || typeof display === "number") ? String(display) : void 0;
10309
10312
  return /* @__PURE__ */ jsxs(
10310
10313
  "td",
10311
10314
  {
@@ -10324,14 +10327,14 @@ function Datatable({
10324
10327
  "data-pin": st.pin,
10325
10328
  "data-pin-edge": st.edge,
10326
10329
  style: { width: widthOf(c), ...st.style },
10327
- title: isActions || c.renderCell || editable ? void 0 : String(val ?? ""),
10330
+ title: cellTitle,
10328
10331
  onClick: selectionMode === "cell" ? (e) => handleCellClick(e, k, row, c) : void 0,
10329
10332
  onFocus: () => setFocus((f) => f.r === ri && f.c === ci ? f : { r: ri, c: ci }),
10330
10333
  onDoubleClick: editable ? () => beginEdit(k, c, row) : void 0,
10331
10334
  children: [
10332
10335
  !checkboxSelection && reorderable && ci === 0 && !isEditing ? /* @__PURE__ */ jsxs("span", { style: { display: "inline-flex", alignItems: "center", gap: 6, maxWidth: "100%" }, children: [
10333
10336
  rowHandle(k, midIdx, row),
10334
- /* @__PURE__ */ jsx("span", { style: { overflow: "hidden", textOverflow: "ellipsis" }, children: isActions ? renderActions(c, row) : c.renderCell ? c.renderCell(val, row) : c.valueFormatter ? c.valueFormatter(val, row) : val })
10337
+ /* @__PURE__ */ jsx("span", { style: { overflow: "hidden", textOverflow: "ellipsis" }, children: isActions ? renderActions(c, row) : c.renderCell ? c.renderCell(val, row) : display })
10335
10338
  ] }) : isEditing ? c.renderEditCell ? (
10336
10339
  // #236: full escape hatch — the host drops in its own editor (searchable/creatable/
10337
10340
  // async Combobox, …) and drives the lifecycle via commit/cancel. Wrapped in
@@ -10350,7 +10353,7 @@ function Datatable({
10350
10353
  onCancel: cancelEdit,
10351
10354
  onKeyDown: onEditKey
10352
10355
  }
10353
- ) : isActions ? renderActions(c, row) : c.renderCell ? c.renderCell(val, row) : c.valueFormatter ? c.valueFormatter(val, row) : val,
10356
+ ) : isActions ? renderActions(c, row) : c.renderCell ? c.renderCell(val, row) : display,
10354
10357
  editable && !isEditing ? /* @__PURE__ */ jsx("span", { className: "twc-dt__edit-hint", "aria-hidden": "true", children: /* @__PURE__ */ jsx(Svg, { d: I.pencil }) }) : null
10355
10358
  ]
10356
10359
  },
@@ -10464,14 +10467,14 @@ function Datatable({
10464
10467
  return /* @__PURE__ */ jsxs("div", { className: `twc-dt ${className}`, ref: rootRef, "data-density": density, "data-resizing": resizing || void 0, ...rest, children: [
10465
10468
  __twcStyles,
10466
10469
  /* @__PURE__ */ jsxs("div", { className: "twc-dt__toolbar", "data-compact": compact || void 0, children: [
10467
- batchActions.length && selected.size > 0 ? /* @__PURE__ */ jsxs("div", { className: "twc-dt__batch", children: [
10470
+ (batchActions.length || hasBatchEditor) && selected.size > 0 ? /* @__PURE__ */ jsxs("div", { className: "twc-dt__batch", children: [
10468
10471
  /* @__PURE__ */ jsx("button", { type: "button", className: "twc-dt__batch-x", onClick: clearSelection, "aria-label": "Clear selection", children: /* @__PURE__ */ jsx(Svg, { d: I.x }) }),
10469
10472
  /* @__PURE__ */ jsxs("span", { className: "twc-dt__batch-count", children: [
10470
10473
  selected.size,
10471
10474
  " selected"
10472
10475
  ] }),
10473
10476
  /* @__PURE__ */ jsxs("div", { className: "twc-dt__batch-actions", children: [
10474
- showBatchEdit && batchEditableCols.length ? /* @__PURE__ */ jsxs("button", { type: "button", className: "twc-dt__batch-btn", onClick: (e) => openBatchEditor(e.currentTarget), children: [
10477
+ hasBatchEditor ? /* @__PURE__ */ jsxs("button", { type: "button", className: "twc-dt__batch-btn", onClick: (e) => openBatchEditor(e.currentTarget), children: [
10475
10478
  /* @__PURE__ */ jsx(Svg, { d: I.pencil }),
10476
10479
  "Edit"
10477
10480
  ] }) : null,
@@ -10766,6 +10769,7 @@ function Datatable({
10766
10769
  className: "twc-dt__th-label",
10767
10770
  role: c.sortable ? "button" : void 0,
10768
10771
  tabIndex: c.sortable ? 0 : void 0,
10772
+ title: typeof c.headerName === "string" ? c.headerName : void 0,
10769
10773
  "aria-label": c.sortable ? `${c.headerName}, sort` : void 0,
10770
10774
  draggable: reorderable || void 0,
10771
10775
  onDragStart: reorderable ? (e) => {
@@ -10897,8 +10901,8 @@ function Datatable({
10897
10901
  const nf = (n) => n.toLocaleString();
10898
10902
  if (totalRows === 0) return "No rows";
10899
10903
  const shown = paged.length;
10900
- const start = paginated ? pageVal * sizeVal + 1 : 1;
10901
- const end = paginated ? start + shown - 1 : shown;
10904
+ const start = paginated ? Math.min(pageVal * sizeVal + 1, totalRows) : 1;
10905
+ const end = paginated ? Math.min(start + shown - 1, totalRows) : shown;
10902
10906
  return /* @__PURE__ */ jsxs(Fragment, { children: [
10903
10907
  paginated ? /* @__PURE__ */ jsxs(Fragment, { children: [
10904
10908
  "Showing ",