@nutui/nutui 4.0.0-beta.26 → 4.0.0-beta.27

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.
@@ -53,7 +53,7 @@ const _sfc_main = create({
53
53
  },
54
54
  spacing: {
55
55
  type: [String, Number],
56
- default: 14
56
+ default: void 0
57
57
  }
58
58
  },
59
59
  components: { StarFillN },
@@ -153,7 +153,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
153
153
  ref_for: true,
154
154
  ref: "rateRefs",
155
155
  id: "rateRefs-" + _ctx.refRandomId + n,
156
- style: normalizeStyle({ marginRight: _ctx.pxCheck(_ctx.spacing) })
156
+ style: normalizeStyle(n < Number(_ctx.count) ? { marginRight: _ctx.pxCheck(_ctx.spacing) } : {})
157
157
  }, [
158
158
  createElementVNode("view", null, [
159
159
  (openBlock(), createBlock(resolveDynamicComponent(_ctx.renderIcon(_ctx.customIcon, { width: _ctx.size, height: _ctx.size, size: _ctx.size, color: n <= _ctx.modelValue ? _ctx.activeColor : _ctx.voidColor })), {
@@ -1,4 +1,4 @@
1
- import { reactive, computed, ref, onMounted, toRefs, openBlock, createElementBlock, normalizeStyle, toDisplayString, createCommentVNode, renderSlot, createElementVNode, withModifiers, normalizeClass, withDirectives, createBlock, resolveDynamicComponent, vShow } from "vue";
1
+ import { reactive, computed, ref, onMounted, toRefs, openBlock, createElementBlock, normalizeStyle, toDisplayString, createCommentVNode, renderSlot, createElementVNode, normalizeClass, withModifiers, withDirectives, createBlock, resolveDynamicComponent, vShow } from "vue";
2
2
  import { c as createComponent } from "./component-81a4c1d0.js";
3
3
  import { r as renderIcon } from "./renderIcon-3d0fd47c.js";
4
4
  import { CircleClose } from "@nutui/icons-vue";
@@ -81,7 +81,6 @@ const _sfc_main = create({
81
81
  const state = reactive({
82
82
  active: false
83
83
  });
84
- console.log(slots);
85
84
  const searchbarStyle = computed(() => {
86
85
  return {
87
86
  background: props.background
@@ -178,8 +177,11 @@ const _hoisted_2 = {
178
177
  key: 1,
179
178
  class: "nut-searchbar__search-icon nut-searchbar__left-search-icon"
180
179
  };
181
- const _hoisted_3 = { class: "nut-searchbar__input-inner" };
182
- const _hoisted_4 = ["type", "maxlength", "placeholder", "value", "disabled", "readonly"];
180
+ const _hoisted_3 = ["type", "maxlength", "placeholder", "value", "disabled", "readonly"];
181
+ const _hoisted_4 = {
182
+ key: 1,
183
+ class: "nut-searchbar__search-icon nut-searchbar__iptright-search-icon"
184
+ };
183
185
  const _hoisted_5 = {
184
186
  key: 2,
185
187
  class: "nut-searchbar__search-icon nut-searchbar__right-search-icon"
@@ -204,7 +206,9 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
204
206
  }, [
205
207
  renderSlot(_ctx.$slots, "leftin")
206
208
  ])) : createCommentVNode("", true),
207
- createElementVNode("view", _hoisted_3, [
209
+ createElementVNode("view", {
210
+ class: normalizeClass(["nut-searchbar__input-inner", _ctx.$slots.rightin && "nut-searchbar__input-inner-absolute"])
211
+ }, [
208
212
  createElementVNode("form", {
209
213
  action: "#",
210
214
  onSubmit: _cache[5] || (_cache[5] = withModifiers((...args) => _ctx.handleSubmit && _ctx.handleSubmit(...args), ["prevent"]))
@@ -223,25 +227,25 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
223
227
  onFocus: _cache[3] || (_cache[3] = (...args) => _ctx.valueFocus && _ctx.valueFocus(...args)),
224
228
  onBlur: _cache[4] || (_cache[4] = (...args) => _ctx.valueBlur && _ctx.valueBlur(...args)),
225
229
  style: normalizeStyle(_ctx.styleSearchbar)
226
- }, null, 46, _hoisted_4)
227
- ], 32),
230
+ }, null, 46, _hoisted_3)
231
+ ], 32)
232
+ ], 2),
233
+ createElementVNode("view", {
234
+ class: normalizeClass(["nut-searchbar__input-inner-icon", _ctx.$slots.rightin && "nut-searchbar__input-inner-icon-absolute"])
235
+ }, [
228
236
  _ctx.clearable ? withDirectives((openBlock(), createElementBlock("view", {
229
237
  key: 0,
230
238
  onClick: _cache[6] || (_cache[6] = (...args) => _ctx.handleClear && _ctx.handleClear(...args)),
231
- class: "nut-searchbar__input-clear"
239
+ class: "nut-searchbar__search-icon nut-searchbar__input-clear"
232
240
  }, [
233
241
  _ctx.$slots["clear-icon"] ? renderSlot(_ctx.$slots, "clear-icon", { key: 0 }) : (openBlock(), createBlock(resolveDynamicComponent(_ctx.renderIcon(_ctx.clearIcon)), { key: 1 }))
234
242
  ], 512)), [
235
243
  [vShow, String(_ctx.modelValue).length > 0]
236
- ]) : createCommentVNode("", true)
237
- ]),
238
- _ctx.$slots.rightin ? (openBlock(), createElementBlock("view", {
239
- key: 1,
240
- class: "nut-searchbar__search-icon nut-searchbar__iptright-sarch-icon",
241
- onClick: _cache[7] || (_cache[7] = (...args) => _ctx.rightIconClick && _ctx.rightIconClick(...args))
242
- }, [
243
- renderSlot(_ctx.$slots, "rightin")
244
- ])) : createCommentVNode("", true)
244
+ ]) : createCommentVNode("", true),
245
+ _ctx.$slots.rightin ? (openBlock(), createElementBlock("view", _hoisted_4, [
246
+ renderSlot(_ctx.$slots, "rightin")
247
+ ])) : createCommentVNode("", true)
248
+ ], 2)
245
249
  ], 4),
