@fctc/sme-widget-ui 2.8.0 → 2.8.1

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.
Files changed (7) hide show
  1. package/dist/index.js +25 -5
  2. package/dist/index.mjs +25 -5
  3. package/dist/widgets.d.mts +1 -0
  4. package/dist/widgets.d.ts +1 -0
  5. package/dist/widgets.js +25 -5
  6. package/dist/widgets.mjs +25 -5
  7. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -13087,8 +13087,12 @@ var TableHead = (props) => {
13087
13087
  checkedAll,
13088
13088
  onRemoveRow,
13089
13089
  onToggleColumnOptional,
13090
- env
13090
+ env,
13091
+ table
13091
13092
  } = props;
13093
+ const headerGroups = table.getHeaderGroups();
13094
+ const headerGroup = headerGroups[0];
13095
+ const visibleColumns = columns?.filter((value) => value?.optional !== "hide") ?? [];
13092
13096
  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("thead", { className: "relative z-10", children: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
13093
13097
  "tr",
13094
13098
  {
@@ -13122,7 +13126,9 @@ var TableHead = (props) => {
13122
13126
  )
13123
13127
  }
13124
13128
  ),
13125
- columns?.filter((value) => value?.optional !== "hide")?.map((col, index4) => {
13129
+ headerGroup?.headers?.map((header, index4) => {
13130
+ const col = visibleColumns[index4];
13131
+ if (!col) return null;
13126
13132
  if (col?.field?.widget === "handle") {
13127
13133
  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
13128
13134
  "th",
@@ -13139,12 +13145,15 @@ var TableHead = (props) => {
13139
13145
  "data-type-co": col?.field?.type_co,
13140
13146
  "data-rtc-resizable": col?.name,
13141
13147
  className: `column whitespace-nowrap text-left p-3 text-sm font-semibold capitalize text-[#060606] ${col?.field?.type_co === "buttons" ? "th-buttons" : "th-normal"}`,
13148
+ style: {
13149
+ width: header.getSize()
13150
+ },
13142
13151
  children: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
13143
13152
  "div",
13144
13153
  {
13145
13154
  className: `cursor-pointer flex items-center gap-[4px] w-full group relative ${(col?.field?.type === "monetary" || col?.field?.widget === "monetary") && "justify-end"}`,
13146
13155
  children: [
13147
- /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { className: "truncate line-clamp-1 w-fit", children: col.title }),
13156
+ /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "cursor-pointer flex justify-between items-center gap-[4px] w-full max-w-full truncate", children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { className: "truncate", children: col.title }) }),
13148
13157
  col?.field?.help && /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_jsx_runtime51.Fragment, { children: [
13149
13158
  (0, import_react_dom.createPortal)(
13150
13159
  /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
@@ -13199,12 +13208,23 @@ var TableHead = (props) => {
13199
13208
  )
13200
13209
  }
13201
13210
  )
13202
- ] })
13211
+ ] }),
13212
+ /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
13213
+ "div",
13214
+ {
13215
+ onMouseDown: header.getResizeHandler(),
13216
+ onTouchStart: header.getResizeHandler(),
13217
+ className: `
13218
+ column-resizer
13219
+ ${header.column.getIsResizing() ? "is-resizing" : ""}
13220
+ `
13221
+ }
13222
+ )
13203
13223
  ]
13204
13224
  }
13205
13225
  )
13206
13226
  },
13207
- "table-head-" + index4
13227
+ "table-head-" + header.id
13208
13228
  );
13209
13229
  }),
13210
13230
  typeof onRemoveRow === "function" && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("th", { className: "relative p-2 w-[35px] th-remove" }),
package/dist/index.mjs CHANGED
@@ -12960,8 +12960,12 @@ var TableHead = (props) => {
12960
12960
  checkedAll,
12961
12961
  onRemoveRow,
12962
12962
  onToggleColumnOptional,
12963
- env
12963
+ env,
12964
+ table
12964
12965
  } = props;
