tdesign-vue-next/cjs/color-picker/components/trigger/index.js

TDesign Component for vue-next

/**
 * tdesign v1.11.5
 * (c) 2025 tdesign
 * @license MIT
 */

'use strict';

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

var _defineProperty = require('@babel/runtime/helpers/defineProperty');
var Vue = require('vue');
var input_index = require('../../../input/index.js');
var color = require('../../../_chunks/dep-3b785e4a.js');
require('@babel/runtime/helpers/classCallCheck');
require('@babel/runtime/helpers/createClass');
var colorPicker_hooks_index = require('../../hooks/index.js');
var hooks_useConfig = require('../../../hooks/useConfig.js');
require('../../../input/input.js');
require('@babel/runtime/helpers/objectWithoutProperties');
require('tdesign-icons-vue-next');
require('../../../input/props.js');
require('../../../hooks/useDisabled.js');
require('../../../_chunks/dep-82a90f9f.js');
require('../../../_chunks/dep-bbe343d7.js');
require('@babel/runtime/helpers/typeof');
require('../../../_chunks/dep-0c2ad01b.js');
require('../../../hooks/useReadonly.js');
require('../../../hooks/useGlobalIcon.js');
require('../../../config-provider/hooks/useConfig.js');
require('../../../_chunks/dep-b4c4a54b.js');
require('../../../_chunks/dep-f8ff548f.js');
require('../../../_chunks/dep-30fb1b25.js');
require('dayjs');
require('../../../_chunks/dep-b6c192db.js');
require('../../../_chunks/dep-ba2090c8.js');
require('../../../_chunks/dep-b27d3215.js');
require('../../../_chunks/dep-ed572eb3.js');
require('../../../_chunks/dep-047617bf.js');
require('../../../_chunks/dep-0a510359.js');
require('../../../_chunks/dep-50a41d31.js');
require('../../../_chunks/dep-be3c3d53.js');
require('../../../_chunks/dep-5ad8a2ab.js');
require('../../../_chunks/dep-8b98fa07.js');
require('../../../_chunks/dep-b0b4fff1.js');
require('../../../_chunks/dep-7a21da5b.js');
require('../../../_chunks/dep-49fa220e.js');
require('../../../_chunks/dep-02ebb419.js');
require('../../../_chunks/dep-feae46a3.js');
require('../../../_chunks/dep-abf21389.js');
require('../../../_chunks/dep-7f32423d.js');
require('../../../_chunks/dep-7c9e3d93.js');
require('../../../_chunks/dep-61a7e281.js');
require('../../../_chunks/dep-ecbaedee.js');
require('../../../_chunks/dep-9de7d250.js');
require('../../../_chunks/dep-6f8a66a3.js');
require('../../../_chunks/dep-b8b9c2a3.js');
require('../../../_chunks/dep-a69ce597.js');
require('../../../utils/render-tnode.js');
require('../../../_chunks/dep-db023c41.js');
require('../../../_chunks/dep-e495f218.js');
require('../../../_chunks/dep-bafc1f63.js');
require('../../../_chunks/dep-c07d6878.js');
require('../../../_chunks/dep-a957c564.js');
require('../../../_chunks/dep-acb090bf.js');
require('../../../_chunks/dep-76218bd8.js');
require('../../../_chunks/dep-9a321a91.js');
require('../../../input/hooks/useInput.js');
require('@babel/runtime/helpers/slicedToArray');
require('../../../form/consts/index.js');
require('../../../hooks/useKeepAnimation.js');
require('../../../hooks/useVModel.js');
require('../../../input/hooks/useLengthLimit.js');
require('../../../_chunks/dep-cef23b69.js');
require('../../../_chunks/dep-25acc189.js');
require('@babel/runtime/helpers/toConsumableArray');
require('../../../_chunks/dep-93cf0a54.js');
require('../../../_chunks/dep-8afe2bf0.js');
require('../../../_chunks/dep-cea0dc9b.js');
require('../../../input/hooks/useInputEventHandler.js');
require('../../../input/hooks/useInputWidth.js');
require('../../../hooks/useResizeObserver.js');
require('../../../input/input-group.js');
require('../../../input/input-group-props.js');
require('../../../utils/withInstall.js');
require('tinycolor2');

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

var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);

var DefaultTrigger = Vue.defineComponent({
  name: "DefaultTrigger",
  inheritAttrs: false,
  props: {
    color: {
      type: String,
      "default": ""
    },
    disabled: {
      type: Boolean,
      "default": false
    },
    borderless: {
      type: Boolean,
      "default": false
    },
    clearable: {
      type: Boolean,
      "default": false
    },
    inputProps: {
      type: Object,
      "default": function _default() {
        return {
          autoWidth: true
        };
      }
    },
    onTriggerChange: {
      type: Function,
      "default": function _default() {
        return function () {};
      }
    },
    size: {
      type: String,
      "default": "medium"
    }
  },
  setup: function setup(props) {
    var baseClassName = colorPicker_hooks_index.useBaseClassName();
    var value = Vue.ref(props.color);
    var _useCommonClassName = hooks_useConfig.useCommonClassName(),
      sizeClassNames = _useCommonClassName.SIZE;
    Vue.watch(function () {
      return [props.color];
    }, function () {
      return value.value = props.color;
    });
    var handleChange = function handleChange(input) {
      if (input === props.color) {
        return;
      }
      if (input && !color.Color.isValid(input)) {
        value.value = props.color;
      } else {
        value.value = input;
      }
      props.onTriggerChange(value.value);
    };
    return function () {
      var inputSlots = {
        label: function label() {
          return Vue.createVNode("div", {
            "class": ["".concat(baseClassName.value, "__trigger--default__color"), "".concat(baseClassName.value, "--bg-alpha")]
          }, [Vue.createVNode("span", {
            "class": ["color-inner", _defineProperty__default["default"]({}, sizeClassNames.value[props.size], props.size !== "medium")],
            "style": {
              background: value.value
            }
          }, null)]);
        }
      };
      return Vue.createVNode(input_index.Input, Vue.mergeProps({
        "borderless": props.borderless,
        "clearable": props.clearable,
        "size": props.size,
        "modelValue": value.value,
        "onUpdate:modelValue": function onUpdateModelValue($event) {
          return value.value = $event;
        },
        "disabled": props.disabled,
        "onBlur": handleChange,
        "onChange": handleChange
      }, props.inputProps), inputSlots);
    };
  }
});

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