@king-design/vue 3.6.0-beta.0 → 3.6.0

package/components/datepicker/useValueBase.js

@@ -0,0 +1,277 @@
+import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js/instance/slice";
+import _mapInstanceProperty from "@babel/runtime-corejs3/core-js/instance/map";
+import _trimInstanceProperty from "@babel/runtime-corejs3/core-js/instance/trim";
+import _spliceInstanceProperty from "@babel/runtime-corejs3/core-js/instance/splice";
+import _sortInstanceProperty from "@babel/runtime-corejs3/core-js/instance/sort";
+import { useInstance } from 'intact-vue-next';
+import { useState, watchState } from '../../hooks/useState';
+import dayjs from './dayjs';
+import { findValueIndex } from './helpers';
+import { isEqualArray, last } from '../utils';
+export function useValueBase(_ref, _ref2, panel, shouldUpdateValue, updateValueOnInput, getEqualType, updateStateValue) {
+  var createDateByValueFormat = _ref.createDateByValueFormat,
+    createDateByShowFormat = _ref.createDateByShowFormat,
+    getShowString = _ref.getShowString,
+    getValueString = _ref.getValueString;
+  var isDisabled = _ref2.isDisabled,
+    minDate = _ref2.minDate;
+  // Normalize the value to multipe values, no matter it's multipe or not
+  var value = useState([]);
+  var instance = useInstance();
+  var dayjsValue = [];
+  instance.watch('value', function (newValue, oldValue) {
+    if (isEqualArray(newValue, oldValue)) return;
+    dayjsValue = convertToDayjs(newValue);
+    updateStateValue(dayjsValue, value);
+    // should update keywords
+    instance.resetKeywords();
+  });
+  watchState(value, function (value) {
+    // silently update the keywords to display the currently selected value 
+    instance.resetKeywords(true);
+    /**
+     * the position may changed after the input break line in multipe mode
+     * use Macro task instead of nextTick, because it has too many Micro tasks
+     */
+    setTimeout(function () {
+      instance.position();
+    });
+  });
+  instance.on('hide', function () {
+    // reset the value after hiding
+    value.set(_sliceInstanceProperty(dayjsValue).call(dayjsValue, 0));
+  });
+  watchState(instance.input.keywords, function (v) {
+    var _instance$get = instance.get(),
+      range = _instance$get.range,
+      multiple = _instance$get.multiple;
+    if (!multiple && v === '') return instance.set('value', null);
+    if (range) {
+      var _context;
+      var _v$split$map = _mapInstanceProperty(_context = v.split(/\s*~\s*/)).call(_context, function (s) {
+          return _trimInstanceProperty(s).call(s);
+        }),
+        start = _v$split$map[0],
+        end = _v$split$map[1];
+      if (start && end) {
+        var startDate = createDateByShowFormat(start);
+        if (!isValidDate(startDate)) {
+          return;
+        }
+        var endDate = createDateByShowFormat(end);
+        if (!isValidDate(endDate)) {
+          return;
+        }
+        if (endDate.isAfter(startDate)) {
+          updateValueOnInput([startDate, endDate]);
+        } else {
+          updateValueOnInput([endDate, startDate]);
+        }
+      }
+    } else {
+      var date = createDateByShowFormat(v);
+      if (isValidDate(date)) {
+        updateValueOnInput(date);
+      }
+    }
+  });
+  function convertToDayjs(v) {
+    if (!v || Array.isArray(v) && !v.length) return [];
+    var _instance$get2 = instance.get(),
+      multiple = _instance$get2.multiple;
+    if (!multiple) {
+      v = [v];
+    }
+    return _mapInstanceProperty(v).call(v, function (value) {
+      if (Array.isArray(value)) {
+        // range
+        return _mapInstanceProperty(value).call(value, createDateByValueFormat);
+      }
+      return createDateByValueFormat(value);
+    });
+  }
+  function convertToValueString(v) {
+    var results = _mapInstanceProperty(v).call(v, function (value) {
+      if (Array.isArray(value)) {
+        return _mapInstanceProperty(value).call(value, getValueString);
+      }
+      return getValueString(value);
+    });
+    if (!instance.get('multiple')) {
+      return results[0] || null;
+    }
+    return results;
+  }
+  function format() {
+    var _instance$get3 = instance.get(),
+      multiple = _instance$get3.multiple;
+    var labelValue = value.value;
+    if (multiple) {
+      labelValue = dayjsValue;
+    }
+    var results = _mapInstanceProperty(labelValue).call(labelValue, formatSingleValue);
+    if (!instance.get('multiple')) {
+      return results[0];
+    }
+    return results;
+  }
+  function formatSingleValue(value) {
+    if (Array.isArray(value)) {
+      if (value.length === 1) {
+        return getShowString(value[0]) + ' ~';
+      }
+      return _mapInstanceProperty(value).call(value, getShowString).join(' ~ ');
+    }
+    return getShowString(value);
+  }
+  function setSingleDate(v, fromInput) {
+    value.set([v]);
+    if (fromInput || shouldUpdateValue(v)) {
+      updateValue();
+    }
+  }
+  function addMultipeDate(v, fromInput) {
+    var _instance$get4 = instance.get(),
+      range = _instance$get4.range;
+    var _value = value.value;
+    _value = !_value ? [] : _sliceInstanceProperty(_value).call(_value);
+    if (range && v.length === 2) {
+      // pop the last value firstly, if it only has the start date 
+      var lastValue = last(_value);
+      if (lastValue && lastValue.length < 2) {
+        _value.pop();
+      }
+    }
+    if (_value.length > dayjsValue.length) {
+      // remove the temporary value added by selecting time directly
+      _value.pop();
+    }
+    var _shouldUpdateValue = true;
+    if (fromInput || shouldUpdateValue(v)) {
+      // if select the date/year/month, then toggle the value.
+      // if from input, treat the value as the final value
+      var index = findValueIndex(_value, v, getEqualType());
+      if (index > -1) {
+        _spliceInstanceProperty(_value).call(_value, index, 1);
+      } else {
+        _value.push(v);
+      }
+    } else {
+      // select the datetime, only push the value,
+      // and unique the array on click confirm button
+      _value.push(v);
+      _shouldUpdateValue = false;
+    }
+    value.set(_value);
+    if (_shouldUpdateValue) {
+      updateValue();
+    }
+  }
+  function setValue(v, fromInput) {
+    var multiple = instance.get('multiple');
+    if (multiple) {
+      addMultipeDate(v, fromInput);
+    } else {
+      setSingleDate(v, fromInput);
+    }
+  }
+  function updateValue() {
+    var _value = value.value;
+    var _instance$get5 = instance.get(),
+      range = _instance$get5.range;
+    if (range) {
+      // only fix the last value, since the others are already fixed 
+      var lastValue = last(_value);
+      if (lastValue) {
+        _sortInstanceProperty(lastValue).call(lastValue, function (a, b) {
+          return a.isAfter(b) ? 1 : -1;
+        });
+      }
+    }
+    var valueStr = convertToValueString(_value);
+    instance.set('value', valueStr);
+    instance.resetKeywords();
+  }
+  // TODO
+  function setMoment() {
+    var now = dayjs();
+    setValue(now, true);
+    instance.hide();
+  }
+  function unique() {
+    var _value = value.value;
+    var map = {};
+    var results = [];
+    _value.forEach(function (value) {
+      var key;
+      if (Array.isArray(value)) {
+        key = _mapInstanceProperty(value).call(value, getValueString).join(' ~ ');
+      } else {
+        key = getValueString(value);
+      }
+      if (!map[key]) {
+        map[key] = true;
+        results.push(value);
+      }
+    });
+    value.set(results);
+  }
+  function isValidDate(date) {
+    return date.isValid() && !isDisabled(date, getEqualType());
+  }
+  function onChangeTime(date, flag) {
+    var _context2;
+    var _instance$get6 = instance.get(),
+      range = _instance$get6.range,
+      multiple = _instance$get6.multiple;
+    var values = _sliceInstanceProperty(_context2 = value.value).call(_context2);
+    // maybe we select time directly
+    var lastIndex = Math.max(values.length - 1, 0);
+    if (allValuesUpdatedInMultipleMode()) {
+      // need add new value, if all value.value has updated to dayjsValue
+      lastIndex = values.length;
+    }
+    var _value = date;
+    if (range) {
+      _value = values[lastIndex];
+      if (_value) {
+        _value = _sliceInstanceProperty(_value).call(_value);
+      } else {
+        _value = [];
+      }
+      _value[flag] = date;
+      instance.trigger('selecting', _value, false);
+    }
+    values[lastIndex] = _value;
+    value.set(values);
+  }
+  function getTimeValue(flag) {
+    var _value = value.value;
+    if (!_value.length) return null;
+    var _instance$get7 = instance.get(),
+      range = _instance$get7.range,
+      min = _instance$get7.min;
+    var lastValue = last(_value);
+    return range ? lastValue[flag] : lastValue;
+  }
+  function getDayjsValue() {
+    return dayjsValue;
+  }
+  function allValuesUpdatedInMultipleMode() {
+    return instance.get('multiple') && value.value.length === dayjsValue.length;
+  }
+  return {
+    value: value,
+    format: format,
+    formatSingleValue: formatSingleValue,
+    onChangeTime: onChangeTime,
+    getTimeValue: getTimeValue,
+    setValue: setValue,
+    convertToDayjs: convertToDayjs,
+    getDayjsValue: getDayjsValue,
+    unique: unique,
+    setMoment: setMoment,
+    updateValue: updateValue,
+    allValuesUpdatedInMultipleMode: allValuesUpdatedInMultipleMode
+  };
+}