246
250
  _ctx.$slots.rightout ? (openBlock(), createElementBlock("view", _hoisted_5, [
247
251
  renderSlot(_ctx.$slots, "rightout")
@@ -4,6 +4,7 @@
4
4
  display: flex;
5
5
  flex-shrink: 0;
6
6
  position: relative;
7
+ margin-right: 14px;
7
8
  &:last-child {
8
9
  margin-right: 0;
9
10
  }
@@ -51,14 +51,19 @@
51
51
  .nut-searchbar__input-inner {
52
52
  display: flex;
53
53
  position: relative;
54
- width: 100%;
54
+ // width: 100%;
55
+ flex: 1;
56
+ align-items: center;
57
+ overflow: hidden;
55
58
  > taro-form-core {
56
59
  width: 100%;
57
60
  }
58
61
  form {
59
- display: flex;
60
- align-items: center;
61
- width: 100%;
62
+ // display: flex;
63
+ // align-items: center;
64
+ // width: 100%;
65
+ flex: 1;
66
+ overflow: hidden;
62
67
  }
63
68
  input {
64
69
  width: 100%;
@@ -66,21 +71,32 @@
66
71
  min-width: 214px;
67
72
  padding-left: 4px;
68
73
  }
69
- .nut-searchbar__input-clear {
70
- display: flex;
71
- justify-content: center;
72
- align-items: center;
73
- margin-right: 13px;
74
- & .nut-searchbar__nut-icon-mask-close {
75
- color: rgb(204, 204, 204);
76
- &:hover {
77
- cursor: pointer;
78
- color: rgb(104, 104, 104);
79
- }
74
+ }
75
+
76
+ .nut-searchbar__input-inner-icon {
77
+ display: flex;
78
+ align-items: center;
79
+ position: relative;
80
+ // overflow: hidden;
81
+ padding: 0 7px;
82
+ }
83
+ .nut-searchbar__input-clear {
84
+ position: relative;
85
+ z-index: 10;
86
+ padding: 0 5px;
87
+ & .nut-searchbar__nut-icon-mask-close {
88
+ color: rgb(204, 204, 204);
89
+ &:hover {
90
+ cursor: pointer;
91
+ color: rgb(104, 104, 104);
80
92
  }
81
93
  }
82
- .nut-searchbar__input-bar_clear {
83
- padding-right: 10px;
94
+ }
95
+ .nut-searchbar__input-inner-icon-absolute {
96
+ .nut-searchbar__input-clear {
97
+ position: absolute;
98
+ z-index: 10;
99
+ left: -20px;
84
100
  }
85
101
  }
86
102
 
@@ -90,8 +106,8 @@
90
106
  height: 14px;
91
107
  }
92
108
 
93
- .nut-searchbar__iptright-sarch-icon {
94
- margin-right: 12px;
109
+ .nut-searchbar__iptright-search-icon {
110
+ margin-left: 5px;
95
111
  }
96
112
 
97
113
  .nut-searchbar__input-bar {
@@ -106,6 +122,13 @@
106
122
  outline: none;
107
123
  font-size: 14px;
108
124
  }
125
+
126
+ .nut-searchbar__input-inner-absolute {
127
+ .nut-searchbar__input-bar {
128
+ box-sizing: border-box;
129
+ padding-right: 20px;
130
+ }
131
+ }
109
132
  }
110
133
 
111
134
  &__left-search-icon {
@@ -2,7 +2,7 @@
2
2
  "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
3
3
  "framework": "vue",
4
4
  "name": "NutUI",
5
- "version": "4.0.0-beta.26",
5
+ "version": "4.0.0-beta.27",
6
6
  "contributions": {
7
7
  "html": {
8
8
  "tags": [