index.js 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899
  1. import { useEvent, useState } from 'functional-mini/component';
  2. import '../_util/assert-component2';
  3. import { mountComponent } from '../_util/component';
  4. import { useComponentEvent } from '../_util/hooks/useComponentEvent';
  5. import useLayoutEffect from '../_util/hooks/useLayoutEffect';
  6. import { hasValue, useMergedState } from '../_util/hooks/useMergedState';
  7. import { triggerRefEvent } from '../_util/hooks/useReportRef';
  8. var Input = function (props) {
  9. var isControlled = hasValue(props.controlled)
  10. ? !!props.controlled
  11. : hasValue(props.value);
  12. var option = {
  13. value: props.value,
  14. };
  15. if (!isControlled && hasValue(props.value)) {
  16. option = {
  17. defaultValue: props.value,
  18. };
  19. }
  20. var _a = useMergedState(props.defaultValue, option), value = _a[0], updateValue = _a[1];
  21. var _b = useState(false), selfFocus = _b[0], setSelfFocus = _b[1];
  22. var triggerEvent = useComponentEvent(props).triggerEvent;
  23. triggerRefEvent();
  24. useLayoutEffect(function (mount) {
  25. if (!isControlled && !mount) {
  26. updateValue(props.value);
  27. }
  28. }, [props.value]);
  29. useEvent('onChange', function (e) {
  30. var newValue = e.detail.value;
  31. if (!isControlled) {
  32. updateValue(newValue);
  33. }
  34. else {
  35. }
  36. triggerEvent('change', newValue, e);
  37. }, []);
  38. useEvent('onFocus', function (e) {
  39. var newValue = e.detail.value;
  40. setSelfFocus(true);
  41. triggerEvent('focus', newValue, e);
  42. }, []);
  43. useEvent('onBlur', function (e) {
  44. var newValue = e.detail.value;
  45. setSelfFocus(false);
  46. triggerEvent('blur', newValue, e);
  47. }, []);
  48. useEvent('onConfirm', function (e) {
  49. var newValue = e.detail.value;
  50. triggerEvent('confirm', newValue, e);
  51. }, []);
  52. useEvent('onClear', function (e) {
  53. if (!isControlled) {
  54. updateValue('');
  55. }
  56. triggerEvent('change', '', e);
  57. }, []);
  58. useEvent('update', function (e) {
  59. if (isControlled) {
  60. return;
  61. }
  62. updateValue(e);
  63. }, []);
  64. return {
  65. state: {
  66. value: value,
  67. controlled: isControlled,
  68. },
  69. selfFocus: selfFocus,
  70. };
  71. };
  72. mountComponent(Input, {
  73. type: null,
  74. value: null,
  75. defaultValue: null,
  76. placeholder: null,
  77. placeholderClassName: null,
  78. placeholderStyle: null,
  79. allowClear: null,
  80. enableNative: null,
  81. confirmType: null,
  82. confirmHold: null,
  83. controlled: null,
  84. alwaysSystem: null,
  85. selectionStart: null,
  86. selectionEnd: null,
  87. cursor: null,
  88. inputClassName: null,
  89. inputStyle: null,
  90. password: null,
  91. prefix: null,
  92. disabled: null,
  93. focusClassName: null,
  94. suffix: null,
  95. focus: null,
  96. name: null,
  97. focusStyle: null,
  98. randomNumber: null,
  99. });