@helpdice/ui 1.4.7 → 1.4.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/button/button.compact.d.ts +15 -0
- package/dist/button/button.d.ts +1 -0
- package/dist/button/index.d.ts +1 -0
- package/dist/button/index.js +143 -63
- package/dist/index.d.ts +2 -1
- package/dist/index.js +1652 -1301
- package/dist/modal/index.js +7 -5
- package/dist/table/index.js +12 -7
- package/dist/table/table-column.d.ts +1 -0
- package/dist/ui-provider/index.js +7 -5
- package/esm/button/button.compact.d.ts +15 -0
- package/esm/button/button.compact.js +77 -0
- package/esm/button/button.d.ts +1 -0
- package/esm/button/button.js +7 -5
- package/esm/button/index.d.ts +1 -0
- package/esm/button/index.js +1 -0
- package/esm/index.d.ts +2 -1
- package/esm/index.js +2 -1
- package/esm/table/table-column.d.ts +1 -0
- package/esm/table/table-column.js +3 -1
- package/esm/table/table-head.js +2 -1
- package/esm/timer/hooks/index.js +2 -0
- package/esm/timer/hooks/useInterval.js +20 -0
- package/esm/timer/index.js +21 -0
- package/esm/timer/useStopwatch.js +55 -0
- package/esm/timer/useTime.js +17 -0
- package/esm/timer/useTimer.js +87 -0
- package/esm/timer/utils/Time.js +75 -0
- package/esm/timer/utils/Validate.js +27 -0
- package/esm/timer/utils/index.js +3 -0
- package/package.json +3 -2
package/dist/modal/index.js
CHANGED
|
@@ -1779,7 +1779,7 @@ var getButtonDripColor = function getButtonDripColor(palette, props) {
|
|
|
1779
1779
|
return isLightHover ? addColorAlpha(hoverColors.bg, 0.65) : addColorAlpha(palette.accents_2, 0.65);
|
|
1780
1780
|
};
|
|
1781
1781
|
|
|
1782
|
-
var _excluded$6 = ["children", "disabled", "type", "loading", "shadow", "ghost", "effect", "onClick", "auto", "icon", "htmlType", "iconRight", "className", "crossOrigin"];
|
|
1782
|
+
var _excluded$6 = ["children", "disabled", "type", "loading", "shadow", "ghost", "effect", "round", "onClick", "auto", "icon", "htmlType", "iconRight", "className", "crossOrigin"];
|
|
1783
1783
|
var ButtonComponent = /*#__PURE__*/React.forwardRef(function (btnProps, ref) {
|
|
1784
1784
|
var theme = useTheme();
|
|
1785
1785
|
var _useScale = useScale(),
|
|
@@ -1815,6 +1815,8 @@ var ButtonComponent = /*#__PURE__*/React.forwardRef(function (btnProps, ref) {
|
|
|
1815
1815
|
ghost = _filteredProps$ghost === undefined ? false : _filteredProps$ghost,
|
|
1816
1816
|
_filteredProps$effect = filteredProps.effect,
|
|
1817
1817
|
effect = _filteredProps$effect === undefined ? true : _filteredProps$effect,
|
|
1818
|
+
_filteredProps$round = filteredProps.round,
|
|
1819
|
+
round = _filteredProps$round === undefined ? false : _filteredProps$round,
|
|
1818
1820
|
onClick = filteredProps.onClick,
|
|
1819
1821
|
_filteredProps$auto = filteredProps.auto,
|
|
1820
1822
|
auto = _filteredProps$auto === undefined ? false : _filteredProps$auto,
|
|
@@ -1878,7 +1880,7 @@ var ButtonComponent = /*#__PURE__*/React.forwardRef(function (btnProps, ref) {
|
|
|
1878
1880
|
disabled: disabled,
|
|
1879
1881
|
onClick: clickHandler
|
|
1880
1882
|
}, props, {
|
|
1881
|
-
className: _JSXStyle.dynamic([["
|
|
1883
|
+
className: _JSXStyle.dynamic([["1558010596", [SCALES.height(2.5), round ? '50%' : theme.layout.radius, SCALES.font(0.875), color, bg, border, cursor, events, shadow ? theme.expressiveness.shadowSmall : '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, shadow ? theme.expressiveness.shadowMedium : 'none', shadow ? '-1px' : '0px']]]) + " " + (props && props.className != null && props.className || useClasses('btn', className) || "")
|
|
1882
1884
|
}), loading && /*#__PURE__*/React.createElement(ButtonLoading, {
|
|
1883
1885
|
color: color
|
|
1884
1886
|
}), childrenWithIcon, dripShow && /*#__PURE__*/React.createElement(ButtonDrip, {
|
|
@@ -1887,9 +1889,9 @@ var ButtonComponent = /*#__PURE__*/React.forwardRef(function (btnProps, ref) {
|
|
|
1887
1889
|
color: dripColor,
|
|
1888
1890
|
onCompleted: dripCompletedHandle
|
|
1889
1891
|
}), /*#__PURE__*/React.createElement(_JSXStyle, {
|
|
1890
|
-
id: "
|
|
1891
|
-
dynamic: [SCALES.height(2.5), theme.layout.radius, SCALES.font(0.875), color, bg, border, cursor, events, shadow ? theme.expressiveness.shadowSmall : '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, shadow ? theme.expressiveness.shadowMedium : 'none', shadow ? '-1px' : '0px']
|
|
1892
|
-
}, ".btn.__jsx-style-dynamic-selector{box-sizing:border-box;display:inline-block;line-height:".concat(SCALES.height(2.5), ";border-radius:").concat(theme.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(border, ";cursor:").concat(cursor, ";pointer-events:").concat(events, ";box-shadow:").concat(shadow ? theme.expressiveness.shadowSmall : '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(shadow ? theme.expressiveness.shadowMedium : 'none', ";-webkit-transform:translate3d(0px,").concat(shadow ? '-1px' : '0px', ",0px);-ms-transform:translate3d(0px,").concat(shadow ? '-1px' : '0px', ",0px);transform:translate3d(0px,").concat(shadow ? '-1px' : '0px', ",0px);}.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;}")));
|
|
1892
|
+
id: "1558010596",
|
|
1893
|
+
dynamic: [SCALES.height(2.5), round ? '50%' : theme.layout.radius, SCALES.font(0.875), color, bg, border, cursor, events, shadow ? theme.expressiveness.shadowSmall : '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, shadow ? theme.expressiveness.shadowMedium : 'none', shadow ? '-1px' : '0px']
|
|
1894
|
+
}, ".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.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(border, ";cursor:").concat(cursor, ";pointer-events:").concat(events, ";box-shadow:").concat(shadow ? theme.expressiveness.shadowSmall : '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(shadow ? theme.expressiveness.shadowMedium : 'none', ";-webkit-transform:translate3d(0px,").concat(shadow ? '-1px' : '0px', ",0px);-ms-transform:translate3d(0px,").concat(shadow ? '-1px' : '0px', ",0px);transform:translate3d(0px,").concat(shadow ? '-1px' : '0px', ",0px);}.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;}")));
|
|
1893
1895
|
});
|
|
1894
1896
|
ButtonComponent.displayName = 'Button';
|
|
1895
1897
|
var Button = withScale(ButtonComponent);
|
package/dist/table/index.js
CHANGED
|
@@ -19987,7 +19987,8 @@ var TableHead = function TableHead(props) {
|
|
|
19987
19987
|
// textAlign: `${column?.align} !important`,
|
|
19988
19988
|
// paddingLeft: '0.3rem',
|
|
19989
19989
|
// paddingRight: '0.3rem',
|
|
19990
|
-
|
|
19990
|
+
backgroundColor: '#fff',
|
|
19991
|
+
color: "".concat(column !== null && column !== undefined && column.color ? column === null || column === undefined ? undefined : column.color : '#333'),
|
|
19991
19992
|
whiteSpace: column !== null && column !== undefined && column.noWrap ? 'nowrap' : 'normal'
|
|
19992
19993
|
}, column === null || column === undefined ? undefined : column.style),
|
|
19993
19994
|
key: "table-th-".concat(column.prop.toString(), "-").concat(index),
|
|
@@ -30891,7 +30892,7 @@ var getButtonDripColor = function getButtonDripColor(palette, props) {
|
|
|
30891
30892
|
return isLightHover ? addColorAlpha(hoverColors.bg, 0.65) : addColorAlpha(palette.accents_2, 0.65);
|
|
30892
30893
|
};
|
|
30893
30894
|
|
|
30894
|
-
var _excluded$8 = ["children", "disabled", "type", "loading", "shadow", "ghost", "effect", "onClick", "auto", "icon", "htmlType", "iconRight", "className", "crossOrigin"];
|
|
30895
|
+
var _excluded$8 = ["children", "disabled", "type", "loading", "shadow", "ghost", "effect", "round", "onClick", "auto", "icon", "htmlType", "iconRight", "className", "crossOrigin"];
|
|
30895
30896
|
var ButtonComponent = /*#__PURE__*/React.forwardRef(function (btnProps, ref) {
|
|
30896
30897
|
var theme = useTheme();
|
|
30897
30898
|
var _useScale = useScale(),
|
|
@@ -30927,6 +30928,8 @@ var ButtonComponent = /*#__PURE__*/React.forwardRef(function (btnProps, ref) {
|
|
|
30927
30928
|
ghost = _filteredProps$ghost === undefined ? false : _filteredProps$ghost,
|
|
30928
30929
|
_filteredProps$effect = filteredProps.effect,
|
|
30929
30930
|
effect = _filteredProps$effect === undefined ? true : _filteredProps$effect,
|
|
30931
|
+
_filteredProps$round = filteredProps.round,
|
|
30932
|
+
round = _filteredProps$round === undefined ? false : _filteredProps$round,
|
|
30930
30933
|
onClick = filteredProps.onClick,
|
|
30931
30934
|
_filteredProps$auto = filteredProps.auto,
|
|
30932
30935
|
auto = _filteredProps$auto === undefined ? false : _filteredProps$auto,
|
|
@@ -30990,7 +30993,7 @@ var ButtonComponent = /*#__PURE__*/React.forwardRef(function (btnProps, ref) {
|
|
|
30990
30993
|
disabled: disabled,
|
|
30991
30994
|
onClick: clickHandler
|
|
30992
30995
|
}, props, {
|
|
30993
|
-
className: _JSXStyle.dynamic([["
|
|
30996
|
+
className: _JSXStyle.dynamic([["1558010596", [SCALES.height(2.5), round ? '50%' : theme.layout.radius, SCALES.font(0.875), color, bg, border, cursor, events, shadow ? theme.expressiveness.shadowSmall : '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, shadow ? theme.expressiveness.shadowMedium : 'none', shadow ? '-1px' : '0px']]]) + " " + (props && props.className != null && props.className || useClasses('btn', className) || "")
|
|
30994
30997
|
}), loading && /*#__PURE__*/React.createElement(ButtonLoading, {
|
|
30995
30998
|
color: color
|
|
30996
30999
|
}), childrenWithIcon, dripShow && /*#__PURE__*/React.createElement(ButtonDrip, {
|
|
@@ -30999,9 +31002,9 @@ var ButtonComponent = /*#__PURE__*/React.forwardRef(function (btnProps, ref) {
|
|
|
30999
31002
|
color: dripColor,
|
|
31000
31003
|
onCompleted: dripCompletedHandle
|
|
31001
31004
|
}), /*#__PURE__*/React.createElement(_JSXStyle, {
|
|
31002
|
-
id: "
|
|
31003
|
-
dynamic: [SCALES.height(2.5), theme.layout.radius, SCALES.font(0.875), color, bg, border, cursor, events, shadow ? theme.expressiveness.shadowSmall : '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, shadow ? theme.expressiveness.shadowMedium : 'none', shadow ? '-1px' : '0px']
|
|
31004
|
-
}, ".btn.__jsx-style-dynamic-selector{box-sizing:border-box;display:inline-block;line-height:".concat(SCALES.height(2.5), ";border-radius:").concat(theme.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(border, ";cursor:").concat(cursor, ";pointer-events:").concat(events, ";box-shadow:").concat(shadow ? theme.expressiveness.shadowSmall : '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(shadow ? theme.expressiveness.shadowMedium : 'none', ";-webkit-transform:translate3d(0px,").concat(shadow ? '-1px' : '0px', ",0px);-ms-transform:translate3d(0px,").concat(shadow ? '-1px' : '0px', ",0px);transform:translate3d(0px,").concat(shadow ? '-1px' : '0px', ",0px);}.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;}")));
|
|
31005
|
+
id: "1558010596",
|
|
31006
|
+
dynamic: [SCALES.height(2.5), round ? '50%' : theme.layout.radius, SCALES.font(0.875), color, bg, border, cursor, events, shadow ? theme.expressiveness.shadowSmall : '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, shadow ? theme.expressiveness.shadowMedium : 'none', shadow ? '-1px' : '0px']
|
|
31007
|
+
}, ".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.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(border, ";cursor:").concat(cursor, ";pointer-events:").concat(events, ";box-shadow:").concat(shadow ? theme.expressiveness.shadowSmall : '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(shadow ? theme.expressiveness.shadowMedium : 'none', ";-webkit-transform:translate3d(0px,").concat(shadow ? '-1px' : '0px', ",0px);-ms-transform:translate3d(0px,").concat(shadow ? '-1px' : '0px', ",0px);transform:translate3d(0px,").concat(shadow ? '-1px' : '0px', ",0px);}.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;}")));
|
|
31005
31008
|
});
|
|
31006
31009
|
ButtonComponent.displayName = 'Button';
|
|
31007
31010
|
var Button = withScale(ButtonComponent);
|
|
@@ -32142,6 +32145,7 @@ var TableColumn = function TableColumn(columnProps) {
|
|
|
32142
32145
|
noWrap = _ref.noWrap,
|
|
32143
32146
|
align = _ref.align,
|
|
32144
32147
|
style = _ref.style,
|
|
32148
|
+
color = _ref.color,
|
|
32145
32149
|
_ref$fontSize = _ref.fontSize,
|
|
32146
32150
|
fontSize = _ref$fontSize === undefined ? 'smaller' : _ref$fontSize,
|
|
32147
32151
|
_ref$className = _ref.className,
|
|
@@ -32161,13 +32165,14 @@ var TableColumn = function TableColumn(columnProps) {
|
|
|
32161
32165
|
options: options,
|
|
32162
32166
|
prop: safeProp,
|
|
32163
32167
|
width: width,
|
|
32168
|
+
color: color,
|
|
32164
32169
|
align: align,
|
|
32165
32170
|
fontSize: fontSize,
|
|
32166
32171
|
className: className,
|
|
32167
32172
|
style: style,
|
|
32168
32173
|
renderHandler: function renderHandler() {}
|
|
32169
32174
|
});
|
|
32170
|
-
}, [children, noWrap, style, fontSize, align, filter, options, label, prop, width, className, renderHandler]);
|
|
32175
|
+
}, [children, noWrap, color, style, fontSize, align, filter, options, label, prop, width, className, renderHandler]);
|
|
32171
32176
|
return null;
|
|
32172
32177
|
};
|
|
32173
32178
|
TableColumn.displayName = 'TableColumn';
|
|
@@ -1772,7 +1772,7 @@ var getButtonDripColor = function getButtonDripColor(palette, props) {
|
|
|
1772
1772
|
return isLightHover ? addColorAlpha(hoverColors.bg, 0.65) : addColorAlpha(palette.accents_2, 0.65);
|
|
1773
1773
|
};
|
|
1774
1774
|
|
|
1775
|
-
var _excluded = ["children", "disabled", "type", "loading", "shadow", "ghost", "effect", "onClick", "auto", "icon", "htmlType", "iconRight", "className", "crossOrigin"];
|
|
1775
|
+
var _excluded = ["children", "disabled", "type", "loading", "shadow", "ghost", "effect", "round", "onClick", "auto", "icon", "htmlType", "iconRight", "className", "crossOrigin"];
|
|
1776
1776
|
var ButtonComponent = /*#__PURE__*/React.forwardRef(function (btnProps, ref) {
|
|
1777
1777
|
var theme = useTheme();
|
|
1778
1778
|
var _useScale = useScale(),
|
|
@@ -1808,6 +1808,8 @@ var ButtonComponent = /*#__PURE__*/React.forwardRef(function (btnProps, ref) {
|
|
|
1808
1808
|
ghost = _filteredProps$ghost === undefined ? false : _filteredProps$ghost,
|
|
1809
1809
|
_filteredProps$effect = filteredProps.effect,
|
|
1810
1810
|
effect = _filteredProps$effect === undefined ? true : _filteredProps$effect,
|
|
1811
|
+
_filteredProps$round = filteredProps.round,
|
|
1812
|
+
round = _filteredProps$round === undefined ? false : _filteredProps$round,
|
|
1811
1813
|
onClick = filteredProps.onClick,
|
|
1812
1814
|
_filteredProps$auto = filteredProps.auto,
|
|
1813
1815
|
auto = _filteredProps$auto === undefined ? false : _filteredProps$auto,
|
|
@@ -1871,7 +1873,7 @@ var ButtonComponent = /*#__PURE__*/React.forwardRef(function (btnProps, ref) {
|
|
|
1871
1873
|
disabled: disabled,
|
|
1872
1874
|
onClick: clickHandler
|
|
1873
1875
|
}, props, {
|
|
1874
|
-
className: _JSXStyle.dynamic([["
|
|
1876
|
+
className: _JSXStyle.dynamic([["1558010596", [SCALES.height(2.5), round ? '50%' : theme.layout.radius, SCALES.font(0.875), color, bg, border, cursor, events, shadow ? theme.expressiveness.shadowSmall : '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, shadow ? theme.expressiveness.shadowMedium : 'none', shadow ? '-1px' : '0px']]]) + " " + (props && props.className != null && props.className || useClasses('btn', className) || "")
|
|
1875
1877
|
}), loading && /*#__PURE__*/React.createElement(ButtonLoading, {
|
|
1876
1878
|
color: color
|
|
1877
1879
|
}), childrenWithIcon, dripShow && /*#__PURE__*/React.createElement(ButtonDrip, {
|
|
@@ -1880,9 +1882,9 @@ var ButtonComponent = /*#__PURE__*/React.forwardRef(function (btnProps, ref) {
|
|
|
1880
1882
|
color: dripColor,
|
|
1881
1883
|
onCompleted: dripCompletedHandle
|
|
1882
1884
|
}), /*#__PURE__*/React.createElement(_JSXStyle, {
|
|
1883
|
-
id: "
|
|
1884
|
-
dynamic: [SCALES.height(2.5), theme.layout.radius, SCALES.font(0.875), color, bg, border, cursor, events, shadow ? theme.expressiveness.shadowSmall : '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, shadow ? theme.expressiveness.shadowMedium : 'none', shadow ? '-1px' : '0px']
|
|
1885
|
-
}, ".btn.__jsx-style-dynamic-selector{box-sizing:border-box;display:inline-block;line-height:".concat(SCALES.height(2.5), ";border-radius:").concat(theme.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(border, ";cursor:").concat(cursor, ";pointer-events:").concat(events, ";box-shadow:").concat(shadow ? theme.expressiveness.shadowSmall : '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(shadow ? theme.expressiveness.shadowMedium : 'none', ";-webkit-transform:translate3d(0px,").concat(shadow ? '-1px' : '0px', ",0px);-ms-transform:translate3d(0px,").concat(shadow ? '-1px' : '0px', ",0px);transform:translate3d(0px,").concat(shadow ? '-1px' : '0px', ",0px);}.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;}")));
|
|
1885
|
+
id: "1558010596",
|
|
1886
|
+
dynamic: [SCALES.height(2.5), round ? '50%' : theme.layout.radius, SCALES.font(0.875), color, bg, border, cursor, events, shadow ? theme.expressiveness.shadowSmall : '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, shadow ? theme.expressiveness.shadowMedium : 'none', shadow ? '-1px' : '0px']
|
|
1887
|
+
}, ".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.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(border, ";cursor:").concat(cursor, ";pointer-events:").concat(events, ";box-shadow:").concat(shadow ? theme.expressiveness.shadowSmall : '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(shadow ? theme.expressiveness.shadowMedium : 'none', ";-webkit-transform:translate3d(0px,").concat(shadow ? '-1px' : '0px', ",0px);-ms-transform:translate3d(0px,").concat(shadow ? '-1px' : '0px', ",0px);transform:translate3d(0px,").concat(shadow ? '-1px' : '0px', ",0px);}.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;}")));
|
|
1886
1888
|
});
|
|
1887
1889
|
ButtonComponent.displayName = 'Button';
|
|
1888
1890
|
var Button = withScale(ButtonComponent);
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { CSSProperties } from 'react';
|
|
2
|
+
type CompactButtonProps = {
|
|
3
|
+
children?: React.ReactNode;
|
|
4
|
+
iconRight?: React.ReactNode;
|
|
5
|
+
to: string;
|
|
6
|
+
icon?: React.ReactNode;
|
|
7
|
+
scale?: number;
|
|
8
|
+
type?: any;
|
|
9
|
+
style?: CSSProperties;
|
|
10
|
+
a?: boolean;
|
|
11
|
+
target?: string;
|
|
12
|
+
onClick?: () => void;
|
|
13
|
+
};
|
|
14
|
+
export default function CompactButton({ to, children, iconRight, icon, scale, type, style, a, target, onClick }: CompactButtonProps): import("react").JSX.Element;
|
|
15
|
+
export {};
|
|
@@ -0,0 +1,77 @@
|
|
|
1
|
+
import Button from './button';
|
|
2
|
+
export default function CompactButton(_ref) {
|
|
3
|
+
var _ref$to = _ref.to,
|
|
4
|
+
to = _ref$to === void 0 ? '/' : _ref$to,
|
|
5
|
+
children = _ref.children,
|
|
6
|
+
iconRight = _ref.iconRight,
|
|
7
|
+
icon = _ref.icon,
|
|
8
|
+
_ref$scale = _ref.scale,
|
|
9
|
+
scale = _ref$scale === void 0 ? 2 / 3 : _ref$scale,
|
|
10
|
+
type = _ref.type,
|
|
11
|
+
style = _ref.style,
|
|
12
|
+
a = _ref.a,
|
|
13
|
+
target = _ref.target,
|
|
14
|
+
onClick = _ref.onClick;
|
|
15
|
+
if (a) {
|
|
16
|
+
return /*#__PURE__*/React.createElement("a", {
|
|
17
|
+
style: {
|
|
18
|
+
all: 'unset',
|
|
19
|
+
boxSizing: 'border-box',
|
|
20
|
+
display: 'inline-block',
|
|
21
|
+
lineHeight: 'calc(2.5* 16px)',
|
|
22
|
+
fontWeight: '400',
|
|
23
|
+
fontSize: 'calc(0.875* 16px)',
|
|
24
|
+
textAlign: 'center',
|
|
25
|
+
whiteSpace: 'nowrap',
|
|
26
|
+
position: 'relative',
|
|
27
|
+
overflow: 'hidden',
|
|
28
|
+
color: '#666',
|
|
29
|
+
backgroundColor: '#fff',
|
|
30
|
+
cursor: 'pointer',
|
|
31
|
+
minWidth: 'min-content',
|
|
32
|
+
width: 'auto',
|
|
33
|
+
height: 'calc(2.5* 16px)',
|
|
34
|
+
padding: '0 calc(0.69* 16px) 0 calc(0.69* 16px)',
|
|
35
|
+
margin: 0,
|
|
36
|
+
'--helpdice-ui-button-height': 'calc(2.5* 16px)',
|
|
37
|
+
'--helpdice-ui-button-icon-padding': 'calc(0.4362* 16px)'
|
|
38
|
+
},
|
|
39
|
+
href: to,
|
|
40
|
+
target: target
|
|
41
|
+
}, /*#__PURE__*/React.createElement("span", {
|
|
42
|
+
style: {
|
|
43
|
+
position: 'absolute',
|
|
44
|
+
right: 'auto',
|
|
45
|
+
left: 'var(--helpdice-ui-button-icon-padding)',
|
|
46
|
+
top: '50%',
|
|
47
|
+
transform: 'translateY(-50%)',
|
|
48
|
+
display: 'flex',
|
|
49
|
+
justifyContent: 'center',
|
|
50
|
+
alignItems: 'center',
|
|
51
|
+
color: 'var(--helpdice-ui-button-color)',
|
|
52
|
+
zIndex: 1
|
|
53
|
+
}
|
|
54
|
+
}, icon), /*#__PURE__*/React.createElement("div", {
|
|
55
|
+
style: {
|
|
56
|
+
display: 'inline-flex',
|
|
57
|
+
position: 'relative',
|
|
58
|
+
zIndex: 1,
|
|
59
|
+
justifyContent: 'center',
|
|
60
|
+
alignItems: 'center',
|
|
61
|
+
textAlign: 'center',
|
|
62
|
+
lineHeight: 'inherit',
|
|
63
|
+
paddingLeft: icon ? 'calc(var(--helpdice-ui-button-height) / 2 + var(--helpdice-ui-button-icon-padding)* .5)' : 0
|
|
64
|
+
}
|
|
65
|
+
}, children));
|
|
66
|
+
}
|
|
67
|
+
return /*#__PURE__*/React.createElement(Button, {
|
|
68
|
+
icon: icon,
|
|
69
|
+
style: style,
|
|
70
|
+
type: type,
|
|
71
|
+
onClick: onClick,
|
|
72
|
+
auto: true,
|
|
73
|
+
scale: scale,
|
|
74
|
+
px: 0.6,
|
|
75
|
+
iconRight: iconRight
|
|
76
|
+
}, children);
|
|
77
|
+
}
|
package/esm/button/button.d.ts
CHANGED
package/esm/button/button.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
2
|
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
3
3
|
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
4
|
-
var _excluded = ["children", "disabled", "type", "loading", "shadow", "ghost", "effect", "onClick", "auto", "icon", "htmlType", "iconRight", "className", "crossOrigin"];
|
|
4
|
+
var _excluded = ["children", "disabled", "type", "loading", "shadow", "ghost", "effect", "round", "onClick", "auto", "icon", "htmlType", "iconRight", "className", "crossOrigin"];
|
|
5
5
|
import _JSXStyle from "../styled-jsx.es.js";
|
|
6
6
|
/* "use client" */
|
|
7
7
|
|
|
@@ -50,6 +50,8 @@ var ButtonComponent = /*#__PURE__*/React.forwardRef(function (btnProps, ref) {
|
|
|
50
50
|
ghost = _filteredProps$ghost === void 0 ? false : _filteredProps$ghost,
|
|
51
51
|
_filteredProps$effect = filteredProps.effect,
|
|
52
52
|
effect = _filteredProps$effect === void 0 ? true : _filteredProps$effect,
|
|
53
|
+
_filteredProps$round = filteredProps.round,
|
|
54
|
+
round = _filteredProps$round === void 0 ? false : _filteredProps$round,
|
|
53
55
|
onClick = filteredProps.onClick,
|
|
54
56
|
_filteredProps$auto = filteredProps.auto,
|
|
55
57
|
auto = _filteredProps$auto === void 0 ? false : _filteredProps$auto,
|
|
@@ -114,7 +116,7 @@ var ButtonComponent = /*#__PURE__*/React.forwardRef(function (btnProps, ref) {
|
|
|
114
116
|
disabled: disabled,
|
|
115
117
|
onClick: clickHandler
|
|
116
118
|
}, props, {
|
|
117
|
-
className: _JSXStyle.dynamic([["
|
|
119
|
+
className: _JSXStyle.dynamic([["1558010596", [SCALES.height(2.5), round ? '50%' : theme.layout.radius, SCALES.font(0.875), color, bg, border, cursor, events, shadow ? theme.expressiveness.shadowSmall : '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, shadow ? theme.expressiveness.shadowMedium : 'none', shadow ? '-1px' : '0px']]]) + " " + (props && props.className != null && props.className || useClasses('btn', className) || "")
|
|
118
120
|
}), loading && /*#__PURE__*/React.createElement(ButtonLoading, {
|
|
119
121
|
color: color
|
|
120
122
|
}), childrenWithIcon, dripShow && /*#__PURE__*/React.createElement(ButtonDrip, {
|
|
@@ -123,9 +125,9 @@ var ButtonComponent = /*#__PURE__*/React.forwardRef(function (btnProps, ref) {
|
|
|
123
125
|
color: dripColor,
|
|
124
126
|
onCompleted: dripCompletedHandle
|
|
125
127
|
}), /*#__PURE__*/React.createElement(_JSXStyle, {
|
|
126
|
-
id: "
|
|
127
|
-
dynamic: [SCALES.height(2.5), theme.layout.radius, SCALES.font(0.875), color, bg, border, cursor, events, shadow ? theme.expressiveness.shadowSmall : '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, shadow ? theme.expressiveness.shadowMedium : 'none', shadow ? '-1px' : '0px']
|
|
128
|
-
}, ".btn.__jsx-style-dynamic-selector{box-sizing:border-box;display:inline-block;line-height:".concat(SCALES.height(2.5), ";border-radius:").concat(theme.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(border, ";cursor:").concat(cursor, ";pointer-events:").concat(events, ";box-shadow:").concat(shadow ? theme.expressiveness.shadowSmall : '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(shadow ? theme.expressiveness.shadowMedium : 'none', ";-webkit-transform:translate3d(0px,").concat(shadow ? '-1px' : '0px', ",0px);-ms-transform:translate3d(0px,").concat(shadow ? '-1px' : '0px', ",0px);transform:translate3d(0px,").concat(shadow ? '-1px' : '0px', ",0px);}.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;}")));
|
|
128
|
+
id: "1558010596",
|
|
129
|
+
dynamic: [SCALES.height(2.5), round ? '50%' : theme.layout.radius, SCALES.font(0.875), color, bg, border, cursor, events, shadow ? theme.expressiveness.shadowSmall : '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, shadow ? theme.expressiveness.shadowMedium : 'none', shadow ? '-1px' : '0px']
|
|
130
|
+
}, ".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.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(border, ";cursor:").concat(cursor, ";pointer-events:").concat(events, ";box-shadow:").concat(shadow ? theme.expressiveness.shadowSmall : '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(shadow ? theme.expressiveness.shadowMedium : 'none', ";-webkit-transform:translate3d(0px,").concat(shadow ? '-1px' : '0px', ",0px);-ms-transform:translate3d(0px,").concat(shadow ? '-1px' : '0px', ",0px);transform:translate3d(0px,").concat(shadow ? '-1px' : '0px', ",0px);}.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;}")));
|
|
129
131
|
});
|
|
130
132
|
ButtonComponent.displayName = 'Button';
|
|
131
133
|
var Button = withScale(ButtonComponent);
|
package/esm/button/index.d.ts
CHANGED
package/esm/button/index.js
CHANGED
package/esm/index.d.ts
CHANGED
|
@@ -6,7 +6,7 @@ export { default as Badge } from './badge';
|
|
|
6
6
|
export type { BadgeProps, BadgeAnchorProps } from './badge';
|
|
7
7
|
export { default as Breadcrumbs } from './breadcrumbs';
|
|
8
8
|
export type { BreadcrumbsProps, BreadcrumbsItemProps, BreadcrumbsSeparatorProps, } from './breadcrumbs';
|
|
9
|
-
export { default as Button } from './button';
|
|
9
|
+
export { default as Button, LinkButton } from './button';
|
|
10
10
|
export type { ButtonProps } from './button';
|
|
11
11
|
export { default as ButtonDropdown } from './button-dropdown';
|
|
12
12
|
export type { ButtonDropdownProps, ButtonDropdownItemProps } from './button-dropdown';
|
|
@@ -95,6 +95,7 @@ export { default as Tooltip } from './tooltip';
|
|
|
95
95
|
export type { TooltipProps } from './tooltip';
|
|
96
96
|
export { default as Tree } from './tree';
|
|
97
97
|
export type { TreeProps } from './tree';
|
|
98
|
+
export { useTime, useTimer, useStopwatch } from './timer';
|
|
98
99
|
export { default as useAllThemes } from './use-all-themes';
|
|
99
100
|
export type { AllThemesConfig } from './use-all-themes';
|
|
100
101
|
export { default as useToasts } from './use-toasts';
|
package/esm/index.js
CHANGED
|
@@ -5,7 +5,7 @@ export { default as AutoComplete } from './auto-complete';
|
|
|
5
5
|
export { default as Avatar } from './avatar';
|
|
6
6
|
export { default as Badge } from './badge';
|
|
7
7
|
export { default as Breadcrumbs } from './breadcrumbs';
|
|
8
|
-
export { default as Button } from './button';
|
|
8
|
+
export { default as Button, LinkButton } from './button';
|
|
9
9
|
export { default as ButtonDropdown } from './button-dropdown';
|
|
10
10
|
export { default as ButtonGroup } from './button-group';
|
|
11
11
|
export { default as Capacity } from './capacity';
|
|
@@ -54,6 +54,7 @@ export { default as Themes } from './themes';
|
|
|
54
54
|
export { default as Toggle } from './toggle';
|
|
55
55
|
export { default as Tooltip } from './tooltip';
|
|
56
56
|
export { default as Tree } from './tree';
|
|
57
|
+
export { useTime, useTimer, useStopwatch } from './timer';
|
|
57
58
|
export { default as useAllThemes } from './use-all-themes';
|
|
58
59
|
export { default as useToasts } from './use-toasts';
|
|
59
60
|
export { default as User } from './user';
|
|
@@ -14,6 +14,7 @@ var TableColumn = function TableColumn(columnProps) {
|
|
|
14
14
|
noWrap = _ref.noWrap,
|
|
15
15
|
align = _ref.align,
|
|
16
16
|
style = _ref.style,
|
|
17
|
+
color = _ref.color,
|
|
17
18
|
_ref$fontSize = _ref.fontSize,
|
|
18
19
|
fontSize = _ref$fontSize === void 0 ? 'smaller' : _ref$fontSize,
|
|
19
20
|
_ref$className = _ref.className,
|
|
@@ -33,13 +34,14 @@ var TableColumn = function TableColumn(columnProps) {
|
|
|
33
34
|
options: options,
|
|
34
35
|
prop: safeProp,
|
|
35
36
|
width: width,
|
|
37
|
+
color: color,
|
|
36
38
|
align: align,
|
|
37
39
|
fontSize: fontSize,
|
|
38
40
|
className: className,
|
|
39
41
|
style: style,
|
|
40
42
|
renderHandler: function renderHandler() {}
|
|
41
43
|
});
|
|
42
|
-
}, [children, noWrap, style, fontSize, align, filter, options, label, prop, width, className, renderHandler]);
|
|
44
|
+
}, [children, noWrap, color, style, fontSize, align, filter, options, label, prop, width, className, renderHandler]);
|
|
43
45
|
return null;
|
|
44
46
|
};
|
|
45
47
|
TableColumn.displayName = 'TableColumn';
|
package/esm/table/table-head.js
CHANGED
|
@@ -141,7 +141,8 @@ var TableHead = function TableHead(props) {
|
|
|
141
141
|
// textAlign: `${column?.align} !important`,
|
|
142
142
|
// paddingLeft: '0.3rem',
|
|
143
143
|
// paddingRight: '0.3rem',
|
|
144
|
-
|
|
144
|
+
backgroundColor: '#fff',
|
|
145
|
+
color: "".concat(column !== null && column !== void 0 && column.color ? column === null || column === void 0 ? void 0 : column.color : '#333'),
|
|
145
146
|
whiteSpace: column !== null && column !== void 0 && column.noWrap ? 'nowrap' : 'normal'
|
|
146
147
|
}, column === null || column === void 0 ? void 0 : column.style),
|
|
147
148
|
key: "table-th-".concat(column.prop.toString(), "-").concat(index),
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { useEffect, useRef } from 'react';
|
|
2
|
+
export default function useInterval(callback, delay) {
|
|
3
|
+
var callbackRef = useRef();
|
|
4
|
+
|
|
5
|
+
// update callback function with current render callback that has access to latest props and state
|
|
6
|
+
useEffect(function () {
|
|
7
|
+
callbackRef.current = callback;
|
|
8
|
+
});
|
|
9
|
+
useEffect(function () {
|
|
10
|
+
if (!delay) {
|
|
11
|
+
return function () {};
|
|
12
|
+
}
|
|
13
|
+
var interval = setInterval(function () {
|
|
14
|
+
callbackRef.current && callbackRef.current();
|
|
15
|
+
}, delay);
|
|
16
|
+
return function () {
|
|
17
|
+
return clearInterval(interval);
|
|
18
|
+
};
|
|
19
|
+
}, [delay]);
|
|
20
|
+
}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
|
+
import useTimer from './useTimer';
|
|
3
|
+
import useStopwatch from './useStopwatch';
|
|
4
|
+
import useTime from './useTime';
|
|
5
|
+
export { useTimer, useStopwatch, useTime };
|
|
6
|
+
export default function useTimerDeprecated(settings) {
|
|
7
|
+
if (settings.expiryTimestamp) {
|
|
8
|
+
var _values = useTimer(settings); // eslint-disable-line
|
|
9
|
+
return _extends({}, _values, {
|
|
10
|
+
startTimer: _values.start,
|
|
11
|
+
stopTimer: _values.pause,
|
|
12
|
+
resetTimer: function resetTimer() {}
|
|
13
|
+
});
|
|
14
|
+
}
|
|
15
|
+
var values = useStopwatch(settings); // eslint-disable-line
|
|
16
|
+
return _extends({}, values, {
|
|
17
|
+
startTimer: values.start,
|
|
18
|
+
stopTimer: values.pause,
|
|
19
|
+
resetTimer: values.reset
|
|
20
|
+
});
|
|
21
|
+
}
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
|
+
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
3
|
+
import { useState, useCallback } from 'react';
|
|
4
|
+
import { Time } from './utils';
|
|
5
|
+
import { useInterval } from './hooks';
|
|
6
|
+
export default function useStopwatch() {
|
|
7
|
+
var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
|
|
8
|
+
autoStart = _ref.autoStart,
|
|
9
|
+
offsetTimestamp = _ref.offsetTimestamp;
|
|
10
|
+
var _useState = useState(Time.getSecondsFromExpiry(offsetTimestamp, true) || 0),
|
|
11
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
12
|
+
passedSeconds = _useState2[0],
|
|
13
|
+
setPassedSeconds = _useState2[1];
|
|
14
|
+
var _useState3 = useState(new Date()),
|
|
15
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
16
|
+
prevTime = _useState4[0],
|
|
17
|
+
setPrevTime = _useState4[1];
|
|
18
|
+
var _useState5 = useState(passedSeconds + Time.getSecondsFromPrevTime(prevTime || 0, true)),
|
|
19
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
20
|
+
seconds = _useState6[0],
|
|
21
|
+
setSeconds = _useState6[1];
|
|
22
|
+
var _useState7 = useState(autoStart),
|
|
23
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
24
|
+
isRunning = _useState8[0],
|
|
25
|
+
setIsRunning = _useState8[1];
|
|
26
|
+
useInterval(function () {
|
|
27
|
+
setSeconds(passedSeconds + Time.getSecondsFromPrevTime(prevTime, true));
|
|
28
|
+
}, isRunning ? 1000 : null);
|
|
29
|
+
var start = useCallback(function () {
|
|
30
|
+
var newPrevTime = new Date();
|
|
31
|
+
setPrevTime(newPrevTime);
|
|
32
|
+
setIsRunning(true);
|
|
33
|
+
setSeconds(passedSeconds + Time.getSecondsFromPrevTime(newPrevTime, true));
|
|
34
|
+
}, [passedSeconds]);
|
|
35
|
+
var pause = useCallback(function () {
|
|
36
|
+
setPassedSeconds(seconds);
|
|
37
|
+
setIsRunning(false);
|
|
38
|
+
}, [seconds]);
|
|
39
|
+
var reset = useCallback(function () {
|
|
40
|
+
var offset = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
|
|
41
|
+
var newAutoStart = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
|
|
42
|
+
var newPassedSeconds = Time.getSecondsFromExpiry(offset, true) || 0;
|
|
43
|
+
var newPrevTime = new Date();
|
|
44
|
+
setPrevTime(newPrevTime);
|
|
45
|
+
setPassedSeconds(newPassedSeconds);
|
|
46
|
+
setIsRunning(newAutoStart);
|
|
47
|
+
setSeconds(newPassedSeconds + Time.getSecondsFromPrevTime(newPrevTime, true));
|
|
48
|
+
}, []);
|
|
49
|
+
return _extends({}, Time.getTimeFromSeconds(seconds), {
|
|
50
|
+
start: start,
|
|
51
|
+
pause: pause,
|
|
52
|
+
reset: reset,
|
|
53
|
+
isRunning: isRunning
|
|
54
|
+
});
|
|
55
|
+
}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
|
+
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
3
|
+
import { useState } from 'react';
|
|
4
|
+
import { Time } from './utils';
|
|
5
|
+
import { useInterval } from './hooks';
|
|
6
|
+
export default function useTime() {
|
|
7
|
+
var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
|
|
8
|
+
format = _ref.format;
|
|
9
|
+
var _useState = useState(Time.getSecondsFromTimeNow()),
|
|
10
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
11
|
+
seconds = _useState2[0],
|
|
12
|
+
setSeconds = _useState2[1];
|
|
13
|
+
useInterval(function () {
|
|
14
|
+
setSeconds(Time.getSecondsFromTimeNow());
|
|
15
|
+
}, 1000);
|
|
16
|
+
return _extends({}, Time.getFormattedTimeFromSeconds(seconds, format));
|
|
17
|
+
}
|