xdesign-vue-next/cjs/input/useInputWidth.js

XDesign Component for vue-next

/**
 * xdesign v1.0.6
 * (c) 2023 xdesign
 * @license MIT
 */

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var isUndefined = require('lodash/isUndefined');
var vue = require('vue');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var isUndefined__default = /*#__PURE__*/_interopDefaultLegacy(isUndefined);

function useInputWidth(props, inputRef, innerValue) {
  var inputPreRef = vue.ref(null);
  var composing = vue.ref(false);
  var updateInputWidth = function updateInputWidth() {
    if (!inputPreRef.value || !inputRef.value) return;
    var _inputPreRef$value$ge = inputPreRef.value.getBoundingClientRect(),
      width = _inputPreRef$value$ge.width;
    inputRef.value.style.width = "".concat(width || 0, "px");
  };
  var addListeners = function addListeners() {
    vue.watch(function () {
      return innerValue.value + props.placeholder;
    }, function () {
      if (!props.autoWidth) return;
      vue.nextTick(function () {
        updateInputWidth();
      });
    }, {
      immediate: true
    });
  };
  vue.onMounted(function () {
    composing.value = false;
    if (props.autoWidth) {
      addListeners();
    }
  });
  var resizeObserver = vue.ref(null);
  var addTableResizeObserver = function addTableResizeObserver(element) {
    if (typeof window === "undefined") return;
    if (isUndefined__default["default"](window.ResizeObserver) || !element) return;
    resizeObserver.value = new window.ResizeObserver(function () {
      updateInputWidth();
    });
    resizeObserver.value.observe(element);
  };
  vue.onMounted(function () {
    addTableResizeObserver(inputPreRef.value);
  });
  vue.onBeforeUnmount(function () {
    var _resizeObserver$value, _resizeObserver$value2;
    (_resizeObserver$value = resizeObserver.value) === null || _resizeObserver$value === void 0 ? void 0 : _resizeObserver$value.unobserve(inputPreRef.value);
    (_resizeObserver$value2 = resizeObserver.value) === null || _resizeObserver$value2 === void 0 ? void 0 : _resizeObserver$value2.disconnect();
  });
  return {
    inputPreRef: inputPreRef
  };
}

exports["default"] = useInputWidth;
//# sourceMappingURL=useInputWidth.js.map