index.js 3.3 KB

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