@helpdice/ui 1.6.3 → 1.6.5

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 (16) hide show
  1. package/dist/Placeholder/index.js +2 -2
  2. package/dist/badge/badge.d.ts +1 -1
  3. package/dist/badge/index.js +12 -12
  4. package/dist/index.js +30 -19
  5. package/dist/table/index.js +18 -7
  6. package/dist/table/table-body.d.ts +2 -1
  7. package/dist/table/table.d.ts +1 -0
  8. package/esm/Placeholder/empty.js +2 -2
  9. package/esm/badge/badge.d.ts +1 -1
  10. package/esm/badge/badge.js +12 -12
  11. package/esm/table/data-table.js +8 -2
  12. package/esm/table/table-body.d.ts +2 -1
  13. package/esm/table/table-body.js +5 -3
  14. package/esm/table/table.d.ts +1 -0
  15. package/esm/table/table.js +4 -1
  16. package/package.json +1 -1
package/dist/Placeholder/index.js CHANGED
@@ -149,8 +149,8 @@ function _unsupportedIterableToArray(r, a) {
149
149
  function Empty() {
150
150
  return /*#__PURE__*/React.createElement("svg", {
151
151
  xmlns: "http://www.w3.org/2000/svg",
152
- width: "20em",
153
- height: "20em",
152
+ width: "10em",
153
+ height: "10em",
154
154
  "data-name": "Layer 1",
155
155
  viewBox: "0 0 1009.54 789.93"
156
156
  }, /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
package/dist/badge/badge.d.ts CHANGED
@@ -2,7 +2,7 @@ import React from 'react';
2
2
  import { NormalTypes } from '../utils/prop-types';
3
3
  export type BadgeTypes = NormalTypes;
4
4
  interface Props {
5
- type?: BadgeTypes;
5
+ color?: BadgeTypes;
6
6
  dot?: boolean;
7
7
  className?: string;
8
8
  }
package/dist/badge/index.js CHANGED
@@ -1180,7 +1180,7 @@ var useClasses = function useClasses() {
1180
1180
  return classes.trim();
1181
1181
  };
1182
1182
 
1183
- var _excluded = ["type", "className", "children", "dot"];
1183
+ var _excluded = ["color", "className", "children", "dot"];
1184
1184
  var getBgColor = function getBgColor(type, palette) {
1185
1185
  var colors = {
1186
1186
  "default": palette.foreground,
@@ -1192,8 +1192,8 @@ var getBgColor = function getBgColor(type, palette) {
1192
1192
  return colors[type];
1193
1193
  };
1194
1194
  var BadgeComponent = function BadgeComponent(_ref) {
1195
- var _ref$type = _ref.type,
1196
- type = _ref$type === void 0 ? 'default' : _ref$type,
1195
+ var _ref$color = _ref.color,
1196
+ color = _ref$color === void 0 ? 'default' : _ref$color,
1197
1197
  _ref$className = _ref.className,
1198
1198
  className = _ref$className === void 0 ? '' : _ref$className,
1199
1199
  children = _ref.children,
@@ -1204,21 +1204,21 @@ var BadgeComponent = function BadgeComponent(_ref) {
1204
1204
  var _useScale = useScale(),
1205
1205
  SCALES = _useScale.SCALES;
1206
1206
  var bg = React.useMemo(function () {
1207
- return getBgColor(type, theme.palette);
1208
- }, [type, theme.palette]);
1209
- var color = React.useMemo(function () {
1210
- if (!type || type === 'default') return theme.palette.background;
1207
+ return getBgColor(color, theme.palette);
1208
+ }, [color, theme.palette]);
1209
+ var _color = React.useMemo(function () {
1210
+ if (!color || color === 'default') return theme.palette.background;
1211
1211
  return 'white';
1212
- }, [type, theme.palette.background]);
1212
+ }, [color, theme.palette.background]);
1213
1213
  var classes = useClasses('badge', {
1214
1214
  dot: dot
1215
1215
  }, className);
1216
1216
  return /*#__PURE__*/React.createElement("span", _extends({}, props, {
1217
- className: _JSXStyle.dynamic([["427831233", [bg, color, SCALES.font(0.875), SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0.25), SCALES.pr(0.4375), SCALES.pb(0.25), SCALES.pl(0.4375), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), SCALES.py(0.25), SCALES.px(0.25)]]]) + " " + (props && props.className != null && props.className || classes || "")
1217
+ className: _JSXStyle.dynamic([["1238256810", [bg, _color, SCALES.font(0.875), SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0.25), SCALES.pr(0.4375), SCALES.pb(0.25), SCALES.pl(0.4375), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), SCALES.py(0.25), SCALES.px(0.25)]]]) + " " + (props && props.className != null && props.className || classes || "")
1218
1218
  }), !dot && children, /*#__PURE__*/React.createElement(_JSXStyle, {
1219
- id: "427831233",
1220
- dynamic: [bg, color, SCALES.font(0.875), SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0.25), SCALES.pr(0.4375), SCALES.pb(0.25), SCALES.pl(0.4375), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), SCALES.py(0.25), SCALES.px(0.25)]
1221
- }, ".badge.__jsx-style-dynamic-selector{display:inline-block;border-radius:16px;font-variant:tabular-nums;line-height:1;vertical-align:middle;background-color:".concat(bg, ";color:").concat(color, ";border:0;font-size:").concat(SCALES.font(0.875), ";width:").concat(SCALES.width(1, 'auto'), ";height:").concat(SCALES.height(1, 'auto'), ";padding:").concat(SCALES.pt(0.25), " ").concat(SCALES.pr(0.4375), " ").concat(SCALES.pb(0.25), " ").concat(SCALES.pl(0.4375), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}.dot.__jsx-style-dynamic-selector{padding:").concat(SCALES.py(0.25), " ").concat(SCALES.px(0.25), ";border-radius:50%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}")));
1219
+ id: "1238256810",
1220
+ dynamic: [bg, _color, SCALES.font(0.875), SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0.25), SCALES.pr(0.4375), SCALES.pb(0.25), SCALES.pl(0.4375), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), SCALES.py(0.25), SCALES.px(0.25)]
1221
+ }, ".badge.__jsx-style-dynamic-selector{display:inline-block;border-radius:16px;font-variant:tabular-nums;line-height:1;vertical-align:middle;background-color:".concat(bg, ";color:").concat(_color, ";border:0;font-size:").concat(SCALES.font(0.875), ";width:").concat(SCALES.width(1, 'auto'), ";height:").concat(SCALES.height(1, 'auto'), ";padding:").concat(SCALES.pt(0.25), " ").concat(SCALES.pr(0.4375), " ").concat(SCALES.pb(0.25), " ").concat(SCALES.pl(0.4375), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}.dot.__jsx-style-dynamic-selector{padding:").concat(SCALES.py(0.25), " ").concat(SCALES.px(0.25), ";border-radius:50%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}")));
1222
1222
  };
