@helpdice/ui 2.5.4 → 2.5.8

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 (141) hide show
  1. package/dist/auto-complete/index.js +1273 -404
  2. package/dist/avatar/index.js +88 -49
  3. package/dist/badge/index.js +69 -27
  4. package/dist/breadcrumbs/index.js +107 -56
  5. package/dist/button/button.icon.d.ts +3 -16
  6. package/dist/button/button.small.d.ts +3 -16
  7. package/dist/button/index.js +143 -157
  8. package/dist/button-dropdown/index.js +96 -83
  9. package/dist/button-group/index.js +61 -21
  10. package/dist/capacity/index.js +61 -22
  11. package/dist/card/index.js +147 -123
  12. package/dist/carousal/index.js +349 -330
  13. package/dist/checkbox/index.js +72 -67
  14. package/dist/circular-progress/CircularProgress.d.ts +17 -0
  15. package/dist/circular-progress/index.d.ts +3 -4
  16. package/dist/circular-progress/index.js +713 -336
  17. package/dist/circular-progress/useCircularProgress.d.ts +12 -0
  18. package/dist/code/index.js +70 -26
  19. package/dist/col/index.js +61 -24
  20. package/dist/collapse/index.js +102 -52
  21. package/dist/container/index.js +187 -190
  22. package/dist/copy-to-clipboard/index.js +158 -210
  23. package/dist/description/index.js +64 -23
  24. package/dist/display/index.js +64 -23
  25. package/dist/divider/index.js +62 -22
  26. package/dist/dot/index.js +63 -23
  27. package/dist/drawer/index.js +74 -61
  28. package/dist/fieldset/index.js +127 -63
  29. package/dist/form/index.js +15 -40
  30. package/dist/grid/index.js +74 -29
  31. package/dist/html-renderer/index.js +3 -2
  32. package/dist/image/index.js +163 -104
  33. package/dist/index.d.ts +2 -1
  34. package/dist/index.js +5240 -4755
  35. package/dist/input/index.js +1183 -277
  36. package/dist/keyboard/index.js +73 -29
  37. package/dist/linear-progress/index.js +27 -24
  38. package/dist/link/index.js +78 -36
  39. package/dist/list/index.js +118 -63
  40. package/dist/loadable/index.js +76 -27
  41. package/dist/loading/index.js +70 -29
  42. package/dist/menu/index.js +53 -47
  43. package/dist/modal/index.js +225 -178
  44. package/dist/note/index.js +64 -23
  45. package/dist/notetip/index.js +54 -45
  46. package/dist/notetip/note-tip.d.ts +2 -0
  47. package/dist/page/index.js +102 -51
  48. package/dist/pagination/index.js +181 -124
  49. package/dist/placeholder/index.js +554 -538
  50. package/dist/popover/index.js +94 -81
  51. package/dist/progress/index.js +66 -27
  52. package/dist/radio/index.js +94 -48
  53. package/dist/rating/index.js +78 -38
  54. package/dist/row/index.js +62 -25
  55. package/dist/search-bar/index.js +172 -162
  56. package/dist/select/index.js +1098 -163
  57. package/dist/select/select.d.ts +2 -0
  58. package/dist/slider/index.js +91 -47
  59. package/dist/snippet/index.js +39 -39
  60. package/dist/spacer/index.js +58 -19
  61. package/dist/spinner/index.js +69 -28
  62. package/dist/swipe/index.js +28 -13
  63. package/dist/table/index.js +4162 -3863
  64. package/dist/table/table-body.d.ts +4 -3
  65. package/dist/table/table-cell.d.ts +4 -2
  66. package/dist/table/table-types.d.ts +2 -0
  67. package/dist/table/table.d.ts +5 -1
  68. package/dist/tabs/index.js +61 -59
  69. package/dist/tag/index.js +16 -20
  70. package/dist/text/index.js +187 -184
  71. package/dist/text/text.d.ts +3 -0
  72. package/dist/textarea/index.js +916 -36
  73. package/dist/textarea/textarea.d.ts +3 -0
  74. package/dist/toggle/index.js +75 -33
  75. package/dist/tooltip/index.d.ts +1 -2
  76. package/dist/tooltip/index.js +59 -53
  77. package/dist/tooltip/tooltip-content.d.ts +1 -1
  78. package/dist/tooltip/tooltip-small.d.ts +2 -5
  79. package/dist/tooltip/tooltip.d.ts +2 -1
  80. package/dist/tree/index.js +176 -115
  81. package/dist/use-scale/index.js +50 -13
  82. package/dist/user/index.js +152 -100
  83. package/esm/avatar/avatar.js +8 -6
  84. package/esm/button/button.icon.d.ts +3 -16
  85. package/esm/button/button.icon.js +22 -22
  86. package/esm/button/button.js +5 -5
  87. package/esm/button/button.small.d.ts +3 -16
  88. package/esm/button/button.small.js +20 -23
  89. package/esm/circular-progress/CircularProgress.d.ts +17 -0
  90. package/esm/circular-progress/CircularProgress.js +110 -0
  91. package/esm/circular-progress/index.d.ts +3 -4
  92. package/esm/circular-progress/index.js +3 -4
  93. package/esm/circular-progress/useCircularProgress.d.ts +12 -0
  94. package/esm/circular-progress/useCircularProgress.js +35 -0
  95. package/esm/index.d.ts +2 -1
  96. package/esm/index.js +1 -1
  97. package/esm/input/input-field.js +11 -9
  98. package/esm/list/list-item.js +11 -11
  99. package/esm/notetip/note-tip.d.ts +2 -0
  100. package/esm/notetip/note-tip.js +8 -5
  101. package/esm/pagination/pagination-item.js +6 -6
  102. package/esm/select/select.d.ts +2 -0
  103. package/esm/select/select.js +15 -2
  104. package/esm/skeleton/index.js +9 -4
  105. package/esm/table/table-body.d.ts +4 -3
  106. package/esm/table/table-body.js +25 -15
  107. package/esm/table/table-cell.d.ts +4 -2
  108. package/esm/table/table-cell.js +19 -3
  109. package/esm/table/table-types.d.ts +2 -0
  110. package/esm/table/table.d.ts +5 -1
  111. package/esm/table/table.js +52 -25
  112. package/esm/text/text.d.ts +3 -0
  113. package/esm/text/text.js +9 -2
  114. package/esm/textarea/textarea.d.ts +3 -0
  115. package/esm/textarea/textarea.js +19 -2
  116. package/esm/tooltip/index.d.ts +1 -2
  117. package/esm/tooltip/tooltip-content.d.ts +1 -1
  118. package/esm/tooltip/tooltip-content.js +5 -5
  119. package/esm/tooltip/tooltip-small.d.ts +2 -5
  120. package/esm/tooltip/tooltip-small.js +0 -1
  121. package/esm/tooltip/tooltip.d.ts +2 -1
  122. package/esm/tooltip/tooltip.js +6 -5
  123. package/package.json +3 -3
  124. package/dist/circular-progress/CircularProgressbar.d.ts +0 -10
  125. package/dist/circular-progress/CircularProgressbarWithChildren.d.ts +0 -7
  126. package/dist/circular-progress/Path.d.ts +0 -9
  127. package/dist/circular-progress/buildStyles.d.ts +0 -12
  128. package/dist/circular-progress/constants.d.ts +0 -5
  129. package/dist/circular-progress/types.d.ts +0 -50
  130. package/esm/circular-progress/CircularProgressbar.d.ts +0 -10
  131. package/esm/circular-progress/CircularProgressbar.js +0 -118
  132. package/esm/circular-progress/CircularProgressbarWithChildren.d.ts +0 -7
  133. package/esm/circular-progress/CircularProgressbarWithChildren.js +0 -32
  134. package/esm/circular-progress/Path.d.ts +0 -9
  135. package/esm/circular-progress/Path.js +0 -52
  136. package/esm/circular-progress/buildStyles.d.ts +0 -12
  137. package/esm/circular-progress/buildStyles.js +0 -45
  138. package/esm/circular-progress/constants.d.ts +0 -5
  139. package/esm/circular-progress/constants.js +0 -5
  140. package/esm/circular-progress/types.d.ts +0 -50
  141. package/esm/circular-progress/types.js +0 -1
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- import { TableDataItemBase, TableOnCellClick, TableOnRowClick, TableRowClassNameHandler } from './table-types';
2
+ import { RowErrorMap, TableDataItemBase, TableOnCellClick, TableOnRowClick, TableRowClassNameHandler } from './table-types';
3
3
  interface Props<TableDataItem extends TableDataItemBase> {
4
4
  hover: boolean;
5
5
  emptyText: string;
@@ -7,16 +7,17 @@ interface Props<TableDataItem extends TableDataItemBase> {
7
7
  onCell?: TableOnCellClick<TableDataItem>;
8
8
  data: Array<TableDataItem>;
9
9
  className?: string;
10
- textPlaceholder?: boolean;
10
+ rowErrors: RowErrorMap;
11
11
  rowClassName: TableRowClassNameHandler<TableDataItem>;
12
12
  rowDraggable?: boolean;
13
13
  readOnly?: boolean;
14
+ isLoading: boolean;
14
15
  onSelected?: (selected: any[]) => void;
15
16
  }
16
17
  type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props<any>>;
17
18
  export type TableBodyProps<TableDataItem extends TableDataItemBase> = Props<TableDataItem> & NativeAttrs;
18
19
  declare const TableBody: {
19
- <TableDataItem extends TableDataItemBase>({ data, emptyText, onRow, onCell, rowClassName, textPlaceholder, rowDraggable, readOnly, onSelected }: TableBodyProps<TableDataItem>): React.JSX.Element;
20
+ <TableDataItem extends TableDataItemBase>({ data, emptyText, onRow, onCell, rowClassName, isLoading, rowErrors, rowDraggable, readOnly, onSelected }: TableBodyProps<TableDataItem>): React.JSX.Element;
20
21
  displayName: string;
21
22
  };
22
23
  export default TableBody;
@@ -1,11 +1,13 @@
1
1
  import React from 'react';
2
- import { TableDataItemBase, TableAbstractColumn, TableOnCellClick } from './table-types';
2
+ import { TableDataItemBase, TableAbstractColumn, TableOnCellClick, FieldError } from './table-types';
3
3
  interface Props<TableDataItem extends TableDataItemBase> {
4
4
  columns: Array<TableAbstractColumn<TableDataItem>>;
5
5
  row: TableDataItem;
6
6
  rowIndex: number;
7
7
  emptyText: string;
8
+ errors?: FieldError;
8
9
  onCellClick?: TableOnCellClick<TableDataItem>;
10
+ isLoading: boolean;
9
11
  }
10
12
  export type TableCellData<TableDataItem> = {
11
13
  row: number;
@@ -14,5 +16,5 @@ export type TableCellData<TableDataItem> = {
14
16
  };
15
17
  type NativeAttrs = Omit<React.HTMLAttributes<any>, keyof Props<any>>;
16
18
  export type TableCellProps<TableDataItem extends TableDataItemBase> = Props<TableDataItem> & NativeAttrs;
17
- declare const TableCell: <TableDataItem extends TableDataItemBase>({ columns, row, rowIndex, emptyText, onCellClick }: TableCellProps<TableDataItem>) => React.JSX.Element;
19
+ declare const TableCell: <TableDataItem extends TableDataItemBase>({ columns, row, errors, rowIndex, emptyText, onCellClick, isLoading }: TableCellProps<TableDataItem>) => React.JSX.Element;
18
20
  export default TableCell;
@@ -21,3 +21,5 @@ export type TableOnRowClick<TableDataItem> = (rowData: TableDataItem, rowIndex:
21
21
  export type TableOnCellClick<TableDataItem> = (cellValue: TableDataItem[keyof TableDataItem], rowIndex: number, colunmIndex: number) => void;
22
22
  export type TableOnChange<TableDataItem> = (data: Array<TableDataItem>) => void;
23
23
  export type TableRowClassNameHandler<TableDataItem> = (rowData: TableDataItem, rowIndex: number) => string;
24
+ export type FieldError = Record<string, string>;
25
+ export type RowErrorMap = Map<number | string, FieldError>;
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- import { TableDataItemBase, TableOnCellClick, TableOnChange, TableOnRowClick, TableRowClassNameHandler } from './table-types';
2
+ import { RowErrorMap, TableDataItemBase, TableOnCellClick, TableOnChange, TableOnRowClick, TableRowClassNameHandler } from './table-types';
3
3
  import { ScaleProps } from '../use-scale';
4
4
  interface Props<TableDataItem extends TableDataItemBase> {
5
5
  data?: Array<TableDataItem>;
@@ -25,6 +25,10 @@ interface Props<TableDataItem extends TableDataItemBase> {
25
25
  previousCursor?: string;
26
26
  nextCursor?: string;
27
27
  hasMore?: boolean;
28
+ rowErrors?: RowErrorMap;
29
+ containerStyle?: object;
30
+ loading?: string;
31
+ isLoading?: boolean;
28
32
  onNextPage?: (next?: string) => void;
29
33
  onPreviousPage?: (prev?: string) => void;
30
34
  }
@@ -4,6 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var React = require('react');
6
6
  var theme = require('@helpdice/theme');
7
+ var jsxRuntime = require('react/jsx-runtime');
7
8
 
8
9
  function _arrayLikeToArray(r, a) {
9
10
  (null == a || a > r.length) && (a = r.length);
@@ -72,15 +73,6 @@ function _defineProperty(e, r, t) {
72
73
  writable: true
73
74
  }) : e[r] = t, e;
74
75
  }
75
- function _extends() {
76
- return _extends = Object.assign ? Object.assign.bind() : function (n) {
77
- for (var e = 1; e < arguments.length; e++) {
78
- var t = arguments[e];
79
- for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
80
- }
81
- return n;
82
- }, _extends.apply(null, arguments);
83
- }
84
76
  function _iterableToArray(r) {
85
77
  if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r);
86
78
  }
@@ -914,11 +906,13 @@ var withScale = function withScale(Render) {
914
906
  getScaleProps: generateGetScaleProps(props),
915
907
  getAllScaleProps: generateGetAllScaleProps(props)
916
908
  };
917
- return /*#__PURE__*/React.createElement(ScaleContext.Provider, {
918
- value: value
919
- }, /*#__PURE__*/React.createElement(Render, _extends({}, props, {
920
- ref: ref
921
- }), children));
909
+ return /*#__PURE__*/jsxRuntime.jsx(ScaleContext.Provider, {
910
+ value: value,
911
+ children: /*#__PURE__*/jsxRuntime.jsx(Render, _objectSpread2(_objectSpread2({}, props), {}, {
912
+ ref: ref,
913
+ children: children
914
+ }))
915
+ });
922
916
  });
