index.js 3.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091
  1. import { useEvent } from 'functional-mini/component';
  2. import '../_util/assert-component2';
  3. import { mountComponent } from '../_util/component';
  4. import { useComponentEvent } from '../_util/hooks/useComponentEvent';
  5. import { useMixState } from '../_util/hooks/useMixState';
  6. import { resolveEventValue } from '../_util/platform';
  7. import { getPrecision, getValidNumber } from './utils';
  8. var Stepper = function (props) {
  9. var _a = useMixState(props.defaultValue, {
  10. value: props.value,
  11. postState: function (num, precision) {
  12. var _a = getValidNumber(num, props.min, props.max, props.step, precision >= 0 ? precision : props.precision), valid = _a.valid, value = _a.value;
  13. if (valid) {
  14. return { valid: valid, value: value };
  15. }
  16. return { valid: false };
  17. },
  18. }), value = _a[0], _b = _a[1], isControlled = _b.isControlled, update = _b.update;
  19. var triggerEvent = useComponentEvent(props).triggerEvent;
  20. var toNumber = function (v) { return (v === '' ? null : Number(v)); };
  21. useEvent('onFocus', function (e) {
  22. triggerEvent('focus', toNumber(value), e);
  23. }, [value]);
  24. useEvent('onChange', function (v, event) {
  25. var state = update(resolveEventValue(v));
  26. if (state.changed) {
  27. triggerEvent('change', toNumber(state.newValue), event);
  28. }
  29. }, [value]);
  30. useEvent('onConfirm', function (_v, event) {
  31. triggerEvent('confirm', value === '' ? null : Number(value), event);
  32. }, [value]);
  33. useEvent('onBlur', function (_v, event) {
  34. if (isControlled) {
  35. var state = update(props.value);
  36. if (state.changed) {
  37. triggerEvent('blur', state.newValue === '' ? null : Number(state.newValue), event);
  38. }
  39. else {
  40. triggerEvent('blur', value === '' ? null : Number(value), event);
  41. }
  42. }
  43. else {
  44. triggerEvent('blur', value === '' ? null : Number(value), event);
  45. }
  46. }, [value, props]);
  47. useEvent('onTap', function (e) {
  48. var step = props.step, disabled = props.disabled, _a = props.min, min = _a === void 0 ? -Infinity : _a, _b = props.max, max = _b === void 0 ? Infinity : _b;
  49. var newValue = Number(value);
  50. if (!disabled) {
  51. var mode = e.currentTarget.dataset.mode;
  52. var result = newValue;
  53. var precision = typeof props.precision === 'number' && props.precision >= 0
  54. ? props.precision
  55. : Math.max(getPrecision(newValue), getPrecision(step));
  56. if (mode === 'minus') {
  57. result = newValue - step;
  58. if (result < min) {
  59. result = min;
  60. }
  61. }
  62. else if (mode === 'add') {
  63. result = newValue + step;
  64. if (result > max) {
  65. result = max;
  66. }
  67. }
  68. if (!isControlled) {
  69. var changed = update(result, precision).changed;
  70. if (!changed) {
  71. return;
  72. }
  73. }
  74. var validValue = getValidNumber(result, min, max, step, precision).value;
  75. triggerEvent('change', Number(validValue), e);
  76. }
  77. }, [value, props]);
  78. return { mixin: { value: value } };
  79. };
  80. mountComponent(Stepper, {
  81. value: null,
  82. defaultValue: null,
  83. precision: -1,
  84. min: Number.MIN_SAFE_INTEGER,
  85. max: Number.MAX_SAFE_INTEGER,
  86. step: 1,
  87. type: 'digit',
  88. inputClassName: '',
  89. inputStyle: '',
  90. disabled: false,
  91. });