@helpdice/ui 1.2.4 → 1.2.6

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 (5) hide show
  1. package/dist/index.js +55 -66
  2. package/dist/table/index.js +55 -66
  3. package/esm/table/table-body.js +8 -8
  4. package/esm/table/table-head.js +47 -58
  5. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -42138,69 +42138,58 @@ var TableHead = function TableHead(props) {
42138
42138
  };
42139
42139
  var generateFilterInputs = function generateFilterInputs() {
42140
42140
  return columns.map(function (col) {
42141
- var _String;
42141
+ var _String, _filters$filterName;
42142
42142
  var Header = col.label,
42143
42143
  accessor = col.filter,
42144
42144
  options = col.options;
42145
42145
  var filterName = (_String = String(col === null || col === undefined ? undefined : col.label)) === null || _String === undefined ? undefined : _String.replace(' ', '_').toLowerCase();
42146
42146
  var unq_accessor = _.uniqueId(filterName);
42147
- if (accessor === 'fixed') {
42148
- var _filters$filterName;
42149
- // Dropdown filter for categorical data (category, status)
42150
- return /*#__PURE__*/React.createElement("td", {
42151
- "data-column": Header
42152
- }, /*#__PURE__*/React.createElement(Select, {
42153
- key: unq_accessor,
42154
- name: filterName,
42155
- value: (_filters$filterName = filters[filterName]) !== null && _filters$filterName !== undefined ? _filters$filterName : 'All',
42156
- onChange: function onChange(newValue) {
42157
- return handleFilterChange(filterName, newValue);
42158
- }
42159
- }, /*#__PURE__*/React.createElement(Select.Option, {
42160
- value: "All"
42161
- }, "All ", Header), options ? options.map(function (option) {
42162
- return /*#__PURE__*/React.createElement(Select.Option, {
42163
- value: option.value
42164
- }, option.name);
42165
- }) : null));
42166
- }
42167
- if (accessor === 'date') {
42168
- // Date filter
42169
- return /*#__PURE__*/React.createElement("th", {
42170
- "data-column": Header,
42171
- key: unq_accessor
42172
- }, /*#__PURE__*/React.createElement(Input, {
42173
- id: "filter-date-".concat(filterName),
42174
- htmlType: "date",
42175
- name: filterName,
42176
- value: filters[filterName],
42177
- onChange: function onChange(e) {
42178
- return handleFilterChange(filterName, e.target.value);
42179
- }
42180
- }));
42181
- }
42182
- if (accessor === 'search') {
42183
- // Text search filter
42184
- return /*#__PURE__*/React.createElement("th", {
42185
- "data-column": Header
42186
- }, /*#__PURE__*/React.createElement(Input, {
42187
- id: "filter-search-".concat(filterName),
42188
- htmlType: "text"
42189
- // ref={filterRefs.current[filterName]} // Dynamically set ref}
42190
- ,
42191
- name: filterName,
42192
- style: {
42193
- height: 30,
42194
- minWidth: 160
42195
- },
42196
- value: filters[filterName],
42197
- onChange: function onChange(e) {
42198
- return handleFilterChange(filterName, e.target.value);
42199
- },
42200
- placeholder: "Search...",
42201
- fullWidth: true
42202
- }));
42203
- }
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
+ })));
42204
42193
  });
42205
42194
  };
42206
42195
  return /*#__PURE__*/React.createElement(React.Fragment, null, colgroup, /*#__PURE__*/React.createElement("thead", {
@@ -42359,7 +42348,7 @@ var TableBody = function TableBody(_ref) {
42359
42348
  role: "checkbox",
42360
42349
  className: useClasses({
42361
42350
  hover: hover
42362
- }, className),
42351
+ }, "".concat(rowDraggable ? 'draggable' : 'hover', " ").concat(className)),
42363
42352
  onDragStart: onDragStart,
42364
42353
  "aria-checked": selected.indexOf(row) !== -1,
42365
42354
  tabIndex: -1,
@@ -42386,28 +42375,28 @@ var TableBody = function TableBody(_ref) {
42386
42375
  }));
