@veltra/desktop 1.0.8 → 1.0.9

package/dist/components/multi-select/multi-select.js.map

@@ -1 +1 @@
-{"version":3,"file":"multi-select.js","names":[],"sources":["../../../src/components/multi-select/multi-select.vue"],"sourcesContent":["<template>\n  <u-dropdown\n    v-if=\"!readonly\"\n    trigger=\"click\"\n    ref=\"dropdownRef\"\n    :class=\"[cls.b, cls.m(size), bem.is('disabled', disabled)]\"\n    :content-class=\"[cls.e('panel'), cls.em('panel', size), contentClass]\"\n    :content-style=\"contentStyle\"\n    :min-width=\"minWidth\"\n    :width=\"width\"\n    @mouseenter=\"hovered = true\"\n    @mouseleave=\"hovered = false\"\n    :disabled=\"disabled\"\n    @update:visible=\"handleDropdownVisible\"\n  >\n    <!-- 触发 -->\n    <template #trigger>\n      <span :class=\"cls.e('placeholder')\" v-show=\"!model?.length\">\n        {{ placeholder }}\n      </span>\n\n      <div v-if=\"model?.length\" :class=\"cls.e('tags')\">\n        <u-tag\n          v-for=\"option of tags\"\n          :key=\"option[valueKey]\"\n          :closable=\"!disabled\"\n          @close=\"handleClose(option)\"\n        >\n          {{ option[labelKey] }}\n        </u-tag>\n        <u-tag v-if=\"restTag\"> {{ restTag }}+ </u-tag>\n      </div>\n\n      <transition name=\"zoom-in\" mode=\"out-in\">\n        <u-icon\n          v-if=\"clearable && model?.length && hovered && !disabled\"\n          :class=\"cls.e('clear')\"\n          @click.stop=\"handleClear\"\n        >\n          <Close />\n        </u-icon>\n\n        <u-icon :class=\"cls.e('arrow')\" v-else><ArrowDown /></u-icon>\n      </transition>\n    </template>\n\n    <!-- 下拉内容 -->\n    <template #content>\n      <!-- 多选栏 -->\n      <div :class=\"cls.e('content-header')\">\n        <u-checkbox\n          :model-value=\"allChecked\"\n          :indeterminate=\"indeterminate\"\n          @update:model-value=\"handleCheckAll\"\n          :disabled=\"max !== undefined\"\n        >\n          全选\n        </u-checkbox>\n\n        <span> 已选 {{ model?.length }}/{{ max ?? options?.length ?? 0 }} </span>\n      </div>\n\n      <!-- 过滤器 -->\n      <div v-if=\"filterable\" :class=\"cls.e('content-filter')\">\n        <u-input\n          placeholder=\"输入关键字进行过滤\"\n          v-model=\"queryString\"\n          @keydown.enter.prevent=\"handleCreateByEnter\"\n        >\n          <template #suffix>\n            <u-icon><Search /></u-icon>\n          </template>\n        </u-input>\n      </div>\n\n      <!-- 多选列表 -->\n      <u-scroll\n        tag=\"ul\"\n        :class=\"[cls.e('options')]\"\n        ref=\"scrollRef\"\n        v-if=\"options.length\"\n        :content-class=\"[cls.e('options-wrap'), bem.is('virtual', virtualEnabled)]\"\n        :content-style=\"{ height: virtualEnabled ? withUnit(totalHeight, 'px') : undefined }\"\n      >\n        <template v-if=\"virtualEnabled\">\n          <u-multi-select-option\n            v-for=\"{ option, index, key, label, offset } of virtualOptions\"\n            :option=\"option\"\n            :disabled=\"isDisabled(option)\"\n            :key=\"key\"\n            :style=\"{ transform: `translateY(${offset}px)` }\"\n            @check=\"handleCheck(option, $event)\"\n            :checked=\"checkedSet.has(option)\"\n            :data-index=\"index\"\n            :measure-element=\"measureElement\"\n          >\n            <slot v-bind=\"{ option, index }\">\n              {{ label }}\n            </slot>\n          </u-multi-select-option>\n        </template>\n\n        <template v-else>\n          <u-multi-select-option\n            v-for=\"(option, index) of options\"\n            :option=\"option\"\n            :disabled=\"isDisabled(option)\"\n            :key=\"chainObj(option).get(valueKey)\"\n            @check=\"handleCheck(option, $event)\"\n            :checked=\"checkedSet.has(option)\"\n          >\n            <slot v-bind=\"{ option, index }\">\n              {{ chainObj(option).get(labelKey) }}\n            </slot>\n          </u-multi-select-option>\n        </template>\n      </u-scroll>\n\n      <div v-else :class=\"cls.e('empty')\">\n        <UEmpty />\n      </div>\n    </template>\n  </u-dropdown>\n\n  <div v-else-if=\"model?.length\" :class=\"[cls.m(size), cls.e('readonly-tags')]\">\n    <div :class=\"cls.e('tags')\">\n      <u-tag v-for=\"option of tags\" :key=\"option[valueKey]\">\n        {{ option[labelKey] }}\n      </u-tag>\n    </div>\n  </div>\n\n  <template v-else>\n    {{ FORM_EMPTY_CONTENT }}\n  </template>\n</template>\n\n<script lang=\"ts\" setup>\nimport { o as chainObj } from '@cat-kit/core'\nimport { useFormComponent, useFormFallbackProps, useVirtual } from '@veltra/compositions'\nimport { ArrowDown, Close, Search } from '@veltra/icons/normal'\nimport { bem, FORM_EMPTY_CONTENT, withUnit } from '@veltra/utils'\nimport { computed, shallowRef, shallowReactive, watch, provide } from 'vue'\n\nimport type {\n  MultiSelectEmits,\n  MultiSelectProps,\n  ScrollExposed,\n  DropdownExposed\n} from '../../types'\nimport { UCheckbox } from '../checkbox'\nimport { UDropdown } from '../dropdown'\nimport { UEmpty } from '../empty'\nimport { UIcon } from '../icon'\nimport { UInput } from '../input'\nimport { UScroll } from '../scroll'\nimport { useOptions } from '../select/use-options'\nimport { UTag } from '../tag'\nimport { MultiSelectDIKey } from './di'\nimport UMultiSelectOption from './multi-select-option.vue'\n\ndefineOptions({ name: 'MultiSelect' })\n\nconst props = withDefaults(defineProps<MultiSelectProps>(), {\n  labelKey: 'label',\n  valueKey: 'value',\n  placeholder: '请选择',\n  clearable: true,\n  visibilityLimit: 3,\n  disabled: undefined,\n  readonly: undefined,\n  minWidth: '220px'\n})\n\nconst emit = defineEmits<MultiSelectEmits>()\n\nconst cls = bem('multi-select')\n\nconst { formProps } = useFormComponent()\n\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props], {\n  size: 'default',\n  disabled: false,\n  readonly: false\n})\n\nconst scrollRef = shallowRef<ScrollExposed>()\n\nconst hovered = shallowRef(false)\n\nconst { options: rawOptions, queryString, allOptions: rawAllOptions } = useOptions({ props })\n\nconst createdOptions = shallowRef<Record<string, any>[]>([])\n\nconst options = computed(() => {\n  const base = rawOptions.value\n  if (!props.creatable || !createdOptions.value.length) return base\n\n  const { valueKey } = props\n  const createdValues = new Set(createdOptions.value.map((o) => chainObj(o).get(valueKey)))\n  const deduped = base.filter((o) => !(o.__isTemp && createdValues.has(chainObj(o).get(valueKey))))\n  const dedupedValues = new Set(deduped.map((o) => chainObj(o).get(valueKey)))\n  const toAdd = createdOptions.value.filter((o) => !dedupedValues.has(chainObj(o).get(valueKey)))\n  return [...toAdd, ...deduped]\n})\n\nconst allOptions = computed(() => {\n  if (!props.creatable || !createdOptions.value.length) return rawAllOptions.value\n  return [...createdOptions.value, ...rawAllOptions.value]\n})\n\nconst { totalHeight, virtualList, virtualEnabled, measureElement } = useVirtual({\n  virtualThreshold: 80,\n  estimateSize: () => 40,\n  count: computed(() => options.value.length),\n  scrollEl: computed(() => scrollRef.value?.containerRef ?? null)\n})\n\nconst virtualOptions = computed(() => {\n  const { valueKey, labelKey } = props\n  const _options = options.value\n  return virtualList.value.map((v) => {\n    const option = _options[v.index]!\n    const val = chainObj(option).get(valueKey)\n    return {\n      option,\n      index: v.index,\n      val,\n      key: v.key,\n      offset: v.start,\n      label: chainObj(option).get(labelKey)\n    }\n  })\n})\n\nconst filterable = computed(() => {\n  return props.filterable || props.creatable || typeof props.options === 'function'\n})\n\nconst model = defineModel<Array<string | number>>()\n\nconst checkedSet = shallowReactive<Set<Record<string, any>>>(new Set())\nconst allChecked = computed(() => {\n  return checkedSet.size === options.value.length\n})\nconst indeterminate = computed(() => {\n  return checkedSet.size > 0 && !allChecked.value\n})\n\nconst optionsMap = computed(() => {\n  const { valueKey } = props\n  return new Map<string | number, Record<string, any>>(\n    allOptions.value.map((option) => [option[valueKey], option])\n  )\n})\n\nconst dropdownRef = shallowRef<DropdownExposed>()\n\nlet internalChange = false\n\nwatch(\n  [model, optionsMap],\n  ([model, optionsMap]) => {\n    if (internalChange) {\n      internalChange = false\n      return\n    }\n    checkedSet.clear()\n    if (optionsMap.size && model?.length) {\n      model.forEach((v) => {\n        const option = optionsMap.get(v)\n        option && checkedSet.add(option)\n      })\n    }\n  },\n  { immediate: true }\n)\n\nconst emitChange = () => {\n  emit('change', Array.from(checkedSet))\n}\n\nconst tags = computed(() => {\n  let tags: Record<string, any>[] = []\n  let { visibilityLimit } = props\n  if (visibilityLimit < 0) {\n    visibilityLimit = 0\n  }\n\n  // 禁用时，显示全部\n  if (disabled.value || readonly.value) {\n    visibilityLimit = model.value?.length ?? 0\n  }\n\n  model.value?.slice(0, visibilityLimit).forEach((k) => {\n    const option = optionsMap.value.get(k)\n    option && tags.push(option)\n  })\n\n  return tags\n})\n\nconst restTag = computed(() => {\n  return (model.value?.length ?? 0) - tags.value.length\n})\n\nconst handleDropdownVisible = (visible: boolean) => {\n  if (!visible) {\n    queryString.value = ''\n  }\n}\n\nconst handleCheck = (option: Record<string, any>, checked: boolean) => {\n  const { valueKey, labelKey } = props\n  if (checked) {\n    if (option.__isTemp && props.creatable) {\n      const created: Record<string, any> = {\n        [labelKey]: chainObj(option).get(labelKey),\n        [valueKey]: chainObj(option).get(valueKey)\n      }\n      createdOptions.value = [...createdOptions.value, created]\n      checkedSet.add(created)\n      internalChange = true\n      model.value = [...(model.value ?? []), chainObj(created).get(valueKey)]\n      queryString.value = ''\n    } else if (!checkedSet.has(option)) {\n      checkedSet.add(option)\n      internalChange = true\n      model.value = [...(model.value ?? []), chainObj(option).get(valueKey)]\n    }\n  } else {\n    checkedSet.delete(option)\n    const val = chainObj(option).get(valueKey)\n    internalChange = true\n    model.value = (model.value ?? []).filter((v) => v !== val)\n    removeCreatedOption(option)\n  }\n\n  emitChange()\n  dropdownRef.value?.updateDropdown()\n}\n\n/** 全选 */\nconst handleCheckAll = (checked: boolean) => {\n  const { valueKey } = props\n  if (checked) {\n    options.value.forEach((option) => {\n      if (!option.__isTemp) checkedSet.add(option)\n    })\n    internalChange = true\n    model.value = Array.from(checkedSet).map((o) => chainObj(o).get(valueKey))\n  } else {\n    checkedSet.clear()\n    internalChange = true\n    model.value = []\n    if (props.creatable) {\n      createdOptions.value = []\n    }\n  }\n\n  emitChange()\n  dropdownRef.value?.updateDropdown()\n}\n\n/** 清除选项 */\nconst handleClear = () => {\n  checkedSet.clear()\n  internalChange = true\n  model.value = []\n  if (props.creatable) {\n    createdOptions.value = []\n  }\n  emit('change', [])\n}\n\nconst handleClose = (option: Record<string, any>) => {\n  checkedSet.delete(option)\n  const val = chainObj(option).get(props.valueKey)\n  internalChange = true\n  model.value = (model.value ?? []).filter((v) => v !== val)\n  removeCreatedOption(option)\n  emitChange()\n}\n\nconst removeCreatedOption = (option: Record<string, any>) => {\n  if (!props.creatable || !createdOptions.value.length) return\n  const { valueKey } = props\n  const val = chainObj(option).get(valueKey)\n  createdOptions.value = createdOptions.value.filter((o) => chainObj(o).get(valueKey) !== val)\n}\n\nconst handleCreateByEnter = () => {\n  if (!props.creatable) return\n  const qs = queryString.value?.trim()\n  if (!qs) return\n\n  const { labelKey, valueKey } = props\n\n  const existingCreated = createdOptions.value.find((o) => chainObj(o).get(valueKey) === qs)\n  if (existingCreated) {\n    if (!checkedSet.has(existingCreated)) {\n      checkedSet.add(existingCreated)\n      internalChange = true\n      model.value = [...(model.value ?? []), chainObj(existingCreated).get(valueKey)]\n    }\n    queryString.value = ''\n    emitChange()\n    dropdownRef.value?.updateDropdown()\n    return\n  }\n\n  const exactMatch = rawOptions.value.find((o) => !o.__isTemp && chainObj(o).get(labelKey) === qs)\n  if (exactMatch) {\n    if (!checkedSet.has(exactMatch)) {\n      checkedSet.add(exactMatch)\n      internalChange = true\n      model.value = [...(model.value ?? []), chainObj(exactMatch).get(valueKey)]\n    }\n    queryString.value = ''\n    emitChange()\n    dropdownRef.value?.updateDropdown()\n    return\n  }\n\n  const created: Record<string, any> = { [labelKey]: qs, [valueKey]: qs }\n  createdOptions.value = [...createdOptions.value, created]\n  checkedSet.add(created)\n  internalChange = true\n  model.value = [...(model.value ?? []), qs]\n  queryString.value = ''\n  emitChange()\n  dropdownRef.value?.updateDropdown()\n}\n\nconst isDisabled = (option: Record<string, any>) => {\n  const { max } = props\n  return max !== undefined && checkedSet.size >= max && !checkedSet.has(option)\n}\n\nconst optionClass = cls.e('option')\nconst rippleClass = cls.e('ripple')\nconst checkboxClass = cls.e('checkbox')\n\nprovide(MultiSelectDIKey, { optionClass, rippleClass, checkboxClass })\n</script>\n"],"mappings":"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"}
+{"version":3,"file":"multi-select.js","names":[],"sources":["../../../src/components/multi-select/multi-select.vue"],"sourcesContent":["<template>\n  <u-dropdown\n    v-if=\"!readonly\"\n    trigger=\"click\"\n    ref=\"dropdownRef\"\n    :class=\"[cls.b, cls.m(size), bem.is('disabled', disabled)]\"\n    :content-class=\"[cls.e('panel'), cls.em('panel', size), contentClass]\"\n    :content-style=\"contentStyle\"\n    :min-width=\"minWidth\"\n    :width=\"width\"\n    @mouseenter=\"hovered = true\"\n    @mouseleave=\"hovered = false\"\n    :disabled=\"disabled\"\n    @update:visible=\"handleDropdownVisible\"\n  >\n    <!-- 触发 -->\n    <template #trigger>\n      <span :class=\"cls.e('placeholder')\" v-show=\"!model?.length\">\n        {{ placeholder }}\n      </span>\n\n      <div v-if=\"model?.length\" :class=\"cls.e('tags')\">\n        <u-tag\n          v-for=\"option of tags\"\n          :key=\"option[valueKey]\"\n          :closable=\"!disabled\"\n          @close=\"handleClose(option)\"\n        >\n          {{ option[labelKey] }}\n        </u-tag>\n        <u-tag v-if=\"restTag\"> {{ restTag }}+ </u-tag>\n      </div>\n\n      <transition name=\"zoom-in\" mode=\"out-in\">\n        <u-icon\n          v-if=\"clearable && model?.length && hovered && !disabled\"\n          :class=\"cls.e('clear')\"\n          @click.stop=\"handleClear\"\n        >\n          <Close />\n        </u-icon>\n\n        <u-icon :class=\"cls.e('arrow')\" v-else><ArrowDown /></u-icon>\n      </transition>\n    </template>\n\n    <!-- 下拉内容 -->\n    <template #content>\n      <!-- 多选栏 -->\n      <div :class=\"cls.e('content-header')\">\n        <u-checkbox\n          :model-value=\"allChecked\"\n          :indeterminate=\"indeterminate\"\n          @update:model-value=\"handleCheckAll\"\n          :disabled=\"max !== undefined\"\n        >\n          全选\n        </u-checkbox>\n\n        <span> 已选 {{ model?.length }}/{{ max ?? options?.length ?? 0 }} </span>\n      </div>\n\n      <!-- 过滤器 -->\n      <div v-if=\"filterable\" :class=\"cls.e('content-filter')\">\n        <u-input\n          placeholder=\"输入关键字进行过滤\"\n          v-model=\"queryString\"\n          @keydown.enter.prevent=\"handleCreateByEnter\"\n        >\n          <template #suffix>\n            <u-icon><Search /></u-icon>\n          </template>\n        </u-input>\n      </div>\n\n      <!-- 多选列表 -->\n      <!--\n        虚拟化启用时内容容器 height 由 useVirtualizer 命令式写入；\n        模板不再绑定 totalSize，避免尺寸变化引起重渲染。\n      -->\n      <u-scroll\n        tag=\"ul\"\n        :class=\"[cls.e('options')]\"\n        ref=\"scrollRef\"\n        v-if=\"options.length\"\n        :content-class=\"[cls.e('options-wrap'), bem.is('virtual', virtualEnabled)]\"\n      >\n        <template v-if=\"virtualEnabled\">\n          <u-multi-select-option\n            v-for=\"{ option, index, key, label, offset } of virtualOptions\"\n            :option=\"option\"\n            :disabled=\"isDisabled(option)\"\n            :key=\"key\"\n            :style=\"{ transform: `translateY(${offset}px)` }\"\n            @check=\"handleCheck(option, $event)\"\n            :checked=\"checkedSet.has(option)\"\n            :index=\"index\"\n            :measure-element=\"measureElement\"\n          >\n            <slot v-bind=\"{ option, index }\">\n              {{ label }}\n            </slot>\n          </u-multi-select-option>\n        </template>\n\n        <template v-else>\n          <u-multi-select-option\n            v-for=\"(option, index) of options\"\n            :option=\"option\"\n            :disabled=\"isDisabled(option)\"\n            :key=\"chainObj(option).get(valueKey)\"\n            @check=\"handleCheck(option, $event)\"\n            :checked=\"checkedSet.has(option)\"\n          >\n            <slot v-bind=\"{ option, index }\">\n              {{ chainObj(option).get(labelKey) }}\n            </slot>\n          </u-multi-select-option>\n        </template>\n      </u-scroll>\n\n      <div v-else :class=\"cls.e('empty')\">\n        <UEmpty />\n      </div>\n    </template>\n  </u-dropdown>\n\n  <div v-else-if=\"model?.length\" :class=\"[cls.m(size), cls.e('readonly-tags')]\">\n    <div :class=\"cls.e('tags')\">\n      <u-tag v-for=\"option of tags\" :key=\"option[valueKey]\">\n        {{ option[labelKey] }}\n      </u-tag>\n    </div>\n  </div>\n\n  <template v-else>\n    {{ FORM_EMPTY_CONTENT }}\n  </template>\n</template>\n\n<script lang=\"ts\" setup>\nimport { o as chainObj } from '@cat-kit/core'\nimport { useFormComponent, useFormFallbackProps, useVirtualizer } from '@veltra/compositions'\nimport { ArrowDown, Close, Search } from '@veltra/icons/normal'\nimport { bem, FORM_EMPTY_CONTENT } from '@veltra/utils'\nimport { computed, shallowRef, shallowReactive, watch, provide } from 'vue'\n\nimport type {\n  MultiSelectEmits,\n  MultiSelectProps,\n  ScrollExposed,\n  DropdownExposed\n} from '../../types'\nimport { UCheckbox } from '../checkbox'\nimport { UDropdown } from '../dropdown'\nimport { UEmpty } from '../empty'\nimport { UIcon } from '../icon'\nimport { UInput } from '../input'\nimport { UScroll } from '../scroll'\nimport { useOptions } from '../select/use-options'\nimport { UTag } from '../tag'\nimport { MultiSelectDIKey } from './di'\nimport UMultiSelectOption from './multi-select-option.vue'\n\ndefineOptions({ name: 'MultiSelect' })\n\nconst props = withDefaults(defineProps<MultiSelectProps>(), {\n  labelKey: 'label',\n  valueKey: 'value',\n  placeholder: '请选择',\n  clearable: true,\n  visibilityLimit: 3,\n  disabled: undefined,\n  readonly: undefined,\n  minWidth: '220px'\n})\n\nconst emit = defineEmits<MultiSelectEmits>()\n\nconst cls = bem('multi-select')\n\nconst { formProps } = useFormComponent()\n\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props], {\n  size: 'default',\n  disabled: false,\n  readonly: false\n})\n\nconst scrollRef = shallowRef<ScrollExposed>()\n\nconst hovered = shallowRef(false)\n\nconst { options: rawOptions, queryString, allOptions: rawAllOptions } = useOptions({ props })\n\nconst createdOptions = shallowRef<Record<string, any>[]>([])\n\nconst options = computed(() => {\n  const base = rawOptions.value\n  if (!props.creatable || !createdOptions.value.length) return base\n\n  const { valueKey } = props\n  const createdValues = new Set(createdOptions.value.map((o) => chainObj(o).get(valueKey)))\n  const deduped = base.filter((o) => !(o.__isTemp && createdValues.has(chainObj(o).get(valueKey))))\n  const dedupedValues = new Set(deduped.map((o) => chainObj(o).get(valueKey)))\n  const toAdd = createdOptions.value.filter((o) => !dedupedValues.has(chainObj(o).get(valueKey)))\n  return [...toAdd, ...deduped]\n})\n\nconst allOptions = computed(() => {\n  if (!props.creatable || !createdOptions.value.length) return rawAllOptions.value\n  return [...createdOptions.value, ...rawAllOptions.value]\n})\n\nconst virtualEnabled = computed(() => options.value.length > 80)\n\nconst { virtualizer, items } = useVirtualizer({\n  estimateSize: () => 40,\n  count: computed(() => options.value.length),\n  scrollEl: () => scrollRef.value?.containerRef ?? null,\n  contentEl: () => (virtualEnabled.value ? (scrollRef.value?.contentRef ?? null) : null)\n})\n\nconst virtualOptions = computed(() => {\n  const { valueKey, labelKey } = props\n  const _options = options.value\n  return items.value.map((v) => {\n    const option = _options[v.index]!\n    const val = chainObj(option).get(valueKey)\n    return {\n      option,\n      index: v.index,\n      val,\n      key: v.index,\n      offset: v.start,\n      label: chainObj(option).get(labelKey)\n    }\n  })\n})\n\nconst measureElement: (index: number, el: Element | null) => void = (index, el) =>\n  virtualizer.measureElement(index, el)\n\nconst filterable = computed(() => {\n  return props.filterable || props.creatable || typeof props.options === 'function'\n})\n\nconst model = defineModel<Array<string | number>>()\n\nconst checkedSet = shallowReactive<Set<Record<string, any>>>(new Set())\nconst allChecked = computed(() => {\n  return checkedSet.size === options.value.length\n})\nconst indeterminate = computed(() => {\n  return checkedSet.size > 0 && !allChecked.value\n})\n\nconst optionsMap = computed(() => {\n  const { valueKey } = props\n  return new Map<string | number, Record<string, any>>(\n    allOptions.value.map((option) => [option[valueKey], option])\n  )\n})\n\nconst dropdownRef = shallowRef<DropdownExposed>()\n\nlet internalChange = false\n\nwatch(\n  [model, optionsMap],\n  ([model, optionsMap]) => {\n    if (internalChange) {\n      internalChange = false\n      return\n    }\n    checkedSet.clear()\n    if (optionsMap.size && model?.length) {\n      model.forEach((v) => {\n        const option = optionsMap.get(v)\n        option && checkedSet.add(option)\n      })\n    }\n  },\n  { immediate: true }\n)\n\nconst emitChange = () => {\n  emit('change', Array.from(checkedSet))\n}\n\nconst tags = computed(() => {\n  let tags: Record<string, any>[] = []\n  let { visibilityLimit } = props\n  if (visibilityLimit < 0) {\n    visibilityLimit = 0\n  }\n\n  // 禁用时，显示全部\n  if (disabled.value || readonly.value) {\n    visibilityLimit = model.value?.length ?? 0\n  }\n\n  model.value?.slice(0, visibilityLimit).forEach((k) => {\n    const option = optionsMap.value.get(k)\n    option && tags.push(option)\n  })\n\n  return tags\n})\n\nconst restTag = computed(() => {\n  return (model.value?.length ?? 0) - tags.value.length\n})\n\nconst handleDropdownVisible = (visible: boolean) => {\n  if (!visible) {\n    queryString.value = ''\n  }\n}\n\nconst handleCheck = (option: Record<string, any>, checked: boolean) => {\n  const { valueKey, labelKey } = props\n  if (checked) {\n    if (option.__isTemp && props.creatable) {\n      const created: Record<string, any> = {\n        [labelKey]: chainObj(option).get(labelKey),\n        [valueKey]: chainObj(option).get(valueKey)\n      }\n      createdOptions.value = [...createdOptions.value, created]\n      checkedSet.add(created)\n      internalChange = true\n      model.value = [...(model.value ?? []), chainObj(created).get(valueKey)]\n      queryString.value = ''\n    } else if (!checkedSet.has(option)) {\n      checkedSet.add(option)\n      internalChange = true\n      model.value = [...(model.value ?? []), chainObj(option).get(valueKey)]\n    }\n  } else {\n    checkedSet.delete(option)\n    const val = chainObj(option).get(valueKey)\n    internalChange = true\n    model.value = (model.value ?? []).filter((v) => v !== val)\n    removeCreatedOption(option)\n  }\n\n  emitChange()\n  dropdownRef.value?.updateDropdown()\n}\n\n/** 全选 */\nconst handleCheckAll = (checked: boolean) => {\n  const { valueKey } = props\n  if (checked) {\n    options.value.forEach((option) => {\n      if (!option.__isTemp) checkedSet.add(option)\n    })\n    internalChange = true\n    model.value = Array.from(checkedSet).map((o) => chainObj(o).get(valueKey))\n  } else {\n    checkedSet.clear()\n    internalChange = true\n    model.value = []\n    if (props.creatable) {\n      createdOptions.value = []\n    }\n  }\n\n  emitChange()\n  dropdownRef.value?.updateDropdown()\n}\n\n/** 清除选项 */\nconst handleClear = () => {\n  checkedSet.clear()\n  internalChange = true\n  model.value = []\n  if (props.creatable) {\n    createdOptions.value = []\n  }\n  emit('change', [])\n}\n\nconst handleClose = (option: Record<string, any>) => {\n  checkedSet.delete(option)\n  const val = chainObj(option).get(props.valueKey)\n  internalChange = true\n  model.value = (model.value ?? []).filter((v) => v !== val)\n  removeCreatedOption(option)\n  emitChange()\n}\n\nconst removeCreatedOption = (option: Record<string, any>) => {\n  if (!props.creatable || !createdOptions.value.length) return\n  const { valueKey } = props\n  const val = chainObj(option).get(valueKey)\n  createdOptions.value = createdOptions.value.filter((o) => chainObj(o).get(valueKey) !== val)\n}\n\nconst handleCreateByEnter = () => {\n  if (!props.creatable) return\n  const qs = queryString.value?.trim()\n  if (!qs) return\n\n  const { labelKey, valueKey } = props\n\n  const existingCreated = createdOptions.value.find((o) => chainObj(o).get(valueKey) === qs)\n  if (existingCreated) {\n    if (!checkedSet.has(existingCreated)) {\n      checkedSet.add(existingCreated)\n      internalChange = true\n      model.value = [...(model.value ?? []), chainObj(existingCreated).get(valueKey)]\n    }\n    queryString.value = ''\n    emitChange()\n    dropdownRef.value?.updateDropdown()\n    return\n  }\n\n  const exactMatch = rawOptions.value.find((o) => !o.__isTemp && chainObj(o).get(labelKey) === qs)\n  if (exactMatch) {\n    if (!checkedSet.has(exactMatch)) {\n      checkedSet.add(exactMatch)\n      internalChange = true\n      model.value = [...(model.value ?? []), chainObj(exactMatch).get(valueKey)]\n    }\n    queryString.value = ''\n    emitChange()\n    dropdownRef.value?.updateDropdown()\n    return\n  }\n\n  const created: Record<string, any> = { [labelKey]: qs, [valueKey]: qs }\n  createdOptions.value = [...createdOptions.value, created]\n  checkedSet.add(created)\n  internalChange = true\n  model.value = [...(model.value ?? []), qs]\n  queryString.value = ''\n  emitChange()\n  dropdownRef.value?.updateDropdown()\n}\n\nconst isDisabled = (option: Record<string, any>) => {\n  const { max } = props\n  return max !== undefined && checkedSet.size >= max && !checkedSet.has(option)\n}\n\nconst optionClass = cls.e('option')\nconst rippleClass = cls.e('ripple')\nconst checkboxClass = cls.e('checkbox')\n\nprovide(MultiSelectDIKey, { optionClass, rippleClass, checkboxClass })\n</script>\n"],"mappings":"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"}

