@helpdice/ui 1.2.7 → 1.2.9

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.js CHANGED
@@ -24878,6 +24878,113 @@ var SpinnerComponent = function SpinnerComponent(_ref) {
24878
24878
  SpinnerComponent.displayName = 'Spinner';
24879
24879
  var Spinner = withScale(SpinnerComponent);
24880
24880
 
24881
+ var makeColgroup = function makeColgroup(width, columns) {
24882
+ var unsetWidthCount = columns.filter(function (c) {
24883
+ return !c.width;
24884
+ }).length;
24885
+ var customWidthTotal = columns.reduce(function (pre, current) {
24886
+ return current.width ? pre + current.width : pre;
24887
+ }, 0);
24888
+ var averageWidth = (width - customWidthTotal) / unsetWidthCount;
24889
+ if (averageWidth <= 0) return /*#__PURE__*/React.createElement("colgroup", null);
24890
+ return /*#__PURE__*/React.createElement("colgroup", null, columns.map(function (column, index) {
24891
+ return /*#__PURE__*/React.createElement("col", {
24892
+ key: "colgroup-".concat(index),
24893
+ width: column.width || averageWidth
24894
+ });
24895
+ }));
24896
+ };
24897
+ var TableHead = function TableHead(props) {
24898
+ var theme = useTheme();
24899
+ var _ref = props,
24900
+ columns = _ref.columns,
24901
+ width = _ref.width;
24902
+ var isScalableWidth = React.useMemo(function () {
24903
+ return columns.find(function (item) {
24904
+ return !!item.width;
24905
+ });
24906
+ }, [columns]);
24907
+ var colgroup = React.useMemo(function () {
24908
+ if (!isScalableWidth) return /*#__PURE__*/React.createElement("colgroup", null);
24909
+ return makeColgroup(width, columns);
24910
+ }, [isScalableWidth, width]);
24911
+ return /*#__PURE__*/React.createElement(React.Fragment, null, colgroup, /*#__PURE__*/React.createElement("thead", {
24912
+ className: _JSXStyle.dynamic([["134865897", [theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius]]])
24913
+ }, /*#__PURE__*/React.createElement("tr", {
24914
+ className: _JSXStyle.dynamic([["134865897", [theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius]]])
24915
+ }, columns.map(function (column, index) {
24916
+ return /*#__PURE__*/React.createElement("th", {
24917
+ style: {
24918
+ // textAlign: `${column?.align} !important`,
24919
+ // paddingLeft: '0.3rem',
24920
+ // paddingRight: '0.3rem',
24921
+ // color: `${column?.color}`,
24922
+ whiteSpace: column !== null && column !== undefined && column.noWrap ? 'nowrap' : 'normal'
24923
+ },
24924
+ key: "table-th-".concat(column.prop.toString(), "-").concat(index),
24925
+ "data-column": column.label,
24926
+ className: _JSXStyle.dynamic([["134865897", [theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius]]]) + " " + (column.className || "")
24927
+ }, /*#__PURE__*/React.createElement("div", {
24928
+ className: _JSXStyle.dynamic([["134865897", [theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius]]]) + " " + "thead-box"
24929
+ }, column.label, /*#__PURE__*/React.createElement("br", {
24930
+ className: _JSXStyle.dynamic([["134865897", [theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius]]])
24931
+ }), /*#__PURE__*/React.createElement("span", {
24932
+ style: {
24933
+ textAlign: 'center'
24934
+ },
24935
+ className: _JSXStyle.dynamic([["134865897", [theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius]]])
24936
+ }, column.text)));
24937
+ }))), /*#__PURE__*/React.createElement(_JSXStyle, {
24938
+ id: "134865897",
24939
+ dynamic: [theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius]
24940
+ }, "thead.__jsx-style-dynamic-selector{border-collapse:separate;border-spacing:0;font-size:inherit;}th.__jsx-style-dynamic-selector{padding:0 0.5em;font-size:calc(0.75 * var(--table-font-size));font-weight:normal;text-align:left;-webkit-letter-spacing:0;-moz-letter-spacing:0;-ms-letter-spacing:0;letter-spacing:0;vertical-align:middle;min-height:calc(2.5 * var(--table-font-size));color:".concat(theme.palette.accents_5, ";background:").concat(theme.palette.accents_1, ";border-bottom:1px solid ").concat(theme.palette.border, ";border-top:1px solid ").concat(theme.palette.border, ";border-radius:0;}th.__jsx-style-dynamic-selector:nth-child(1){border-bottom:1px solid ").concat(theme.palette.border, ";border-left:1px solid ").concat(theme.palette.border, ";border-top:1px solid ").concat(theme.palette.border, ";border-top-left-radius:").concat(theme.layout.radius, ";border-bottom-left-radius:").concat(theme.layout.radius, ";}th.__jsx-style-dynamic-selector:last-child{border-bottom:1px solid ").concat(theme.palette.border, ";border-right:1px solid ").concat(theme.palette.border, ";border-top:1px solid ").concat(theme.palette.border, ";border-top-right-radius:").concat(theme.layout.radius, ";border-bottom-right-radius:").concat(theme.layout.radius, ";}.thead-box.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-align:center;min-height:calc(2.5 * var(--table-font-size));text-transform:uppercase;}")));
24941
+ };
24942
+ TableHead.displayName = 'TableHead';
24943
+
24944
+ var TableCell = function TableCell(_ref) {
24945
+ var columns = _ref.columns,
24946
+ row = _ref.row,
24947
+ rowIndex = _ref.rowIndex,
24948
+ emptyText = _ref.emptyText,
24949
+ onCellClick = _ref.onCellClick;
24950
+ /* eslint-disable react/jsx-no-useless-fragment */
24951
+ return /*#__PURE__*/React.createElement(React.Fragment, null, columns.map(function (column, index) {
24952
+ var currentRowValue = row[column.prop];
24953
+ var cellValue = currentRowValue || emptyText;
24954
+ var shouldBeRenderElement = column.renderHandler(currentRowValue, row, rowIndex);
24955
+ return /*#__PURE__*/React.createElement("td", {
24956
+ style: _objectSpread2({
24957
+ fontSize: "".concat(column === null || column === undefined ? undefined : column.fontSize),
24958
+ textAlign: "".concat(column === null || column === undefined ? undefined : column.align, " !important"),
24959
+ paddingLeft: '0.3rem',
24960
+ paddingRight: '0.3rem',
24961
+ color: "".concat(column === null || column === undefined ? undefined : column.color),
24962
+ whiteSpace: column !== null && column !== undefined && column.noWrap ? 'nowrap' : 'normal'
24963
+ }, currentRowValue === null || currentRowValue === undefined ? undefined : currentRowValue.style),
24964
+ "data-column": column.label,
24965
+ key: "row-td-".concat(index, "-").concat(column.prop.toString()),
24966
+ onClick: function onClick() {
24967
+ return onCellClick && onCellClick(currentRowValue, rowIndex, index);
24968
+ },
24969
+ className: column.className
24970
+ }, /*#__PURE__*/React.createElement("div", {
24971
+ className: "cell"
24972
+ }, shouldBeRenderElement ? shouldBeRenderElement : cellValue));
24973
+ }));
24974
+ /* eslint-enable */
24975
+ };
24976
+
24977
+ /* "use client" */
24978
+
24979
+ var defaultContext$2 = {
24980
+ columns: [],
24981
+ updateColumn: function updateColumn() {}
24982
+ };
24983
+ var TableContext = /*#__PURE__*/React.createContext(defaultContext$2);
24984
+ var useTableContext = function useTableContext() {
24985
+ return React.useContext(TableContext);
24986
+ };
24987
+
24881
24988
  var lodash$1 = {exports: {}};
24882
24989
 
24883
24990
  /**
@@ -42090,187 +42197,6 @@ function requireLodash () {
42090
42197
  var lodashExports = requireLodash();
42091
42198
  var _ = /*@__PURE__*/getDefaultExportFromCjs(lodashExports);
42092
42199
 
42093
- var makeColgroup = function makeColgroup(width, columns) {
42094
- var unsetWidthCount = columns.filter(function (c) {
42095
- return !c.width;
42096
- }).length;
42097
- var customWidthTotal = columns.reduce(function (pre, current) {
42098
- return current.width ? pre + current.width : pre;
42099
- }, 0);
42100
- var averageWidth = (width - customWidthTotal) / unsetWidthCount;
42101
- if (averageWidth <= 0) return /*#__PURE__*/React.createElement("colgroup", null);
42102
- return /*#__PURE__*/React.createElement("colgroup", null, columns.map(function (column, index) {
42103
- return /*#__PURE__*/React.createElement("col", {
42104
- key: "colgroup-".concat(index),
42105
- width: column.width || averageWidth
42106
- });
42107
- }));
42108
- };
42109
- var TableHead = function TableHead(props) {
42110
- var theme = useTheme();
42111
- var _React$useState = React.useState({}),
42112
- _React$useState2 = _slicedToArray(_React$useState, 2),
42113
- filters = _React$useState2[0],
42114
- setFilters = _React$useState2[1];
42115
- var _ref = props,
42116
- columns = _ref.columns,
42117
- width = _ref.width,
42118
- onFilters = _ref.onFilters,
42119
- showFilters = _ref.showFilters;
42120
- var isScalableWidth = React.useMemo(function () {
42121
- return columns.find(function (item) {
42122
- return !!item.width;
42123
- });
42124
- }, [columns]);
42125
- var colgroup = React.useMemo(function () {
42126
- if (!isScalableWidth) return /*#__PURE__*/React.createElement("colgroup", null);
42127
- return makeColgroup(width, columns);
42128
- }, [isScalableWidth, width]);
42129
- var handleFilterChange = function handleFilterChange(name, value) {
42130
- setFilters(function (prevFilters) {
42131
- var updatedFilters = _objectSpread2(_objectSpread2({}, prevFilters), {}, _defineProperty$1({}, name, value));
42132
- // Call onFiltersChange to propagate filter changes to the parent
42133
- if (onFilters) {
42134
- onFilters(updatedFilters);
42135
- }
42136
- return updatedFilters;
42137
- });
42138
- };
42139
- var generateFilterInputs = function generateFilterInputs() {
42140
- return columns.map(function (col) {
42141
- var _String, _filters$filterName;
42142
- var Header = col.label,
42143
- accessor = col.filter,
42144
- options = col.options;
42145
- var filterName = (_String = String(col === null || col === undefined ? undefined : col.label)) === null || _String === undefined ? undefined : _String.replace(' ', '_').toLowerCase();
42146
- var unq_accessor = _.uniqueId(filterName);
42147
- return /*#__PURE__*/React.createElement("th", {
42148
- style: {
42149
- margin: '3px'
42150
- },
42151
- "data-column": Header,
42152
- key: unq_accessor
42153
- }, accessor === 'fixed' && /*#__PURE__*/React.createElement(Select, {
42154
- key: unq_accessor,
42155
- name: filterName,
42156
- value: (_filters$filterName = filters[filterName]) !== null && _filters$filterName !== undefined ? _filters$filterName : 'All',
42157
- onChange: function onChange(newValue) {
42158
- return handleFilterChange(filterName, newValue);
42159
- }
42160
- }, /*#__PURE__*/React.createElement(Select.Option, {
42161
- value: "All"
42162
- }, "All ", Header), options ? options.map(function (option) {
42163
- return /*#__PURE__*/React.createElement(Select.Option, {
42164
- value: option.value
42165
- }, option.name);
42166
- }) : null), accessor === 'date' && /*#__PURE__*/React.createElement(Input, {
42167
- id: "filter-date-".concat(filterName),
42168
- htmlType: "date",
42169
- name: filterName,
42170
- value: filters[filterName],
42171
- onChange: function onChange(e) {
42172
- return handleFilterChange(filterName, e.target.value);
42173
- }
42174
- }), accessor === 'search' && /*#__PURE__*/React.createElement("th", {
42175
- "data-column": Header
42176
- }, /*#__PURE__*/React.createElement(Input, {
42177
- id: "filter-search-".concat(filterName),
42178
- htmlType: "text"
42179
- // ref={filterRefs.current[filterName]} // Dynamically set ref}
42180
- ,
42181
- name: filterName,
42182
- style: {
42183
- height: 30,
42184
- minWidth: 160
42185
- },
42186
- value: filters[filterName],
42187
- onChange: function onChange(e) {
42188
- return handleFilterChange(filterName, e.target.value);
42189
- },
42190
- placeholder: "Search...",
42191
- fullWidth: true
42192
- })));
42193
- });
42194
- };
42195
- return /*#__PURE__*/React.createElement(React.Fragment, null, colgroup, /*#__PURE__*/React.createElement("thead", {
42196
- className: _JSXStyle.dynamic([["134865897", [theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius]]])
42197
- }, /*#__PURE__*/React.createElement("tr", {
42198
- className: _JSXStyle.dynamic([["134865897", [theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius]]])
42199
- }, columns.map(function (column, index) {
42200
- return /*#__PURE__*/React.createElement("th", {
42201
- style: {
42202
- // textAlign: `${column?.align} !important`,
42203
- // paddingLeft: '0.3rem',
42204
- // paddingRight: '0.3rem',
42205
- // color: `${column?.color}`,
42206
- whiteSpace: column !== null && column !== undefined && column.noWrap ? 'nowrap' : 'normal'
42207
- },
42208
- key: "table-th-".concat(column.prop.toString(), "-").concat(index),
42209
- "data-column": column.label,
42210
- className: _JSXStyle.dynamic([["134865897", [theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius]]]) + " " + (column.className || "")
42211
- }, /*#__PURE__*/React.createElement("div", {
42212
- className: _JSXStyle.dynamic([["134865897", [theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius]]]) + " " + "thead-box"
42213
- }, column.label, /*#__PURE__*/React.createElement("br", {
42214
- className: _JSXStyle.dynamic([["134865897", [theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius]]])
42215
- }), /*#__PURE__*/React.createElement("span", {
42216
- style: {
42217
- textAlign: 'center'
42218
- },
42219
- className: _JSXStyle.dynamic([["134865897", [theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius]]])
42220
- }, column.text)));
42221
- })), showFilters && /*#__PURE__*/React.createElement("tr", {
42222
- className: _JSXStyle.dynamic([["134865897", [theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius]]])
42223
- }, generateFilterInputs())), /*#__PURE__*/React.createElement(_JSXStyle, {
42224
- id: "134865897",
42225
- dynamic: [theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius]
42226
- }, "thead.__jsx-style-dynamic-selector{border-collapse:separate;border-spacing:0;font-size:inherit;}th.__jsx-style-dynamic-selector{padding:0 0.5em;font-size:calc(0.75 * var(--table-font-size));font-weight:normal;text-align:left;-webkit-letter-spacing:0;-moz-letter-spacing:0;-ms-letter-spacing:0;letter-spacing:0;vertical-align:middle;min-height:calc(2.5 * var(--table-font-size));color:".concat(theme.palette.accents_5, ";background:").concat(theme.palette.accents_1, ";border-bottom:1px solid ").concat(theme.palette.border, ";border-top:1px solid ").concat(theme.palette.border, ";border-radius:0;}th.__jsx-style-dynamic-selector:nth-child(1){border-bottom:1px solid ").concat(theme.palette.border, ";border-left:1px solid ").concat(theme.palette.border, ";border-top:1px solid ").concat(theme.palette.border, ";border-top-left-radius:").concat(theme.layout.radius, ";border-bottom-left-radius:").concat(theme.layout.radius, ";}th.__jsx-style-dynamic-selector:last-child{border-bottom:1px solid ").concat(theme.palette.border, ";border-right:1px solid ").concat(theme.palette.border, ";border-top:1px solid ").concat(theme.palette.border, ";border-top-right-radius:").concat(theme.layout.radius, ";border-bottom-right-radius:").concat(theme.layout.radius, ";}.thead-box.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-align:center;min-height:calc(2.5 * var(--table-font-size));text-transform:uppercase;}")));
42227
- };
42228
- TableHead.displayName = 'TableHead';
42229
-
42230
- var TableCell = function TableCell(_ref) {
42231
- var columns = _ref.columns,
42232
- row = _ref.row,
42233
- rowIndex = _ref.rowIndex,
42234
- emptyText = _ref.emptyText,
42235
- onCellClick = _ref.onCellClick;
42236
- /* eslint-disable react/jsx-no-useless-fragment */
42237
- return /*#__PURE__*/React.createElement(React.Fragment, null, columns.map(function (column, index) {
42238
- var currentRowValue = row[column.prop];
42239
- var cellValue = currentRowValue || emptyText;
42240
- var shouldBeRenderElement = column.renderHandler(currentRowValue, row, rowIndex);
42241
- return /*#__PURE__*/React.createElement("td", {
42242
- style: _objectSpread2({
42243
- fontSize: "".concat(column === null || column === undefined ? undefined : column.fontSize),
42244
- textAlign: "".concat(column === null || column === undefined ? undefined : column.align, " !important"),
42245
- paddingLeft: '0.3rem',
42246
- paddingRight: '0.3rem',
42247
- color: "".concat(column === null || column === undefined ? undefined : column.color),
42248
- whiteSpace: column !== null && column !== undefined && column.noWrap ? 'nowrap' : 'normal'
42249
- }, currentRowValue === null || currentRowValue === undefined ? undefined : currentRowValue.style),
42250
- "data-column": column.label,
42251
- key: "row-td-".concat(index, "-").concat(column.prop.toString()),
42252
- onClick: function onClick() {
42253
- return onCellClick && onCellClick(currentRowValue, rowIndex, index);
42254
- },
42255
- className: column.className
42256
- }, /*#__PURE__*/React.createElement("div", {
42257
- className: "cell"
42258
- }, shouldBeRenderElement ? shouldBeRenderElement : cellValue));
42259
- }));
42260
- /* eslint-enable */
42261
- };
42262
-
42263
- /* "use client" */
42264
-
42265
- var defaultContext$2 = {
42266
- columns: [],
42267
- updateColumn: function updateColumn() {}
42268
- };
42269
- var TableContext = /*#__PURE__*/React.createContext(defaultContext$2);
42270
- var useTableContext = function useTableContext() {
42271
- return React.useContext(TableContext);
42272
- };
42273
-
42274
42200
  var TableBody = function TableBody(_ref) {
42275
42201
  var data = _ref.data,
42276
42202
  emptyText = _ref.emptyText,
@@ -42525,6 +42451,10 @@ function TableComponent(tableProps) {
42525
42451
  updateColumn: updateColumn
42526
42452
  };
42527
42453
  }, [columns]);