923
917
  ScaleFC.displayName = "Scale".concat(Render.displayName || 'Wrapper');
924
918
  return ScaleFC;
@@ -1071,43 +1065,48 @@ var TabsComponent = function TabsComponent(_ref) {
1071
1065
  setDisplayHighlight(true);
1072
1066
  }
1073
1067
  };
1074
- return /*#__PURE__*/React.createElement(TabsContext.Provider, {
1075
- value: initialValue
1076
- }, /*#__PURE__*/React.createElement("div", _extends({}, props, {
1077
- className: _JSXStyle.dynamic([["1340018565", [SCALES.font(1), SCALES.width(1, 'initial'), 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), align, theme$1.palette.border, leftSpace]]]) + " " + (props && props.className != null && props.className || theme.useClasses('tabs', className) || "")
1078
- }), /*#__PURE__*/React.createElement("header", {
1079
- ref: ref,
1080
- onMouseLeave: function onMouseLeave() {
1081
- return setDisplayHighlight(false);
1082
- },
1083
- className: _JSXStyle.dynamic([["1340018565", [SCALES.font(1), SCALES.width(1, 'initial'), 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), align, theme$1.palette.border, leftSpace]]])
1084
- }, /*#__PURE__*/React.createElement(theme.Highlight, {
1085
- rect: rect,
1086
- visible: displayHighlight,
1087
- hoverHeightRatio: hoverHeightRatio,
1088
- hoverWidthRatio: hoverWidthRatio
1089
- }), /*#__PURE__*/React.createElement("div", {
1090
- className: _JSXStyle.dynamic([["1340018565", [SCALES.font(1), SCALES.width(1, 'initial'), 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), align, theme$1.palette.border, leftSpace]]]) + " " + (theme.useClasses('scroll-container', {
1091
- 'hide-divider': hideDivider
1092
- }) || "")
1093
- }, tabs.map(function (_ref2) {
1094
- var Cell = _ref2.cell,
1095
- value = _ref2.value;
1096
- return /*#__PURE__*/React.createElement(Cell, {
1097
- key: value,
1098
- onClick: clickHandler,
1099
- onMouseOver: tabItemMouseOverHandler,
1100
- activeClassName: activeClassName,
1101
- activeStyle: activeStyle,
1102
- hideBorder: hideBorder,
1103
- className: _JSXStyle.dynamic([["1340018565", [SCALES.font(1), SCALES.width(1, 'initial'), 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), align, theme$1.palette.border, leftSpace]]])
1104
- });
1105
- }))), /*#__PURE__*/React.createElement("div", {
1106
- className: _JSXStyle.dynamic([["1340018565", [SCALES.font(1), SCALES.width(1, 'initial'), 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), align, theme$1.palette.border, leftSpace]]]) + " " + "content"
1107
- }, children), /*#__PURE__*/React.createElement(_JSXStyle, {
1108
- id: "1340018565",
1109
- dynamic: [SCALES.font(1), SCALES.width(1, 'initial'), 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), align, theme$1.palette.border, leftSpace]
1110
- }, ".tabs.__jsx-style-dynamic-selector{font-size:".concat(SCALES.font(1), ";width:").concat(SCALES.width(1, 'initial'), ";height:").concat(SCALES.height(1, 'auto'), ";padding:").concat(SCALES.pt(0), " ").concat(SCALES.pr(0), " ").concat(SCALES.pb(0), " ").concat(SCALES.pl(0), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}header.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;overflow-y:hidden;overflow-x:scroll;-webkit-scrollbar-width:none;-moz-scrollbar-width:none;-ms-scrollbar-width:none;scrollbar-width:none;position:relative;}.scroll-container.__jsx-style-dynamic-selector{width:100%;height:100%;-webkit-flex:1;-ms-flex:1;flex:1;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:").concat(align, ";-webkit-justify-content:").concat(align, ";-ms-flex-pack:").concat(align, ";justify-content:").concat(align, ";border-bottom:1px solid ").concat(theme$1.palette.border, ";padding-left:").concat(leftSpace, ";}header.__jsx-style-dynamic-selector::-webkit-scrollbar{display:none;}.hide-divider.__jsx-style-dynamic-selector{border-color:transparent;}.content.__jsx-style-dynamic-selector{padding-top:0.625rem;}"))));
1068
+ return /*#__PURE__*/jsxRuntime.jsx(TabsContext.Provider, {
1069
+ value: initialValue,
1070
+ children: /*#__PURE__*/jsxRuntime.jsxs("div", _objectSpread2(_objectSpread2({}, props), {}, {
1071
+ className: _JSXStyle.dynamic([["1340018565", [SCALES.font(1), SCALES.width(1, 'initial'), 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), align, theme$1.palette.border, leftSpace]]]) + " " + (props && props.className != null && props.className || theme.useClasses('tabs', className) || ""),
1072
+ children: [/*#__PURE__*/jsxRuntime.jsxs("header", {
1073
+ ref: ref,
1074
+ onMouseLeave: function onMouseLeave() {
1075
+ return setDisplayHighlight(false);
1076
+ },
1077
+ className: _JSXStyle.dynamic([["1340018565", [SCALES.font(1), SCALES.width(1, 'initial'), 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), align, theme$1.palette.border, leftSpace]]]),
1078
+ children: [/*#__PURE__*/jsxRuntime.jsx(theme.Highlight, {
1079
+ rect: rect,
1080
+ visible: displayHighlight,
1081
+ hoverHeightRatio: hoverHeightRatio,
1082
+ hoverWidthRatio: hoverWidthRatio
1083
+ }), /*#__PURE__*/jsxRuntime.jsx("div", {
1084
+ className: _JSXStyle.dynamic([["1340018565", [SCALES.font(1), SCALES.width(1, 'initial'), 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), align, theme$1.palette.border, leftSpace]]]) + " " + (theme.useClasses('scroll-container', {
1085
+ 'hide-divider': hideDivider
1086
+ }) || ""),
1087
+ children: tabs.map(function (_ref2) {
1088
+ var Cell = _ref2.cell,
1089
+ value = _ref2.value;
1090
+ return /*#__PURE__*/jsxRuntime.jsx(Cell, {
1091
+ onClick: clickHandler,
1092
+ onMouseOver: tabItemMouseOverHandler,
1093
+ activeClassName: activeClassName,
1094
+ activeStyle: activeStyle,
1095
+ hideBorder: hideBorder,
1096
+ className: _JSXStyle.dynamic([["1340018565", [SCALES.font(1), SCALES.width(1, 'initial'), 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), align, theme$1.palette.border, leftSpace]]])
1097
+ }, value);
1098
+ })
1099
+ })]
1100
+ }), /*#__PURE__*/jsxRuntime.jsx("div", {
1101
+ className: _JSXStyle.dynamic([["1340018565", [SCALES.font(1), SCALES.width(1, 'initial'), 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), align, theme$1.palette.border, leftSpace]]]) + " " + "content",
1102
+ children: children
1103
+ }), /*#__PURE__*/jsxRuntime.jsx(_JSXStyle, {
1104
+ id: "1340018565",
1105
+ dynamic: [SCALES.font(1), SCALES.width(1, 'initial'), 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), align, theme$1.palette.border, leftSpace],
1106
+ children: ".tabs.__jsx-style-dynamic-selector{font-size:".concat(SCALES.font(1), ";width:").concat(SCALES.width(1, 'initial'), ";height:").concat(SCALES.height(1, 'auto'), ";padding:").concat(SCALES.pt(0), " ").concat(SCALES.pr(0), " ").concat(SCALES.pb(0), " ").concat(SCALES.pl(0), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}header.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;overflow-y:hidden;overflow-x:scroll;-webkit-scrollbar-width:none;-moz-scrollbar-width:none;-ms-scrollbar-width:none;scrollbar-width:none;position:relative;}.scroll-container.__jsx-style-dynamic-selector{width:100%;height:100%;-webkit-flex:1;-ms-flex:1;flex:1;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:").concat(align, ";-webkit-justify-content:").concat(align, ";-ms-flex-pack:").concat(align, ";justify-content:").concat(align, ";border-bottom:1px solid ").concat(theme$1.palette.border, ";padding-left:").concat(leftSpace, ";}header.__jsx-style-dynamic-selector::-webkit-scrollbar{display:none;}.hide-divider.__jsx-style-dynamic-selector{border-color:transparent;}.content.__jsx-style-dynamic-selector{padding-top:0.625rem;}")
1107
+ })]
1108
+ }))
1109
+ });
1111
1110
  };