1223
1223
  BadgeComponent.displayName = 'Badge';
1224
1224
  var Badge = withScale(BadgeComponent);
package/dist/index.js CHANGED
@@ -12829,7 +12829,7 @@ var AvatarGroup = withScale(AvatarGroupComponent);
12829
12829
 
12830
12830
  Avatar.Group = AvatarGroup;
12831
12831
 
12832
- var _excluded$1h = ["type", "className", "children", "dot"];
12832
+ var _excluded$1h = ["color", "className", "children", "dot"];
12833
12833
  var getBgColor = function getBgColor(type, palette) {
12834
12834
  var colors = {
12835
12835
  "default": palette.foreground,
@@ -12841,8 +12841,8 @@ var getBgColor = function getBgColor(type, palette) {
12841
12841
  return colors[type];
12842
12842
  };
12843
12843
  var BadgeComponent = function BadgeComponent(_ref) {
12844
- var _ref$type = _ref.type,
12845
- type = _ref$type === void 0 ? 'default' : _ref$type,
12844
+ var _ref$color = _ref.color,
12845
+ color = _ref$color === void 0 ? 'default' : _ref$color,
12846
12846
  _ref$className = _ref.className,
12847
12847
  className = _ref$className === void 0 ? '' : _ref$className,
12848
12848
  children = _ref.children,
@@ -12853,21 +12853,21 @@ var BadgeComponent = function BadgeComponent(_ref) {
12853
12853
  var _useScale = useScale(),
12854
12854
  SCALES = _useScale.SCALES;
12855
12855
  var bg = React$1.useMemo(function () {
12856
- return getBgColor(type, theme.palette);
12857
- }, [type, theme.palette]);
12858
- var color = React$1.useMemo(function () {
12859
- if (!type || type === 'default') return theme.palette.background;
12856
+ return getBgColor(color, theme.palette);
12857
+ }, [color, theme.palette]);
12858
+ var _color = React$1.useMemo(function () {
12859
+ if (!color || color === 'default') return theme.palette.background;
12860
12860
  return 'white';
12861
- }, [type, theme.palette.background]);
12861
+ }, [color, theme.palette.background]);
12862
12862
  var classes = useClasses('badge', {
12863
12863
  dot: dot
12864
12864
  }, className);
12865
12865
  return /*#__PURE__*/React$1.createElement("span", _extends({}, props, {
12866
- className: _JSXStyle.dynamic([["427831233", [bg, color, SCALES.font(0.875), SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0.25), SCALES.pr(0.4375), SCALES.pb(0.25), SCALES.pl(0.4375), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), SCALES.py(0.25), SCALES.px(0.25)]]]) + " " + (props && props.className != null && props.className || classes || "")
12866
+ className: _JSXStyle.dynamic([["1238256810", [bg, _color, SCALES.font(0.875), SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0.25), SCALES.pr(0.4375), SCALES.pb(0.25), SCALES.pl(0.4375), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), SCALES.py(0.25), SCALES.px(0.25)]]]) + " " + (props && props.className != null && props.className || classes || "")
12867
12867
  }), !dot && children, /*#__PURE__*/React$1.createElement(_JSXStyle, {
12868
- id: "427831233",
12869
- dynamic: [bg, color, SCALES.font(0.875), SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0.25), SCALES.pr(0.4375), SCALES.pb(0.25), SCALES.pl(0.4375), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), SCALES.py(0.25), SCALES.px(0.25)]
12870
- }, ".badge.__jsx-style-dynamic-selector{display:inline-block;border-radius:16px;font-variant:tabular-nums;line-height:1;vertical-align:middle;background-color:".concat(bg, ";color:").concat(color, ";border:0;font-size:").concat(SCALES.font(0.875), ";width:").concat(SCALES.width(1, 'auto'), ";height:").concat(SCALES.height(1, 'auto'), ";padding:").concat(SCALES.pt(0.25), " ").concat(SCALES.pr(0.4375), " ").concat(SCALES.pb(0.25), " ").concat(SCALES.pl(0.4375), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}.dot.__jsx-style-dynamic-selector{padding:").concat(SCALES.py(0.25), " ").concat(SCALES.px(0.25), ";border-radius:50%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}")));
12868
+ id: "1238256810",
12869
+ dynamic: [bg, _color, SCALES.font(0.875), SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0.25), SCALES.pr(0.4375), SCALES.pb(0.25), SCALES.pl(0.4375), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), SCALES.py(0.25), SCALES.px(0.25)]
12870
+ }, ".badge.__jsx-style-dynamic-selector{display:inline-block;border-radius:16px;font-variant:tabular-nums;line-height:1;vertical-align:middle;background-color:".concat(bg, ";color:").concat(_color, ";border:0;font-size:").concat(SCALES.font(0.875), ";width:").concat(SCALES.width(1, 'auto'), ";height:").concat(SCALES.height(1, 'auto'), ";padding:").concat(SCALES.pt(0.25), " ").concat(SCALES.pr(0.4375), " ").concat(SCALES.pb(0.25), " ").concat(SCALES.pl(0.4375), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}.dot.__jsx-style-dynamic-selector{padding:").concat(SCALES.py(0.25), " ").concat(SCALES.px(0.25), ";border-radius:50%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}")));
12871
12871
  };
