@helpdice/ui 2.5.4 → 2.5.8-beta.0

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 (45) hide show
  1. package/dist/auto-complete/index.js +913 -102
  2. package/dist/avatar/index.js +11 -9
  3. package/dist/button/button.icon.d.ts +0 -1
  4. package/dist/button/button.small.d.ts +0 -1
  5. package/dist/button/index.js +7 -9
  6. package/dist/carousal/index.js +7 -9
  7. package/dist/container/index.js +7 -9
  8. package/dist/copy-to-clipboard/index.js +7 -9
  9. package/dist/index.js +3046 -2989
  10. package/dist/input/index.js +906 -47
  11. package/dist/modal/index.js +5 -5
  12. package/dist/pagination/index.js +6 -6
  13. package/dist/placeholder/index.js +16 -11
  14. package/dist/select/index.js +912 -14
  15. package/dist/select/select.d.ts +2 -0
  16. package/dist/table/index.js +21623 -21568
  17. package/dist/table/table-body.d.ts +1 -2
  18. package/dist/table/table.d.ts +1 -0
  19. package/dist/text/index.js +16 -11
  20. package/dist/text/text.d.ts +3 -0
  21. package/dist/textarea/index.js +881 -7
  22. package/dist/textarea/textarea.d.ts +3 -0
  23. package/dist/tooltip/index.js +0 -1
  24. package/dist/tooltip/tooltip-small.d.ts +2 -5
  25. package/dist/user/index.js +11 -9
  26. package/esm/avatar/avatar.js +8 -6
  27. package/esm/button/button.icon.d.ts +0 -1
  28. package/esm/button/button.js +5 -5
  29. package/esm/button/button.small.d.ts +0 -1
  30. package/esm/button/button.small.js +2 -4
  31. package/esm/input/input-field.js +11 -9
  32. package/esm/pagination/pagination-item.js +6 -6
  33. package/esm/select/select.d.ts +2 -0
  34. package/esm/select/select.js +15 -2
  35. package/esm/table/table-body.d.ts +1 -2
  36. package/esm/table/table-body.js +16 -11
  37. package/esm/table/table.d.ts +1 -0
  38. package/esm/table/table.js +45 -25
  39. package/esm/text/text.d.ts +3 -0
  40. package/esm/text/text.js +9 -2
  41. package/esm/textarea/textarea.d.ts +3 -0
  42. package/esm/textarea/textarea.js +19 -2
  43. package/esm/tooltip/tooltip-small.d.ts +2 -5
  44. package/esm/tooltip/tooltip-small.js +0 -1
  45. package/package.json +2 -2