1112
1111
  TabsComponent.displayName = 'Tabs';
1113
1112
  var Tabs = withScale(TabsComponent);
@@ -1145,19 +1144,20 @@ var TabsItemComponent = function TabsItemComponent(_ref) {
1145
1144
  if (disabled) return;
1146
1145
  onClick && onClick(value);
1147
1146
  };
1148
- return /*#__PURE__*/React.createElement("div", {
1147
+ return /*#__PURE__*/jsxRuntime.jsxs("div", {
1149
1148
  ref: ref,
1150
1149
  role: "button",
1151
- key: value,
1152
1150
  onMouseOver: onMouseOver,
1153
1151
  onClick: clickHandler,
1154
1152
  style: active ? activeStyle : {},
1155
1153
  "data-helpdice": "tab-item",
1156
- className: _JSXStyle.dynamic([["2444688710", [theme$1.palette.accents_5, SCALES.font(0.875), SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0.875), SCALES.pr(0.55), SCALES.pb(0.875), SCALES.pl(0.55), SCALES.mt(0), SCALES.mr(0.2), SCALES.mb(0), SCALES.ml(0.2), SCALES.pl(0.28), SCALES.pr(0.28), theme$1.palette.foreground, theme$1.palette.foreground, theme$1.palette.foreground, theme$1.palette.accents_3, label]]]) + " " + (classes || "")
1157
- }, label, /*#__PURE__*/React.createElement(_JSXStyle, {
1158
- id: "2444688710",
1159
- dynamic: [theme$1.palette.accents_5, SCALES.font(0.875), SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0.875), SCALES.pr(0.55), SCALES.pb(0.875), SCALES.pl(0.55), SCALES.mt(0), SCALES.mr(0.2), SCALES.mb(0), SCALES.ml(0.2), SCALES.pl(0.28), SCALES.pr(0.28), theme$1.palette.foreground, theme$1.palette.foreground, theme$1.palette.foreground, theme$1.palette.accents_3, label]
1160
- }, ".tab.__jsx-style-dynamic-selector{position:relative;box-sizing:border-box;cursor:pointer;outline:0;text-transform:capitalize;white-space:nowrap;background-color:transparent;color:".concat(theme$1.palette.accents_5, ";-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;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;font-size:").concat(SCALES.font(0.875), ";line-height:normal;width:").concat(SCALES.width(1, 'auto'), ";height:").concat(SCALES.height(1, 'auto'), ";padding:").concat(SCALES.pt(0.875), " ").concat(SCALES.pr(0.55), " ").concat(SCALES.pb(0.875), " ").concat(SCALES.pl(0.55), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0.2), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0.2), ";z-index:1;--tabs-item-hover-left:calc(-1 * ").concat(SCALES.pl(0.28), ");--tabs-item-hover-right:calc(-1 * ").concat(SCALES.pr(0.28), ");}.tab.__jsx-style-dynamic-selector:hover{color:").concat(theme$1.palette.foreground, ";}.tab.__jsx-style-dynamic-selector:after{position:absolute;content:'';bottom:-1px;left:0;right:0;width:100%;height:2px;border-radius:4px;-webkit-transform:scaleX(0.75);-ms-transform:scaleX(0.75);transform:scaleX(0.75);background-color:").concat(theme$1.palette.foreground, ";-webkit-transition:opacity,-webkit-transform 200ms ease-in;-webkit-transition:opacity,transform 200ms ease-in;transition:opacity,transform 200ms ease-in;opacity:0;}.active.__jsx-style-dynamic-selector:after{opacity:1;-webkit-transform:scaleX(1);-ms-transform:scaleX(1);transform:scaleX(1);}.tab.__jsx-style-dynamic-selector svg{max-height:1em;margin-right:5px;}.tab.__jsx-style-dynamic-selector:first-of-type{margin-left:0;}.active.__jsx-style-dynamic-selector{color:").concat(theme$1.palette.foreground, ";}.disabled.__jsx-style-dynamic-selector{color:").concat(theme$1.palette.accents_3, ";cursor:not-allowed;}.hide-border.__jsx-style-dynamic-selector:before{display:block;content:").concat(label, ";font-weight:500;height:0;overflow:hidden;visibility:hidden;}.hide-border.__jsx-style-dynamic-selector:after{display:none;}.hide-border.active.__jsx-style-dynamic-selector{font-weight:500;}")));
1154
+ className: _JSXStyle.dynamic([["2444688710", [theme$1.palette.accents_5, SCALES.font(0.875), SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0.875), SCALES.pr(0.55), SCALES.pb(0.875), SCALES.pl(0.55), SCALES.mt(0), SCALES.mr(0.2), SCALES.mb(0), SCALES.ml(0.2), SCALES.pl(0.28), SCALES.pr(0.28), theme$1.palette.foreground, theme$1.palette.foreground, theme$1.palette.foreground, theme$1.palette.accents_3, label]]]) + " " + (classes || ""),
1155
+ children: [label, /*#__PURE__*/jsxRuntime.jsx(_JSXStyle, {
1156
+ id: "2444688710",
1157
+ dynamic: [theme$1.palette.accents_5, SCALES.font(0.875), SCALES.width(1, 'auto'), SCALES.height(1, 'auto'), SCALES.pt(0.875), SCALES.pr(0.55), SCALES.pb(0.875), SCALES.pl(0.55), SCALES.mt(0), SCALES.mr(0.2), SCALES.mb(0), SCALES.ml(0.2), SCALES.pl(0.28), SCALES.pr(0.28), theme$1.palette.foreground, theme$1.palette.foreground, theme$1.palette.foreground, theme$1.palette.accents_3, label],
1158
+ children: ".tab.__jsx-style-dynamic-selector{position:relative;box-sizing:border-box;cursor:pointer;outline:0;text-transform:capitalize;white-space:nowrap;background-color:transparent;color:".concat(theme$1.palette.accents_5, ";-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;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;font-size:").concat(SCALES.font(0.875), ";line-height:normal;width:").concat(SCALES.width(1, 'auto'), ";height:").concat(SCALES.height(1, 'auto'), ";padding:").concat(SCALES.pt(0.875), " ").concat(SCALES.pr(0.55), " ").concat(SCALES.pb(0.875), " ").concat(SCALES.pl(0.55), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0.2), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0.2), ";z-index:1;--tabs-item-hover-left:calc(-1 * ").concat(SCALES.pl(0.28), ");--tabs-item-hover-right:calc(-1 * ").concat(SCALES.pr(0.28), ");}.tab.__jsx-style-dynamic-selector:hover{color:").concat(theme$1.palette.foreground, ";}.tab.__jsx-style-dynamic-selector:after{position:absolute;content:'';bottom:-1px;left:0;right:0;width:100%;height:2px;border-radius:4px;-webkit-transform:scaleX(0.75);-ms-transform:scaleX(0.75);transform:scaleX(0.75);background-color:").concat(theme$1.palette.foreground, ";-webkit-transition:opacity,-webkit-transform 200ms ease-in;-webkit-transition:opacity,transform 200ms ease-in;transition:opacity,transform 200ms ease-in;opacity:0;}.active.__jsx-style-dynamic-selector:after{opacity:1;-webkit-transform:scaleX(1);-ms-transform:scaleX(1);transform:scaleX(1);}.tab.__jsx-style-dynamic-selector svg{max-height:1em;margin-right:5px;}.tab.__jsx-style-dynamic-selector:first-of-type{margin-left:0;}.active.__jsx-style-dynamic-selector{color:").concat(theme$1.palette.foreground, ";}.disabled.__jsx-style-dynamic-selector{color:").concat(theme$1.palette.accents_3, ";cursor:not-allowed;}.hide-border.__jsx-style-dynamic-selector:before{display:block;content:").concat(label, ";font-weight:500;height:0;overflow:hidden;visibility:hidden;}.hide-border.__jsx-style-dynamic-selector:after{display:none;}.hide-border.active.__jsx-style-dynamic-selector{font-weight:500;}")
1159
+ })]
1160
+ }, value);
1161
1161
  };