12966
+ const headerGroups = table.getHeaderGroups();
12967
+ const headerGroup = headerGroups[0];
12968
+ const visibleColumns = columns?.filter((value) => value?.optional !== "hide") ?? [];
12965
12969
  return /* @__PURE__ */ jsx51("thead", { className: "relative z-10", children: /* @__PURE__ */ jsxs29(
12966
12970
  "tr",
12967
12971
  {
@@ -12995,7 +12999,9 @@ var TableHead = (props) => {
12995
12999
  )
12996
13000
  }
12997
13001
  ),
12998
- columns?.filter((value) => value?.optional !== "hide")?.map((col, index4) => {
13002
+ headerGroup?.headers?.map((header, index4) => {
13003
+ const col = visibleColumns[index4];
13004
+ if (!col) return null;
12999
13005
  if (col?.field?.widget === "handle") {
13000
13006
  return /* @__PURE__ */ jsx51(
13001
13007
  "th",
@@ -13012,12 +13018,15 @@ var TableHead = (props) => {
13012
13018
  "data-type-co": col?.field?.type_co,
13013
13019
  "data-rtc-resizable": col?.name,
13014
13020
  className: `column whitespace-nowrap text-left p-3 text-sm font-semibold capitalize text-[#060606] ${col?.field?.type_co === "buttons" ? "th-buttons" : "th-normal"}`,
13021
+ style: {
13022
+ width: header.getSize()
13023
+ },
13015
13024
  children: /* @__PURE__ */ jsxs29(
13016
13025
  "div",
13017
13026
  {
13018
13027
  className: `cursor-pointer flex items-center gap-[4px] w-full group relative ${(col?.field?.type === "monetary" || col?.field?.widget === "monetary") && "justify-end"}`,
13019
13028
  children: [
13020
- /* @__PURE__ */ jsx51("span", { className: "truncate line-clamp-1 w-fit", children: col.title }),
13029
+ /* @__PURE__ */ jsx51("div", { className: "cursor-pointer flex justify-between items-center gap-[4px] w-full max-w-full truncate", children: /* @__PURE__ */ jsx51("span", { className: "truncate", children: col.title }) }),
13021
13030
  col?.field?.help && /* @__PURE__ */ jsxs29(Fragment4, { children: [
13022
13031
  createPortal(
13023
13032
  /* @__PURE__ */ jsx51(
@@ -13072,12 +13081,23 @@ var TableHead = (props) => {
13072
13081
  )
13073
13082
  }
13074
13083
  )
13075
- ] })
13084
+ ] }),
13085
+ /* @__PURE__ */ jsx51(
13086
+ "div",
13087
+ {
13088
+ onMouseDown: header.getResizeHandler(),
13089
+ onTouchStart: header.getResizeHandler(),
13090
+ className: `
13091
+ column-resizer
13092
+ ${header.column.getIsResizing() ? "is-resizing" : ""}
13093
+ `
13094
+ }
13095
+ )
13076
13096
  ]
13077
13097
  }
13078
13098
  )
13079
13099
  },
13080
- "table-head-" + index4
13100
+ "table-head-" + header.id
13081
13101
  );
13082
13102
  }),
13083
13103
  typeof onRemoveRow === "function" && /* @__PURE__ */ jsx51("th", { className: "relative p-2 w-[35px] th-remove" }),
package/dist/widgets.d.mts CHANGED
@@ -129,6 +129,7 @@ interface TableHeadProps {
129
129
  onToggleColumnOptional?: any;
130
130
  onRemoveRow?: any;
131
131
  env?: any;
132
+ table?: any;
132
133
  }
133
134
  declare const TableHead: (props: TableHeadProps) => JSX.Element;
134
135
 
package/dist/widgets.d.ts CHANGED
@@ -129,6 +129,7 @@ interface TableHeadProps {
129
129
  onToggleColumnOptional?: any;
130
130
  onRemoveRow?: any;
131
131
  env?: any;
132
+ table?: any;
132
133
  }
133
134
  declare const TableHead: (props: TableHeadProps) => JSX.Element;
134
135
 
package/dist/widgets.js CHANGED
@@ -12079,8 +12079,12 @@ var TableHead = (props) => {
12079
12079
  checkedAll,
12080
12080
  onRemoveRow,
12081
12081
  onToggleColumnOptional,
12082
- env
12082
+ env,
12083
+ table
12083
12084
  } = props;
12085
+ const headerGroups = table.getHeaderGroups();
12086
+ const headerGroup = headerGroups[0];
12087
+ const visibleColumns = columns?.filter((value) => value?.optional !== "hide") ?? [];
12084
12088
  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("thead", { className: "relative z-10", children: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
12085
12089
  "tr",
12086
12090
  {
@@ -12114,7 +12118,9 @@ var TableHead = (props) => {
12114
12118
  )
12115
12119
  }
12116
12120
  ),
12117
- columns?.filter((value) => value?.optional !== "hide")?.map((col, index4) => {
12121
+ headerGroup?.headers?.map((header, index4) => {
12122
+ const col = visibleColumns[index4];
12123
+ if (!col) return null;
12118
12124
  if (col?.field?.widget === "handle") {
12119
12125
  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
12120
12126
  "th",
@@ -12131,12 +12137,15 @@ var TableHead = (props) => {
12131
12137
  "data-type-co": col?.field?.type_co,
12132
12138
  "data-rtc-resizable": col?.name,
12133
12139
  className: `column whitespace-nowrap text-left p-3 text-sm font-semibold capitalize text-[#060606] ${col?.field?.type_co === "buttons" ? "th-buttons" : "th-normal"}`,
12140
+ style: {
12141
+ width: header.getSize()
12142
+ },
12134
12143
  children: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
12135
12144
  "div",
12136
12145
  {
12137
12146
  className: `cursor-pointer flex items-center gap-[4px] w-full group relative ${(col?.field?.type === "monetary" || col?.field?.widget === "monetary") && "justify-end"}`,
12138
12147
  children: [
12139
- /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { className: "truncate line-clamp-1 w-fit", children: col.title }),
12148
+ /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "cursor-pointer flex justify-between items-center gap-[4px] w-full max-w-full truncate", children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { className: "truncate", children: col.title }) }),
12140
12149
  col?.field?.help && /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_jsx_runtime51.Fragment, { children: [
12141
12150
  (0, import_react_dom.createPortal)(
12142
12151
  /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
@@ -12191,12 +12200,23 @@ var TableHead = (props) => {
12191
12200
  )
12192
12201
  }
12193
12202
  )
12194
- ] })
12203
+ ] }),
12204
+ /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
12205
+ "div",
12206
+ {
12207
+ onMouseDown: header.getResizeHandler(),
12208
+ onTouchStart: header.getResizeHandler(),
12209
+ className: `
12210
+ column-resizer
12211
+ ${header.column.getIsResizing() ? "is-resizing" : ""}
12212
+ `
12213
+ }
12214
+ )
12195
12215
  ]