package/components/datepicker/useYears.js

@@ -44,10 +44,13 @@ export function useYears(showDate, status, focusDate) {
   }
   function onClick(date) {
     showDate.set(date);
-    if (instance.datepicker.get('type') !== 'year') {
-      instance.type.set('month');
-    } else {
+    var datepickerType = instance.datepicker.get('type');
+    if (datepickerType === 'year') {
       instance.triggerChange(date);
+    } else if (datepickerType === 'quarter') {
+      instance.type.set('quarter');
+    } else {
+      instance.type.set('month');
     }
   }
   return {

package/components/dropdown/dropdown.d.ts

@@ -16,6 +16,7 @@ export interface DropdownProps {
     collison?: Position['collision'];
     of?: 'self' | 'parent' | Event;
     container?: PortalProps['container'];
+    alwaysShowOnClick?: boolean;
 }
 export interface DropdownEvents {
     shouldFocus: [];

package/components/dropdown/dropdown.js

@@ -23,7 +23,8 @@ var typeDefs = {
   // Event is undefined in NodeJs
   of: ['self', 'parent', typeof Event === 'undefined' ? undefined : Event],
   container: [String, Function],
-  collison: ['none', 'fit', 'flip', 'flipfit', Array]
+  collison: ['none', 'fit', 'flip', 'flipfit', Array],
+  alwaysShowOnClick: Boolean
 };
 var defaults = function defaults() {
   return {
@@ -222,14 +223,16 @@ function useDocumentClickForDropdown(dropdown) {
       // case 2: if right click on a trigger and its trigger type is contextmenu, ignore it
       // case 3: if click on a trigger and its trigger type is focus, do nothing 
       // case 3: if click on sub-dropdown, we should also show the parent dropdown, so ignore it
-      var trigger = dropdown.get('trigger');
+      var _dropdown$get = dropdown.get(),
+        trigger = _dropdown$get.trigger,
+        alwaysShowOnClick = _dropdown$get.alwaysShowOnClick;
       if (trigger === 'focus') return;
       var isHover = trigger === 'hover';
-      if (isHover || trigger === 'contextmenu') {
+      if (isHover || trigger === 'contextmenu' || alwaysShowOnClick) {
         var triggerDom = findDomFromVNode(dropdown.$lastInput, true);
         var target = e.target;
         if (containsOrEqual(triggerDom, target)) {
-          if (isHover) return;
+          if (isHover || alwaysShowOnClick) return;
           if (!isHover && e.type === 'contextmenu') return;
         }
       }

package/components/input/index.d.ts

@@ -64,5 +64,7 @@ export declare class Input<V extends Value = Value> extends Component<InputProps
     focus(): void;
     blur(): void;
     select(): void;
+    getStringWidth(str: string): Promise<number>;
+    getSelectionStart(): number | null;
     private clear;
 }

package/components/input/index.js

@@ -76,6 +76,12 @@ export var Input = /*#__PURE__*/function (_Component) {
   _proto.select = function select() {
     selectValue(this.inputRef.value);
   };
+  _proto.getStringWidth = function getStringWidth(str) {
+    return this.autoWidth.getStringWidth(str);
+  };
+  _proto.getSelectionStart = function getSelectionStart() {
+    return this.inputRef.value.selectionStart;
+  };
   _proto.clear = function clear(e) {
     this.set('value', '');
     this.focus();

package/components/input/index.spec.js

@@ -259,4 +259,49 @@ describe('Input', function () {
       }
     }, _callee7);
   })));
+  it('should handle textarea resize correctly', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee8() {
+    var ResizeDemo, _mount8, instance, element, inputElements, resizeNoneElement, resizeVerticalElement, resizeNoneAutoElement, textareas, textarea1, textarea2, computedStyle1, computedStyle2;
+    return _regeneratorRuntime.wrap(function _callee8$(_context10) {
+      while (1) switch (_context10.prev = _context10.next) {
+        case 0:
+          ResizeDemo = /*#__PURE__*/function (_Component2) {
+            _inheritsLoose(ResizeDemo, _Component2);
+            function ResizeDemo() {
+              var _context9;
+              var _this2;
+              for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+                args[_key2] = arguments[_key2];
+              }
+              _this2 = _Component2.call.apply(_Component2, _concatInstanceProperty(_context9 = [this]).call(_context9, args)) || this;
+              _this2.Input = Input;
+              return _this2;
+            }
+            return ResizeDemo;
+          }(Component);
+          ResizeDemo.template = "\n                const {Input} = this;\n                <div>\n                    <Input type=\"textarea\" resize=\"none\" placeholder=\"resize none\" />\n                    <Input type=\"textarea\" resize=\"vertical\" placeholder=\"resize vertical\" />\n                    <Input type=\"textarea\" resize=\"none\" rows=\"auto\" placeholder=\"resize none with auto rows\" />\n                </div>\n            ";
+          _mount8 = mount(ResizeDemo), instance = _mount8[0], element = _mount8[1];
+          inputElements = element.querySelectorAll('.k-input'); // should have k-resize-none class
+          resizeNoneElement = inputElements[0];
+          expect(resizeNoneElement.classList.contains('k-resize-none')).to.be.true;
+          expect(resizeNoneElement.classList.contains('k-resize-vertical')).to.be.false;
+          resizeVerticalElement = inputElements[1];
+          expect(resizeVerticalElement.classList.contains('k-resize-vertical')).to.be.true;
+          expect(resizeVerticalElement.classList.contains('k-resize-none')).to.be.false;
+          // resize="none" with rows="auto" (should have k-resize-none class)
+          resizeNoneAutoElement = inputElements[2];
+          expect(resizeNoneAutoElement.classList.contains('k-resize-none')).to.be.true;
+          // Test CSS computed styles to ensure resize is applied correctly
+          textareas = element.querySelectorAll('.k-textarea');
+          textarea1 = textareas[0];
+          textarea2 = textareas[1];
+          computedStyle1 = getComputedStyle(textarea1);
+          computedStyle2 = getComputedStyle(textarea2);
+          expect(computedStyle1.resize).to.eql('none');
+          expect(computedStyle2.resize).to.eql('vertical');
+        case 19:
+        case "end":
+          return _context10.stop();
+      }
+    }, _callee8);
+  })));
 });