42454
+ var _React$useState = React.useState({}),
42455
+ _React$useState2 = _slicedToArray(_React$useState, 2),
42456
+ filters = _React$useState2[0],
42457
+ setFilters = _React$useState2[1];
42528
42458
  React.useEffect(function () {
42529
42459
  if (typeof customData === 'undefined') return;
42530
42460
  setData(customData);
@@ -42532,7 +42462,75 @@ function TableComponent(tableProps) {
42532
42462
  useResize(function () {
42533
42463
  return updateShape();
42534
42464
  });
42535
- return /*#__PURE__*/React.createElement(TableContext.Provider, {
42465
+ var handleFilterChange = function handleFilterChange(name, value) {
42466
+ setFilters(function (prevFilters) {
42467
+ var updatedFilters = _objectSpread2(_objectSpread2({}, prevFilters), {}, _defineProperty$1({}, name, value));
42468
+ // Call onFiltersChange to propagate filter changes to the parent
42469
+ if (onFilters) {
42470
+ onFilters(updatedFilters);
42471
+ }
42472
+ return updatedFilters;
42473
+ });
42474
+ };
42475
+ var generateFilterInputs = function generateFilterInputs() {
42476
+ return columns.map(function (col) {
42477
+ var _String, _filters$filterName;
42478
+ var Header = col.label,
42479
+ accessor = col.filter,
42480
+ options = col.options;
42481
+ var filterName = (_String = String(col === null || col === undefined ? undefined : col.label)) === null || _String === undefined ? undefined : _String.replace(' ', '_').toLowerCase();
42482
+ var unq_accessor = _.uniqueId(filterName);
42483
+ return /*#__PURE__*/React.createElement("div", {
42484
+ style: {
42485
+ margin: '3px'
42486
+ },
42487
+ "data-column": Header,
42488
+ key: unq_accessor
42489
+ }, accessor === 'fixed' && /*#__PURE__*/React.createElement(Select, {
42490
+ key: unq_accessor,
42491
+ name: filterName,
42492
+ value: (_filters$filterName = filters[filterName]) !== null && _filters$filterName !== undefined ? _filters$filterName : 'All',
42493
+ onChange: function onChange(newValue) {
42494
+ return handleFilterChange(filterName, newValue);
42495
+ }
42496
+ }, /*#__PURE__*/React.createElement(Select.Option, {
42497
+ value: "All"
42498
+ }, "All ", Header), options ? options.map(function (option) {
42499
+ return /*#__PURE__*/React.createElement(Select.Option, {
42500
+ value: option.value
42501
+ }, option.name);
42502
+ }) : null), accessor === 'date' && /*#__PURE__*/React.createElement(Input, {
42503
+ id: "filter-date-".concat(filterName),
42504
+ htmlType: "date",
42505
+ name: filterName,
42506
+ value: filters[filterName],
42507
+ onChange: function onChange(e) {
42508
+ return handleFilterChange(filterName, e.target.value);
42509
+ }
42510
+ }), accessor === 'search' && /*#__PURE__*/React.createElement(Input, {
42511
+ id: "filter-search-".concat(filterName),
42512
+ htmlType: "text",
42513
+ autoComplete: "off",
42514
+ name: filterName,
42515
+ style: {
42516
+ height: 30,
42517
+ minWidth: 160
42518
+ },
42519
+ value: filters[filterName],
42520
+ onChange: function onChange(e) {
42521
+ return handleFilterChange(filterName, e.target.value);
42522
+ },
42523
+ placeholder: "Search...",
42524
+ fullWidth: true
42525
+ }));
42526
+ });
42527
+ };
42528
+ return /*#__PURE__*/React.createElement("div", null, showFilters && /*#__PURE__*/React.createElement("div", {
42529
+ style: {
42530
+ display: 'flex',
42531
+ gap: 6
42532
+ }
42533
+ }, generateFilterInputs()), /*#__PURE__*/React.createElement(TableContext.Provider, {
42536
42534
  value: contextValue
42537
42535
  }, /*#__PURE__*/React.createElement("table", _extends({
42538
42536
  ref: ref
@@ -42540,8 +42538,6 @@ function TableComponent(tableProps) {
42540
42538
  className: _JSXStyle.dynamic([["2132340556", [SCALES.font(1), SCALES.width(1, '100%'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]]]) + " " + (props && props.className != null && props.className || className || "")
42541
42539
  }), /*#__PURE__*/React.createElement(TableHead, {
42542
42540
  columns: columns,
42543
- onFilters: onFilters,
42544
- showFilters: showFilters,
42545
42541
  width: width
42546
42542
  }), /*#__PURE__*/React.createElement(TableBody, {
42547
42543
  data: data,
@@ -42556,7 +42552,7 @@ function TableComponent(tableProps) {
42556
42552
  }), children, /*#__PURE__*/React.createElement(_JSXStyle, {
42557
42553
  id: "2132340556",
42558
42554
  dynamic: [SCALES.font(1), SCALES.width(1, '100%'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]
42559
- }, "table.__jsx-style-dynamic-selector{border-collapse:separate;border-spacing:0;--table-font-size:".concat(SCALES.font(1), ";font-size:var(--table-font-size);width:").concat(SCALES.width(1, '100%'), ";height:").concat(SCALES.height(1, 'auto'), ";padding:").concat(SCALES.pt(0), " ").concat(SCALES.pr(0), " ").concat(SCALES.pb(0), " ").concat(SCALES.pl(0), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}"))));
42555
+ }, "table.__jsx-style-dynamic-selector{border-collapse:separate;border-spacing:0;--table-font-size:".concat(SCALES.font(1), ";font-size:var(--table-font-size);width:").concat(SCALES.width(1, '100%'), ";height:").concat(SCALES.height(1, 'auto'), ";padding:").concat(SCALES.pt(0), " ").concat(SCALES.pr(0), " ").concat(SCALES.pb(0), " ").concat(SCALES.pl(0), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}")))));
42560
42556
  }
42561
42557
  TableComponent.displayName = 'Table';
42562
42558
  TableComponent.Column = TableColumn;