12196
12216
  }
12197
12217
  )
12198
12218
  },
12199
- "table-head-" + index4
12219
+ "table-head-" + header.id
12200
12220
  );
12201
12221
  }),
12202
12222
  typeof onRemoveRow === "function" && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("th", { className: "relative p-2 w-[35px] th-remove" }),
package/dist/widgets.mjs CHANGED
@@ -12016,8 +12016,12 @@ var TableHead = (props) => {
12016
12016
  checkedAll,
12017
12017
  onRemoveRow,
12018
12018
  onToggleColumnOptional,
12019
- env
12019
+ env,
12020
+ table
12020
12021
  } = props;
12022
+ const headerGroups = table.getHeaderGroups();
12023
+ const headerGroup = headerGroups[0];
12024
+ const visibleColumns = columns?.filter((value) => value?.optional !== "hide") ?? [];
12021
12025
  return /* @__PURE__ */ jsx51("thead", { className: "relative z-10", children: /* @__PURE__ */ jsxs29(
12022
12026
  "tr",
12023
12027
  {
@@ -12051,7 +12055,9 @@ var TableHead = (props) => {
12051
12055
  )
12052
12056
  }
12053
12057
  ),
12054
- columns?.filter((value) => value?.optional !== "hide")?.map((col, index4) => {
12058
+ headerGroup?.headers?.map((header, index4) => {
12059
+ const col = visibleColumns[index4];
12060
+ if (!col) return null;
12055
12061
  if (col?.field?.widget === "handle") {
12056
12062
  return /* @__PURE__ */ jsx51(
12057
12063
  "th",
@@ -12068,12 +12074,15 @@ var TableHead = (props) => {
12068
12074
  "data-type-co": col?.field?.type_co,
12069
12075
  "data-rtc-resizable": col?.name,
12070
12076
  className: `column whitespace-nowrap text-left p-3 text-sm font-semibold capitalize text-[#060606] ${col?.field?.type_co === "buttons" ? "th-buttons" : "th-normal"}`,
12077
+ style: {
12078
+ width: header.getSize()
12079
+ },
12071
12080
  children: /* @__PURE__ */ jsxs29(
12072
12081
  "div",
12073
12082
  {
12074
12083
  className: `cursor-pointer flex items-center gap-[4px] w-full group relative ${(col?.field?.type === "monetary" || col?.field?.widget === "monetary") && "justify-end"}`,
12075
12084
  children: [
12076
- /* @__PURE__ */ jsx51("span", { className: "truncate line-clamp-1 w-fit", children: col.title }),
12085
+ /* @__PURE__ */ jsx51("div", { className: "cursor-pointer flex justify-between items-center gap-[4px] w-full max-w-full truncate", children: /* @__PURE__ */ jsx51("span", { className: "truncate", children: col.title }) }),
12077
12086
  col?.field?.help && /* @__PURE__ */ jsxs29(Fragment4, { children: [
12078
12087
  createPortal(
12079
12088
  /* @__PURE__ */ jsx51(
@@ -12128,12 +12137,23 @@ var TableHead = (props) => {
12128
12137
  )
12129
12138
  }
12130
12139
  )
12131
- ] })
12140
+ ] }),
12141
+ /* @__PURE__ */ jsx51(
12142
+ "div",
12143
+ {
12144
+ onMouseDown: header.getResizeHandler(),
12145
+ onTouchStart: header.getResizeHandler(),
12146
+ className: `
12147
+ column-resizer
12148
+ ${header.column.getIsResizing() ? "is-resizing" : ""}
12149
+ `
12150
+ }
12151
+ )
12132
12152
  ]
12133
12153
  }
12134
12154
  )
12135
12155
  },
12136
- "table-head-" + index4
12156
+ "table-head-" + header.id
12137
12157
  );
12138
12158
  }),
12139
12159
  typeof onRemoveRow === "function" && /* @__PURE__ */ jsx51("th", { className: "relative p-2 w-[35px] th-remove" }),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fctc/sme-widget-ui",
3
- "version": "2.8.0",
3
+ "version": "2.8.1",
4
4
  "main": "dist/index.cjs",
5
5
  "module": "dist/index.mjs",
6
6
  "types": "dist/index.d.ts",