package/components/input/index.vdt.js

@@ -59,7 +59,7 @@ export default function ($props, $blocks, $__proto__) {
     focusInputOnClick = _this$focusHook.focusInputOnClick;
   var isNotAutoRows = isStringOrNumber(rows) && rows !== 'auto';
   var k = this.config.k;
-  var classNameObj = (_classNameObj = {}, _classNameObj[k + "-input"] = true, _classNameObj[k + "-" + size] = size !== 'default', _classNameObj[k + "-group"] = $blocks.prepend || $blocks.append, _classNameObj[k + "-disabled"] = disabled, _classNameObj[k + "-clearable"] = clearable, _classNameObj[k + "-auto-width"] = autoWidth, _classNameObj[k + "-fluid"] = fluid, _classNameObj[k + "-stack-clear"] = stackClearIcon, _classNameObj[k + "-inline"] = inline, _classNameObj[k + "-flat"] = flat, _classNameObj[k + "-type-textarea"] = type === 'textarea', _classNameObj[k + "-focus"] = isFocus.value, _classNameObj[k + "-resize-" + resize] = type === 'textarea' && isNotAutoRows, _classNameObj[k + "-resize-none"] = type === 'textarea' && !isNotAutoRows, _classNameObj[className] = className, _classNameObj[makeStyles(k)] = true, _classNameObj);
+  var classNameObj = (_classNameObj = {}, _classNameObj[k + "-input"] = true, _classNameObj[k + "-" + size] = size !== 'default', _classNameObj[k + "-group"] = $blocks.prepend || $blocks.append, _classNameObj[k + "-disabled"] = disabled, _classNameObj[k + "-clearable"] = clearable, _classNameObj[k + "-auto-width"] = autoWidth, _classNameObj[k + "-fluid"] = fluid, _classNameObj[k + "-stack-clear"] = stackClearIcon, _classNameObj[k + "-inline"] = inline, _classNameObj[k + "-flat"] = flat, _classNameObj[k + "-type-textarea"] = type === 'textarea', _classNameObj[k + "-focus"] = isFocus.value, _classNameObj[k + "-resize-" + (isNotAutoRows ? resize : 'none')] = type === 'textarea', _classNameObj[className] = className, _classNameObj[makeStyles(k)] = true, _classNameObj);
   var _this$showPassword = this.showPassword,
     isShowPassword = _this$showPassword.isShow,
     toggleShowPassword = _this$showPassword.toggleShow,
@@ -67,7 +67,8 @@ export default function ($props, $blocks, $__proto__) {
     showPasswordIcon = _this$showPassword.showIcon;
   var _this$autoWidth = this.autoWidth,
     fakeRef = _this$autoWidth.fakeRef,
-    fakeWidth = _this$autoWidth.width.value;
+    fakeWidth = _this$autoWidth.width.value,
+    forceShowFake = _this$autoWidth.forceShowFake;
   var height = this.autoRows;
   var inputValue = frozenOnInput && inputing ? originalValue : value;
   var hasInputValue = !isNullOrUndefined(inputValue);
@@ -133,7 +134,7 @@ export default function ($props, $blocks, $__proto__) {
           return block ? block.call($this, callBlock, data) : callBlock();
         }, __$blocks['suffix'](_$no))], 0, _$cn(k + "-input-suffix"), {
           'ev-click': stopPropagation
-        }) : undefined, autoWidth ? _$ce(2, 'div', _$ce(2, 'pre', !hasValue ? hasInputValue || !defaultValue ? placeholder : defaultValue : inputValue, 0, null, null, null, fakeRef), 2, _$cn(k + "-input-fake")) : undefined], 0, _$cn(k + "-input-wrapper"), {
+        }) : undefined, autoWidth || forceShowFake.value ? _$ce(2, 'div', _$ce(2, 'pre', !hasValue ? hasInputValue || !defaultValue ? placeholder : defaultValue : inputValue, 0, null, null, null, fakeRef), 2, _$cn(k + "-input-fake")) : undefined], 0, _$cn(k + "-input-wrapper"), {
           'ev-click': focusInputOnClick
         })
       });