package/dist/components/multi-select/multi-select.vue.d.ts

@@ -29,13 +29,13 @@ declare const __VLS_base: _$vue.DefineComponent<__VLS_PublicProps, {}, {}, {}, {
   onChange?: ((options: Record<string, any>[]) => any) | undefined;
 }>, {
   disabled: boolean;
-  placeholder: string;
-  clearable: boolean;
   readonly: boolean;
   labelKey: string;
   valueKey: string;
-  visibilityLimit: number;
+  placeholder: string;
+  clearable: boolean;
   minWidth: string;
+  visibilityLimit: number;
 }, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/components/multi-tree-select/multi-tree-select.vue.d.ts

@@ -23,15 +23,15 @@ declare const __VLS_base: _$vue.DefineComponent<__VLS_PublicProps, {}, {}, {}, {
   onChange?: ((checked: Record<string, any>[]) => any) | undefined;
 }>, {
   disabled: boolean;
-  placeholder: string;
-  clearable: boolean;
   readonly: boolean;
   labelKey: string;
   valueKey: string;
-  filterable: boolean;
-  visibilityLimit: number;
+  placeholder: string;
+  clearable: boolean;
   minWidth: string;
   expandAll: boolean;
+  filterable: boolean;
+  visibilityLimit: number;
 }, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/components/notification/notification.vue.d.ts