1162
1162
  TabsInternalCell.displayName = 'TabsInternalCell';
1163
1163
  React.useEffect(function () {
@@ -1168,7 +1168,9 @@ var TabsItemComponent = function TabsItemComponent(_ref) {
1168
1168
  }, [value, label, disabled]);
1169
1169
 
1170
1170
  /* eslint-disable react/jsx-no-useless-fragment */
1171
- return isActive ? /*#__PURE__*/React.createElement(React.Fragment, null, children) : null;
1171
+ return isActive ? /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
1172
+ children: children
1173
+ }) : null;
1172
1174
  };
1173
1175
  TabsItemComponent.displayName = 'TabsItem';
1174
1176
  var TabsItem = withScale(TabsItemComponent);
package/dist/tag/index.js CHANGED
@@ -4,6 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var React = require('react');
6
6
  var theme = require('@helpdice/theme');
7
+ var jsxRuntime = require('react/jsx-runtime');
7
8
 
8
9
  function _arrayLikeToArray(r, a) {
9
10
  (null == a || a > r.length) && (a = r.length);
@@ -66,15 +67,6 @@ function _defineProperty(e, r, t) {
66
67
  writable: true
67
68
  }) : e[r] = t, e;
68
69
  }
69
- function _extends() {
70
- return _extends = Object.assign ? Object.assign.bind() : function (n) {
71
- for (var e = 1; e < arguments.length; e++) {
72
- var t = arguments[e];
73
- for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
74
- }
75
- return n;
76
- }, _extends.apply(null, arguments);
77
- }
78
70
  function ownKeys(e, r) {
79
71
  var t = Object.keys(e);
80
72
  if (Object.getOwnPropertySymbols) {
@@ -853,11 +845,13 @@ var withScale = function withScale(Render) {
853
845
  getScaleProps: generateGetScaleProps(props),
854
846
  getAllScaleProps: generateGetAllScaleProps(props)
855
847
  };
856
- return /*#__PURE__*/React.createElement(ScaleContext.Provider, {
857
- value: value
858
- }, /*#__PURE__*/React.createElement(Render, _extends({}, props, {
859
- ref: ref
860
- }), children));
848
+ return /*#__PURE__*/jsxRuntime.jsx(ScaleContext.Provider, {
849
+ value: value,
850
+ children: /*#__PURE__*/jsxRuntime.jsx(Render, _objectSpread2(_objectSpread2({}, props), {}, {
851
+ ref: ref,
852
+ children: children
853
+ }))
854
+ });
861
855
  });