package/components/input/useAutoWidth.d.ts

@@ -1,4 +1,6 @@
 export declare function useAutoWidth(): {
     fakeRef: import('intact-vue-next').RefObject<HTMLDivElement>;
     width: import("../../hooks/useState").State<number>;
+    forceShowFake: import("../../hooks/useState").State<boolean>;
+    getStringWidth: (str: string) => Promise<number>;
 };

package/components/input/useAutoWidth.js

@@ -1,9 +1,11 @@
+import _Promise from "@babel/runtime-corejs3/core-js/promise";
 import { useInstance, createRef, onMounted, nextTick } from 'intact-vue-next';
 import { useState } from '../../hooks/useState';
 export function useAutoWidth() {
   var instance = useInstance();
   var fakeRef = createRef();
   var width = useState(0);
+  var forceShowFake = useState(false);
   instance.watch('value', adjustWidth, {
     inited: true,
     presented: true
@@ -24,9 +26,25 @@ export function useAutoWidth() {
       });
     }
   }
+  function getStringWidth(str) {
+    forceShowFake.set(true);
+    return new _Promise(function (resolve) {
+      nextTick(function () {
+        var fakeElem = fakeRef.value;
+        var textNode = fakeElem.firstChild;
+        var oldStr = textNode.nodeValue;
+        textNode.nodeValue = str;
+        resolve(fakeElem.offsetWidth);
+        textNode.nodeValue = oldStr;
+        forceShowFake.set(false);
+      });
+    });
+  }
   return {
     fakeRef: fakeRef,
-    width: width
+    width: width,
+    forceShowFake: forceShowFake,
+    getStringWidth: getStringWidth
   };
 }
 function isVisible(elem) {

package/components/scrollSelect/useMouseEvents.js

@@ -12,6 +12,7 @@ export function useMouseEvents(translate, list) {
   var y;
   var itemHeight;
   var deltaY;
+  var wheelDeltaY = 0;
   var _useDraggable = useDraggable({
       onStart: function onStart(e) {
         dragged = false;
@@ -61,14 +62,14 @@ export function useMouseEvents(translate, list) {
     e.preventDefault();
     itemHeight = getItemHeight();
     var threshold = itemHeight * 0.6;
-    deltaY = (deltaY || 0) + e.deltaY;
-    if (Math.abs(deltaY) >= threshold) {
-      if (deltaY > 0) {
+    wheelDeltaY += e.deltaY;
+    if (Math.abs(wheelDeltaY) >= threshold) {
+      if (wheelDeltaY > 0) {
         setByRelativeIndex(1, null, true);
       } else {
         setByRelativeIndex(-1, null, true);
       }
-      deltaY = 0;
+      wheelDeltaY = 0;
     }
   }
   // throttle onWheel

package/components/select/base.d.ts

@@ -67,7 +67,7 @@ export declare abstract class BaseSelect<T extends BaseSelectProps<any> = BaseSe
     position(): void;
     show(): void;
     hide(): void;
-    resetKeywords(keywords: State<string>): void;
+    resetKeywords(): void;
     protected hasValue(): any;
     private delete;
     protected clear(e: MouseEvent): void;

package/components/select/base.js

@@ -90,8 +90,8 @@ export var BaseSelect = /*#__PURE__*/function (_Component) {
   _proto.hide = function hide() {
     this.set('show', false);
   };
-  _proto.resetKeywords = function resetKeywords(keywords) {
-    keywords.set('');
+  _proto.resetKeywords = function resetKeywords() {
+    this.input.keywords.set('');
   };
   _proto.hasValue = function hasValue() {
     var _this$get = this.get(),
@@ -142,5 +142,6 @@ BaseSelect.events = events;
 __decorate([bind], BaseSelect.prototype, "position", null);
 __decorate([bind], BaseSelect.prototype, "show", null);
 __decorate([bind], BaseSelect.prototype, "hide", null);
+__decorate([bind], BaseSelect.prototype, "resetKeywords", null);
 __decorate([bind], BaseSelect.prototype, "clear", null);
 __decorate([bind], BaseSelect.prototype, "onKeydown", null);

package/components/select/base.vdt.js

@@ -87,6 +87,7 @@ export default function ($props, $blocks, $__proto__) {
           'disabled': disabled,
           'container': container,
           'position': position,
+          'alwaysShowOnClick': $props.alwaysShowOnClick,
           'children': [_$cv('div', _extends({}, getRestProps(_this), {
             'className': _$cn(classNameObj),
             'tabindex': disabled ? '-1' : '0',
@@ -95,7 +96,8 @@ export default function ($props, $blocks, $__proto__) {
             'style': !isNullOrUndefined(width) ? addStyle(style, {
               width: width + "px"
             }) : style,
-            'ref': triggerRef
+            'ref': triggerRef,
+            'ev-click': $props.onClick
           }), [$blocks.prefix ? _$ce(2, 'div', (_$blocks['prefix'] = function ($super) {
             return null;
           }, __$blocks['prefix'] = function ($super, data) {
@@ -123,8 +125,7 @@ export default function ($props, $blocks, $__proto__) {
               'key': 'input',
               'readonly': !show,
               'waveDisabled': true,
-              'flat': flat,
-              'ev-click': $props.onClick
+              'flat': flat
             }, 'input', inputRef) : !filterable && !hasValue ? _$ce(2, 'div', placeholder, 0, _$cn(k + "-select-placeholder c-ellipsis"), null, 'placeholder') : !multiple ? _$ce(2, 'div', (_$blocks['value'] = function ($super) {
               return label;
             }, __$blocks['value'] = function ($super, data) {