@@ -7,7 +7,6 @@ interface Props<TableDataItem extends TableDataItemBase> {
7
7
  onCell?: TableOnCellClick<TableDataItem>;
8
8
  data: Array<TableDataItem>;
9
9
  className?: string;
10
- textPlaceholder?: boolean;
11
10
  rowClassName: TableRowClassNameHandler<TableDataItem>;
12
11
  rowDraggable?: boolean;
13
12
  readOnly?: boolean;
@@ -16,7 +15,7 @@ interface Props<TableDataItem extends TableDataItemBase> {
16
15
  type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props<any>>;
17
16
  export type TableBodyProps<TableDataItem extends TableDataItemBase> = Props<TableDataItem> & NativeAttrs;
18
17
  declare const TableBody: {
19
- <TableDataItem extends TableDataItemBase>({ data, emptyText, onRow, onCell, rowClassName, textPlaceholder, rowDraggable, readOnly, onSelected }: TableBodyProps<TableDataItem>): React.JSX.Element;
18
+ <TableDataItem extends TableDataItemBase>({ data, emptyText, onRow, onCell, rowClassName, rowDraggable, readOnly, onSelected }: TableBodyProps<TableDataItem>): React.JSX.Element;
20
19
  displayName: string;
21
20
  };
22
21
  export default TableBody;
@@ -25,6 +25,7 @@ interface Props<TableDataItem extends TableDataItemBase> {
25
25
  previousCursor?: string;
26
26
  nextCursor?: string;
27
27
  hasMore?: boolean;
28
+ containerStyle?: object;
28
29
  onNextPage?: (next?: string) => void;
29
30
  onPreviousPage?: (prev?: string) => void;
30
31
  }
@@ -1528,7 +1528,7 @@ var ButtonComponent = /*#__PURE__*/React.forwardRef(function (btnProps, ref) {
1528
1528
  return /*#__PURE__*/React.createElement(React.Fragment, null, to ? /*#__PURE__*/React.createElement("a", _extends({
1529
1529
  href: to
1530
1530
  }, props, {
1531
- className: _JSXStyle.dynamic([["3965326317", [SCALES.height(2.5), round ? '50%' : theme$1.layout.radius, SCALES.font(0.875), color, bg, shadow ? 'transparent' : border, cursor, events, shadow ? btnShadow : 'none', SCALES.pl(0.727), SCALES.height(2.5), color, bg, auto ? 'min-content' : SCALES.width(10.5), auto ? 'auto' : 'initial', SCALES.height(2.5), SCALES.pt(0), paddingRight, SCALES.pb(0), paddingLeft, SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hover.color, hover.color, hover.bg, hover.border, cursor, events, btnShadow, shadow ? '-1px' : '0px']]]) + " " + (props && props.className != null && props.className || theme.useClasses('btn', 'btn-link', className) || "")
1531
+ className: _JSXStyle.dynamic([["331518307", [SCALES.height(2.5), round ? '50%' : theme$1.layout.radius, SCALES.font(0.875), color, bg, shadow ? 'transparent' : border, cursor !== null && cursor !== void 0 ? cursor : 'pointer', events, shadow ? btnShadow : 'none', SCALES.pl(0.727), SCALES.height(2.5), color, bg, auto ? 'min-content' : SCALES.width(10.5), auto ? 'auto' : 'initial', SCALES.height(2.5), SCALES.pt(0), paddingRight, SCALES.pb(0), paddingLeft, SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hover.color, hover.color, hover.bg, hover.border, cursor, events, btnShadow, shadow ? '-1px' : '0px']]]) + " " + (props && props.className != null && props.className || theme.useClasses('btn', 'btn-link', className) || "")
1532
1532
  }), loading && /*#__PURE__*/React.createElement(ButtonLoading, {
1533
1533
  color: color
1534
1534
  }), childrenWithIcon) : /*#__PURE__*/React.createElement("button", _extends({
@@ -1537,7 +1537,7 @@ var ButtonComponent = /*#__PURE__*/React.forwardRef(function (btnProps, ref) {
1537
1537
  disabled: disabled,
1538
1538
  onClick: clickHandler
1539
1539
  }, props, {
1540
- className: _JSXStyle.dynamic([["3965326317", [SCALES.height(2.5), round ? '50%' : theme$1.layout.radius, SCALES.font(0.875), color, bg, shadow ? 'transparent' : border, cursor, events, shadow ? btnShadow : 'none', SCALES.pl(0.727), SCALES.height(2.5), color, bg, auto ? 'min-content' : SCALES.width(10.5), auto ? 'auto' : 'initial', SCALES.height(2.5), SCALES.pt(0), paddingRight, SCALES.pb(0), paddingLeft, SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hover.color, hover.color, hover.bg, hover.border, cursor, events, btnShadow, shadow ? '-1px' : '0px']]]) + " " + (props && props.className != null && props.className || theme.useClasses('btn', className) || "")
1540
+ className: _JSXStyle.dynamic([["331518307", [SCALES.height(2.5), round ? '50%' : theme$1.layout.radius, SCALES.font(0.875), color, bg, shadow ? 'transparent' : border, cursor !== null && cursor !== void 0 ? cursor : 'pointer', events, shadow ? btnShadow : 'none', SCALES.pl(0.727), SCALES.height(2.5), color, bg, auto ? 'min-content' : SCALES.width(10.5), auto ? 'auto' : 'initial', SCALES.height(2.5), SCALES.pt(0), paddingRight, SCALES.pb(0), paddingLeft, SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hover.color, hover.color, hover.bg, hover.border, cursor, events, btnShadow, shadow ? '-1px' : '0px']]]) + " " + (props && props.className != null && props.className || theme.useClasses('btn', className) || "")
1541
1541
  }), loading && /*#__PURE__*/React.createElement(ButtonLoading, {
1542
1542
  color: color
1543
1543
  }), childrenWithIcon, dripShow && /*#__PURE__*/React.createElement(ButtonDrip, {
@@ -1546,9 +1546,9 @@ var ButtonComponent = /*#__PURE__*/React.forwardRef(function (btnProps, ref) {
1546
1546
  color: dripColor,
1547
1547
  onCompleted: dripCompletedHandle
1548
1548
  })), /*#__PURE__*/React.createElement(_JSXStyle, {
1549
- id: "3965326317",
1550
- dynamic: [SCALES.height(2.5), round ? '50%' : theme$1.layout.radius, SCALES.font(0.875), color, bg, shadow ? 'transparent' : border, cursor, events, shadow ? btnShadow : 'none', SCALES.pl(0.727), SCALES.height(2.5), color, bg, auto ? 'min-content' : SCALES.width(10.5), auto ? 'auto' : 'initial', SCALES.height(2.5), SCALES.pt(0), paddingRight, SCALES.pb(0), paddingLeft, SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hover.color, hover.color, hover.bg, hover.border, cursor, events, btnShadow, shadow ? '-1px' : '0px']
1551
- }, ".btn.__jsx-style-dynamic-selector{box-sizing:border-box;display:inline-block;line-height:".concat(SCALES.height(2.5), ";border-radius:").concat(round ? '50%' : theme$1.layout.radius, ";font-weight:400;font-size:").concat(SCALES.font(0.875), ";-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;outline:none;text-transform:capitalize;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;text-align:center;white-space:nowrap;-webkit-transition:background-color 200ms ease 0ms,box-shadow 200ms ease 0ms, border 200ms ease 0ms,color 200ms ease 0ms;transition:background-color 200ms ease 0ms,box-shadow 200ms ease 0ms, border 200ms ease 0ms,color 200ms ease 0ms;position:relative;overflow:hidden;color:").concat(color, ";background-color:").concat(bg, ";border:1px solid ").concat(shadow ? 'transparent' : border, ";cursor:").concat(cursor, ";pointer-events:").concat(events, ";box-shadow:").concat(shadow ? btnShadow : 'none', ";--helpdice-ui-button-icon-padding:").concat(SCALES.pl(0.727), ";--helpdice-ui-button-height:").concat(SCALES.height(2.5), ";--helpdice-ui-button-color:").concat(color, ";--helpdice-ui-button-bg:").concat(bg, ";min-width:").concat(auto ? 'min-content' : SCALES.width(10.5), ";width:").concat(auto ? 'auto' : 'initial', ";height:").concat(SCALES.height(2.5), ";padding:").concat(SCALES.pt(0), " ").concat(paddingRight, " ").concat(SCALES.pb(0), " ").concat(paddingLeft, ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}.btn.__jsx-style-dynamic-selector:hover,.btn.__jsx-style-dynamic-selector:focus{color:").concat(hover.color, ";--helpdice-ui-button-color:").concat(hover.color, ";background-color:").concat(hover.bg, ";border-color:").concat(hover.border, ";cursor:").concat(cursor, ";pointer-events:").concat(events, ";box-shadow:").concat(btnShadow, ";}.btn-link.__jsx-style-dynamic-selector{display:-webkit-box !important;display:-webkit-flex !important;display:-ms-flexbox !important;display:flex !important;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}.btn.__jsx-style-dynamic-selector .text{position:relative;z-index:1;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;text-align:center;line-height:inherit;top:-1px;}.btn.__jsx-style-dynamic-selector .text p,.btn.__jsx-style-dynamic-selector .text pre,.btn.__jsx-style-dynamic-selector .text div{margin:0;}.ripple.__jsx-style-dynamic-selector{position:absolute;border-radius:50%;-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0);-webkit-animation:ripple-animation-__jsx-style-dynamic-selector 600ms ease-out;animation:ripple-animation-__jsx-style-dynamic-selector 600ms ease-out;background-color:rgba(0,0,0,0.3);pointer-events:none;z-index:1;}@-webkit-keyframes ripple-animation-__jsx-style-dynamic-selector{to{-webkit-transform:scale(2.5);-ms-transform:scale(2.5);transform:scale(2.5);opacity:0;}}@keyframes ripple-animation-__jsx-style-dynamic-selector{to{-webkit-transform:scale(2.5);-ms-transform:scale(2.5);transform:scale(2.5);opacity:0;}}")));
1549
+ id: "331518307",
1550
+ dynamic: [SCALES.height(2.5), round ? '50%' : theme$1.layout.radius, SCALES.font(0.875), color, bg, shadow ? 'transparent' : border, cursor !== null && cursor !== void 0 ? cursor : 'pointer', events, shadow ? btnShadow : 'none', SCALES.pl(0.727), SCALES.height(2.5), color, bg, auto ? 'min-content' : SCALES.width(10.5), auto ? 'auto' : 'initial', SCALES.height(2.5), SCALES.pt(0), paddingRight, SCALES.pb(0), paddingLeft, SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hover.color, hover.color, hover.bg, hover.border, cursor, events, btnShadow, shadow ? '-1px' : '0px']
1551
+ }, ".btn.__jsx-style-dynamic-selector{box-sizing:border-box;display:inline-block;line-height:".concat(SCALES.height(2.5), ";border-radius:").concat(round ? '50%' : theme$1.layout.radius, ";font-weight:400;font-size:").concat(SCALES.font(0.875), ";-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;outline:none;text-transform:capitalize;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;text-align:center;white-space:nowrap;-webkit-transition:background-color 200ms ease 0ms,box-shadow 200ms ease 0ms, border 200ms ease 0ms,color 200ms ease 0ms;transition:background-color 200ms ease 0ms,box-shadow 200ms ease 0ms, border 200ms ease 0ms,color 200ms ease 0ms;position:relative;overflow:hidden;color:").concat(color, ";background-color:").concat(bg, ";border:1px solid ").concat(shadow ? 'transparent' : border, ";cursor:").concat(cursor !== null && cursor !== void 0 ? cursor : 'pointer', ";pointer-events:").concat(events, ";box-shadow:").concat(shadow ? btnShadow : 'none', ";--helpdice-ui-button-icon-padding:").concat(SCALES.pl(0.727), ";--helpdice-ui-button-height:").concat(SCALES.height(2.5), ";--helpdice-ui-button-color:").concat(color, ";--helpdice-ui-button-bg:").concat(bg, ";min-width:").concat(auto ? 'min-content' : SCALES.width(10.5), ";width:").concat(auto ? 'auto' : 'initial', ";height:").concat(SCALES.height(2.5), ";padding:").concat(SCALES.pt(0), " ").concat(paddingRight, " ").concat(SCALES.pb(0), " ").concat(paddingLeft, ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}.btn.__jsx-style-dynamic-selector:hover,.btn.__jsx-style-dynamic-selector:focus{color:").concat(hover.color, ";--helpdice-ui-button-color:").concat(hover.color, ";background-color:").concat(hover.bg, ";border-color:").concat(hover.border, ";cursor:").concat(cursor, ";pointer-events:").concat(events, ";box-shadow:").concat(btnShadow, ";}.btn-link.__jsx-style-dynamic-selector{display:-webkit-box !important;display:-webkit-flex !important;display:-ms-flexbox !important;display:flex !important;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}.btn.__jsx-style-dynamic-selector .text{position:relative;z-index:1;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;text-align:center;line-height:inherit;top:-1px;}.btn.__jsx-style-dynamic-selector .text p,.btn.__jsx-style-dynamic-selector .text pre,.btn.__jsx-style-dynamic-selector .text div{margin:0;}.ripple.__jsx-style-dynamic-selector{position:absolute;border-radius:50%;-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0);-webkit-animation:ripple-animation-__jsx-style-dynamic-selector 600ms ease-out;animation:ripple-animation-__jsx-style-dynamic-selector 600ms ease-out;background-color:rgba(0,0,0,0.3);pointer-events:none;z-index:1;}@-webkit-keyframes ripple-animation-__jsx-style-dynamic-selector{to{-webkit-transform:scale(2.5);-ms-transform:scale(2.5);transform:scale(2.5);opacity:0;}}@keyframes ripple-animation-__jsx-style-dynamic-selector{to{-webkit-transform:scale(2.5);-ms-transform:scale(2.5);transform:scale(2.5);opacity:0;}}")));
1552
1552
  });
1553
1553
  ButtonComponent.displayName = 'Button';
1554
1554
  var Button = withScale(ButtonComponent);
@@ -1593,19 +1593,17 @@ var SmallButton = function SmallButton(_ref) {
1593
1593
  type = _ref.type,
1594
1594
  style = _ref.style,
1595
1595
  onClick = _ref.onClick,
1596
- to = _ref.to,
1597
- a = _ref.a;
1596
+ to = _ref.to;
1598
1597
  // const theme = useTheme();
1599
1598
  return /*#__PURE__*/React.createElement(Button, {
1600
1599
  to: to,
1601
- a: a,
1602
1600
  icon: icon,
1603
1601
  style: style,
1604
1602
  type: type,
1605
1603
  onClick: onClick,
1606
1604
  auto: true,
1607
1605
  scale: scale,
1608
- py: 0.6,
1606
+ px: 0.6,
1609
1607
  iconRight: iconRight
1610
1608
  }, children);
1611
1609
  };
@@ -1616,7 +1614,7 @@ var SmallButton$1 = /*#__PURE__*/React.memo(SmallButton);
1616
1614
  Button.Icon = IconButton;
1617
1615
  Button.Small = SmallButton$1;
1618
1616
 
1619
- var _excluded = ["h1", "h2", "h3", "h4", "h5", "h6", "p", "b", "small", "i", "span", "del", "em", "blockquote", "noWrap", "collapse", "children", "className"];
1617
+ var _excluded = ["h1", "h2", "h3", "h4", "h5", "h6", "p", "b", "small", "i", "span", "del", "em", "blockquote", "noWrap", "collapse", "children", "className", "display", "alignItems", "justify"];
1620
1618
  var _getModifierChild = function getModifierChild(tags, children) {
1621
1619
  if (!tags.length) return children;
1622
1620
  var nextTag = tags.slice(1, tags.length);
@@ -1660,6 +1658,10 @@ var TextComponent = function TextComponent(_ref) {
1660
1658
  children = _ref.children,
1661
1659
  _ref$className = _ref.className,
1662
1660
  className = _ref$className === void 0 ? '' : _ref$className,
1661
+ _ref$display = _ref.display,
1662
+ display = _ref$display === void 0 ? 'block' : _ref$display,
1663
+ alignItems = _ref.alignItems,
1664
+ justify = _ref.justify,
1663
1665
  props = _objectWithoutProperties(_ref, _excluded);
1664
1666
  var elements = {
1665
1667
  h1: h1,
@@ -1714,7 +1716,10 @@ var TextComponent = function TextComponent(_ref) {
1714
1716
  }, [renderableChildElements, children]);
1715
1717
  return /*#__PURE__*/React.createElement(TextChild, _extends({
1716
1718
  style: {
1717
- textAlign: props.align
1719
+ textAlign: props.align,
1720
+ display: display,
1721
+ alignItems: alignItems,
1722
+ justifyContent: justify
1718
1723
  },
1719
1724
  className: "".concat(className, " ").concat(noWrap ? 'no-wrap' : ''),
1720
1725
  tag: tag
@@ -19,7 +19,10 @@ interface Props {
19
19
  blockquote?: boolean;
20
20
  noWrap?: boolean;
21
21
  className?: string;
22
+ display?: string;
22
23
  color?: TextTypes;
24
+ alignItems?: string;
25
+ justify?: string;
23
26
  align?: 'center' | 'right' | 'left';
24
27
  }
25
28
  type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props>;