42387
42376
  }
42388
42377
  return /*#__PURE__*/React.createElement("tbody", {
42389
- className: _JSXStyle.dynamic([["3433300570", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
42378
+ className: _JSXStyle.dynamic([["1422656197", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
42390
42379
  }, data.map(function (row, index) {
42391
42380
  var qid = _.uniqueId();
42392
42381
  if (row === null || row === undefined) {
42393
42382
  var uid = _.uniqueId();
42394
42383
  return /*#__PURE__*/React.createElement("tr", {
42395
42384
  key: uid,
42396
- className: _JSXStyle.dynamic([["3433300570", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
42385
+ className: _JSXStyle.dynamic([["1422656197", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
42397
42386
  }, /*#__PURE__*/React.createElement("td", {
42398
42387
  colSpan: columns.length,
42399
- className: _JSXStyle.dynamic([["3433300570", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
42388
+ className: _JSXStyle.dynamic([["1422656197", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
42400
42389
  }, "\u2003"));
42401
42390
  }
42402
42391
  return /*#__PURE__*/React.createElement(React.Fragment, null, renderRow(columns, row, index), (row === null || row === undefined ? undefined : row.table) && /*#__PURE__*/React.createElement("tr", {
42403
42392
  key: qid,
42404
- className: _JSXStyle.dynamic([["3433300570", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
42393
+ className: _JSXStyle.dynamic([["1422656197", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
42405
42394
  }, /*#__PURE__*/React.createElement("td", {
42406
42395
  style: {
42407
42396
  padding: '1rem'
42408
42397
  },
42409
42398
  colSpan: columns.length,
42410
- className: _JSXStyle.dynamic([["3433300570", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
42399
+ className: _JSXStyle.dynamic([["1422656197", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
42411
42400
  })));
42412
42401
 
42413
42402
  // return (
@@ -42425,9 +42414,9 @@ var TableBody = function TableBody(_ref) {
42425
42414
  // </tr>
42426
42415
  // )
42427
42416
  }), /*#__PURE__*/React.createElement(_JSXStyle, {
42428
- id: "3433300570",
42417
+ id: "1422656197",
42429
42418
  dynamic: [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]
42430
- }, "tr.__jsx-style-dynamic-selector{-webkit-transition:background-color 0.25s ease;transition:background-color 0.25s ease;font-size:inherit;}tr.hover.__jsx-style-dynamic-selector:hover{background-color:".concat(theme.palette.accents_1, ";}tr.__jsx-style-dynamic-selector td{padding:0 0.5em;border-bottom:1px solid ").concat(theme.palette.border, ";color:").concat(theme.palette.accents_6, ";font-size:calc(0.875 * var(--table-font-size));text-align:left;}tr.__jsx-style-dynamic-selector .cell{min-height:calc(3.125 * var(--table-font-size));display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-flex-flow:row wrap;-ms-flex-flow:row wrap;flex-flow:row wrap;}")));
42419
+ }, "tr.__jsx-style-dynamic-selector{-webkit-transition:background-color 0.25s ease;transition:background-color 0.25s ease;font-size:inherit;}tr.hover.__jsx-style-dynamic-selector:hover{background-color:".concat(theme.palette.accents_1, ";}tr.draggable.__jsx-style-dynamic-selector:hover{border:2px dashed #dfdfdf;margin:3px;}tr.__jsx-style-dynamic-selector td{padding:0 0.5em;border-bottom:1px solid ").concat(theme.palette.border, ";color:").concat(theme.palette.accents_6, ";font-size:calc(0.875 * var(--table-font-size));text-align:left;}tr.__jsx-style-dynamic-selector .cell{min-height:calc(3.125 * var(--table-font-size));display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-flex-flow:row wrap;-ms-flex-flow:row wrap;flex-flow:row wrap;}")));
42431
42420
  };
42432
42421
  TableBody.displayName = 'TableBody';
42433
42422
 
package/dist/table/index.js CHANGED
@@ -19883,69 +19883,58 @@ var TableHead = function TableHead(props) {
19883
19883
  };
19884
19884
  var generateFilterInputs = function generateFilterInputs() {
19885
19885
  return columns.map(function (col) {
19886
- var _String;
19886
+ var _String, _filters$filterName;
19887
19887
  var Header = col.label,
19888
19888
  accessor = col.filter,
19889
19889
  options = col.options;
19890
19890
  var filterName = (_String = String(col === null || col === undefined ? undefined : col.label)) === null || _String === undefined ? undefined : _String.replace(' ', '_').toLowerCase();
19891
19891
  var unq_accessor = _.uniqueId(filterName);
19892
- if (accessor === 'fixed') {
19893
- var _filters$filterName;
19894
- // Dropdown filter for categorical data (category, status)
19895
- return /*#__PURE__*/React.createElement("td", {
19896
- "data-column": Header
19897
- }, /*#__PURE__*/React.createElement(Select, {
19898
- key: unq_accessor,
19899
- name: filterName,
19900
- value: (_filters$filterName = filters[filterName]) !== null && _filters$filterName !== undefined ? _filters$filterName : 'All',
19901
- onChange: function onChange(newValue) {
19902
- return handleFilterChange(filterName, newValue);
19903
- }
19904
- }, /*#__PURE__*/React.createElement(Select.Option, {
19905
- value: "All"
19906
- }, "All ", Header), options ? options.map(function (option) {
19907
- return /*#__PURE__*/React.createElement(Select.Option, {
19908
- value: option.value
19909
- }, option.name);
19910
- }) : null));
19911
- }
19912
- if (accessor === 'date') {
19913
- // Date filter
19914
- return /*#__PURE__*/React.createElement("th", {
19915
- "data-column": Header,
19916
- key: unq_accessor
19917
- }, /*#__PURE__*/React.createElement(Input, {
19918
- id: "filter-date-".concat(filterName),
19919
- htmlType: "date",
19920
- name: filterName,
19921
- value: filters[filterName],
19922
- onChange: function onChange(e) {
19923
- return handleFilterChange(filterName, e.target.value);
19924
- }
19925
- }));
19926
- }
19927
- if (accessor === 'search') {
19928
- // Text search filter
19929
- return /*#__PURE__*/React.createElement("th", {
19930
- "data-column": Header
19931
- }, /*#__PURE__*/React.createElement(Input, {
19932
- id: "filter-search-".concat(filterName),
19933
- htmlType: "text"
19934
- // ref={filterRefs.current[filterName]} // Dynamically set ref}
19935
- ,
19936
- name: filterName,
19937
- style: {
19938
- height: 30,
19939
- minWidth: 160
19940
- },
19941
- value: filters[filterName],
19942
- onChange: function onChange(e) {
19943
- return handleFilterChange(filterName, e.target.value);
19944
- },
19945
- placeholder: "Search...",
19946
- fullWidth: true
19947
- }));
19948
- }
19892
+ return /*#__PURE__*/React.createElement("th", {
19893
+ style: {
19894
+ margin: '3px'
19895
+ },
19896
+ "data-column": Header,
19897
+ key: unq_accessor
19898
+ }, accessor === 'fixed' && /*#__PURE__*/React.createElement(Select, {
19899
+ key: unq_accessor,
19900
+ name: filterName,
19901
+ value: (_filters$filterName = filters[filterName]) !== null && _filters$filterName !== undefined ? _filters$filterName : 'All',
19902
+ onChange: function onChange(newValue) {
19903
+ return handleFilterChange(filterName, newValue);
19904
+ }
19905
+ }, /*#__PURE__*/React.createElement(Select.Option, {
19906
+ value: "All"
19907
+ }, "All ", Header), options ? options.map(function (option) {
19908
+ return /*#__PURE__*/React.createElement(Select.Option, {
19909
+ value: option.value
19910
+ }, option.name);
19911
+ }) : null), accessor === 'date' && /*#__PURE__*/React.createElement(Input, {
19912
+ id: "filter-date-".concat(filterName),
19913
+ htmlType: "date",
19914
+ name: filterName,
19915
+ value: filters[filterName],
19916
+ onChange: function onChange(e) {
19917
+ return handleFilterChange(filterName, e.target.value);
19918
+ }
19919
+ }), accessor === 'search' && /*#__PURE__*/React.createElement("th", {
19920
+ "data-column": Header
19921
+ }, /*#__PURE__*/React.createElement(Input, {
19922
+ id: "filter-search-".concat(filterName),
19923
+ htmlType: "text"
19924
+ // ref={filterRefs.current[filterName]} // Dynamically set ref}
19925
+ ,
19926
+ name: filterName,
19927
+ style: {
19928
+ height: 30,
19929
+ minWidth: 160
19930
+ },
19931
+ value: filters[filterName],
19932
+ onChange: function onChange(e) {
19933
+ return handleFilterChange(filterName, e.target.value);
19934
+ },
19935
+ placeholder: "Search...",
19936
+ fullWidth: true
19937
+ })));
19949
19938
  });
19950
19939
  };
19951
19940
  return /*#__PURE__*/React.createElement(React.Fragment, null, colgroup, /*#__PURE__*/React.createElement("thead", {
@@ -20104,7 +20093,7 @@ var TableBody = function TableBody(_ref) {
20104
20093
  role: "checkbox",
20105
20094
  className: useClasses({
20106
20095
  hover: hover
20107
- }, className),
20096
+ }, "".concat(rowDraggable ? 'draggable' : 'hover', " ").concat(className)),
20108
20097
  onDragStart: onDragStart,
20109
20098
  "aria-checked": selected.indexOf(row) !== -1,
20110
20099
  tabIndex: -1,
@@ -20131,28 +20120,28 @@ var TableBody = function TableBody(_ref) {
20131
20120
  }));
20132
20121
  }
20133
20122
  return /*#__PURE__*/React.createElement("tbody", {
20134
- className: _JSXStyle.dynamic([["3433300570", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
20123
+ className: _JSXStyle.dynamic([["1422656197", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
20135
20124
  }, data.map(function (row, index) {
20136
20125
  var qid = _.uniqueId();
20137
20126
  if (row === null || row === undefined) {
20138
20127
  var uid = _.uniqueId();
20139
20128
  return /*#__PURE__*/React.createElement("tr", {
20140
20129
  key: uid,
20141
- className: _JSXStyle.dynamic([["3433300570", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
20130
+ className: _JSXStyle.dynamic([["1422656197", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
20142
20131
  }, /*#__PURE__*/React.createElement("td", {
20143
20132
  colSpan: columns.length,
20144
- className: _JSXStyle.dynamic([["3433300570", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
20133
+ className: _JSXStyle.dynamic([["1422656197", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
20145
20134
  }, "\u2003"));
20146
20135
  }
20147
20136
  return /*#__PURE__*/React.createElement(React.Fragment, null, renderRow(columns, row, index), (row === null || row === undefined ? undefined : row.table) && /*#__PURE__*/React.createElement("tr", {
20148
20137
  key: qid,
20149
- className: _JSXStyle.dynamic([["3433300570", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
20138
+ className: _JSXStyle.dynamic([["1422656197", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
20150
20139
  }, /*#__PURE__*/React.createElement("td", {
20151
20140
  style: {
20152
20141
  padding: '1rem'
20153
20142
  },
20154
20143
  colSpan: columns.length,
20155
- className: _JSXStyle.dynamic([["3433300570", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
20144
+ className: _JSXStyle.dynamic([["1422656197", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
20156
20145
  })));
20157
20146
 
20158
20147
  // return (
@@ -20170,9 +20159,9 @@ var TableBody = function TableBody(_ref) {
20170
20159
  // </tr>
20171
20160
  // )
20172
20161
  }), /*#__PURE__*/React.createElement(_JSXStyle, {
20173
- id: "3433300570",
20162
+ id: "1422656197",
20174
20163
  dynamic: [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]
20175
- }, "tr.__jsx-style-dynamic-selector{-webkit-transition:background-color 0.25s ease;transition:background-color 0.25s ease;font-size:inherit;}tr.hover.__jsx-style-dynamic-selector:hover{background-color:".concat(theme.palette.accents_1, ";}tr.__jsx-style-dynamic-selector td{padding:0 0.5em;border-bottom:1px solid ").concat(theme.palette.border, ";color:").concat(theme.palette.accents_6, ";font-size:calc(0.875 * var(--table-font-size));text-align:left;}tr.__jsx-style-dynamic-selector .cell{min-height:calc(3.125 * var(--table-font-size));display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-flex-flow:row wrap;-ms-flex-flow:row wrap;flex-flow:row wrap;}")));
20164
+ }, "tr.__jsx-style-dynamic-selector{-webkit-transition:background-color 0.25s ease;transition:background-color 0.25s ease;font-size:inherit;}tr.hover.__jsx-style-dynamic-selector:hover{background-color:".concat(theme.palette.accents_1, ";}tr.draggable.__jsx-style-dynamic-selector:hover{border:2px dashed #dfdfdf;margin:3px;}tr.__jsx-style-dynamic-selector td{padding:0 0.5em;border-bottom:1px solid ").concat(theme.palette.border, ";color:").concat(theme.palette.accents_6, ";font-size:calc(0.875 * var(--table-font-size));text-align:left;}tr.__jsx-style-dynamic-selector .cell{min-height:calc(3.125 * var(--table-font-size));display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-flex-flow:row wrap;-ms-flex-flow:row wrap;flex-flow:row wrap;}")));
20176
20165
  };
20177
20166
  TableBody.displayName = 'TableBody';
20178
20167
 
package/esm/table/table-body.js CHANGED
@@ -84,7 +84,7 @@ var TableBody = function TableBody(_ref) {
84
84
  role: "checkbox",
85
85
  className: useClasses({
86
86
  hover: hover
87
- }, className),
87
+ }, "".concat(rowDraggable ? 'draggable' : 'hover', " ").concat(className)),
88
88
  onDragStart: onDragStart,
89
89
  "aria-checked": selected.indexOf(row) !== -1,
90
90
  tabIndex: -1,
@@ -111,28 +111,28 @@ var TableBody = function TableBody(_ref) {
111
111
  }));
112
112
  }
113
113
  return /*#__PURE__*/React.createElement("tbody", {
114
- className: _JSXStyle.dynamic([["3433300570", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
114
+ className: _JSXStyle.dynamic([["1422656197", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
115
115
  }, data.map(function (row, index) {
116
116
  var qid = _.uniqueId();
117
117
  if (row === null || row === undefined) {
118
118
  var uid = _.uniqueId();
119
119
  return /*#__PURE__*/React.createElement("tr", {
120
120
  key: uid,
121
- className: _JSXStyle.dynamic([["3433300570", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
121
+ className: _JSXStyle.dynamic([["1422656197", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
122
122
  }, /*#__PURE__*/React.createElement("td", {
123
123
  colSpan: columns.length,
124
- className: _JSXStyle.dynamic([["3433300570", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
124
+ className: _JSXStyle.dynamic([["1422656197", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
125
125
  }, "\u2003"));
126
126
  }
127
127
  return /*#__PURE__*/React.createElement(React.Fragment, null, renderRow(columns, row, index), (row === null || row === void 0 ? void 0 : row.table) && /*#__PURE__*/React.createElement("tr", {
128
128
  key: qid,
129
- className: _JSXStyle.dynamic([["3433300570", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
129
+ className: _JSXStyle.dynamic([["1422656197", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
130
130
  }, /*#__PURE__*/React.createElement("td", {
131
131
  style: {
132
132
  padding: '1rem'
133
133
  },
134
134
  colSpan: columns.length,
135
- className: _JSXStyle.dynamic([["3433300570", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
135
+ className: _JSXStyle.dynamic([["1422656197", [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]]])
136
136
  })));
137
137
 
138
138
  // return (
@@ -150,9 +150,9 @@ var TableBody = function TableBody(_ref) {
150
150
  // </tr>
151
151
  // )
152
152
  }), /*#__PURE__*/React.createElement(_JSXStyle, {
153
- id: "3433300570",
153
+ id: "1422656197",
154
154
  dynamic: [theme.palette.accents_1, theme.palette.border, theme.palette.accents_6]
155
- }, "tr.__jsx-style-dynamic-selector{-webkit-transition:background-color 0.25s ease;transition:background-color 0.25s ease;font-size:inherit;}tr.hover.__jsx-style-dynamic-selector:hover{background-color:".concat(theme.palette.accents_1, ";}tr.__jsx-style-dynamic-selector td{padding:0 0.5em;border-bottom:1px solid ").concat(theme.palette.border, ";color:").concat(theme.palette.accents_6, ";font-size:calc(0.875 * var(--table-font-size));text-align:left;}tr.__jsx-style-dynamic-selector .cell{min-height:calc(3.125 * var(--table-font-size));display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-flex-flow:row wrap;-ms-flex-flow:row wrap;flex-flow:row wrap;}")));
155
+ }, "tr.__jsx-style-dynamic-selector{-webkit-transition:background-color 0.25s ease;transition:background-color 0.25s ease;font-size:inherit;}tr.hover.__jsx-style-dynamic-selector:hover{background-color:".concat(theme.palette.accents_1, ";}tr.draggable.__jsx-style-dynamic-selector:hover{border:2px dashed #dfdfdf;margin:3px;}tr.__jsx-style-dynamic-selector td{padding:0 0.5em;border-bottom:1px solid ").concat(theme.palette.border, ";color:").concat(theme.palette.accents_6, ";font-size:calc(0.875 * var(--table-font-size));text-align:left;}tr.__jsx-style-dynamic-selector .cell{min-height:calc(3.125 * var(--table-font-size));display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-flex-flow:row wrap;-ms-flex-flow:row wrap;flex-flow:row wrap;}")));
156
156
  };
157
157
  TableBody.displayName = 'TableBody';
158
158
  export default TableBody;
package/esm/table/table-head.js CHANGED
@@ -55,69 +55,58 @@ var TableHead = function TableHead(props) {
55
55
  };
56
56
  var generateFilterInputs = function generateFilterInputs() {
57
57
  return columns.map(function (col) {
58
- var _String;
58
+ var _String, _filters$filterName;
59
59
  var Header = col.label,
60
60
  accessor = col.filter,
61
61
  options = col.options;
62
62
  var filterName = (_String = String(col === null || col === void 0 ? void 0 : col.label)) === null || _String === void 0 ? void 0 : _String.replace(' ', '_').toLowerCase();
63
63
  var unq_accessor = _.uniqueId(filterName);
64
- if (accessor === 'fixed') {
65
- var _filters$filterName;
66
- // Dropdown filter for categorical data (category, status)
67
- return /*#__PURE__*/React.createElement("td", {
68
- "data-column": Header
69
- }, /*#__PURE__*/React.createElement(Select, {
70
- key: unq_accessor,
71
- name: filterName,
72
- value: (_filters$filterName = filters[filterName]) !== null && _filters$filterName !== void 0 ? _filters$filterName : 'All',
73
- onChange: function onChange(newValue) {
74
- return handleFilterChange(filterName, newValue);
75
- }
76
- }, /*#__PURE__*/React.createElement(Select.Option, {
77
- value: "All"
78
- }, "All ", Header), options ? options.map(function (option) {
79
- return /*#__PURE__*/React.createElement(Select.Option, {
80
- value: option.value
81
- }, option.name);
82
- }) : null));
83
- }
84
- if (accessor === 'date') {
85
- // Date filter
86
- return /*#__PURE__*/React.createElement("th", {
87
- "data-column": Header,
88
- key: unq_accessor
89
- }, /*#__PURE__*/React.createElement(Input, {
90
- id: "filter-date-".concat(filterName),
91
- htmlType: "date",
92
- name: filterName,
93
- value: filters[filterName],
94
- onChange: function onChange(e) {
95
- return handleFilterChange(filterName, e.target.value);
96
- }
97
- }));
98
- }
99
- if (accessor === 'search') {
100
- // Text search filter
101
- return /*#__PURE__*/React.createElement("th", {
102
- "data-column": Header
103
- }, /*#__PURE__*/React.createElement(Input, {
104
- id: "filter-search-".concat(filterName),
105
- htmlType: "text"
106
- // ref={filterRefs.current[filterName]} // Dynamically set ref}
107
- ,
108
- name: filterName,
109
- style: {
110
- height: 30,
111
- minWidth: 160
112
- },
113
- value: filters[filterName],
114
- onChange: function onChange(e) {
115
- return handleFilterChange(filterName, e.target.value);
116
- },
117
- placeholder: "Search...",
118
- fullWidth: true
119
- }));
120
- }
64
+ return /*#__PURE__*/React.createElement("th", {
65
+ style: {
66
+ margin: '3px'
67
+ },
68
+ "data-column": Header,
69
+ key: unq_accessor
70
+ }, accessor === 'fixed' && /*#__PURE__*/React.createElement(Select, {
71
+ key: unq_accessor,
72
+ name: filterName,
73
+ value: (_filters$filterName = filters[filterName]) !== null && _filters$filterName !== void 0 ? _filters$filterName : 'All',
74
+ onChange: function onChange(newValue) {
75
+ return handleFilterChange(filterName, newValue);
76
+ }
77
+ }, /*#__PURE__*/React.createElement(Select.Option, {
78
+ value: "All"
79
+ }, "All ", Header), options ? options.map(function (option) {
80
+ return /*#__PURE__*/React.createElement(Select.Option, {
81
+ value: option.value
82
+ }, option.name);
83
+ }) : null), accessor === 'date' && /*#__PURE__*/React.createElement(Input, {
84
+ id: "filter-date-".concat(filterName),
85
+ htmlType: "date",
86
+ name: filterName,
87
+ value: filters[filterName],
88
+ onChange: function onChange(e) {
89
+ return handleFilterChange(filterName, e.target.value);
90
+ }
91
+ }), accessor === 'search' && /*#__PURE__*/React.createElement("th", {
92
+ "data-column": Header
93
+ }, /*#__PURE__*/React.createElement(Input, {
94
+ id: "filter-search-".concat(filterName),
95
+ htmlType: "text"
96
+ // ref={filterRefs.current[filterName]} // Dynamically set ref}
97
+ ,
98
+ name: filterName,
99
+ style: {
100
+ height: 30,
101
+ minWidth: 160
102
+ },
103
+ value: filters[filterName],
104
+ onChange: function onChange(e) {
105
+ return handleFilterChange(filterName, e.target.value);
106
+ },
107
+ placeholder: "Search...",
108
+ fullWidth: true
109
+ })));
121
110
  });
122
111
  };
123
112
  return /*#__PURE__*/React.createElement(React.Fragment, null, colgroup, /*#__PURE__*/React.createElement("thead", {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@helpdice/ui",
3
- "version": "1.2.4",
3
+ "version": "1.2.6",
4
4
  "main": "dist/index.js",
5
5
  "types": "esm/index.d.ts",
6
6
  "unpkg": "dist/index.min.js",