12872
12872
  BadgeComponent.displayName = 'Badge';
12873
12873
  var Badge = withScale(BadgeComponent);
@@ -43737,8 +43737,8 @@ var _ = /*@__PURE__*/getDefaultExportFromCjs(lodashExports);
43737
43737
  function Empty() {
43738
43738
  return /*#__PURE__*/React$1.createElement("svg", {
43739
43739
  xmlns: "http://www.w3.org/2000/svg",
43740
- width: "20em",
43741
- height: "20em",
43740
+ width: "10em",
43741
+ height: "10em",
43742
43742
  "data-name": "Layer 1",
43743
43743
  viewBox: "0 0 1009.54 789.93"
43744
43744
  }, /*#__PURE__*/React$1.createElement("defs", null, /*#__PURE__*/React$1.createElement("linearGradient", {
@@ -44527,6 +44527,12 @@ function DataTable(_ref) {
44527
44527
  // }}>Apply</Button></Popover.Item></>
44528
44528
  // )
44529
44529
 
44530
+ var SELECTED = React$1.useMemo(function () {
44531
+ if (selected.length > 0 && onSelected) {
44532
+ return onSelected(selected);
44533
+ }
44534
+ return /*#__PURE__*/React$1.createElement(React$1.Fragment, null);
44535
+ }, [selected]);
44530
44536
  return /*#__PURE__*/React$1.createElement(GridContainer, {
44531
44537
  className: "helpdice-ui-data-table-container",
44532
44538
  direction: "column"
@@ -44563,7 +44569,7 @@ function DataTable(_ref) {
44563
44569
  },
44564
44570
  justify: "flex-end",
44565
44571
  alignContent: "center"
44566
- }, menu, !children && !readOnly ? /*#__PURE__*/React$1.createElement(React$1.Fragment, null, selected.length > 0 && onSelected ? onSelected(selected) : null, onSelectedEdit && selected.length === 1 ? /*#__PURE__*/React$1.createElement(Tooltip, {
44572
+ }, menu, !children && !readOnly ? /*#__PURE__*/React$1.createElement(React$1.Fragment, null, SELECTED, onSelectedEdit && selected.length === 1 ? /*#__PURE__*/React$1.createElement(Tooltip, {
44567
44573
  text: "Edit Selected",
44568
44574
  placement: "bottom",
44569
44575
  font: 0.8,
@@ -44728,6 +44734,7 @@ var TableBody = function TableBody(_ref) {
44728
44734
  onRow = _ref.onRow,
44729
44735
  onCell = _ref.onCell,
44730
44736
  rowClassName = _ref.rowClassName,
44737
+ textPlaceholder = _ref.textPlaceholder,
44731
44738
  _ref$rowDraggable = _ref.rowDraggable,
44732
44739
  rowDraggable = _ref$rowDraggable === void 0 ? false : _ref$rowDraggable,
44733
44740
  _ref$readOnly = _ref.readOnly,
@@ -44775,10 +44782,11 @@ var TableBody = function TableBody(_ref) {
44775
44782
  // };
44776
44783
 
44777
44784
  // Push Selected Rows
44778
- // useEffect(() => {
44785
+ // const SELECTED = useMemo(() => {
44779
44786
  // if (selected.length > 0 && onSelected) {
44780
- // onSelected(selected);
44787
+ // return onSelected(selected);
44781
44788
  // }
44789
+ // return <></>;
44782
44790
  // }, [selected]);
44783
44791
 
44784
44792
  function renderRow(cols, row, index) {
@@ -44833,7 +44841,7 @@ var TableBody = function TableBody(_ref) {
44833
44841
  return /*#__PURE__*/React$1.createElement("tbody", null, /*#__PURE__*/React$1.createElement("tr", null, /*#__PURE__*/React$1.createElement("td", {
44834
44842
  colSpan: columns === null || columns === void 0 ? void 0 : columns.length
44835
44843
  }, /*#__PURE__*/React$1.createElement("div", null, /*#__PURE__*/React$1.createElement(Placeholder, {
44836
- empty: true,
44844
+ empty: !textPlaceholder,
44837
44845
  msg: "No Entries Found"
44838
44846
  })))));
44839
44847
  }
@@ -44939,7 +44947,7 @@ var TableColumn = function TableColumn(columnProps) {
44939
44947
  };
44940
44948
  TableColumn.displayName = 'TableColumn';
44941
44949
 
44942
- var _excluded$9 = ["children", "data", "initialData", "hover", "emptyText", "rowDraggable", "readOnly", "cursorPagination", "previousCursor", "nextCursor", "hasMore", "onNextPage", "onPreviousPage", "onRow", "onCell", "onChange", "onFilters", "onPageChange", "showFilters", "stickyHeader", "onSelected", "dataLength", "viewLength", "className", "rowClassName"];
44950
+ var _excluded$9 = ["children", "data", "initialData", "hover", "emptyText", "rowDraggable", "readOnly", "cursorPagination", "previousCursor", "nextCursor", "hasMore", "onNextPage", "onPreviousPage", "onRow", "onCell", "onChange", "onFilters", "onPageChange", "showFilters", "stickyHeader", "textPlaceholder", "onSelected", "dataLength", "viewLength", "className", "rowClassName"];
44943
44951
  function TableComponent(tableProps) {
44944
44952
  /* eslint-disable @typescript-eslint/no-unused-vars */
44945
44953
  var _ref = tableProps,
@@ -44971,6 +44979,8 @@ function TableComponent(tableProps) {
44971
44979
  showFilters = _ref$showFilters === void 0 ? false : _ref$showFilters,
44972
44980
  _ref$stickyHeader = _ref.stickyHeader,
44973
44981
  stickyHeader = _ref$stickyHeader === void 0 ? false : _ref$stickyHeader,
44982
+ _ref$textPlaceholder = _ref.textPlaceholder,
44983
+ textPlaceholder = _ref$textPlaceholder === void 0 ? false : _ref$textPlaceholder,
44974
44984
  onSelected = _ref.onSelected,
44975
44985
  dataLength = _ref.dataLength,
44976
44986
  viewLength = _ref.viewLength,
@@ -45050,6 +45060,7 @@ function TableComponent(tableProps) {
45050
45060
  emptyText: emptyText,
45051
45061
  onRow: onRow,
45052
45062
  onCell: onCell,
45063
+ textPlaceholder: textPlaceholder,
45053
45064
  rowClassName: rowClassName,
45054
45065
  rowDraggable: rowDraggable,
45055
45066
  readOnly: readOnly,
package/dist/table/index.js CHANGED
@@ -20068,8 +20068,8 @@ var _ = /*@__PURE__*/getDefaultExportFromCjs(lodashExports);
20068
20068
  function Empty() {
20069
20069
  return /*#__PURE__*/React.createElement("svg", {
20070
20070
  xmlns: "http://www.w3.org/2000/svg",
20071
- width: "20em",
20072
- height: "20em",
20071
+ width: "10em",
20072
+ height: "10em",
20073
20073
  "data-name": "Layer 1",
20074
20074
  viewBox: "0 0 1009.54 789.93"
20075
20075
  }, /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
@@ -31805,6 +31805,12 @@ function DataTable(_ref) {
31805
31805
  // }}>Apply</Button></Popover.Item></>
31806
31806
  // )
31807
31807
 
31808
+ var SELECTED = React.useMemo(function () {
31809
+ if (selected.length > 0 && onSelected) {
31810
+ return onSelected(selected);
31811
+ }
31812
+ return /*#__PURE__*/React.createElement(React.Fragment, null);
31813
+ }, [selected]);
31808
31814
  return /*#__PURE__*/React.createElement(GridContainer, {
31809
31815
  className: "helpdice-ui-data-table-container",
31810
31816
  direction: "column"
@@ -31841,7 +31847,7 @@ function DataTable(_ref) {
31841
31847
  },
31842
31848
  justify: "flex-end",
31843
31849
  alignContent: "center"
31844
- }, menu, !children && !readOnly ? /*#__PURE__*/React.createElement(React.Fragment, null, selected.length > 0 && onSelected ? onSelected(selected) : null, onSelectedEdit && selected.length === 1 ? /*#__PURE__*/React.createElement(Tooltip, {
31850
+ }, menu, !children && !readOnly ? /*#__PURE__*/React.createElement(React.Fragment, null, SELECTED, onSelectedEdit && selected.length === 1 ? /*#__PURE__*/React.createElement(Tooltip, {
31845
31851
  text: "Edit Selected",
31846
31852
  placement: "bottom",
31847
31853
  font: 0.8,
@@ -32006,6 +32012,7 @@ var TableBody = function TableBody(_ref) {
32006
32012
  onRow = _ref.onRow,
32007
32013
  onCell = _ref.onCell,
32008
32014
  rowClassName = _ref.rowClassName,
32015
+ textPlaceholder = _ref.textPlaceholder,
32009
32016
  _ref$rowDraggable = _ref.rowDraggable,
32010
32017
  rowDraggable = _ref$rowDraggable === void 0 ? false : _ref$rowDraggable,
32011
32018
  _ref$readOnly = _ref.readOnly,
@@ -32053,10 +32060,11 @@ var TableBody = function TableBody(_ref) {
32053
32060
  // };
32054
32061
 
32055
32062
  // Push Selected Rows
32056
- // useEffect(() => {
32063
+ // const SELECTED = useMemo(() => {
32057
32064
  // if (selected.length > 0 && onSelected) {
32058
- // onSelected(selected);
32065
+ // return onSelected(selected);
32059
32066
  // }
32067
+ // return <></>;
32060
32068
  // }, [selected]);
32061
32069
 
32062
32070
  function renderRow(cols, row, index) {
@@ -32111,7 +32119,7 @@ var TableBody = function TableBody(_ref) {
32111
32119
  return /*#__PURE__*/React.createElement("tbody", null, /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", {
32112
32120
  colSpan: columns === null || columns === void 0 ? void 0 : columns.length
32113
32121
  }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Placeholder, {
32114
- empty: true,
32122
+ empty: !textPlaceholder,
32115
32123
  msg: "No Entries Found"
32116
32124
  })))));
32117
32125
  }
@@ -32567,7 +32575,7 @@ var Pagination = withScale(PaginationComponent);
32567
32575
  Pagination.Previous = PaginationPrevious;
32568
32576
  Pagination.Next = PaginationNext;
32569
32577
 
32570
- var _excluded = ["children", "data", "initialData", "hover", "emptyText", "rowDraggable", "readOnly", "cursorPagination", "previousCursor", "nextCursor", "hasMore", "onNextPage", "onPreviousPage", "onRow", "onCell", "onChange", "onFilters", "onPageChange", "showFilters", "stickyHeader", "onSelected", "dataLength", "viewLength", "className", "rowClassName"];
32578
+ var _excluded = ["children", "data", "initialData", "hover", "emptyText", "rowDraggable", "readOnly", "cursorPagination", "previousCursor", "nextCursor", "hasMore", "onNextPage", "onPreviousPage", "onRow", "onCell", "onChange", "onFilters", "onPageChange", "showFilters", "stickyHeader", "textPlaceholder", "onSelected", "dataLength", "viewLength", "className", "rowClassName"];
32571
32579
  function TableComponent(tableProps) {
32572
32580
  /* eslint-disable @typescript-eslint/no-unused-vars */
32573
32581
  var _ref = tableProps,
@@ -32599,6 +32607,8 @@ function TableComponent(tableProps) {
32599
32607
  showFilters = _ref$showFilters === void 0 ? false : _ref$showFilters,
32600
32608
  _ref$stickyHeader = _ref.stickyHeader,
32601
32609
  stickyHeader = _ref$stickyHeader === void 0 ? false : _ref$stickyHeader,
32610
+ _ref$textPlaceholder = _ref.textPlaceholder,
32611
+ textPlaceholder = _ref$textPlaceholder === void 0 ? false : _ref$textPlaceholder,
32602
32612
  onSelected = _ref.onSelected,
32603
32613
  dataLength = _ref.dataLength,
32604
32614
  viewLength = _ref.viewLength,
@@ -32678,6 +32688,7 @@ function TableComponent(tableProps) {
32678
32688
  emptyText: emptyText,
32679
32689
  onRow: onRow,
32680
32690
  onCell: onCell,
32691
+ textPlaceholder: textPlaceholder,
32681
32692
  rowClassName: rowClassName,
32682
32693
  rowDraggable: rowDraggable,
32683
32694
  readOnly: readOnly,
package/dist/table/table-body.d.ts CHANGED
@@ -7,6 +7,7 @@ interface Props<TableDataItem extends TableDataItemBase> {
7
7
  onCell?: TableOnCellClick<TableDataItem>;
8
8
  data: Array<TableDataItem>;
9
9
  className?: string;
10
+ textPlaceholder?: boolean;
10
11
  rowClassName: TableRowClassNameHandler<TableDataItem>;
11
12
  rowDraggable?: boolean;
12
13
  readOnly?: boolean;
@@ -15,7 +16,7 @@ interface Props<TableDataItem extends TableDataItemBase> {
15
16
  type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props<any>>;
16
17
  export type TableBodyProps<TableDataItem extends TableDataItemBase> = Props<TableDataItem> & NativeAttrs;
17
18
  declare const TableBody: {
18
- <TableDataItem extends TableDataItemBase>({ data, emptyText, onRow, onCell, rowClassName, rowDraggable, readOnly, onSelected }: TableBodyProps<TableDataItem>): React.JSX.Element;
19
+ <TableDataItem extends TableDataItemBase>({ data, emptyText, onRow, onCell, rowClassName, textPlaceholder, rowDraggable, readOnly, onSelected }: TableBodyProps<TableDataItem>): React.JSX.Element;
19
20
  displayName: string;
20
21
  };
21
22
  export default TableBody;
package/dist/table/table.d.ts CHANGED
@@ -17,6 +17,7 @@ interface Props<TableDataItem extends TableDataItemBase> {
17
17
  readOnly?: boolean;
18
18
  showFilters?: boolean;
19
19
  stickyHeader?: boolean;
20
+ textPlaceholder?: boolean;
20
21
  dataLength?: number;
21
22
  viewLength?: number;
22
23
  rowClassName?: TableRowClassNameHandler<TableDataItem>;
package/esm/Placeholder/empty.js CHANGED
@@ -2,8 +2,8 @@ import React from 'react';
2
2
  function Empty() {
3
3
  return /*#__PURE__*/React.createElement("svg", {
4
4
  xmlns: "http://www.w3.org/2000/svg",
5
- width: "20em",
6
- height: "20em",
5
+ width: "10em",
6
+ height: "10em",
7
7
  "data-name": "Layer 1",
8
8
  viewBox: "0 0 1009.54 789.93"
9
9
  }, /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
package/esm/badge/badge.d.ts CHANGED
@@ -2,7 +2,7 @@ import React from 'react';
2
2
  import { NormalTypes } from '../utils/prop-types';
3
3
  export type BadgeTypes = NormalTypes;
4
4
  interface Props {
5
- type?: BadgeTypes;
5
+ color?: BadgeTypes;
6
6
  dot?: boolean;
7
7
  className?: string;
8
8
  }
package/esm/badge/badge.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
3
- var _excluded = ["type", "className", "children", "dot"];
3
+ var _excluded = ["color", "className", "children", "dot"];
4
4
  import _JSXStyle from "../styled-jsx.es.js";
5
5
  /* "use client" */
6
6
 
@@ -19,8 +19,8 @@ var getBgColor = function getBgColor(type, palette) {
19
19
  return colors[type];
20
20
  };
21
21
  var BadgeComponent = function BadgeComponent(_ref) {
22
- var _ref$type = _ref.type,
23
- type = _ref$type === void 0 ? 'default' : _ref$type,
22
+ var _ref$color = _ref.color,
23
+ color = _ref$color === void 0 ? 'default' : _ref$color,
24
24
  _ref$className = _ref.className,
25
25
  className = _ref$className === void 0 ? '' : _ref$className,
26
26
  children = _ref.children,
@@ -31,21 +31,21 @@ var BadgeComponent = function BadgeComponent(_ref) {
31
31
  var _useScale = useScale(),
32
32
  SCALES = _useScale.SCALES;
33
33
  var bg = useMemo(function () {
34
- return getBgColor(type, theme.palette);
35
- }, [type, theme.palette]);
36
- var color = useMemo(function () {
37
- if (!type || type === 'default') return theme.palette.background;
34
+ return getBgColor(color, theme.palette);
35
+ }, [color, theme.palette]);
36
+ var _color = useMemo(function () {
37
+ if (!color || color === 'default') return theme.palette.background;
38
38
  return 'white';
39
- }, [type, theme.palette.background]);
39
+ }, [color, theme.palette.background]);
40
40
  var classes = useClasses('badge', {
41
41
  dot: dot
42
42
  }, className);
43
43
  return /*#__PURE__*/React.createElement("span", _extends({}, props, {
44
- className: _JSXStyle.dynamic([["427831233", [bg, color, SCALES.font(0.875), SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0.25), SCALES.pr(0.4375), SCALES.pb(0.25), SCALES.pl(0.4375), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), SCALES.py(0.25), SCALES.px(0.25)]]]) + " " + (props && props.className != null && props.className || classes || "")
44
+ className: _JSXStyle.dynamic([["1238256810", [bg, _color, SCALES.font(0.875), SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0.25), SCALES.pr(0.4375), SCALES.pb(0.25), SCALES.pl(0.4375), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), SCALES.py(0.25), SCALES.px(0.25)]]]) + " " + (props && props.className != null && props.className || classes || "")
45
45
  }), !dot && children, /*#__PURE__*/React.createElement(_JSXStyle, {
46
- id: "427831233",
47
- dynamic: [bg, color, SCALES.font(0.875), SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0.25), SCALES.pr(0.4375), SCALES.pb(0.25), SCALES.pl(0.4375), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), SCALES.py(0.25), SCALES.px(0.25)]
48
- }, ".badge.__jsx-style-dynamic-selector{display:inline-block;border-radius:16px;font-variant:tabular-nums;line-height:1;vertical-align:middle;background-color:".concat(bg, ";color:").concat(color, ";border:0;font-size:").concat(SCALES.font(0.875), ";width:").concat(SCALES.width(1, 'auto'), ";height:").concat(SCALES.height(1, 'auto'), ";padding:").concat(SCALES.pt(0.25), " ").concat(SCALES.pr(0.4375), " ").concat(SCALES.pb(0.25), " ").concat(SCALES.pl(0.4375), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}.dot.__jsx-style-dynamic-selector{padding:").concat(SCALES.py(0.25), " ").concat(SCALES.px(0.25), ";border-radius:50%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}")));
46
+ id: "1238256810",
47
+ dynamic: [bg, _color, SCALES.font(0.875), SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0.25), SCALES.pr(0.4375), SCALES.pb(0.25), SCALES.pl(0.4375), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), SCALES.py(0.25), SCALES.px(0.25)]
48
+ }, ".badge.__jsx-style-dynamic-selector{display:inline-block;border-radius:16px;font-variant:tabular-nums;line-height:1;vertical-align:middle;background-color:".concat(bg, ";color:").concat(_color, ";border:0;font-size:").concat(SCALES.font(0.875), ";width:").concat(SCALES.width(1, 'auto'), ";height:").concat(SCALES.height(1, 'auto'), ";padding:").concat(SCALES.pt(0.25), " ").concat(SCALES.pr(0.4375), " ").concat(SCALES.pb(0.25), " ").concat(SCALES.pl(0.4375), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}.dot.__jsx-style-dynamic-selector{padding:").concat(SCALES.py(0.25), " ").concat(SCALES.px(0.25), ";border-radius:50%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}")));
49
49
  };
50
50
  BadgeComponent.displayName = 'Badge';
51
51
  var Badge = withScale(BadgeComponent);
package/esm/table/data-table.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
3
- import React, { memo, useEffect, useState } from 'react';
3
+ import React, { memo, useEffect, useMemo, useState } from 'react';
4
4
  // import { useDebounce } from 'use-debounce';
5
5
  import { ArrowLeft, Columns, Delete, Edit, Filters, Refresh } from '@helpdice/icons';
6
6
  // import InfiniteScroll from 'react-infinite-scroll-component';
@@ -253,6 +253,12 @@ function DataTable(_ref) {
253
253
  // }}>Apply</Button></Popover.Item></>
254
254
  // )
255
255
 
256
+ var SELECTED = useMemo(function () {
257
+ if (selected.length > 0 && onSelected) {
258
+ return onSelected(selected);
259
+ }
260
+ return /*#__PURE__*/React.createElement(React.Fragment, null);
261
+ }, [selected]);
256
262
  return /*#__PURE__*/React.createElement(Container, {
257
263
  className: "helpdice-ui-data-table-container",
258
264
  direction: "column"
@@ -289,7 +295,7 @@ function DataTable(_ref) {
289
295
  },
290
296
  justify: "flex-end",
291
297
  alignContent: "center"
292
- }, menu, !children && !readOnly ? /*#__PURE__*/React.createElement(React.Fragment, null, selected.length > 0 && onSelected ? onSelected(selected) : null, onSelectedEdit && selected.length === 1 ? /*#__PURE__*/React.createElement(Tooltip, {
298
+ }, menu, !children && !readOnly ? /*#__PURE__*/React.createElement(React.Fragment, null, SELECTED, onSelectedEdit && selected.length === 1 ? /*#__PURE__*/React.createElement(Tooltip, {
293
299
  text: "Edit Selected",
294
300
  placement: "bottom",
295
301
  font: 0.8,
package/esm/table/table-body.d.ts CHANGED
@@ -7,6 +7,7 @@ interface Props<TableDataItem extends TableDataItemBase> {
7
7
  onCell?: TableOnCellClick<TableDataItem>;
8
8
  data: Array<TableDataItem>;
9
9
  className?: string;
10
+ textPlaceholder?: boolean;
10
11
  rowClassName: TableRowClassNameHandler<TableDataItem>;
11
12
  rowDraggable?: boolean;
12
13
  readOnly?: boolean;
@@ -15,7 +16,7 @@ interface Props<TableDataItem extends TableDataItemBase> {
15
16
  type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props<any>>;
16
17
  export type TableBodyProps<TableDataItem extends TableDataItemBase> = Props<TableDataItem> & NativeAttrs;
17
18
  declare const TableBody: {
18
- <TableDataItem extends TableDataItemBase>({ data, emptyText, onRow, onCell, rowClassName, rowDraggable, readOnly, onSelected }: TableBodyProps<TableDataItem>): React.JSX.Element;
19
+ <TableDataItem extends TableDataItemBase>({ data, emptyText, onRow, onCell, rowClassName, textPlaceholder, rowDraggable, readOnly, onSelected }: TableBodyProps<TableDataItem>): React.JSX.Element;
19
20
  displayName: string;
20
21
  };
21
22
  export default TableBody;
package/esm/table/table-body.js CHANGED
@@ -15,6 +15,7 @@ var TableBody = function TableBody(_ref) {
15
15
  onRow = _ref.onRow,
16
16
  onCell = _ref.onCell,
17
17
  rowClassName = _ref.rowClassName,
18
+ textPlaceholder = _ref.textPlaceholder,
18
19
  _ref$rowDraggable = _ref.rowDraggable,
19
20
  rowDraggable = _ref$rowDraggable === void 0 ? false : _ref$rowDraggable,
20
21
  _ref$readOnly = _ref.readOnly,
@@ -62,10 +63,11 @@ var TableBody = function TableBody(_ref) {
62
63
  // };
63
64
 
64
65
  // Push Selected Rows
65
- // useEffect(() => {
66
+ // const SELECTED = useMemo(() => {
66
67
  // if (selected.length > 0 && onSelected) {
67
- // onSelected(selected);
68
+ // return onSelected(selected);
68
69
  // }
70
+ // return <></>;
69
71
  // }, [selected]);
70
72
 
71
73
  function renderRow(cols, row, index) {
@@ -120,7 +122,7 @@ var TableBody = function TableBody(_ref) {
120
122
  return /*#__PURE__*/React.createElement("tbody", null, /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", {
121
123
  colSpan: columns === null || columns === void 0 ? void 0 : columns.length
122
124
  }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Placeholder, {
123
- empty: true,
125
+ empty: !textPlaceholder,
124
126
  msg: "No Entries Found"
125
127
  })))));
126
128
  }
package/esm/table/table.d.ts CHANGED
@@ -17,6 +17,7 @@ interface Props<TableDataItem extends TableDataItemBase> {
17
17
  readOnly?: boolean;
18
18
  showFilters?: boolean;
19
19
  stickyHeader?: boolean;
20
+ textPlaceholder?: boolean;
20
21
  dataLength?: number;
21
22
  viewLength?: number;
22
23
  rowClassName?: TableRowClassNameHandler<TableDataItem>;
package/esm/table/table.js CHANGED
@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
3
3
  import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
4
4
  import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
5
- var _excluded = ["children", "data", "initialData", "hover", "emptyText", "rowDraggable", "readOnly", "cursorPagination", "previousCursor", "nextCursor", "hasMore", "onNextPage", "onPreviousPage", "onRow", "onCell", "onChange", "onFilters", "onPageChange", "showFilters", "stickyHeader", "onSelected", "dataLength", "viewLength", "className", "rowClassName"];
5
+ var _excluded = ["children", "data", "initialData", "hover", "emptyText", "rowDraggable", "readOnly", "cursorPagination", "previousCursor", "nextCursor", "hasMore", "onNextPage", "onPreviousPage", "onRow", "onCell", "onChange", "onFilters", "onPageChange", "showFilters", "stickyHeader", "textPlaceholder", "onSelected", "dataLength", "viewLength", "className", "rowClassName"];
6
6
  import _JSXStyle from "../styled-jsx.es.js";
7
7
  /* "use client" */
8
8
 
@@ -50,6 +50,8 @@ function TableComponent(tableProps) {
50
50
  showFilters = _ref$showFilters === void 0 ? false : _ref$showFilters,
51
51
  _ref$stickyHeader = _ref.stickyHeader,
52
52
  stickyHeader = _ref$stickyHeader === void 0 ? false : _ref$stickyHeader,
53
+ _ref$textPlaceholder = _ref.textPlaceholder,
54
+ textPlaceholder = _ref$textPlaceholder === void 0 ? false : _ref$textPlaceholder,
53
55
  onSelected = _ref.onSelected,
54
56
  dataLength = _ref.dataLength,
55
57
  viewLength = _ref.viewLength,
@@ -129,6 +131,7 @@ function TableComponent(tableProps) {
129
131
  emptyText: emptyText,
130
132
  onRow: onRow,
131
133
  onCell: onCell,
134
+ textPlaceholder: textPlaceholder,
132
135
  rowClassName: rowClassName,
133
136
  rowDraggable: rowDraggable,
134
137
  readOnly: readOnly,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@helpdice/ui",
3
- "version": "1.6.3",
3
+ "version": "1.6.5",
4
4
  "main": "dist/index.js",
5
5
  "types": "esm/index.d.ts",
6
6
  "unpkg": "dist/index.min.js",