@@ -4,8 +4,8 @@ import * as _$_veltra_utils0 from "@veltra/utils";
 
 //#region src/components/notification/notification.vue.d.ts
 declare const __VLS_export: _$vue.DefineComponent<NotificationProps, _$_veltra_utils0.DeconstructValue<_NotificationExposed>, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {}, string, _$vue.PublicProps, Readonly<NotificationProps> & Readonly<{}>, {
-  closable: boolean;
   duration: number;
+  closable: boolean;
   offset: number;
   buttonText: string;
   position: "top-left" | "top-right" | "bottom-left" | "bottom-right";

package/dist/components/number-input/number-input.vue.d.ts

@@ -21,9 +21,9 @@ declare const __VLS_base: _$vue.DefineComponent<__VLS_PublicProps, {}, {}, {}, {
   onChange?: ((value?: number | undefined) => any) | undefined;
 }>, {
   disabled: boolean;
+  readonly: boolean;
   placeholder: string;
   clearable: boolean;
-  readonly: boolean;
 }, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/components/number-range-input/number-range-input.vue.d.ts

@@ -24,10 +24,10 @@ declare const __VLS_export: _$vue.DefineComponent<__VLS_PublicProps, {}, {}, {},
   "onUpdate:start"?: ((value: number | undefined) => any) | undefined;
   "onUpdate:end"?: ((value: number | undefined) => any) | undefined;
 }>, {
+  separator: string;
   disabled: boolean;
-  clearable: boolean;
   readonly: boolean;
-  separator: string;
+  clearable: boolean;
   startPlaceholder: string;
   endPlaceholder: string;
 }, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;

package/dist/components/palette/di.js.map

@@ -1 +1 @@
-{"version":3,"file":"di.js","names":[],"sources":["../../../src/components/palette/di.ts"],"sourcesContent":["import type { Updater } from '@veltra/compositions'\nimport type { BEM } from '@veltra/utils'\nimport type { InjectionKey, Ref, ComputedRef } from 'vue'\n\nimport type { PaletteHSV, PaletteRGB } from '../../types'\n\nexport const PaletteDIKey: InjectionKey<{\n  cls: BEM<'palette', 'u-'>\n  /** 色调 RGB 值 */\n  hueRGB: ComputedRef<PaletteRGB>\n  /** 色调 饱和度 亮度 */\n  HSV: PaletteHSV\n  /** RGB 值 */\n  RGB: ComputedRef<PaletteRGB>\n  /** 透明度 */\n  alpha: Ref<number>\n  /** 更新器 */\n  updater: Updater\n  /** 更新色调 */\n  updateHue: (deg: number) => void\n  /** 更新调色盘透明度 */\n  updateAlpha: (alpha: number) => void\n  /** 更新饱和度 亮度 */\n  updateSV: (sv: { s: number; v: number }) => void\n}> = Symbol('PaletteDIKey')\n"],"mappings":";AAMA,MAAa,eAkBR,OAAO,eAAe"}
+{"version":3,"file":"di.js","names":[],"sources":["../../../src/components/palette/di.ts"],"sourcesContent":["import type { UserAction } from '@veltra/compositions'\nimport type { BEM } from '@veltra/utils'\nimport type { InjectionKey, Ref, ComputedRef } from 'vue'\n\nimport type { PaletteHSV, PaletteRGB } from '../../types'\n\nexport const PaletteDIKey: InjectionKey<{\n  cls: BEM<'palette', 'u-'>\n  /** 色调 RGB 值 */\n  hueRGB: ComputedRef<PaletteRGB>\n  /** 色调 饱和度 亮度 */\n  HSV: PaletteHSV\n  /** RGB 值 */\n  RGB: ComputedRef<PaletteRGB>\n  /** 透明度 */\n  alpha: Ref<number>\n  /** 将函数包装为用户动作（阻断 modelValue 回流副作用） */\n  userAction: UserAction\n  /** 当前是否处于用户动作期间 */\n  isUserActive: () => boolean\n  /** 更新色调 */\n  updateHue: (deg: number) => void\n  /** 更新调色盘透明度 */\n  updateAlpha: (alpha: number) => void\n  /** 更新饱和度 亮度 */\n  updateSV: (sv: { s: number; v: number }) => void\n}> = Symbol('PaletteDIKey')\n"],"mappings":";AAMA,MAAa,eAoBR,OAAO,eAAe"}

package/dist/components/palette/palette-alpha.js

