index.js 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114
  1. import _mergeJSXProps2 from "@vue/babel-helper-vue-jsx-merge-props";
  2. import _mergeJSXProps from "@vue/babel-helper-vue-jsx-merge-props";
  3. import _extends from "@babel/runtime/helpers/esm/extends";
  4. // Utils
  5. import { createNamespace } from '../utils';
  6. import { inherit, emit } from '../utils/functional';
  7. import { preventDefault } from '../utils/dom/event'; // Components
  8. import Field from '../field'; // Types
  9. var _createNamespace = createNamespace('search'),
  10. createComponent = _createNamespace[0],
  11. bem = _createNamespace[1],
  12. t = _createNamespace[2];
  13. function Search(h, props, slots, ctx) {
  14. function Label() {
  15. if (slots.label || props.label) {
  16. return h("div", {
  17. "class": bem('label')
  18. }, [slots.label ? slots.label() : props.label]);
  19. }
  20. }
  21. function Action() {
  22. if (!props.showAction) {
  23. return;
  24. }
  25. function onCancel() {
  26. if (slots.action) {
  27. return;
  28. }
  29. emit(ctx, 'input', '');
  30. emit(ctx, 'cancel');
  31. }
  32. return h("div", {
  33. "class": bem('action'),
  34. "attrs": {
  35. "role": "button",
  36. "tabindex": "0"
  37. },
  38. "on": {
  39. "click": onCancel
  40. }
  41. }, [slots.action ? slots.action() : props.actionText || t('cancel')]);
  42. }
  43. var fieldData = {
  44. attrs: ctx.data.attrs,
  45. on: _extends({}, ctx.listeners, {
  46. keypress: function keypress(event) {
  47. // press enter
  48. if (event.keyCode === 13) {
  49. preventDefault(event);
  50. emit(ctx, 'search', props.value);
  51. }
  52. emit(ctx, 'keypress', event);
  53. }
  54. })
  55. };
  56. var inheritData = inherit(ctx);
  57. inheritData.attrs = undefined;
  58. return h("div", _mergeJSXProps2([{
  59. "class": bem({
  60. 'show-action': props.showAction
  61. }),
  62. "style": {
  63. background: props.background
  64. }
  65. }, inheritData]), [slots.left == null ? void 0 : slots.left(), h("div", {
  66. "class": bem('content', props.shape)
  67. }, [Label(), h(Field, _mergeJSXProps([{
  68. "attrs": {
  69. "type": "search",
  70. "border": false,
  71. "value": props.value,
  72. "leftIcon": props.leftIcon,
  73. "rightIcon": props.rightIcon,
  74. "clearable": props.clearable,
  75. "clearTrigger": props.clearTrigger
  76. },
  77. "scopedSlots": {
  78. 'left-icon': slots['left-icon'],
  79. 'right-icon': slots['right-icon']
  80. }
  81. }, fieldData]))]), Action()]);
  82. }
  83. Search.props = {
  84. value: String,
  85. label: String,
  86. rightIcon: String,
  87. actionText: String,
  88. background: String,
  89. showAction: Boolean,
  90. clearTrigger: String,
  91. shape: {
  92. type: String,
  93. default: 'square'
  94. },
  95. clearable: {
  96. type: Boolean,
  97. default: true
  98. },
  99. leftIcon: {
  100. type: String,
  101. default: 'search'
  102. }
  103. };
  104. export default createComponent(Search);