@helpdice/ui 1.3.8 → 1.3.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
@@ -42211,9 +42211,9 @@ var TableHead = function TableHead(props) {
42211
42211
  });
42212
42212
  };
42213
42213
  return /*#__PURE__*/React.createElement(React.Fragment, null, colgroup, /*#__PURE__*/React.createElement("thead", {
42214
- className: _JSXStyle.dynamic([["318735310", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
42214
+ className: _JSXStyle.dynamic([["500933572", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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
42215
  }, /*#__PURE__*/React.createElement("tr", {
42216
- className: _JSXStyle.dynamic([["318735310", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
42216
+ className: _JSXStyle.dynamic([["500933572", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
42217
42217
  }, columns.map(function (column, index) {
42218
42218
  return /*#__PURE__*/React.createElement("th", {
42219
42219
  style: {
@@ -42225,23 +42225,23 @@ var TableHead = function TableHead(props) {
42225
42225
  },
42226
42226
  key: "table-th-".concat(column.prop.toString(), "-").concat(index),
42227
42227
  "data-column": column.label,
42228
- className: _JSXStyle.dynamic([["318735310", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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 || "")
42228
+ className: _JSXStyle.dynamic([["500933572", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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 || "")
42229
42229
  }, /*#__PURE__*/React.createElement("div", {
42230
- className: _JSXStyle.dynamic([["318735310", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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"
42230
+ className: _JSXStyle.dynamic([["500933572", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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"
42231
42231
  }, column.label, /*#__PURE__*/React.createElement("br", {
42232
- className: _JSXStyle.dynamic([["318735310", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
42232
+ className: _JSXStyle.dynamic([["500933572", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
42233
42233
  }), /*#__PURE__*/React.createElement("span", {
42234
42234
  style: {
42235
42235
  textAlign: 'center'
42236
42236
  },
42237
- className: _JSXStyle.dynamic([["318735310", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
42237
+ className: _JSXStyle.dynamic([["500933572", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
42238
42238
  }, column.text)));
42239
42239
  })), showFilters && /*#__PURE__*/React.createElement("tr", {
42240
- className: _JSXStyle.dynamic([["318735310", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
42240
+ className: _JSXStyle.dynamic([["500933572", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
42241
42241
  }, generateFilterInputs())), /*#__PURE__*/React.createElement(_JSXStyle, {
42242
- id: "318735310",
42243
- dynamic: [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]
42244
- }, "thead.__jsx-style-dynamic-selector{border-collapse:separate;border-spacing:0;font-size:inherit;".concat(stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", ";}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;").concat(stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", ";}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;}")));
42242
+ id: "500933572",
42243
+ dynamic: [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]
42244
+ }, "thead.__jsx-style-dynamic-selector{border-collapse:separate;border-spacing:0;font-size:inherit;".concat(stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", ";}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;}")));
42245
42245
  };
42246
42246
  TableHead.displayName = 'TableHead';
42247
42247
 
@@ -43490,6 +43490,12 @@ function TableComponent(tableProps) {
43490
43490
  }), children, dataLength && viewLength && onPageChange ? /*#__PURE__*/React.createElement("tfoot", {
43491
43491
  className: _JSXStyle.dynamic([["864348448", [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)]]])
43492
43492
  }, /*#__PURE__*/React.createElement(Pagination, {
43493
+ style: {
43494
+ marginLeft: '10px',
43495
+ marginRight: '10px',
43496
+ marginTop: '10px',
43497
+ marginBottom: '5px'
43498
+ },
43493
43499
  onChange: function onChange(pageNumber) {
43494
43500
  // Get the range for the current page
43495
43501
  var _getDataRange = getDataRange(pageNumber, viewLength, dataLength),
@@ -19969,9 +19969,9 @@ var TableHead = function TableHead(props) {
19969
19969
  });
19970
19970
  };
19971
19971
  return /*#__PURE__*/React.createElement(React.Fragment, null, colgroup, /*#__PURE__*/React.createElement("thead", {
19972
- className: _JSXStyle.dynamic([["318735310", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
19972
+ className: _JSXStyle.dynamic([["500933572", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
19973
19973
  }, /*#__PURE__*/React.createElement("tr", {
19974
- className: _JSXStyle.dynamic([["318735310", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
19974
+ className: _JSXStyle.dynamic([["500933572", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
19975
19975
  }, columns.map(function (column, index) {
19976
19976
  return /*#__PURE__*/React.createElement("th", {
19977
19977
  style: {
@@ -19983,23 +19983,23 @@ var TableHead = function TableHead(props) {
19983
19983
  },
19984
19984
  key: "table-th-".concat(column.prop.toString(), "-").concat(index),
19985
19985
  "data-column": column.label,
19986
- className: _JSXStyle.dynamic([["318735310", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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 || "")
19986
+ className: _JSXStyle.dynamic([["500933572", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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 || "")
19987
19987
  }, /*#__PURE__*/React.createElement("div", {
19988
- className: _JSXStyle.dynamic([["318735310", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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"
19988
+ className: _JSXStyle.dynamic([["500933572", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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"
19989
19989
  }, column.label, /*#__PURE__*/React.createElement("br", {
19990
- className: _JSXStyle.dynamic([["318735310", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
19990
+ className: _JSXStyle.dynamic([["500933572", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
19991
19991
  }), /*#__PURE__*/React.createElement("span", {
19992
19992
  style: {
19993
19993
  textAlign: 'center'
19994
19994
  },
19995
- className: _JSXStyle.dynamic([["318735310", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
19995
+ className: _JSXStyle.dynamic([["500933572", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
19996
19996
  }, column.text)));
19997
19997
  })), showFilters && /*#__PURE__*/React.createElement("tr", {
19998
- className: _JSXStyle.dynamic([["318735310", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
19998
+ className: _JSXStyle.dynamic([["500933572", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
19999
19999
  }, generateFilterInputs())), /*#__PURE__*/React.createElement(_JSXStyle, {
20000
- id: "318735310",
20001
- dynamic: [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]
20002
- }, "thead.__jsx-style-dynamic-selector{border-collapse:separate;border-spacing:0;font-size:inherit;".concat(stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", ";}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;").concat(stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", ";}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;}")));
20000
+ id: "500933572",
20001
+ dynamic: [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]
20002
+ }, "thead.__jsx-style-dynamic-selector{border-collapse:separate;border-spacing:0;font-size:inherit;".concat(stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", ";}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;}")));
20003
20003
  };
20004
20004
  TableHead.displayName = 'TableHead';
20005
20005
 
@@ -32543,6 +32543,12 @@ function TableComponent(tableProps) {
32543
32543
  }), children, dataLength && viewLength && onPageChange ? /*#__PURE__*/React.createElement("tfoot", {
32544
32544
  className: _JSXStyle.dynamic([["864348448", [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)]]])
32545
32545
  }, /*#__PURE__*/React.createElement(Pagination, {
32546
+ style: {
32547
+ marginLeft: '10px',
32548
+ marginRight: '10px',
32549
+ marginTop: '10px',
32550
+ marginBottom: '5px'
32551
+ },
32546
32552
  onChange: function onChange(pageNumber) {
32547
32553
  // Get the range for the current page
32548
32554
  var _getDataRange = getDataRange(pageNumber, viewLength, dataLength),
@@ -123,9 +123,9 @@ var TableHead = function TableHead(props) {
123
123
  });
124
124
  };
125
125
  return /*#__PURE__*/React.createElement(React.Fragment, null, colgroup, /*#__PURE__*/React.createElement("thead", {
126
- className: _JSXStyle.dynamic([["318735310", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
126
+ className: _JSXStyle.dynamic([["500933572", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
127
127
  }, /*#__PURE__*/React.createElement("tr", {
128
- className: _JSXStyle.dynamic([["318735310", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
128
+ className: _JSXStyle.dynamic([["500933572", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
129
129
  }, columns.map(function (column, index) {
130
130
  return /*#__PURE__*/React.createElement("th", {
131
131
  style: {
@@ -137,23 +137,23 @@ var TableHead = function TableHead(props) {
137
137
  },
138
138
  key: "table-th-".concat(column.prop.toString(), "-").concat(index),
139
139
  "data-column": column.label,
140
- className: _JSXStyle.dynamic([["318735310", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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 || "")
140
+ className: _JSXStyle.dynamic([["500933572", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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 || "")
141
141
  }, /*#__PURE__*/React.createElement("div", {
142
- className: _JSXStyle.dynamic([["318735310", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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"
142
+ className: _JSXStyle.dynamic([["500933572", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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"
143
143
  }, column.label, /*#__PURE__*/React.createElement("br", {
144
- className: _JSXStyle.dynamic([["318735310", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
144
+ className: _JSXStyle.dynamic([["500933572", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
145
145
  }), /*#__PURE__*/React.createElement("span", {
146
146
  style: {
147
147
  textAlign: 'center'
148
148
  },
149
- className: _JSXStyle.dynamic([["318735310", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
149
+ className: _JSXStyle.dynamic([["500933572", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
150
150
  }, column.text)));
151
151
  })), showFilters && /*#__PURE__*/React.createElement("tr", {
152
- className: _JSXStyle.dynamic([["318735310", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
152
+ className: _JSXStyle.dynamic([["500933572", [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]]])
153
153
  }, generateFilterInputs())), /*#__PURE__*/React.createElement(_JSXStyle, {
154
- id: "318735310",
155
- dynamic: [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", theme.palette.accents_5, theme.palette.accents_1, theme.palette.border, theme.palette.border, stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]
156
- }, "thead.__jsx-style-dynamic-selector{border-collapse:separate;border-spacing:0;font-size:inherit;".concat(stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", ";}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;").concat(stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", ";}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;}")));
154
+ id: "500933572",
155
+ dynamic: [stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", 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]
156
+ }, "thead.__jsx-style-dynamic-selector{border-collapse:separate;border-spacing:0;font-size:inherit;".concat(stickyHeader && "\n position: sticky;\n top: 0;\n background-color: #fff;\n z-index: 1;\n ", ";}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;}")));
157
157
  };
158
158
  TableHead.displayName = 'TableHead';
159
159
  export default TableHead;
@@ -126,6 +126,12 @@ function TableComponent(tableProps) {
126
126
  }), children, dataLength && viewLength && onPageChange ? /*#__PURE__*/React.createElement("tfoot", {
127
127
  className: _JSXStyle.dynamic([["864348448", [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)]]])
128
128
  }, /*#__PURE__*/React.createElement(Pagination, {
129
+ style: {
130
+ marginLeft: '10px',
131
+ marginRight: '10px',
132
+ marginTop: '10px',
133
+ marginBottom: '5px'
134
+ },
129
135
  onChange: function onChange(pageNumber) {
130
136
  // Get the range for the current page
131
137
  var _getDataRange = getDataRange(pageNumber, viewLength, dataLength),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@helpdice/ui",
3
- "version": "1.3.8",
3
+ "version": "1.3.9",
4
4
  "main": "dist/index.js",
5
5
  "types": "esm/index.d.ts",
6
6
  "unpkg": "dist/index.min.js",