862
856
  ScaleFC.displayName = "Scale".concat(Render.displayName || 'Wrapper');
863
857
  return ScaleFC;
@@ -918,12 +912,14 @@ var TagComponent = function TagComponent(_ref) {
918
912
  color = _useMemo.color,
919
913
  bgColor = _useMemo.bgColor,
920
914
  borderColor = _useMemo.borderColor;
921
- return /*#__PURE__*/React.createElement("span", _extends({}, props, {
922
- className: _JSXStyle.dynamic([["3652870078", [borderColor, bgColor, color, SCALES.height(0.3125), SCALES.font(0.875), SCALES.width(1, 'auto'), SCALES.height(1.75), SCALES.pt(0.375), SCALES.pr(0.375), SCALES.pb(0.375), SCALES.pl(0.375), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]]]) + " " + (props && props.className != null && props.className || className || "")
923
- }), children, /*#__PURE__*/React.createElement(_JSXStyle, {
924
- id: "3652870078",
925
- dynamic: [borderColor, bgColor, color, SCALES.height(0.3125), SCALES.font(0.875), SCALES.width(1, 'auto'), SCALES.height(1.75), SCALES.pt(0.375), SCALES.pr(0.375), SCALES.pb(0.375), SCALES.pl(0.375), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]
926
- }, "span.__jsx-style-dynamic-selector{display:inline-block;border:1px solid ".concat(borderColor, ";background-color:").concat(bgColor, ";color:").concat(color, ";box-sizing:border-box;line-height:1em;border-radius:").concat(SCALES.height(0.3125), ";font-size:").concat(SCALES.font(0.875), ";width:").concat(SCALES.width(1, 'auto'), ";height:").concat(SCALES.height(1.75), ";padding:").concat(SCALES.pt(0.375), " ").concat(SCALES.pr(0.375), " ").concat(SCALES.pb(0.375), " ").concat(SCALES.pl(0.375), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}")));
915
+ return /*#__PURE__*/jsxRuntime.jsxs("span", _objectSpread2(_objectSpread2({}, props), {}, {
916
+ className: _JSXStyle.dynamic([["3652870078", [borderColor, bgColor, color, SCALES.height(0.3125), SCALES.font(0.875), SCALES.width(1, 'auto'), SCALES.height(1.75), SCALES.pt(0.375), SCALES.pr(0.375), SCALES.pb(0.375), SCALES.pl(0.375), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]]]) + " " + (props && props.className != null && props.className || className || ""),
917
+ children: [children, /*#__PURE__*/jsxRuntime.jsx(_JSXStyle, {
918
+ id: "3652870078",
919
+ dynamic: [borderColor, bgColor, color, SCALES.height(0.3125), SCALES.font(0.875), SCALES.width(1, 'auto'), SCALES.height(1.75), SCALES.pt(0.375), SCALES.pr(0.375), SCALES.pb(0.375), SCALES.pl(0.375), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)],
920
+ children: "span.__jsx-style-dynamic-selector{display:inline-block;border:1px solid ".concat(borderColor, ";background-color:").concat(bgColor, ";color:").concat(color, ";box-sizing:border-box;line-height:1em;border-radius:").concat(SCALES.height(0.3125), ";font-size:").concat(SCALES.font(0.875), ";width:").concat(SCALES.width(1, 'auto'), ";height:").concat(SCALES.height(1.75), ";padding:").concat(SCALES.pt(0.375), " ").concat(SCALES.pr(0.375), " ").concat(SCALES.pb(0.375), " ").concat(SCALES.pl(0.375), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}")
921
+ })]
922
+ }));
927
923
  };
928
924
  TagComponent.displayName = 'Tag';
929
925
  var Tag = withScale(TagComponent);