@@ -6,7 +6,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 	name: "PaletteAlpha",
 	__name: "palette-alpha",
 	setup(__props, { expose: __expose }) {
-		const { cls, updateAlpha, hueRGB, alpha, updater } = inject(PaletteDIKey);
+		const { cls, updateAlpha, hueRGB, alpha, userAction, isUserActive } = inject(PaletteDIKey);
 		const alphaRef = shallowRef();
 		const alphaThumbTransformX = shallowRef(0);
 		const alphaThumbStyle = computed(() => {
@@ -18,12 +18,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 			alphaWidth = alphaRef.value?.offsetWidth ?? 0;
 			rangeX[1] = alphaWidth;
 		}
-		function updateOffsetX(offsetX) {
-			updater.updateAndLock(() => {
-				alphaThumbTransformX.value = offsetX;
-				updateAlpha(alphaWidth > 0 ? offsetX / alphaWidth : 0);
-			});
-		}
+		const updateOffsetX = userAction((offsetX) => {
+			alphaThumbTransformX.value = offsetX;
+			updateAlpha(alphaWidth > 0 ? offsetX / alphaWidth : 0);
+		});
 		const alphaDragger = useDrag({
 			target: alphaRef,
 			rangeX,
@@ -48,9 +46,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 			init();
 		});
 		watch(alpha, (newAlphaValue) => {
-			updater.update(() => {
-				alphaThumbTransformX.value = alphaWidth > 0 ? alphaWidth * newAlphaValue : 0;
-			});
+			if (isUserActive()) return;
+			alphaThumbTransformX.value = alphaWidth > 0 ? alphaWidth * newAlphaValue : 0;
 		}, { flush: "post" });
 		__expose({ init });
 		return (_ctx, _cache) => {

package/dist/components/palette/palette-alpha.js.map

@@ -1 +1 @@
-{"version":3,"file":"palette-alpha.js","names":[],"sources":["../../../src/components/palette/palette-alpha.vue"],"sourcesContent":["<template>\n  <div :class=\"cls.e('alpha')\" ref=\"alphaRef\">\n    <div :class=\"cls.e('alpha-bg')\" :style=\"{ background: alphaSliderBG }\"></div>\n\n    <span :class=\"cls.e('alpha-thumb')\" @click.stop :style=\"alphaThumbStyle\"></span>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useDrag } from '@veltra/compositions'\nimport { computed, inject, shallowRef, onMounted, watch } from 'vue'\n\nimport { PaletteDIKey } from './di'\n\ndefineOptions({\n  name: 'PaletteAlpha'\n})\n\nconst { cls, updateAlpha, hueRGB, alpha, updater } = inject(PaletteDIKey)!\n\nconst alphaRef = shallowRef<HTMLElement>()\n\nconst alphaThumbTransformX = shallowRef(0)\n\nconst alphaThumbStyle = computed(() => {\n  return { transform: `translateX(${alphaThumbTransformX.value}px)` }\n})\n\nlet alphaWidth = 0\nconst rangeX = [0, 0] as [number, number]\n\nfunction getAlphaWidth() {\n  alphaWidth = alphaRef.value?.offsetWidth ?? 0\n  rangeX[1] = alphaWidth\n}\n\nfunction updateOffsetX(offsetX: number) {\n  updater.updateAndLock(() => {\n    alphaThumbTransformX.value = offsetX\n    updateAlpha(alphaWidth > 0 ? offsetX / alphaWidth : 0)\n  })\n}\n\nconst alphaDragger = useDrag({\n  target: alphaRef,\n  rangeX,\n  onDrag({ offsetX }) {\n    updateOffsetX(offsetX)\n  },\n  onDragStart(e) {\n    getAlphaWidth()\n\n    alphaDragger.update({ offsetX: e.offsetX })\n\n    updateOffsetX(e.offsetX)\n  }\n})\n\nconst alphaSliderBG = computed(() => {\n  const { r, g, b } = hueRGB.value\n  return `linear-gradient(to right, rgba(${r}, ${g}, ${b}, 0), rgba(${r}, ${g}, ${b}, 1))`\n})\n\nfunction init(): void {\n  getAlphaWidth()\n  alphaThumbTransformX.value = alphaWidth > 0 ? alphaWidth * alpha.value : 0\n}\n\nonMounted(() => {\n  init()\n})\n\nwatch(\n  alpha,\n  (newAlphaValue) => {\n    updater.update(() => {\n      alphaThumbTransformX.value = alphaWidth > 0 ? alphaWidth * newAlphaValue : 0\n    })\n  },\n  { flush: 'post' }\n)\n\ndefineExpose({\n  init\n})\n</script>\n"],"mappings":";;;;;;;;EAkBA,MAAM,EAAE,KAAK,aAAa,QAAQ,OAAO,YAAY,OAAO,aAAa;EAEzE,MAAM,WAAW,YAAwB;EAEzC,MAAM,uBAAuB,WAAW,EAAC;EAEzC,MAAM,kBAAkB,eAAe;AACrC,UAAO,EAAE,WAAW,cAAc,qBAAqB,MAAM,MAAK;IACnE;EAED,IAAI,aAAa;EACjB,MAAM,SAAS,CAAC,GAAG,EAAE;EAErB,SAAS,gBAAgB;AACvB,gBAAa,SAAS,OAAO,eAAe;AAC5C,UAAO,KAAK;;EAGd,SAAS,cAAc,SAAiB;AACtC,WAAQ,oBAAoB;AAC1B,yBAAqB,QAAQ;AAC7B,gBAAY,aAAa,IAAI,UAAU,aAAa,EAAC;KACtD;;EAGH,MAAM,eAAe,QAAQ;GAC3B,QAAQ;GACR;GACA,OAAO,EAAE,WAAW;AAClB,kBAAc,QAAO;;GAEvB,YAAY,GAAG;AACb,mBAAc;AAEd,iBAAa,OAAO,EAAE,SAAS,EAAE,SAAS,CAAA;AAE1C,kBAAc,EAAE,QAAO;;GAE1B,CAAA;EAED,MAAM,gBAAgB,eAAe;GACnC,MAAM,EAAE,GAAG,GAAG,MAAM,OAAO;AAC3B,UAAO,kCAAkC,EAAE,IAAI,EAAE,IAAI,EAAE,aAAa,EAAE,IAAI,EAAE,IAAI,EAAE;IACnF;EAED,SAAS,OAAa;AACpB,kBAAc;AACd,wBAAqB,QAAQ,aAAa,IAAI,aAAa,MAAM,QAAQ;;AAG3E,kBAAgB;AACd,SAAK;IACN;AAED,QACE,QACC,kBAAkB;AACjB,WAAQ,aAAa;AACnB,yBAAqB,QAAQ,aAAa,IAAI,aAAa,gBAAgB;KAC5E;KAEH,EAAE,OAAO,QAAO,CAClB;AAEA,WAAa,EACX,MACD,CAAA;;uBAnFC,mBAIM,OAAA;IAJA,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,QAAA,CAAA;aAAe;IAAJ,KAAI;OAC/B,mBAA6E,OAAA;IAAvE,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,WAAA,CAAA;IAAe,OAAK,eAAA,EAAA,YAAgB,cAAA,OAAa,CAAA;gBAEnE,mBAAgF,QAAA;IAAzE,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,cAAA,CAAA;IAAkB,SAAK,OAAA,OAAA,OAAA,KAAA,oBAAN,IAAW,CAAA,OAAA,CAAA;IAAE,OAAK,eAAE,gBAAA,MAAe"}
+{"version":3,"file":"palette-alpha.js","names":[],"sources":["../../../src/components/palette/palette-alpha.vue"],"sourcesContent":["<template>\n  <div :class=\"cls.e('alpha')\" ref=\"alphaRef\">\n    <div :class=\"cls.e('alpha-bg')\" :style=\"{ background: alphaSliderBG }\"></div>\n\n    <span :class=\"cls.e('alpha-thumb')\" @click.stop :style=\"alphaThumbStyle\"></span>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useDrag } from '@veltra/compositions'\nimport { computed, inject, shallowRef, onMounted, watch } from 'vue'\n\nimport { PaletteDIKey } from './di'\n\ndefineOptions({\n  name: 'PaletteAlpha'\n})\n\nconst { cls, updateAlpha, hueRGB, alpha, userAction, isUserActive } = inject(PaletteDIKey)!\n\nconst alphaRef = shallowRef<HTMLElement>()\n\nconst alphaThumbTransformX = shallowRef(0)\n\nconst alphaThumbStyle = computed(() => {\n  return { transform: `translateX(${alphaThumbTransformX.value}px)` }\n})\n\nlet alphaWidth = 0\nconst rangeX = [0, 0] as [number, number]\n\nfunction getAlphaWidth() {\n  alphaWidth = alphaRef.value?.offsetWidth ?? 0\n  rangeX[1] = alphaWidth\n}\n\nconst updateOffsetX = userAction((offsetX: number) => {\n  alphaThumbTransformX.value = offsetX\n  updateAlpha(alphaWidth > 0 ? offsetX / alphaWidth : 0)\n})\n\nconst alphaDragger = useDrag({\n  target: alphaRef,\n  rangeX,\n  onDrag({ offsetX }) {\n    updateOffsetX(offsetX)\n  },\n  onDragStart(e) {\n    getAlphaWidth()\n\n    alphaDragger.update({ offsetX: e.offsetX })\n\n    updateOffsetX(e.offsetX)\n  }\n})\n\nconst alphaSliderBG = computed(() => {\n  const { r, g, b } = hueRGB.value\n  return `linear-gradient(to right, rgba(${r}, ${g}, ${b}, 0), rgba(${r}, ${g}, ${b}, 1))`\n})\n\nfunction init(): void {\n  getAlphaWidth()\n  alphaThumbTransformX.value = alphaWidth > 0 ? alphaWidth * alpha.value : 0\n}\n\nonMounted(() => {\n  init()\n})\n\nwatch(\n  alpha,\n  (newAlphaValue) => {\n    if (isUserActive()) return\n    alphaThumbTransformX.value = alphaWidth > 0 ? alphaWidth * newAlphaValue : 0\n  },\n  { flush: 'post' }\n)\n\ndefineExpose({\n  init\n})\n</script>\n"],"mappings":";;;;;;;;EAkBA,MAAM,EAAE,KAAK,aAAa,QAAQ,OAAO,YAAY,iBAAiB,OAAO,aAAa;EAE1F,MAAM,WAAW,YAAwB;EAEzC,MAAM,uBAAuB,WAAW,EAAC;EAEzC,MAAM,kBAAkB,eAAe;AACrC,UAAO,EAAE,WAAW,cAAc,qBAAqB,MAAM,MAAK;IACnE;EAED,IAAI,aAAa;EACjB,MAAM,SAAS,CAAC,GAAG,EAAE;EAErB,SAAS,gBAAgB;AACvB,gBAAa,SAAS,OAAO,eAAe;AAC5C,UAAO,KAAK;;EAGd,MAAM,gBAAgB,YAAY,YAAoB;AACpD,wBAAqB,QAAQ;AAC7B,eAAY,aAAa,IAAI,UAAU,aAAa,EAAC;IACtD;EAED,MAAM,eAAe,QAAQ;GAC3B,QAAQ;GACR;GACA,OAAO,EAAE,WAAW;AAClB,kBAAc,QAAO;;GAEvB,YAAY,GAAG;AACb,mBAAc;AAEd,iBAAa,OAAO,EAAE,SAAS,EAAE,SAAS,CAAA;AAE1C,kBAAc,EAAE,QAAO;;GAE1B,CAAA;EAED,MAAM,gBAAgB,eAAe;GACnC,MAAM,EAAE,GAAG,GAAG,MAAM,OAAO;AAC3B,UAAO,kCAAkC,EAAE,IAAI,EAAE,IAAI,EAAE,aAAa,EAAE,IAAI,EAAE,IAAI,EAAE;IACnF;EAED,SAAS,OAAa;AACpB,kBAAc;AACd,wBAAqB,QAAQ,aAAa,IAAI,aAAa,MAAM,QAAQ;;AAG3E,kBAAgB;AACd,SAAK;IACN;AAED,QACE,QACC,kBAAkB;AACjB,OAAI,cAAc,CAAE;AACpB,wBAAqB,QAAQ,aAAa,IAAI,aAAa,gBAAgB;KAE7E,EAAE,OAAO,QAAO,CAClB;AAEA,WAAa,EACX,MACD,CAAA;;uBAhFC,mBAIM,OAAA;IAJA,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,QAAA,CAAA;aAAe;IAAJ,KAAI;OAC/B,mBAA6E,OAAA;IAAvE,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,WAAA,CAAA;IAAe,OAAK,eAAA,EAAA,YAAgB,cAAA,OAAa,CAAA;gBAEnE,mBAAgF,QAAA;IAAzE,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,cAAA,CAAA;IAAkB,SAAK,OAAA,OAAA,OAAA,KAAA,oBAAN,IAAW,CAAA,OAAA,CAAA;IAAE,OAAK,eAAE,gBAAA,MAAe"}

package/dist/components/palette/palette-hue.js

@@ -6,7 +6,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 	name: "PaletteHue",
 	__name: "palette-hue",
 	setup(__props, { expose: __expose }) {
-		const { cls, updateHue, HSV, updater } = inject(PaletteDIKey);
+		const { cls, updateHue, HSV, userAction } = inject(PaletteDIKey);
 		const hueRef = shallowRef();
 		const transformX = shallowRef(0);
 		let sliderWidth = 0;
@@ -18,12 +18,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 			sliderWidth = hueRef.value?.offsetWidth ?? 0;
 			rangeX[1] = sliderWidth;
 		}
-		function updateOffsetX(offsetX) {
-			updater.updateAndLock(() => {
-				transformX.value = offsetX;
-				updateHue(Math.round(offsetX / sliderWidth * 360));
-			});
-		}
+		const updateOffsetX = userAction((offsetX) => {
+			transformX.value = offsetX;
+			updateHue(Math.round(offsetX / sliderWidth * 360));
+		});
 		const sliderDragger = useDrag({
 			target: hueRef,
 			rangeX,

package/dist/components/palette/palette-hue.js.map

@@ -1 +1 @@
-{"version":3,"file":"palette-hue.js","names":[],"sources":["../../../src/components/palette/palette-hue.vue"],"sourcesContent":["<template>\n  <div :class=\"cls.e('hue')\" ref=\"hueRef\">\n    <span :class=\"cls.e('hue-thumb')\" @click.stop :style=\"hueThumbStyle\"></span>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useDrag } from '@veltra/compositions'\nimport { inject, onMounted } from 'vue'\nimport { shallowRef, computed } from 'vue'\n\nimport { PaletteDIKey } from './di'\n\ndefineOptions({\n  name: 'PaletteHue'\n})\n\nconst { cls, updateHue, HSV, updater } = inject(PaletteDIKey)!\n\nconst hueRef = shallowRef<HTMLElement>()\n\nconst transformX = shallowRef(0)\nlet sliderWidth = 0\n\nconst hueThumbStyle = computed(() => {\n  return { transform: `translateX(${transformX.value}px)` }\n})\n\nconst rangeX = [0, 0] as [number, number]\n\nfunction getSliderWidth() {\n  sliderWidth = hueRef.value?.offsetWidth ?? 0\n  rangeX[1] = sliderWidth\n}\n\nfunction updateOffsetX(offsetX: number) {\n  updater.updateAndLock(() => {\n    transformX.value = offsetX\n    updateHue(Math.round((offsetX / sliderWidth) * 360))\n  })\n}\n\nconst sliderDragger = useDrag({\n  target: hueRef,\n  rangeX,\n  onDrag({ offsetX }) {\n    updateOffsetX(offsetX)\n  },\n  onDragStart(e) {\n    getSliderWidth()\n\n    sliderDragger.update({ offsetX: e.offsetX })\n\n    updateOffsetX(e.offsetX)\n  }\n})\n\nfunction init(): void {\n  getSliderWidth()\n  transformX.value = (sliderWidth * HSV.h) / 360\n}\n\nonMounted(() => {\n  init()\n})\n\ndefineExpose({\n  init\n})\n</script>\n"],"mappings":";;;;;;;;EAiBA,MAAM,EAAE,KAAK,WAAW,KAAK,YAAY,OAAO,aAAa;EAE7D,MAAM,SAAS,YAAwB;EAEvC,MAAM,aAAa,WAAW,EAAC;EAC/B,IAAI,cAAc;EAElB,MAAM,gBAAgB,eAAe;AACnC,UAAO,EAAE,WAAW,cAAc,WAAW,MAAM,MAAK;IACzD;EAED,MAAM,SAAS,CAAC,GAAG,EAAE;EAErB,SAAS,iBAAiB;AACxB,iBAAc,OAAO,OAAO,eAAe;AAC3C,UAAO,KAAK;;EAGd,SAAS,cAAc,SAAiB;AACtC,WAAQ,oBAAoB;AAC1B,eAAW,QAAQ;AACnB,cAAU,KAAK,MAAO,UAAU,cAAe,IAAI,CAAA;KACpD;;EAGH,MAAM,gBAAgB,QAAQ;GAC5B,QAAQ;GACR;GACA,OAAO,EAAE,WAAW;AAClB,kBAAc,QAAO;;GAEvB,YAAY,GAAG;AACb,oBAAe;AAEf,kBAAc,OAAO,EAAE,SAAS,EAAE,SAAS,CAAA;AAE3C,kBAAc,EAAE,QAAO;;GAE1B,CAAA;EAED,SAAS,OAAa;AACpB,mBAAe;AACf,cAAW,QAAS,cAAc,IAAI,IAAK;;AAG7C,kBAAgB;AACd,SAAK;IACN;AAED,WAAa,EACX,MACD,CAAA;;uBAnEC,mBAEM,OAAA;IAFA,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,MAAA,CAAA;aAAa;IAAJ,KAAI;OAC7B,mBAA4E,QAAA;IAArE,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,YAAA,CAAA;IAAgB,SAAK,OAAA,OAAA,OAAA,KAAA,oBAAN,IAAW,CAAA,OAAA,CAAA;IAAE,OAAK,eAAE,cAAA,MAAa"}
+{"version":3,"file":"palette-hue.js","names":[],"sources":["../../../src/components/palette/palette-hue.vue"],"sourcesContent":["<template>\n  <div :class=\"cls.e('hue')\" ref=\"hueRef\">\n    <span :class=\"cls.e('hue-thumb')\" @click.stop :style=\"hueThumbStyle\"></span>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useDrag } from '@veltra/compositions'\nimport { inject, onMounted } from 'vue'\nimport { shallowRef, computed } from 'vue'\n\nimport { PaletteDIKey } from './di'\n\ndefineOptions({\n  name: 'PaletteHue'\n})\n\nconst { cls, updateHue, HSV, userAction } = inject(PaletteDIKey)!\n\nconst hueRef = shallowRef<HTMLElement>()\n\nconst transformX = shallowRef(0)\nlet sliderWidth = 0\n\nconst hueThumbStyle = computed(() => {\n  return { transform: `translateX(${transformX.value}px)` }\n})\n\nconst rangeX = [0, 0] as [number, number]\n\nfunction getSliderWidth() {\n  sliderWidth = hueRef.value?.offsetWidth ?? 0\n  rangeX[1] = sliderWidth\n}\n\nconst updateOffsetX = userAction((offsetX: number) => {\n  transformX.value = offsetX\n  updateHue(Math.round((offsetX / sliderWidth) * 360))\n})\n\nconst sliderDragger = useDrag({\n  target: hueRef,\n  rangeX,\n  onDrag({ offsetX }) {\n    updateOffsetX(offsetX)\n  },\n  onDragStart(e) {\n    getSliderWidth()\n\n    sliderDragger.update({ offsetX: e.offsetX })\n\n    updateOffsetX(e.offsetX)\n  }\n})\n\nfunction init(): void {\n  getSliderWidth()\n  transformX.value = (sliderWidth * HSV.h) / 360\n}\n\nonMounted(() => {\n  init()\n})\n\ndefineExpose({\n  init\n})\n</script>\n"],"mappings":";;;;;;;;EAiBA,MAAM,EAAE,KAAK,WAAW,KAAK,eAAe,OAAO,aAAa;EAEhE,MAAM,SAAS,YAAwB;EAEvC,MAAM,aAAa,WAAW,EAAC;EAC/B,IAAI,cAAc;EAElB,MAAM,gBAAgB,eAAe;AACnC,UAAO,EAAE,WAAW,cAAc,WAAW,MAAM,MAAK;IACzD;EAED,MAAM,SAAS,CAAC,GAAG,EAAE;EAErB,SAAS,iBAAiB;AACxB,iBAAc,OAAO,OAAO,eAAe;AAC3C,UAAO,KAAK;;EAGd,MAAM,gBAAgB,YAAY,YAAoB;AACpD,cAAW,QAAQ;AACnB,aAAU,KAAK,MAAO,UAAU,cAAe,IAAI,CAAA;IACpD;EAED,MAAM,gBAAgB,QAAQ;GAC5B,QAAQ;GACR;GACA,OAAO,EAAE,WAAW;AAClB,kBAAc,QAAO;;GAEvB,YAAY,GAAG;AACb,oBAAe;AAEf,kBAAc,OAAO,EAAE,SAAS,EAAE,SAAS,CAAA;AAE3C,kBAAc,EAAE,QAAO;;GAE1B,CAAA;EAED,SAAS,OAAa;AACpB,mBAAe;AACf,cAAW,QAAS,cAAc,IAAI,IAAK;;AAG7C,kBAAgB;AACd,SAAK;IACN;AAED,WAAa,EACX,MACD,CAAA;;uBAjEC,mBAEM,OAAA;IAFA,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,MAAA,CAAA;aAAa;IAAJ,KAAI;OAC7B,mBAA4E,QAAA;IAArE,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,YAAA,CAAA;IAAgB,SAAK,OAAA,OAAA,OAAA,KAAA,oBAAN,IAAW,CAAA,OAAA,CAAA;IAAE,OAAK,eAAE,cAAA,MAAa"}

package/dist/components/palette/palette-sv.js

@@ -6,7 +6,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 	name: "PaletteSV",
 	__name: "palette-sv",
 	setup(__props, { expose: __expose }) {
-		const { cls, hueRGB, HSV, updateSV, updater } = inject(PaletteDIKey);
+		const { cls, hueRGB, HSV, updateSV, userAction } = inject(PaletteDIKey);
 		const svRef = shallowRef();
 		const canvasSize = {
 			width: 0,
@@ -29,16 +29,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 		const svThumbStyle = computed(() => {
 			return { transform: `translate(${transform.x}px, ${transform.y}px)` };
 		});
-		function updateThumb(offsetX, offsetY) {
-			updater.updateAndLock(() => {
-				transform.x = offsetX;
-				transform.y = offsetY;
-				updateSV({
-					s: Math.max(0, Math.min(1, offsetX / canvasSize.width)),
-					v: Math.max(0, Math.min(1, 1 - offsetY / canvasSize.height))
-				});
+		const updateThumb = userAction((offsetX, offsetY) => {
+			transform.x = offsetX;
+			transform.y = offsetY;
+			updateSV({
+				s: Math.max(0, Math.min(1, offsetX / canvasSize.width)),
+				v: Math.max(0, Math.min(1, 1 - offsetY / canvasSize.height))
 			});
-		}
+		});
 		const svDragger = useDrag({
 			target: svRef,
 			rangeX,

package/dist/components/palette/palette-sv.js.map

@@ -1 +1 @@
-{"version":3,"file":"palette-sv.js","names":[],"sources":["../../../src/components/palette/palette-sv.vue"],"sourcesContent":["<template>\n  <!-- 调色画布 -->\n  <div :class=\"cls.e('sv')\" ref=\"svRef\">\n    <div :class=\"cls.e('sv-s')\" :style=\"{ backgroundImage: canvasBackground }\"></div>\n    <div :class=\"cls.e('sv-v')\">{{}}</div>\n\n    <div\n      :class=\"cls.e('sv-thumb')\"\n      ref=\"svThumbRef\"\n      @click.stop\n      @mousedown.stop\n      :style=\"svThumbStyle\"\n    ></div>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useDrag } from '@veltra/compositions'\nimport { computed, inject, reactive, shallowRef, onMounted } from 'vue'\n\nimport { PaletteDIKey } from './di'\n\ndefineOptions({\n  name: 'PaletteSV'\n})\n\nconst { cls, hueRGB, HSV, updateSV, updater } = inject(PaletteDIKey)!\n\nconst svRef = shallowRef<HTMLDivElement>()\n\nconst canvasSize = {\n  width: 0,\n  height: 0\n}\n\nconst rangeX = [0, 0] as [number, number]\nconst rangeY = [0, 0] as [number, number]\n\nconst getCanvasSize = () => {\n  if (!svRef.value) return\n  const { offsetHeight, offsetWidth } = svRef.value!\n\n  canvasSize.width = offsetWidth\n  rangeX[1] = offsetWidth\n\n  canvasSize.height = offsetHeight\n  rangeY[1] = offsetHeight\n}\n\nconst transform = reactive({\n  x: 0,\n  y: 0\n})\n\nconst svThumbStyle = computed(() => {\n  return {\n    transform: `translate(${transform.x}px, ${transform.y}px)`\n  }\n})\n\nfunction updateThumb(offsetX: number, offsetY: number) {\n  updater.updateAndLock(() => {\n    transform.x = offsetX\n    transform.y = offsetY\n\n    // 根据画布位置计算饱和度和亮度\n    // 水平方向表示饱和度，从左到右饱和度逐渐增高\n    // 垂直方向表示亮度，上亮下暗\n    const s = Math.max(0, Math.min(1, offsetX / canvasSize.width))\n    const v = Math.max(0, Math.min(1, 1 - offsetY / canvasSize.height))\n\n    // 更新饱和度和亮度\n    updateSV({ s, v })\n  })\n}\n\nconst svDragger = useDrag({\n  target: svRef,\n  rangeX,\n  rangeY,\n\n  onDrag({ offsetX, offsetY }) {\n    updateThumb(offsetX, offsetY)\n  },\n  onDragStart(e) {\n    getCanvasSize()\n\n    const { offsetX, offsetY } = e\n\n    updateThumb(offsetX, offsetY)\n\n    svDragger.update({ offsetX, offsetY })\n  }\n})\n\nconst canvasBackground = computed(() => {\n  const { r, g, b } = hueRGB.value\n  return `linear-gradient(to right, rgb(255, 255, 255), rgb(${r}, ${g}, ${b}))`\n})\n\nfunction init(): void {\n  getCanvasSize()\n  transform.x = canvasSize.width * HSV.s\n  transform.y = canvasSize.height * (1 - HSV.v)\n}\n\nonMounted(() => {\n  init()\n})\n\ndefineExpose({\n  init\n})\n</script>\n"],"mappings":";;;;;;;;EA0BA,MAAM,EAAE,KAAK,QAAQ,KAAK,UAAU,YAAY,OAAO,aAAa;EAEpE,MAAM,QAAQ,YAA2B;EAEzC,MAAM,aAAa;GACjB,OAAO;GACP,QAAQ;GACV;EAEA,MAAM,SAAS,CAAC,GAAG,EAAE;EACrB,MAAM,SAAS,CAAC,GAAG,EAAE;EAErB,MAAM,sBAAsB;AAC1B,OAAI,CAAC,MAAM,MAAO;GAClB,MAAM,EAAE,cAAc,gBAAgB,MAAM;AAE5C,cAAW,QAAQ;AACnB,UAAO,KAAK;AAEZ,cAAW,SAAS;AACpB,UAAO,KAAK;;EAGd,MAAM,YAAY,SAAS;GACzB,GAAG;GACH,GAAG;GACJ,CAAA;EAED,MAAM,eAAe,eAAe;AAClC,UAAO,EACL,WAAW,aAAa,UAAU,EAAE,MAAM,UAAU,EAAE,MACxD;IACD;EAED,SAAS,YAAY,SAAiB,SAAiB;AACrD,WAAQ,oBAAoB;AAC1B,cAAU,IAAI;AACd,cAAU,IAAI;AASd,aAAS;KAAE,GAJD,KAAK,IAAI,GAAG,KAAK,IAAI,GAAG,UAAU,WAAW,MAAM,CAAA;KAI/C,GAHJ,KAAK,IAAI,GAAG,KAAK,IAAI,GAAG,IAAI,UAAU,WAAW,OAAO,CAAA;KAGjD,CAAA;KAClB;;EAGH,MAAM,YAAY,QAAQ;GACxB,QAAQ;GACR;GACA;GAEA,OAAO,EAAE,SAAS,WAAW;AAC3B,gBAAY,SAAS,QAAO;;GAE9B,YAAY,GAAG;AACb,mBAAc;IAEd,MAAM,EAAE,SAAS,YAAY;AAE7B,gBAAY,SAAS,QAAO;AAE5B,cAAU,OAAO;KAAE;KAAS;KAAS,CAAA;;GAExC,CAAA;EAED,MAAM,mBAAmB,eAAe;GACtC,MAAM,EAAE,GAAG,GAAG,MAAM,OAAO;AAC3B,UAAO,qDAAqD,EAAE,IAAI,EAAE,IAAI,EAAE;IAC3E;EAED,SAAS,OAAa;AACpB,kBAAc;AACd,aAAU,IAAI,WAAW,QAAQ,IAAI;AACrC,aAAU,IAAI,WAAW,UAAU,IAAI,IAAI;;AAG7C,kBAAgB;AACd,SAAK;IACN;AAED,WAAa,EACX,MACD,CAAA;;2DA/GC,mBAAA,SAAa,EACb,mBAWM,OAAA;IAXA,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,KAAA,CAAA;aAAY;IAAJ,KAAI;;IAC5B,mBAAiF,OAAA;KAA3E,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,OAAA,CAAA;KAAW,OAAK,eAAA,EAAA,iBAAqB,iBAAA,OAAgB,CAAA;;IACvE,mBAAsC,OAAA,EAAhC,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,OAAA,CAAA,EAAA,EAAA,iBAAA,EAAA,EAAA;IAElB,mBAMO,OAAA;KALJ,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,WAAA,CAAA;KACb,KAAI;KACH,SAAK,OAAA,OAAA,OAAA,KAAA,oBAAN,IAAW,CAAA,OAAA,CAAA;KACV,aAAS,OAAA,OAAA,OAAA,KAAA,oBAAV,IAAe,CAAA,OAAA,CAAA;KACd,OAAK,eAAE,aAAA,MAAY"}
+{"version":3,"file":"palette-sv.js","names":[],"sources":["../../../src/components/palette/palette-sv.vue"],"sourcesContent":["<template>\n  <!-- 调色画布 -->\n  <div :class=\"cls.e('sv')\" ref=\"svRef\">\n    <div :class=\"cls.e('sv-s')\" :style=\"{ backgroundImage: canvasBackground }\"></div>\n    <div :class=\"cls.e('sv-v')\">{{}}</div>\n\n    <div\n      :class=\"cls.e('sv-thumb')\"\n      ref=\"svThumbRef\"\n      @click.stop\n      @mousedown.stop\n      :style=\"svThumbStyle\"\n    ></div>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useDrag } from '@veltra/compositions'\nimport { computed, inject, reactive, shallowRef, onMounted } from 'vue'\n\nimport { PaletteDIKey } from './di'\n\ndefineOptions({\n  name: 'PaletteSV'\n})\n\nconst { cls, hueRGB, HSV, updateSV, userAction } = inject(PaletteDIKey)!\n\nconst svRef = shallowRef<HTMLDivElement>()\n\nconst canvasSize = {\n  width: 0,\n  height: 0\n}\n\nconst rangeX = [0, 0] as [number, number]\nconst rangeY = [0, 0] as [number, number]\n\nconst getCanvasSize = () => {\n  if (!svRef.value) return\n  const { offsetHeight, offsetWidth } = svRef.value!\n\n  canvasSize.width = offsetWidth\n  rangeX[1] = offsetWidth\n\n  canvasSize.height = offsetHeight\n  rangeY[1] = offsetHeight\n}\n\nconst transform = reactive({\n  x: 0,\n  y: 0\n})\n\nconst svThumbStyle = computed(() => {\n  return {\n    transform: `translate(${transform.x}px, ${transform.y}px)`\n  }\n})\n\nconst updateThumb = userAction((offsetX: number, offsetY: number) => {\n  transform.x = offsetX\n  transform.y = offsetY\n\n  // 根据画布位置计算饱和度和亮度\n  // 水平方向表示饱和度，从左到右饱和度逐渐增高\n  // 垂直方向表示亮度，上亮下暗\n  const s = Math.max(0, Math.min(1, offsetX / canvasSize.width))\n  const v = Math.max(0, Math.min(1, 1 - offsetY / canvasSize.height))\n\n  // 更新饱和度和亮度\n  updateSV({ s, v })\n})\n\nconst svDragger = useDrag({\n  target: svRef,\n  rangeX,\n  rangeY,\n\n  onDrag({ offsetX, offsetY }) {\n    updateThumb(offsetX, offsetY)\n  },\n  onDragStart(e) {\n    getCanvasSize()\n\n    const { offsetX, offsetY } = e\n\n    updateThumb(offsetX, offsetY)\n\n    svDragger.update({ offsetX, offsetY })\n  }\n})\n\nconst canvasBackground = computed(() => {\n  const { r, g, b } = hueRGB.value\n  return `linear-gradient(to right, rgb(255, 255, 255), rgb(${r}, ${g}, ${b}))`\n})\n\nfunction init(): void {\n  getCanvasSize()\n  transform.x = canvasSize.width * HSV.s\n  transform.y = canvasSize.height * (1 - HSV.v)\n}\n\nonMounted(() => {\n  init()\n})\n\ndefineExpose({\n  init\n})\n</script>\n"],"mappings":";;;;;;;;EA0BA,MAAM,EAAE,KAAK,QAAQ,KAAK,UAAU,eAAe,OAAO,aAAa;EAEvE,MAAM,QAAQ,YAA2B;EAEzC,MAAM,aAAa;GACjB,OAAO;GACP,QAAQ;GACV;EAEA,MAAM,SAAS,CAAC,GAAG,EAAE;EACrB,MAAM,SAAS,CAAC,GAAG,EAAE;EAErB,MAAM,sBAAsB;AAC1B,OAAI,CAAC,MAAM,MAAO;GAClB,MAAM,EAAE,cAAc,gBAAgB,MAAM;AAE5C,cAAW,QAAQ;AACnB,UAAO,KAAK;AAEZ,cAAW,SAAS;AACpB,UAAO,KAAK;;EAGd,MAAM,YAAY,SAAS;GACzB,GAAG;GACH,GAAG;GACJ,CAAA;EAED,MAAM,eAAe,eAAe;AAClC,UAAO,EACL,WAAW,aAAa,UAAU,EAAE,MAAM,UAAU,EAAE,MACxD;IACD;EAED,MAAM,cAAc,YAAY,SAAiB,YAAoB;AACnE,aAAU,IAAI;AACd,aAAU,IAAI;AASd,YAAS;IAAE,GAJD,KAAK,IAAI,GAAG,KAAK,IAAI,GAAG,UAAU,WAAW,MAAM,CAAA;IAI/C,GAHJ,KAAK,IAAI,GAAG,KAAK,IAAI,GAAG,IAAI,UAAU,WAAW,OAAO,CAAA;IAGjD,CAAA;IAClB;EAED,MAAM,YAAY,QAAQ;GACxB,QAAQ;GACR;GACA;GAEA,OAAO,EAAE,SAAS,WAAW;AAC3B,gBAAY,SAAS,QAAO;;GAE9B,YAAY,GAAG;AACb,mBAAc;IAEd,MAAM,EAAE,SAAS,YAAY;AAE7B,gBAAY,SAAS,QAAO;AAE5B,cAAU,OAAO;KAAE;KAAS;KAAS,CAAA;;GAExC,CAAA;EAED,MAAM,mBAAmB,eAAe;GACtC,MAAM,EAAE,GAAG,GAAG,MAAM,OAAO;AAC3B,UAAO,qDAAqD,EAAE,IAAI,EAAE,IAAI,EAAE;IAC3E;EAED,SAAS,OAAa;AACpB,kBAAc;AACd,aAAU,IAAI,WAAW,QAAQ,IAAI;AACrC,aAAU,IAAI,WAAW,UAAU,IAAI,IAAI;;AAG7C,kBAAgB;AACd,SAAK;IACN;AAED,WAAa,EACX,MACD,CAAA;;2DA7GC,mBAAA,SAAa,EACb,mBAWM,OAAA;IAXA,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,KAAA,CAAA;aAAY;IAAJ,KAAI;;IAC5B,mBAAiF,OAAA;KAA3E,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,OAAA,CAAA;KAAW,OAAK,eAAA,EAAA,iBAAqB,iBAAA,OAAgB,CAAA;;IACvE,mBAAsC,OAAA,EAAhC,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,OAAA,CAAA,EAAA,EAAA,iBAAA,EAAA,EAAA;IAElB,mBAMO,OAAA;KALJ,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,WAAA,CAAA;KACb,KAAI;KACH,SAAK,OAAA,OAAA,OAAA,KAAA,oBAAN,IAAW,CAAA,OAAA,CAAA;KACV,aAAS,OAAA,OAAA,OAAA,KAAA,oBAAV,IAAe,CAAA,OAAA,CAAA;KACd,OAAK,eAAE,aAAA,MAAY"}

package/dist/components/palette/palette.js

@@ -8,7 +8,7 @@ import _sfc_main$5 from "./palette-sv.js";
 import { useHSV } from "./use-hsv.js";
 import { computed, createBlock, createCommentVNode, createElementVNode, createVNode, defineComponent, mergeModels, normalizeClass, normalizeStyle, openBlock, provide, shallowRef, unref, useModel, useTemplateRef, watch, withCtx } from "vue";
 import { bem } from "@veltra/utils";
-import { useFormComponent, useFormFallbackProps, useUpdateLock } from "@veltra/compositions";
+import { useFormComponent, useFormFallbackProps, useUserAction } from "@veltra/compositions";
 //#region src/components/palette/palette.vue
 const _sfc_main = /* @__PURE__ */ defineComponent({
 	name: "Palette",
@@ -48,43 +48,41 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 		const { HSV, alpha, ...rest } = useHSV();
 		const color = useModel(__props, "modelValue");
 		const RGB = computed(() => HSV2RGB(HSV));
-		const updater = useUpdateLock();
+		const { userAction, isUserActive } = useUserAction();
 		watch([alpha, RGB], ([alpha, RGB]) => {
 			color.value = `#${RGB2HEX(RGB, alpha)}`;
 		});
 		const visible = shallowRef(false);
-		function handleClear() {
-			updater.updateAndLock(() => {
-				color.value = "";
-				rest.updateAlpha(1);
-				visible.value = false;
-			});
-		}
+		const handleClear = userAction(() => {
+			color.value = "";
+			rest.updateAlpha(1);
+			visible.value = false;
+		});
 		const paletteSVRef = useTemplateRef("palette-sv");
 		const paletteHueRef = useTemplateRef("palette-hue");
 		const paletteAlphaRef = useTemplateRef("palette-alpha");
 		watch(color, (color) => {
 			if (!color) return;
-			updater.update(() => {
-				const { RGB, alpha } = HEX2RGBA(color);
-				const hsv = RGB2HSV(RGB);
-				rest.updateHue(hsv.h);
-				rest.updateSV({
-					s: hsv.s,
-					v: hsv.v
-				});
-				rest.updateAlpha(alpha);
-				paletteSVRef.value?.init();
-				paletteHueRef.value?.init();
-				paletteAlphaRef.value?.init();
+			if (isUserActive()) return;
+			const { RGB, alpha } = HEX2RGBA(color);
+			const hsv = RGB2HSV(RGB);
+			rest.updateHue(hsv.h);
+			rest.updateSV({
+				s: hsv.s,
+				v: hsv.v
 			});
+			rest.updateAlpha(alpha);
+			paletteSVRef.value?.init();
+			paletteHueRef.value?.init();
+			paletteAlphaRef.value?.init();
 		}, { immediate: true });
 		provide(PaletteDIKey, {
 			cls,
 			HSV,
 			RGB,
 			alpha,
-			updater,
+			userAction,
+			isUserActive,
 			...rest
 		});
 		return (_ctx, _cache) => {
@@ -106,8 +104,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 					createVNode(_sfc_main$3, {
 						color: color.value,
 						"onUpdate:color": _cache[0] || (_cache[0] = ($event) => color.value = $event),
-						onClear: handleClear
-					}, null, 8, ["color"])
+						onClear: unref(handleClear)
+					}, null, 8, ["color", "onClear"])
 				]),
 				default: withCtx(() => [createElementVNode("span", {
 					class: normalizeClass(className.value),

package/dist/components/palette/palette.js.map

@@ -1 +1 @@
-{"version":3,"file":"palette.js","names":[],"sources":["../../../src/components/palette/palette.vue"],"sourcesContent":["<template>\n  <u-tip\n    trigger=\"click\"\n    :class=\"cls.e('panel')\"\n    v-model:visible=\"visible\"\n    :disabled=\"disabled || readonly\"\n  >\n    <span :class=\"className\" :style=\"{ backgroundColor: color }\"> </span>\n\n    <template #content>\n      <!-- 饱和度和亮度 -->\n      <PaletteSV ref=\"palette-sv\" />\n\n      <!-- 色相 -->\n      <PaletteHue ref=\"palette-hue\" />\n\n      <!-- 透明度 -->\n      <PaletteAlpha ref=\"palette-alpha\" />\n\n      <!-- 颜色切换 -->\n      <PaletteColorSwitch v-model:color=\"color\" @clear=\"handleClear\" />\n    </template>\n  </u-tip>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useFormComponent, useFormFallbackProps, useUpdateLock } from '@veltra/compositions'\nimport { bem } from '@veltra/utils'\nimport { computed, provide, shallowRef, useTemplateRef, watch } from 'vue'\n\nimport type { PaletteProps } from '../../types'\nimport { UTip } from '../tip'\nimport { HSV2RGB, RGB2HEX, HEX2RGBA, RGB2HSV } from './color-transform'\nimport { PaletteDIKey } from './di'\nimport PaletteAlpha from './palette-alpha.vue'\nimport PaletteColorSwitch from './palette-color-switch.vue'\nimport PaletteHue from './palette-hue.vue'\nimport PaletteSV from './palette-sv.vue'\nimport { useHSV } from './use-hsv'\n\ndefineOptions({\n  name: 'Palette'\n})\n\nconst props = withDefaults(defineProps<PaletteProps>(), {\n  disabled: undefined,\n  readonly: undefined\n})\n\nconst { formProps } = useFormComponent()\n\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props])\n\nconst cls = bem('palette')\n\nconst className = computed(() => {\n  return [cls.b, cls.m(size.value), bem.is('no-color', !color.value)]\n})\n\nconst { HSV, alpha, ...rest } = useHSV()\n\nconst color = defineModel<string>()\nconst RGB = computed(() => HSV2RGB(HSV))\nconst updater = useUpdateLock()\n\nwatch([alpha, RGB], ([alpha, RGB]) => {\n  color.value = `#${RGB2HEX(RGB, alpha)}`\n})\n\nconst visible = shallowRef(false)\n\nfunction handleClear() {\n  updater.updateAndLock(() => {\n    color.value = ''\n    rest.updateAlpha(1)\n    visible.value = false\n  })\n}\n\nconst paletteSVRef = useTemplateRef('palette-sv')\nconst paletteHueRef = useTemplateRef('palette-hue')\nconst paletteAlphaRef = useTemplateRef('palette-alpha')\n\nwatch(\n  color,\n  (color) => {\n    if (!color) return\n\n    updater.update(() => {\n      const { RGB, alpha } = HEX2RGBA(color)\n      const hsv = RGB2HSV(RGB)\n      rest.updateHue(hsv.h)\n      rest.updateSV({ s: hsv.s, v: hsv.v })\n      rest.updateAlpha(alpha)\n\n      paletteSVRef.value?.init()\n      paletteHueRef.value?.init()\n      paletteAlphaRef.value?.init()\n    })\n  },\n  { immediate: true }\n)\n\nprovide(PaletteDIKey, {\n  cls,\n  HSV,\n  RGB,\n  alpha,\n  updater,\n  ...rest\n})\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA4CA,MAAM,QAAQ;EAKd,MAAM,EAAE,cAAc,kBAAiB;EAEvC,MAAM,EAAE,MAAM,UAAU,aAAa,qBAAqB,CAAC,aAAa,EAAE,EAAE,MAAM,CAAA;EAElF,MAAM,MAAM,IAAI,UAAS;EAEzB,MAAM,YAAY,eAAe;AAC/B,UAAO;IAAC,IAAI;IAAG,IAAI,EAAE,KAAK,MAAM;IAAE,IAAI,GAAG,YAAY,CAAC,MAAM,MAAM;IAAA;IACnE;EAED,MAAM,EAAE,KAAK,OAAO,GAAG,SAAS,QAAO;EAEvC,MAAM,QAAQ,SAAmB,SAAA,aAAC;EAClC,MAAM,MAAM,eAAe,QAAQ,IAAI,CAAA;EACvC,MAAM,UAAU,eAAc;AAE9B,QAAM,CAAC,OAAO,IAAI,GAAG,CAAC,OAAO,SAAS;AACpC,SAAM,QAAQ,IAAI,QAAQ,KAAK,MAAM;IACtC;EAED,MAAM,UAAU,WAAW,MAAK;EAEhC,SAAS,cAAc;AACrB,WAAQ,oBAAoB;AAC1B,UAAM,QAAQ;AACd,SAAK,YAAY,EAAC;AAClB,YAAQ,QAAQ;KACjB;;EAGH,MAAM,eAAe,eAAe,aAAY;EAChD,MAAM,gBAAgB,eAAe,cAAa;EAClD,MAAM,kBAAkB,eAAe,gBAAe;AAEtD,QACE,QACC,UAAU;AACT,OAAI,CAAC,MAAO;AAEZ,WAAQ,aAAa;IACnB,MAAM,EAAE,KAAK,UAAU,SAAS,MAAK;IACrC,MAAM,MAAM,QAAQ,IAAG;AACvB,SAAK,UAAU,IAAI,EAAC;AACpB,SAAK,SAAS;KAAE,GAAG,IAAI;KAAG,GAAG,IAAI;KAAG,CAAA;AACpC,SAAK,YAAY,MAAK;AAEtB,iBAAa,OAAO,MAAK;AACzB,kBAAc,OAAO,MAAK;AAC1B,oBAAgB,OAAO,MAAK;KAC7B;KAEH,EAAE,WAAW,MAAK,CACpB;AAEA,UAAQ,cAAc;GACpB;GACA;GACA;GACA;GACA;GACA,GAAG;GACJ,CAAA;;uBA7GC,YAqBQ,MAAA,YAAA,EAAA;IApBN,SAAQ;IACP,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,QAAA,CAAA;IACL,SAAS,QAAA;8DAAA,QAAO,QAAA;IACvB,UAAU,MAAA,SAAQ,IAAI,MAAA,SAAQ;;IAIpB,SAAO,cACD;KAAf,mBAAA,WAAe;KACf,YAA8B,aAAA,EAAnB,KAAI,cAAY,EAAA,MAAA,IAAA;KAE3B,mBAAA,OAAW;KACX,YAAgC,aAAA,EAApB,KAAI,eAAa,EAAA,MAAA,IAAA;KAE7B,mBAAA,QAAY;KACZ,YAAoC,aAAA,EAAtB,KAAI,iBAAe,EAAA,MAAA,IAAA;KAEjC,mBAAA,SAAa;KACb,YAAiE,aAAA;MAArC,OAAO,MAAA;8DAAA,MAAK,QAAA;MAAG,SAAO;;;2BAbiB,CAArE,mBAAqE,QAAA;KAA9D,OAAK,eAAE,UAAA,MAAS;KAAG,OAAK,eAAA,EAAA,iBAAqB,MAAA,OAAK,CAAA"}
+{"version":3,"file":"palette.js","names":[],"sources":["../../../src/components/palette/palette.vue"],"sourcesContent":["<template>\n  <u-tip\n    trigger=\"click\"\n    :class=\"cls.e('panel')\"\n    v-model:visible=\"visible\"\n    :disabled=\"disabled || readonly\"\n  >\n    <span :class=\"className\" :style=\"{ backgroundColor: color }\"> </span>\n\n    <template #content>\n      <!-- 饱和度和亮度 -->\n      <PaletteSV ref=\"palette-sv\" />\n\n      <!-- 色相 -->\n      <PaletteHue ref=\"palette-hue\" />\n\n      <!-- 透明度 -->\n      <PaletteAlpha ref=\"palette-alpha\" />\n\n      <!-- 颜色切换 -->\n      <PaletteColorSwitch v-model:color=\"color\" @clear=\"handleClear\" />\n    </template>\n  </u-tip>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useFormComponent, useFormFallbackProps, useUserAction } from '@veltra/compositions'\nimport { bem } from '@veltra/utils'\nimport { computed, provide, shallowRef, useTemplateRef, watch } from 'vue'\n\nimport type { PaletteProps } from '../../types'\nimport { UTip } from '../tip'\nimport { HSV2RGB, RGB2HEX, HEX2RGBA, RGB2HSV } from './color-transform'\nimport { PaletteDIKey } from './di'\nimport PaletteAlpha from './palette-alpha.vue'\nimport PaletteColorSwitch from './palette-color-switch.vue'\nimport PaletteHue from './palette-hue.vue'\nimport PaletteSV from './palette-sv.vue'\nimport { useHSV } from './use-hsv'\n\ndefineOptions({\n  name: 'Palette'\n})\n\nconst props = withDefaults(defineProps<PaletteProps>(), {\n  disabled: undefined,\n  readonly: undefined\n})\n\nconst { formProps } = useFormComponent()\n\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props])\n\nconst cls = bem('palette')\n\nconst className = computed(() => {\n  return [cls.b, cls.m(size.value), bem.is('no-color', !color.value)]\n})\n\nconst { HSV, alpha, ...rest } = useHSV()\n\nconst color = defineModel<string>()\nconst RGB = computed(() => HSV2RGB(HSV))\nconst { userAction, isUserActive } = useUserAction()\n\nwatch([alpha, RGB], ([alpha, RGB]) => {\n  color.value = `#${RGB2HEX(RGB, alpha)}`\n})\n\nconst visible = shallowRef(false)\n\nconst handleClear = userAction(() => {\n  color.value = ''\n  rest.updateAlpha(1)\n  visible.value = false\n})\n\nconst paletteSVRef = useTemplateRef('palette-sv')\nconst paletteHueRef = useTemplateRef('palette-hue')\nconst paletteAlphaRef = useTemplateRef('palette-alpha')\n\nwatch(\n  color,\n  (color) => {\n    if (!color) return\n    if (isUserActive()) return\n\n    const { RGB, alpha } = HEX2RGBA(color)\n    const hsv = RGB2HSV(RGB)\n    rest.updateHue(hsv.h)\n    rest.updateSV({ s: hsv.s, v: hsv.v })\n    rest.updateAlpha(alpha)\n\n    paletteSVRef.value?.init()\n    paletteHueRef.value?.init()\n    paletteAlphaRef.value?.init()\n  },\n  { immediate: true }\n)\n\nprovide(PaletteDIKey, {\n  cls,\n  HSV,\n  RGB,\n  alpha,\n  userAction,\n  isUserActive,\n  ...rest\n})\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA4CA,MAAM,QAAQ;EAKd,MAAM,EAAE,cAAc,kBAAiB;EAEvC,MAAM,EAAE,MAAM,UAAU,aAAa,qBAAqB,CAAC,aAAa,EAAE,EAAE,MAAM,CAAA;EAElF,MAAM,MAAM,IAAI,UAAS;EAEzB,MAAM,YAAY,eAAe;AAC/B,UAAO;IAAC,IAAI;IAAG,IAAI,EAAE,KAAK,MAAM;IAAE,IAAI,GAAG,YAAY,CAAC,MAAM,MAAM;IAAA;IACnE;EAED,MAAM,EAAE,KAAK,OAAO,GAAG,SAAS,QAAO;EAEvC,MAAM,QAAQ,SAAmB,SAAA,aAAC;EAClC,MAAM,MAAM,eAAe,QAAQ,IAAI,CAAA;EACvC,MAAM,EAAE,YAAY,iBAAiB,eAAc;AAEnD,QAAM,CAAC,OAAO,IAAI,GAAG,CAAC,OAAO,SAAS;AACpC,SAAM,QAAQ,IAAI,QAAQ,KAAK,MAAM;IACtC;EAED,MAAM,UAAU,WAAW,MAAK;EAEhC,MAAM,cAAc,iBAAiB;AACnC,SAAM,QAAQ;AACd,QAAK,YAAY,EAAC;AAClB,WAAQ,QAAQ;IACjB;EAED,MAAM,eAAe,eAAe,aAAY;EAChD,MAAM,gBAAgB,eAAe,cAAa;EAClD,MAAM,kBAAkB,eAAe,gBAAe;AAEtD,QACE,QACC,UAAU;AACT,OAAI,CAAC,MAAO;AACZ,OAAI,cAAc,CAAE;GAEpB,MAAM,EAAE,KAAK,UAAU,SAAS,MAAK;GACrC,MAAM,MAAM,QAAQ,IAAG;AACvB,QAAK,UAAU,IAAI,EAAC;AACpB,QAAK,SAAS;IAAE,GAAG,IAAI;IAAG,GAAG,IAAI;IAAG,CAAA;AACpC,QAAK,YAAY,MAAK;AAEtB,gBAAa,OAAO,MAAK;AACzB,iBAAc,OAAO,MAAK;AAC1B,mBAAgB,OAAO,MAAK;KAE9B,EAAE,WAAW,MAAK,CACpB;AAEA,UAAQ,cAAc;GACpB;GACA;GACA;GACA;GACA;GACA;GACA,GAAG;GACJ,CAAA;;uBA3GC,YAqBQ,MAAA,YAAA,EAAA;IApBN,SAAQ;IACP,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,QAAA,CAAA;IACL,SAAS,QAAA;8DAAA,QAAO,QAAA;IACvB,UAAU,MAAA,SAAQ,IAAI,MAAA,SAAQ;;IAIpB,SAAO,cACD;KAAf,mBAAA,WAAe;KACf,YAA8B,aAAA,EAAnB,KAAI,cAAY,EAAA,MAAA,IAAA;KAE3B,mBAAA,OAAW;KACX,YAAgC,aAAA,EAApB,KAAI,eAAa,EAAA,MAAA,IAAA;KAE7B,mBAAA,QAAY;KACZ,YAAoC,aAAA,EAAtB,KAAI,iBAAe,EAAA,MAAA,IAAA;KAEjC,mBAAA,SAAa;KACb,YAAiE,aAAA;MAArC,OAAO,MAAA;8DAAA,MAAK,QAAA;MAAG,SAAO,MAAA,YAAW;;;2BAbM,CAArE,mBAAqE,QAAA;KAA9D,OAAK,eAAE,UAAA,MAAS;KAAG,OAAK,eAAA,EAAA,iBAAqB,MAAA,OAAK,CAAA"}

package/dist/components/password-input/password-input.vue.d.ts

@@ -16,8 +16,8 @@ declare const __VLS_base: _$vue.DefineComponent<__VLS_PublicProps, {}, {}, {}, {
   "onUpdate:modelValue"?: ((value: string | undefined) => any) | undefined;
 }>, {
   disabled: boolean;
-  clearable: boolean;
   readonly: boolean;
+  clearable: boolean;
 }, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/components/pop-confirm/pop-confirm.vue.d.ts

@@ -15,8 +15,8 @@ declare const __VLS_base: _$vue.DefineComponent<PopConfirmProps, {}, {}, {}, {},
   onCancel?: (() => any) | undefined;
 }>, {
   icon: _$vue.Component;
-  direction: TipDirection;
   trigger: "hover" | "click";
+  direction: TipDirection;
   iconColor: string;
   confirmText: string;
   cancelText: string;

package/dist/components/progress-nodes/progress-nodes.vue.d.ts

@@ -16,15 +16,15 @@ type __VLS_Slots = {} & {
   default?: (props: typeof __VLS_3) => any;
 };
 declare const __VLS_base: _$vue.DefineComponent<ProgressNodesProps, {}, {}, {}, {}, _$vue.ComponentOptionsMixin, _$vue.ComponentOptionsMixin, {} & {
-  "update:modelValue": (value: string | number) => any;
   click: (node: Record<string, any>, index: number) => any;
+  "update:modelValue": (value: string | number) => any;
 }, string, _$vue.PublicProps, Readonly<ProgressNodesProps> & Readonly<{
-  "onUpdate:modelValue"?: ((value: string | number) => any) | undefined;
   onClick?: ((node: Record<string, any>, index: number) => any) | undefined;
+  "onUpdate:modelValue"?: ((value: string | number) => any) | undefined;
 }>, {
+  colorType: _$_veltra_utils0.ColorType;
   labelKey: string;
   valueKey: string;
-  colorType: _$_veltra_utils0.ColorType;
 }, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/components/rich-text-editor/rich-text-editor.vue.d.ts

@@ -12,10 +12,10 @@ declare const __VLS_export: _$vue.DefineComponent<RichTextEditorProps & {
 }> & Readonly<{
   "onUpdate:modelValue"?: ((value: string | undefined) => any) | undefined;
 }>, {
+  format: RichTextFormat;
   disabled: boolean;
-  placeholder: string;
   readonly: boolean;
-  format: RichTextFormat;
+  placeholder: string;
   toolbar: ToolbarItem[];
 }, {}, {}, {}, string, _$vue.ComponentProvideOptions, false, {}, any>;
 //#endregion

package/dist/components/select/select.js

@@ -8,7 +8,7 @@ import { useKeyboard } from "./use-keyboard.js";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createSlots, createTextVNode, createVNode, defineComponent, isRef, mergeModels, mergeProps, nextTick, normalizeClass, normalizeStyle, openBlock, renderList, renderSlot, shallowRef, toDisplayString, unref, useModel, watch, withCtx, withDirectives } from "vue";
 import { o } from "@cat-kit/core";
 import { FORM_EMPTY_CONTENT, bem, scrollIntoContainerView, withUnit } from "@veltra/utils";
-import { useFormComponent, useFormFallbackProps, useVirtual } from "@veltra/compositions";
+import { useFormComponent, useFormFallbackProps, useVirtualizer } from "@veltra/compositions";
 import { vFocus } from "@veltra/directives";
 import { ArrowDown, Search } from "@veltra/icons/normal";
 //#region src/components/select/select.vue
@@ -102,31 +102,34 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 				selected.value = void 0;
 			}
 		}, { immediate: true });
-		const { virtualList, totalHeight, virtualEnabled: _virtualEnabled, scrollTo, measureElement } = useVirtual({
+		const baseVirtualEnabled = computed(() => options.value.length > 80);
+		const virtualEnabled = computed(() => baseVirtualEnabled.value && !props.grid);
+		const { virtualizer, items } = useVirtualizer({
 			count: computed(() => options.value.length),
-			virtualThreshold: 80,
-			scrollEl: computed(() => scrollRef.value?.containerRef ?? null),
+			scrollEl: () => scrollRef.value?.containerRef ?? null,
+			contentEl: () => virtualEnabled.value ? scrollRef.value?.contentRef ?? null : null,
 			gap: 4,
 			estimateSize: () => 40
 		});
-		const virtualEnabled = computed(() => {
-			return _virtualEnabled.value && !props.grid;
-		});
 		const virtualOptions = computed(() => {
 			const _options = options.value;
 			const { labelKey, valueKey } = props;
-			return virtualList.value.map((item) => {
+			return items.value.map((item) => {
 				const option = _options[item.index];
 				return {
 					option,
 					index: item.index,
 					label: o(option).get(labelKey),
 					val: o(option).get(valueKey),
-					key: item.key,
+					key: item.index,
 					offset: item.start
 				};
 			});
 		});
+		const measureElement = (index, el) => virtualizer.measureElement(index, el);
+		function scrollTo(index) {
+			virtualizer.scrollToIndex(index, { align: "center" });
+		}
 		watch([scrollRef, virtualEnabled], ([scroll, virtualEnabled]) => {
 			if (!scroll || !props.modelValue) return;
 			if (virtualEnabled) {
@@ -238,7 +241,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 						})]),
 						_: 1
 					}, 8, ["modelValue"])), [[unref(vFocus)]])], 2)) : createCommentVNode("v-if", true),
-					createCommentVNode(" 单选列表 "),
+					createCommentVNode("\n        单选列表。虚拟化启用时，内容容器 height 由 useVirtualizer 命令式写入；\n        此处 content-style 仅承担 grid 相关样式，避免 height 变化触发模板重渲染。\n      "),
 					unref(options).length ? (openBlock(), createBlock(unref(_sfc_main$3), {
 						key: 1,
 						tag: "ul",
@@ -251,7 +254,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 							unref(bem).is("grid", !!__props.grid)
 						],
 						"content-style": {
-							height: virtualEnabled.value ? unref(withUnit)(unref(totalHeight), "px") : void 0,
 							gridTemplateColumns: __props.grid ? `repeat(${__props.grid.cols}, minmax(0px, 1fr))` : void 0,
 							gridGap: __props.grid ? unref(withUnit)(__props.grid.gap, "px") : void 0
 						}
@@ -264,7 +266,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 								style: normalizeStyle({ transform: `translateY(${offset}px)` }),
 								"data-index": index,
 								ref_for: true,
-								ref: unref(measureElement)
+								ref: (el) => measureElement(index, el)
 							}, [renderSlot(_ctx.$slots, "default", mergeProps({ ref_for: true }, {
 								option,
 								index