@veltra/desktop 1.0.7 → 1.0.9

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

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

@@ -1 +1 @@
-{"version":3,"file":"select.js","names":["$slots"],"sources":["../../../src/components/select/select.vue"],"sourcesContent":["<template>\n  <u-dropdown\n    v-if=\"!readonly\"\n    trigger=\"click\"\n    :class=\"[cls.b, bem.is('disabled', disabled)]\"\n    ref=\"dropdownRef\"\n    v-model:visible=\"dropdownVisible\"\n    :content-class=\"[cls.e('panel'), cls.em('panel', size), contentClass]\"\n    :content-style=\"contentStyle\"\n    :disabled=\"disabled\"\n    :min-width=\"minWidth\"\n    :width=\"width\"\n    @keydown=\"handleKeydown\"\n    @update:visible=\"handleDropdownVisible\"\n  >\n    <!-- 触发 -->\n    <template #trigger>\n      <u-input\n        :size=\"size\"\n        :disabled=\"disabled\"\n        :placeholder=\"placeholder\"\n        :clearable=\"clearable\"\n        :model-value=\"selected ? (o(selected).get(labelKey) ?? label) : modelValue\"\n        @clear=\"handleClear\"\n        @keydown=\"handleKeydown\"\n        native-readonly\n      >\n        <template #prefix v-if=\"$slots.prefix\">\n          <slot name=\"prefix\" />\n        </template>\n\n        <template #suffix>\n          <u-icon :class=\"cls.e('arrow')\">\n            <ArrowDown />\n          </u-icon>\n        </template>\n      </u-input>\n    </template>\n\n    <!-- 下拉内容 -->\n    <template #content>\n      <!-- 过滤器 -->\n      <div v-if=\"filterable\" :class=\"cls.e('content-filter')\">\n        <u-input placeholder=\"输入关键字进行搜索\" tabindex=\"0\" v-focus v-model=\"queryString\">\n          <template #suffix>\n            <u-icon>\n              <Search />\n            </u-icon>\n          </template>\n        </u-input>\n      </div>\n\n      <!-- 单选列表 -->\n      <u-scroll\n        v-if=\"options.length\"\n        tag=\"ul\"\n        :class=\"cls.e('options')\"\n        ref=\"scrollRef\"\n        :content-class=\"[\n          cls.e('options-wrap'),\n          bem.is('virtual', virtualEnabled),\n          bem.is('grid', !!grid)\n        ]\"\n        :content-style=\"{\n          height: virtualEnabled ? withUnit(totalHeight, 'px') : undefined,\n          gridTemplateColumns: grid ? `repeat(${grid.cols}, minmax(0px, 1fr))` : undefined,\n          gridGap: grid ? withUnit(grid.gap, 'px') : undefined\n        }\"\n      >\n        <template v-if=\"virtualEnabled\">\n          <!-- @vue-ignore -->\n          <li\n            v-for=\"{ option, index, val, label, key, offset } of virtualOptions\"\n            :class=\"[optionClass, bem.is('selected', index === currentIndex)]\"\n            @click=\"handleSelect(option, index)\"\n            :key=\"key\"\n            :style=\"{ transform: `translateY(${offset}px)` }\"\n            :data-index=\"index\"\n            :ref=\"measureElement\"\n          >\n            <slot v-bind=\"{ option, index }\">\n              {{ label }}\n            </slot>\n          </li>\n        </template>\n\n        <template v-else>\n          <li\n            v-for=\"(option, index) of options\"\n            :class=\"[optionClass, bem.is('selected', index === currentIndex)]\"\n            @click=\"handleSelect(option, index)\"\n            :data-index=\"index\"\n            :title=\"o(option).get(labelKey)\"\n            :key=\"o(option).get(valueKey)\"\n          >\n            <slot v-bind=\"{ option, index }\">\n              {{ o(option).get(labelKey) }}\n            </slot>\n          </li>\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  <template v-else>\n    {{ label || selected?.[labelKey] || FORM_EMPTY_CONTENT }}\n  </template>\n</template>\n\n<script lang=\"ts\" setup>\nimport { o } from '@cat-kit/core'\nimport { useFormComponent, useFormFallbackProps, useVirtual } from '@veltra/compositions'\nimport { vFocus } from '@veltra/directives'\nimport { ArrowDown, Search } from '@veltra/icons/normal'\nimport { bem, FORM_EMPTY_CONTENT, scrollIntoContainerView, withUnit } from '@veltra/utils'\nimport { computed, nextTick, shallowRef, watch } from 'vue'\n\nimport type {\n  SelectEmits,\n  SelectProps,\n  _SelectExposed,\n  DropdownExposed,\n  ScrollExposed\n} from '../../types'\nimport { UDropdown } from '../dropdown'\nimport { UEmpty } from '../empty'\nimport { UIcon } from '../icon'\nimport { UInput } from '../input'\nimport { UScroll } from '../scroll'\nimport { useKeyboard } from './use-keyboard'\nimport { useOptions } from './use-options'\n\ndefineOptions({ name: 'Select' })\n\nconst props = withDefaults(defineProps<SelectProps>(), {\n  labelKey: 'label',\n  valueKey: 'value',\n  placeholder: '请选择',\n  clearable: true,\n  disabled: undefined,\n  readonly: undefined\n})\n\nconst emit = defineEmits<SelectEmits>()\n\ndefineSlots<{\n  /** 前缀插槽 */\n  prefix?: () => any\n  /** 默认插槽 */\n  default?: (scope: { option: Record<string, any>; index: number }) => any\n}>()\n\nconst cls = bem('select')\n\nconst optionClass = cls.e('option')\n\nconst { formProps } = useFormComponent()\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props], {\n  size: 'default',\n  disabled: false,\n  readonly: false\n})\n\nconst currentIndex = shallowRef(-1)\nconst label = defineModel('text')\nconst selected = shallowRef<Record<string, any>>()\n\nconst dropdownRef = shallowRef<DropdownExposed>()\nconst scrollRef = shallowRef<ScrollExposed>()\n\nconst filterable = computed(() => {\n  return props.filterable || typeof props.options === 'function'\n})\n\nconst { queryString, options, temOptionsToCreatedOptions, clearCreatedOptions } = useOptions({\n  props\n})\n\n// TODO: 优化\nlet userSelecting = false\nfunction lock() {\n  userSelecting = true\n}\n\nfunction unlock() {\n  nextTick(() => {\n    userSelecting = false\n  })\n}\n\n// 回显\nwatch(\n  [() => props.modelValue, options],\n  ([modelValue, options]) => {\n    if (userSelecting) return\n\n    if (!options?.length) return\n\n    if (modelValue !== undefined) {\n      const { valueKey } = props\n      currentIndex.value = options.findIndex((option) => o(option).get(valueKey) === modelValue)\n      selected.value = options[currentIndex.value]\n    } else {\n      currentIndex.value = -1\n      selected.value = undefined\n    }\n  },\n  { immediate: true }\n)\n\nconst {\n  virtualList,\n  totalHeight,\n  virtualEnabled: _virtualEnabled,\n  scrollTo,\n  measureElement\n} = useVirtual({\n  count: computed(() => options.value.length),\n  virtualThreshold: 80,\n  scrollEl: computed(() => scrollRef.value?.containerRef ?? null),\n  gap: 4,\n  estimateSize: () => 40\n})\n\nconst virtualEnabled = computed(() => {\n  return _virtualEnabled.value && !props.grid\n})\n\nconst virtualOptions = computed(() => {\n  const _options = options.value\n  const { labelKey, valueKey } = props\n  return virtualList.value.map((item) => {\n    const option = _options[item.index]!\n    return {\n      option,\n      index: item.index,\n      label: o(option).get(labelKey),\n      val: o(option).get(valueKey),\n      key: item.key,\n      offset: item.start\n    }\n  })\n})\n\nwatch([scrollRef, virtualEnabled], ([scroll, virtualEnabled]) => {\n  if (!scroll || !props.modelValue) return\n\n  if (virtualEnabled) {\n    const index = options.value.findIndex((option) => option === selected.value)\n    index !== -1 && dropdownVisible.value && nextTick(() => scrollTo(index))\n  } else {\n    const selectedEl = scroll?.contentRef?.getElementsByClassName('is-selected')[0]\n    if (selectedEl) {\n      scrollIntoContainerView(selectedEl as HTMLElement, scroll.containerRef ?? null)\n    }\n  }\n})\n\nconst dropdownVisible = shallowRef(false)\n\nwatch(dropdownVisible, (v) => {\n  if (!v) {\n    queryString.value = ''\n  }\n})\n\nconst handleDropdownVisible = (visible: boolean) => {\n  if (!visible) {\n    queryString.value = ''\n  }\n}\n\n/** 单选 */\nconst handleSelect = (option: Record<string, any>, index: number) => {\n  lock()\n  selected.value = option\n\n  emit('update:modelValue', option?.[props.valueKey])\n  label.value = option?.[props.labelKey]\n  emit('change', option)\n  if (option.__isTemp) {\n    temOptionsToCreatedOptions()\n  }\n  currentIndex.value = index\n  dropdownRef.value?.close()\n\n  unlock()\n}\n\n/** 清除选项 */\nconst handleClear = () => {\n  lock()\n  selected.value = undefined\n  clearCreatedOptions()\n  emit('update:modelValue', undefined)\n  emit('change', undefined)\n  unlock()\n}\n\nfunction getCurrentEl() {\n  return scrollRef.value?.contentRef?.querySelector('li.is-selected') as HTMLElement | undefined\n}\n\nconst { handleKeydown } = useKeyboard({\n  options,\n  currentIndex,\n  selectOption: handleSelect,\n  getCurrentEl\n})\n</script>\n"],"mappings":"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"}
+{"version":3,"file":"select.js","names":["$slots"],"sources":["../../../src/components/select/select.vue"],"sourcesContent":["<template>\n  <u-dropdown\n    v-if=\"!readonly\"\n    trigger=\"click\"\n    :class=\"[cls.b, bem.is('disabled', disabled)]\"\n    ref=\"dropdownRef\"\n    v-model:visible=\"dropdownVisible\"\n    :content-class=\"[cls.e('panel'), cls.em('panel', size), contentClass]\"\n    :content-style=\"contentStyle\"\n    :disabled=\"disabled\"\n    :min-width=\"minWidth\"\n    :width=\"width\"\n    @keydown=\"handleKeydown\"\n    @update:visible=\"handleDropdownVisible\"\n  >\n    <!-- 触发 -->\n    <template #trigger>\n      <u-input\n        :size=\"size\"\n        :disabled=\"disabled\"\n        :placeholder=\"placeholder\"\n        :clearable=\"clearable\"\n        :model-value=\"selected ? (o(selected).get(labelKey) ?? label) : modelValue\"\n        @clear=\"handleClear\"\n        @keydown=\"handleKeydown\"\n        native-readonly\n      >\n        <template #prefix v-if=\"$slots.prefix\">\n          <slot name=\"prefix\" />\n        </template>\n\n        <template #suffix>\n          <u-icon :class=\"cls.e('arrow')\">\n            <ArrowDown />\n          </u-icon>\n        </template>\n      </u-input>\n    </template>\n\n    <!-- 下拉内容 -->\n    <template #content>\n      <!-- 过滤器 -->\n      <div v-if=\"filterable\" :class=\"cls.e('content-filter')\">\n        <u-input placeholder=\"输入关键字进行搜索\" tabindex=\"0\" v-focus v-model=\"queryString\">\n          <template #suffix>\n            <u-icon>\n              <Search />\n            </u-icon>\n          </template>\n        </u-input>\n      </div>\n\n      <!--\n        单选列表。虚拟化启用时，内容容器 height 由 useVirtualizer 命令式写入；\n        此处 content-style 仅承担 grid 相关样式，避免 height 变化触发模板重渲染。\n      -->\n      <u-scroll\n        v-if=\"options.length\"\n        tag=\"ul\"\n        :class=\"cls.e('options')\"\n        ref=\"scrollRef\"\n        :content-class=\"[\n          cls.e('options-wrap'),\n          bem.is('virtual', virtualEnabled),\n          bem.is('grid', !!grid)\n        ]\"\n        :content-style=\"{\n          gridTemplateColumns: grid ? `repeat(${grid.cols}, minmax(0px, 1fr))` : undefined,\n          gridGap: grid ? withUnit(grid.gap, 'px') : undefined\n        }\"\n      >\n        <template v-if=\"virtualEnabled\">\n          <!-- @vue-ignore -->\n          <li\n            v-for=\"{ option, index, val, label, key, offset } of virtualOptions\"\n            :class=\"[optionClass, bem.is('selected', index === currentIndex)]\"\n            @click=\"handleSelect(option, index)\"\n            :key=\"key\"\n            :style=\"{ transform: `translateY(${offset}px)` }\"\n            :data-index=\"index\"\n            :ref=\"(el) => measureElement(index, el as Element | null)\"\n          >\n            <slot v-bind=\"{ option, index }\">\n              {{ label }}\n            </slot>\n          </li>\n        </template>\n\n        <template v-else>\n          <li\n            v-for=\"(option, index) of options\"\n            :class=\"[optionClass, bem.is('selected', index === currentIndex)]\"\n            @click=\"handleSelect(option, index)\"\n            :data-index=\"index\"\n            :title=\"o(option).get(labelKey)\"\n            :key=\"o(option).get(valueKey)\"\n          >\n            <slot v-bind=\"{ option, index }\">\n              {{ o(option).get(labelKey) }}\n            </slot>\n          </li>\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  <template v-else>\n    {{ label || selected?.[labelKey] || FORM_EMPTY_CONTENT }}\n  </template>\n</template>\n\n<script lang=\"ts\" setup>\nimport { o } from '@cat-kit/core'\nimport { useFormComponent, useFormFallbackProps, useVirtualizer } from '@veltra/compositions'\nimport { vFocus } from '@veltra/directives'\nimport { ArrowDown, Search } from '@veltra/icons/normal'\nimport { bem, FORM_EMPTY_CONTENT, scrollIntoContainerView, withUnit } from '@veltra/utils'\nimport { computed, nextTick, shallowRef, watch } from 'vue'\n\nimport type {\n  SelectEmits,\n  SelectProps,\n  _SelectExposed,\n  DropdownExposed,\n  ScrollExposed\n} from '../../types'\nimport { UDropdown } from '../dropdown'\nimport { UEmpty } from '../empty'\nimport { UIcon } from '../icon'\nimport { UInput } from '../input'\nimport { UScroll } from '../scroll'\nimport { useKeyboard } from './use-keyboard'\nimport { useOptions } from './use-options'\n\ndefineOptions({ name: 'Select' })\n\nconst props = withDefaults(defineProps<SelectProps>(), {\n  labelKey: 'label',\n  valueKey: 'value',\n  placeholder: '请选择',\n  clearable: true,\n  disabled: undefined,\n  readonly: undefined\n})\n\nconst emit = defineEmits<SelectEmits>()\n\ndefineSlots<{\n  /** 前缀插槽 */\n  prefix?: () => any\n  /** 默认插槽 */\n  default?: (scope: { option: Record<string, any>; index: number }) => any\n}>()\n\nconst cls = bem('select')\n\nconst optionClass = cls.e('option')\n\nconst { formProps } = useFormComponent()\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props], {\n  size: 'default',\n  disabled: false,\n  readonly: false\n})\n\nconst currentIndex = shallowRef(-1)\nconst label = defineModel('text')\nconst selected = shallowRef<Record<string, any>>()\n\nconst dropdownRef = shallowRef<DropdownExposed>()\nconst scrollRef = shallowRef<ScrollExposed>()\n\nconst filterable = computed(() => {\n  return props.filterable || typeof props.options === 'function'\n})\n\nconst { queryString, options, temOptionsToCreatedOptions, clearCreatedOptions } = useOptions({\n  props\n})\n\n// TODO: 优化\nlet userSelecting = false\nfunction lock() {\n  userSelecting = true\n}\n\nfunction unlock() {\n  nextTick(() => {\n    userSelecting = false\n  })\n}\n\n// 回显\nwatch(\n  [() => props.modelValue, options],\n  ([modelValue, options]) => {\n    if (userSelecting) return\n\n    if (!options?.length) return\n\n    if (modelValue !== undefined) {\n      const { valueKey } = props\n      currentIndex.value = options.findIndex((option) => o(option).get(valueKey) === modelValue)\n      selected.value = options[currentIndex.value]\n    } else {\n      currentIndex.value = -1\n      selected.value = undefined\n    }\n  },\n  { immediate: true }\n)\n\nconst baseVirtualEnabled = computed(() => options.value.length > 80)\nconst virtualEnabled = computed(() => baseVirtualEnabled.value && !props.grid)\n\nconst { virtualizer, items } = useVirtualizer({\n  count: computed(() => options.value.length),\n  scrollEl: () => scrollRef.value?.containerRef ?? null,\n  contentEl: () => (virtualEnabled.value ? (scrollRef.value?.contentRef ?? null) : null),\n  gap: 4,\n  estimateSize: () => 40\n})\n\nconst virtualOptions = computed(() => {\n  const _options = options.value\n  const { labelKey, valueKey } = props\n  return items.value.map((item) => {\n    const option = _options[item.index]!\n    return {\n      option,\n      index: item.index,\n      label: o(option).get(labelKey),\n      val: o(option).get(valueKey),\n      key: item.index,\n      offset: item.start\n    }\n  })\n})\n\nconst measureElement: (index: number, el: Element | null) => void = (index, el) =>\n  virtualizer.measureElement(index, el)\n\nfunction scrollTo(index: number): void {\n  virtualizer.scrollToIndex(index, { align: 'center' })\n}\n\nwatch([scrollRef, virtualEnabled], ([scroll, virtualEnabled]) => {\n  if (!scroll || !props.modelValue) return\n\n  if (virtualEnabled) {\n    const index = options.value.findIndex((option) => option === selected.value)\n    index !== -1 && dropdownVisible.value && nextTick(() => scrollTo(index))\n  } else {\n    const selectedEl = scroll?.contentRef?.getElementsByClassName('is-selected')[0]\n    if (selectedEl) {\n      scrollIntoContainerView(selectedEl as HTMLElement, scroll.containerRef ?? null)\n    }\n  }\n})\n\nconst dropdownVisible = shallowRef(false)\n\nwatch(dropdownVisible, (v) => {\n  if (!v) {\n    queryString.value = ''\n  }\n})\n\nconst handleDropdownVisible = (visible: boolean) => {\n  if (!visible) {\n    queryString.value = ''\n  }\n}\n\n/** 单选 */\nconst handleSelect = (option: Record<string, any>, index: number) => {\n  lock()\n  selected.value = option\n\n  emit('update:modelValue', option?.[props.valueKey])\n  label.value = option?.[props.labelKey]\n  emit('change', option)\n  if (option.__isTemp) {\n    temOptionsToCreatedOptions()\n  }\n  currentIndex.value = index\n  dropdownRef.value?.close()\n\n  unlock()\n}\n\n/** 清除选项 */\nconst handleClear = () => {\n  lock()\n  selected.value = undefined\n  clearCreatedOptions()\n  emit('update:modelValue', undefined)\n  emit('change', undefined)\n  unlock()\n}\n\nfunction getCurrentEl() {\n  return scrollRef.value?.contentRef?.querySelector('li.is-selected') as HTMLElement | undefined\n}\n\nconst { handleKeydown } = useKeyboard({\n  options,\n  currentIndex,\n  selectOption: handleSelect,\n  getCurrentEl\n})\n</script>\n"],"mappings":"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"}

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

@@ -26,12 +26,12 @@ declare const __VLS_base: _$vue.DefineComponent<__VLS_PublicProps, {}, {}, {}, {
   "onUpdate:text"?: ((value: any) => any) | undefined;
   "onUpdate:label"?: ((label?: string | undefined) => any) | undefined;
 }>, {
+  disabled: boolean;
+  readonly: boolean;
   labelKey: string;
   valueKey: string;
   placeholder: string;
   clearable: boolean;
-  disabled: 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/select/style.js

@@ -1,2 +1,7 @@
+import "../icon/style.js";
+import "../dropdown/style.js";
+import "../scroll/style.js";
+import "../input/style.js";
+import "../empty/style.js";
 import "./style2.css";
 import "@veltra/directives/ripple/style.js";

package/dist/components/select/style2.css

@@ -15,26 +15,6 @@
 * --u-height-small: 24px;
 */
 /** 暗色：data-theme 与系统偏好，与 UITheme.injectBuiltInThemes 选择器策略一致 */
-.u-select {
-  --u-menu-hover-bg: rgba(148, 163, 184, 0.12);
-  --u-menu-hover-color: var(--u-text-color-title);
-  --u-menu-active-bg: rgba(59, 130, 246, 0.12);
-  --u-menu-active-color: var(--u-color-primary-dark-1);
-}
-html[data-theme=dark] .u-select {
-  --u-menu-hover-bg: rgba(148, 163, 184, 0.14);
-  --u-menu-hover-color: var(--u-text-color-title);
-  --u-menu-active-bg: rgba(96, 165, 250, 0.2);
-  --u-menu-active-color: var(--u-text-color-white);
-}
-@media (prefers-color-scheme: dark) {
-  html:not([data-theme=light]) .u-select {
-    --u-menu-hover-bg: rgba(148, 163, 184, 0.14);
-    --u-menu-hover-color: var(--u-text-color-title);
-    --u-menu-active-bg: rgba(96, 165, 250, 0.2);
-    --u-menu-active-color: var(--u-text-color-white);
-  }
-}
 .u-select {
   width: 100%;
 }

package/dist/components/slider/slider-thumb.js

@@ -1,6 +1,6 @@
 import { sliderContextKey } from "./di.js";
 import { computed, createElementBlock, defineComponent, inject, normalizeClass, normalizeStyle, openBlock, unref, useTemplateRef, watch } from "vue";
-import { useDrag, useUpdateLock } from "@veltra/compositions";
+import { useDrag, useUserAction } from "@veltra/compositions";
 //#region src/components/slider/slider-thumb.vue
 const _sfc_main = /* @__PURE__ */ defineComponent({
 	__name: "slider-thumb",
@@ -15,7 +15,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 			if (sliderProps.vertical) return { transform: `translate(0, ${props.modelValue}px)` };
 			return { transform: `translate(${props.modelValue}px, 0)` };
 		});
-		const { updateAndLock, update } = useUpdateLock();
+		const { userAction, isUserActive } = useUserAction();
 		function updateModel(offset) {
 			offset = getOffsetByStep(offset);
 			emit("update:modelValue", offset);
@@ -23,25 +23,22 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 		}
 		const dragger = useDrag({
 			target: computed(() => disabled.value ? null : thumbRef.value),
-			onDrag({ offsetX, offsetY }) {
-				updateAndLock(() => {
-					updateModel(sliderProps.vertical ? offsetY : offsetX);
-				});
-			},
+			onDrag: userAction(({ offsetX, offsetY }) => {
+				updateModel(sliderProps.vertical ? offsetY : offsetX);
+			}),
 			rangeX: range,
 			rangeY: range,
-			onDragEnd({ offsetX, offsetY }) {
-				updateAndLock(() => {
-					updateDragger(updateModel(sliderProps.vertical ? offsetY : offsetX));
-				});
-			}
+			onDragEnd: userAction(({ offsetX, offsetY }) => {
+				updateDragger(updateModel(sliderProps.vertical ? offsetY : offsetX));
+			})
 		});
 		function updateDragger(offset) {
 			if (sliderProps.vertical) dragger.update({ offsetY: offset });
 			else dragger.update({ offsetX: offset });
 		}
 		watch(() => props.modelValue, (offset) => {
-			update(() => updateDragger(offset));
+			if (isUserActive()) return;
+			updateDragger(offset);
 		});
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", {

package/dist/components/slider/slider-thumb.js.map

@@ -1 +1 @@
-{"version":3,"file":"slider-thumb.js","names":[],"sources":["../../../src/components/slider/slider-thumb.vue"],"sourcesContent":["<template>\n  <div ref=\"thumb\" :class=\"cls.e('thumb')\" :style></div>\n</template>\n<script lang=\"ts\" setup>\nimport { useDrag, useUpdateLock } from '@veltra/compositions'\nimport { computed, inject, useTemplateRef, watch } from 'vue'\n\nimport { sliderContextKey } from './di'\n\nconst props = defineProps<{\n  modelValue: number\n}>()\n\nconst emit = defineEmits<{\n  (e: 'update:modelValue', value: number): void\n}>()\n\nconst { cls, range, disabled, sliderProps, getOffsetByStep } = inject(sliderContextKey)!\n\nconst thumbRef = useTemplateRef('thumb')\n\nconst style = computed(() => {\n  if (sliderProps.vertical) {\n    return {\n      transform: `translate(0, ${props.modelValue}px)`\n    }\n  }\n  return {\n    transform: `translate(${props.modelValue}px, 0)`\n  }\n})\n\nconst { updateAndLock, update } = useUpdateLock()\n\nfunction updateModel(offset: number) {\n  offset = getOffsetByStep(offset)\n  emit('update:modelValue', offset)\n  return offset\n}\n\nconst dragger = useDrag({\n  target: computed(() => (disabled.value ? null : thumbRef.value)),\n\n  onDrag({ offsetX, offsetY }) {\n    updateAndLock(() => {\n      updateModel(sliderProps.vertical ? offsetY : offsetX)\n    })\n  },\n  rangeX: range,\n  rangeY: range,\n  onDragEnd({ offsetX, offsetY }) {\n    updateAndLock(() => {\n      const offset = updateModel(sliderProps.vertical ? offsetY : offsetX)\n      updateDragger(offset)\n    })\n  }\n})\n\nfunction updateDragger(offset: number) {\n  if (sliderProps.vertical) {\n    dragger.update({ offsetY: offset })\n  } else {\n    dragger.update({ offsetX: offset })\n  }\n}\n\nwatch(\n  () => props.modelValue,\n  (offset) => {\n    update(() => updateDragger(offset))\n  }\n)\n</script>\n"],"mappings":";;;;;;;;;EASA,MAAM,QAAQ;EAId,MAAM,OAAO;EAIb,MAAM,EAAE,KAAK,OAAO,UAAU,aAAa,oBAAoB,OAAO,iBAAiB;EAEvF,MAAM,WAAW,eAAe,QAAO;EAEvC,MAAM,QAAQ,eAAe;AAC3B,OAAI,YAAY,SACd,QAAO,EACL,WAAW,gBAAgB,MAAM,WAAW,MAC9C;AAEF,UAAO,EACL,WAAW,aAAa,MAAM,WAAW,SAC3C;IACD;EAED,MAAM,EAAE,eAAe,WAAW,eAAc;EAEhD,SAAS,YAAY,QAAgB;AACnC,YAAS,gBAAgB,OAAM;AAC/B,QAAK,qBAAqB,OAAM;AAChC,UAAO;;EAGT,MAAM,UAAU,QAAQ;GACtB,QAAQ,eAAgB,SAAS,QAAQ,OAAO,SAAS,MAAO;GAEhE,OAAO,EAAE,SAAS,WAAW;AAC3B,wBAAoB;AAClB,iBAAY,YAAY,WAAW,UAAU,QAAO;MACrD;;GAEH,QAAQ;GACR,QAAQ;GACR,UAAU,EAAE,SAAS,WAAW;AAC9B,wBAAoB;AAElB,mBADe,YAAY,YAAY,WAAW,UAAU,QAAO,CAC/C;MACrB;;GAEJ,CAAA;EAED,SAAS,cAAc,QAAgB;AACrC,OAAI,YAAY,SACd,SAAQ,OAAO,EAAE,SAAS,QAAQ,CAAA;OAElC,SAAQ,OAAO,EAAE,SAAS,QAAQ,CAAA;;AAItC,cACQ,MAAM,aACX,WAAW;AACV,gBAAa,cAAc,OAAO,CAAA;IAEtC;;uBAtEE,mBAAsD,OAAA;IAAjD,KAAI;IAAS,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,QAAA,CAAA;IAAY,OAAK,eAAL,MAAA,MAAK"}
+{"version":3,"file":"slider-thumb.js","names":[],"sources":["../../../src/components/slider/slider-thumb.vue"],"sourcesContent":["<template>\n  <div ref=\"thumb\" :class=\"cls.e('thumb')\" :style></div>\n</template>\n<script lang=\"ts\" setup>\nimport { useDrag, useUserAction } from '@veltra/compositions'\nimport { computed, inject, useTemplateRef, watch } from 'vue'\n\nimport { sliderContextKey } from './di'\n\nconst props = defineProps<{\n  modelValue: number\n}>()\n\nconst emit = defineEmits<{\n  (e: 'update:modelValue', value: number): void\n}>()\n\nconst { cls, range, disabled, sliderProps, getOffsetByStep } = inject(sliderContextKey)!\n\nconst thumbRef = useTemplateRef('thumb')\n\nconst style = computed(() => {\n  if (sliderProps.vertical) {\n    return {\n      transform: `translate(0, ${props.modelValue}px)`\n    }\n  }\n  return {\n    transform: `translate(${props.modelValue}px, 0)`\n  }\n})\n\nconst { userAction, isUserActive } = useUserAction()\n\nfunction updateModel(offset: number) {\n  offset = getOffsetByStep(offset)\n  emit('update:modelValue', offset)\n  return offset\n}\n\nconst dragger = useDrag({\n  target: computed(() => (disabled.value ? null : thumbRef.value)),\n\n  onDrag: userAction(({ offsetX, offsetY }) => {\n    updateModel(sliderProps.vertical ? offsetY : offsetX)\n  }),\n  rangeX: range,\n  rangeY: range,\n  onDragEnd: userAction(({ offsetX, offsetY }) => {\n    const offset = updateModel(sliderProps.vertical ? offsetY : offsetX)\n    updateDragger(offset)\n  })\n})\n\nfunction updateDragger(offset: number) {\n  if (sliderProps.vertical) {\n    dragger.update({ offsetY: offset })\n  } else {\n    dragger.update({ offsetX: offset })\n  }\n}\n\nwatch(\n  () => props.modelValue,\n  (offset) => {\n    if (isUserActive()) return\n    updateDragger(offset)\n  }\n)\n</script>\n"],"mappings":";;;;;;;;;EASA,MAAM,QAAQ;EAId,MAAM,OAAO;EAIb,MAAM,EAAE,KAAK,OAAO,UAAU,aAAa,oBAAoB,OAAO,iBAAiB;EAEvF,MAAM,WAAW,eAAe,QAAO;EAEvC,MAAM,QAAQ,eAAe;AAC3B,OAAI,YAAY,SACd,QAAO,EACL,WAAW,gBAAgB,MAAM,WAAW,MAC9C;AAEF,UAAO,EACL,WAAW,aAAa,MAAM,WAAW,SAC3C;IACD;EAED,MAAM,EAAE,YAAY,iBAAiB,eAAc;EAEnD,SAAS,YAAY,QAAgB;AACnC,YAAS,gBAAgB,OAAM;AAC/B,QAAK,qBAAqB,OAAM;AAChC,UAAO;;EAGT,MAAM,UAAU,QAAQ;GACtB,QAAQ,eAAgB,SAAS,QAAQ,OAAO,SAAS,MAAO;GAEhE,QAAQ,YAAY,EAAE,SAAS,cAAc;AAC3C,gBAAY,YAAY,WAAW,UAAU,QAAO;KACpD;GACF,QAAQ;GACR,QAAQ;GACR,WAAW,YAAY,EAAE,SAAS,cAAc;AAE9C,kBADe,YAAY,YAAY,WAAW,UAAU,QAAO,CAC/C;KACrB;GACF,CAAA;EAED,SAAS,cAAc,QAAgB;AACrC,OAAI,YAAY,SACd,SAAQ,OAAO,EAAE,SAAS,QAAQ,CAAA;OAElC,SAAQ,OAAO,EAAE,SAAS,QAAQ,CAAA;;AAItC,cACQ,MAAM,aACX,WAAW;AACV,OAAI,cAAc,CAAE;AACpB,iBAAc,OAAM;IAExB;;uBAnEE,mBAAsD,OAAA;IAAjD,KAAI;IAAS,OAAK,eAAE,MAAA,IAAG,CAAC,EAAC,QAAA,CAAA;IAAY,OAAK,eAAL,MAAA,MAAK"}

package/dist/components/slider/slider.js

@@ -3,7 +3,7 @@ import _sfc_main$1 from "./slider-thumb.js";
 import { useSlider } from "./use-slider.js";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, isRef, normalizeClass, normalizeStyle, openBlock, provide, renderList, toDisplayString, unref, watch, withModifiers } from "vue";
 import { bem } from "@veltra/utils";
-import { useFormComponent, useFormFallbackProps, useUpdateLock } from "@veltra/compositions";
+import { useFormComponent, useFormFallbackProps, useUserAction } from "@veltra/compositions";
 //#region src/components/slider/slider.vue
 const _hoisted_1 = { key: 1 };
 const _sfc_main = /* @__PURE__ */ defineComponent({
@@ -61,7 +61,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 				[sizeProp]: `${Math.abs(offset1.value - offset2.value)}px`
 			};
 		});
-		const { updateAndLock, update } = useUpdateLock();
+		const { userAction, isUserActive } = useUserAction();
 		watch([sliderSize, ...[
 			"modelValue",
 			"range",
@@ -69,13 +69,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 			"min",
 			"vertical"
 		].map((k) => () => props[k])], ([size, value, range]) => {
-			update(() => {
-				if (value === void 0 || size === 0) return;
-				if (range) {
-					offset1.value = value2SliderOffset(value[0]);
-					offset2.value = value2SliderOffset(value[1]);
-				} else offset1.value = value2SliderOffset(value);
-			});
+			if (isUserActive()) return;
+			if (value === void 0 || size === 0) return;
+			if (range) {
+				offset1.value = value2SliderOffset(value[0]);
+				offset2.value = value2SliderOffset(value[1]);
+			} else offset1.value = value2SliderOffset(value);
 		}, { immediate: true });
 		const ticks = computed(() => {
 			const { step, min, max } = props;
@@ -84,12 +83,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
 			const offsetPercent = step / (max - min) * 100;
 			return [...Array.from({ length: tickLength }, (_, i) => i * offsetPercent), 100];
 		});
-		watch([offset1, offset2], (v) => {
-			updateAndLock(() => {
-				if (props.range) emit("update:modelValue", v.map(sliderOffset2Value).sort());
-				else emit("update:modelValue", sliderOffset2Value(v[0]));
-			});
-		});
+		watch([offset1, offset2], userAction((v) => {
+			if (props.range) emit("update:modelValue", v.map(sliderOffset2Value).sort());
+			else emit("update:modelValue", sliderOffset2Value(v[0]));
+		}));
 		function handleClickSlider(e) {
 			if (disabled.value || props.range) return;
 			const rect = e.currentTarget.getBoundingClientRect();

package/dist/components/slider/slider.js.map

@@ -1 +1 @@
-{"version":3,"file":"slider.js","names":[],"sources":["../../../src/components/slider/slider.vue"],"sourcesContent":["<template>\n  <div v-if=\"!readonly\" :class=\"className\">\n    <div :class=\"cls.e('track')\" ref=\"sliderRef\" @click=\"handleClickSlider\">\n      <div :class=\"cls.e('bar')\" :style=\"barStyles\" />\n\n      <slider-thumb v-model=\"offset1\" @click.stop />\n      <slider-thumb v-if=\"range\" v-model=\"offset2\" @click.stop />\n\n      <div\n        v-for=\"tick in ticks\"\n        :style=\"{ [vertical ? 'bottom' : 'left']: `${tick}%` }\"\n        :class=\"cls.e('tick')\"\n      />\n    </div>\n  </div>\n\n  <div v-else>\n    {{ props.modelValue }}\n  </div>\n</template>\n\n<script lang=\"ts\" setup generic=\"T extends number | [number, number]\">\nimport { useFormComponent, useFormFallbackProps, useUpdateLock } from '@veltra/compositions'\nimport { bem } from '@veltra/utils'\nimport { computed, provide, watch } from 'vue'\n\nimport type { SliderProps, SliderEmits } from '../../types'\nimport { sliderContextKey } from './di'\nimport SliderThumb from './slider-thumb.vue'\nimport { useSlider } from './use-slider'\n\ndefineOptions({\n  name: 'Slider'\n})\n\nconst props = withDefaults(defineProps<SliderProps<T>>(), {\n  min: 0,\n  max: 100,\n  disabled: undefined,\n  readonly: undefined\n})\n\nconst emit = defineEmits<SliderEmits<T>>()\n\nconst cls = bem('slider')\n\nconst { formProps } = useFormComponent()\n\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props])\n\nconst className = computed(() => {\n  return [\n    cls.b,\n    cls.m(size.value),\n    bem.is('disabled', disabled.value),\n    bem.is('range', props.range),\n    bem.is('horizontal', !props.vertical),\n    bem.is('vertical', props.vertical)\n  ]\n})\n\nconst {\n  offset1,\n  offset2,\n  sliderRef,\n  slideRange,\n  sliderSize,\n  sliderOffset2Value,\n  value2SliderOffset,\n  getOffsetByStep\n} = useSlider(props)\n\nconst barStyles = computed(() => {\n  const { vertical } = props\n  const offsetProp = vertical ? 'bottom' : 'left'\n  const sizeProp = vertical ? 'height' : 'width'\n\n  if (!props.range) {\n    return {\n      [offsetProp]: 0,\n      [sizeProp]: `${Math.abs(offset1.value)}px`\n    }\n  }\n  return {\n    [offsetProp]: `${Math.min(Math.abs(offset1.value), Math.abs(offset2.value))}px`,\n    [sizeProp]: `${Math.abs(offset1.value - offset2.value)}px`\n  }\n})\n\nconst { updateAndLock, update } = useUpdateLock()\n\nwatch(\n  [sliderSize, ...['modelValue', 'range', 'max', 'min', 'vertical'].map((k) => () => props[k])],\n  ([size, value, range]) => {\n    update(() => {\n      if (value === undefined || size === 0) return\n\n      if (range) {\n        offset1.value = value2SliderOffset((value as [number, number])[0])\n        offset2.value = value2SliderOffset((value as [number, number])[1])\n      } else {\n        offset1.value = value2SliderOffset(value as number)\n      }\n    })\n  },\n  { immediate: true }\n)\n\nconst ticks = computed(() => {\n  const { step, min, max } = props\n  if (!step) return []\n  const tickLength = Math.ceil((max! - min!) / step)\n  const offsetPercent = (step / (max! - min!)) * 100\n\n  return [...Array.from({ length: tickLength }, (_, i) => i * offsetPercent), 100]\n})\n\nwatch([offset1, offset2], (v) => {\n  updateAndLock(() => {\n    if (props.range) {\n      emit('update:modelValue', v.map(sliderOffset2Value).sort() as T)\n    } else {\n      emit('update:modelValue', sliderOffset2Value(v[0]) as T)\n    }\n  })\n})\n\nfunction handleClickSlider(e: MouseEvent) {\n  if (disabled.value || props.range) return\n\n  // 获取点击位置相对于滑块的偏移量\n  const rect = (e.currentTarget as HTMLElement).getBoundingClientRect()\n\n  offset1.value = getOffsetByStep(e.clientX - rect.left)\n}\n\nprovide(sliderContextKey, {\n  sliderProps: props,\n  disabled,\n  range: slideRange,\n  cls,\n  getOffsetByStep\n})\n</script>\n"],"mappings":"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"}
+{"version":3,"file":"slider.js","names":[],"sources":["../../../src/components/slider/slider.vue"],"sourcesContent":["<template>\n  <div v-if=\"!readonly\" :class=\"className\">\n    <div :class=\"cls.e('track')\" ref=\"sliderRef\" @click=\"handleClickSlider\">\n      <div :class=\"cls.e('bar')\" :style=\"barStyles\" />\n\n      <slider-thumb v-model=\"offset1\" @click.stop />\n      <slider-thumb v-if=\"range\" v-model=\"offset2\" @click.stop />\n\n      <div\n        v-for=\"tick in ticks\"\n        :style=\"{ [vertical ? 'bottom' : 'left']: `${tick}%` }\"\n        :class=\"cls.e('tick')\"\n      />\n    </div>\n  </div>\n\n  <div v-else>\n    {{ props.modelValue }}\n  </div>\n</template>\n\n<script lang=\"ts\" setup generic=\"T extends number | [number, number]\">\nimport { useFormComponent, useFormFallbackProps, useUserAction } from '@veltra/compositions'\nimport { bem } from '@veltra/utils'\nimport { computed, provide, watch } from 'vue'\n\nimport type { SliderProps, SliderEmits } from '../../types'\nimport { sliderContextKey } from './di'\nimport SliderThumb from './slider-thumb.vue'\nimport { useSlider } from './use-slider'\n\ndefineOptions({\n  name: 'Slider'\n})\n\nconst props = withDefaults(defineProps<SliderProps<T>>(), {\n  min: 0,\n  max: 100,\n  disabled: undefined,\n  readonly: undefined\n})\n\nconst emit = defineEmits<SliderEmits<T>>()\n\nconst cls = bem('slider')\n\nconst { formProps } = useFormComponent()\n\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props])\n\nconst className = computed(() => {\n  return [\n    cls.b,\n    cls.m(size.value),\n    bem.is('disabled', disabled.value),\n    bem.is('range', props.range),\n    bem.is('horizontal', !props.vertical),\n    bem.is('vertical', props.vertical)\n  ]\n})\n\nconst {\n  offset1,\n  offset2,\n  sliderRef,\n  slideRange,\n  sliderSize,\n  sliderOffset2Value,\n  value2SliderOffset,\n  getOffsetByStep\n} = useSlider(props)\n\nconst barStyles = computed(() => {\n  const { vertical } = props\n  const offsetProp = vertical ? 'bottom' : 'left'\n  const sizeProp = vertical ? 'height' : 'width'\n\n  if (!props.range) {\n    return {\n      [offsetProp]: 0,\n      [sizeProp]: `${Math.abs(offset1.value)}px`\n    }\n  }\n  return {\n    [offsetProp]: `${Math.min(Math.abs(offset1.value), Math.abs(offset2.value))}px`,\n    [sizeProp]: `${Math.abs(offset1.value - offset2.value)}px`\n  }\n})\n\nconst { userAction, isUserActive } = useUserAction()\n\nwatch(\n  [sliderSize, ...['modelValue', 'range', 'max', 'min', 'vertical'].map((k) => () => props[k])],\n  ([size, value, range]) => {\n    if (isUserActive()) return\n    if (value === undefined || size === 0) return\n\n    if (range) {\n      offset1.value = value2SliderOffset((value as [number, number])[0])\n      offset2.value = value2SliderOffset((value as [number, number])[1])\n    } else {\n      offset1.value = value2SliderOffset(value as number)\n    }\n  },\n  { immediate: true }\n)\n\nconst ticks = computed(() => {\n  const { step, min, max } = props\n  if (!step) return []\n  const tickLength = Math.ceil((max! - min!) / step)\n  const offsetPercent = (step / (max! - min!)) * 100\n\n  return [...Array.from({ length: tickLength }, (_, i) => i * offsetPercent), 100]\n})\n\nwatch(\n  [offset1, offset2],\n  userAction((v) => {\n    if (props.range) {\n      emit('update:modelValue', v.map(sliderOffset2Value).sort() as T)\n    } else {\n      emit('update:modelValue', sliderOffset2Value(v[0]) as T)\n    }\n  })\n)\n\nfunction handleClickSlider(e: MouseEvent) {\n  if (disabled.value || props.range) return\n\n  // 获取点击位置相对于滑块的偏移量\n  const rect = (e.currentTarget as HTMLElement).getBoundingClientRect()\n\n  offset1.value = getOffsetByStep(e.clientX - rect.left)\n}\n\nprovide(sliderContextKey, {\n  sliderProps: props,\n  disabled,\n  range: slideRange,\n  cls,\n  getOffsetByStep\n})\n</script>\n"],"mappings":"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"}

package/dist/components/steps/style.js

@@ -1 +1,3 @@
+import "../icon/style.js";
+import "../tip/style.js";
 import "./style2.css";

package/dist/components/steps/style2.css

@@ -18,49 +18,48 @@
 .u-steps {
   padding: 0;
   margin: 0;
-  /** 颜色变量 */
 }
-.u-steps__finished--primary {
-  --finished-color: var(--u-color-primary);
+.u-steps__finished--primary__item.is-finished {
+  color: var(--u-color-primary);
 }
-.u-steps__current--primary {
-  --current-color: var(--u-color-primary);
+.u-steps__current--primary__item.is-current {
+  color: var(--u-color-primary);
 }
-.u-steps__finished--success {
-  --finished-color: var(--u-color-success);
+.u-steps__finished--success__item.is-finished {
+  color: var(--u-color-success);
 }
-.u-steps__current--success {
-  --current-color: var(--u-color-success);
+.u-steps__current--success__item.is-current {
+  color: var(--u-color-success);
 }
-.u-steps__finished--warning {
-  --finished-color: var(--u-color-warning);
+.u-steps__finished--warning__item.is-finished {
+  color: var(--u-color-warning);
 }
-.u-steps__current--warning {
-  --current-color: var(--u-color-warning);
+.u-steps__current--warning__item.is-current {
+  color: var(--u-color-warning);
 }
-.u-steps__finished--danger {
-  --finished-color: var(--u-color-danger);
+.u-steps__finished--danger__item.is-finished {
+  color: var(--u-color-danger);
 }
-.u-steps__current--danger {
-  --current-color: var(--u-color-danger);
+.u-steps__current--danger__item.is-current {
+  color: var(--u-color-danger);
 }
-.u-steps__finished--info {
-  --finished-color: var(--u-color-info);
+.u-steps__finished--info__item.is-finished {
+  color: var(--u-color-info);
 }
-.u-steps__current--info {
-  --current-color: var(--u-color-info);
+.u-steps__current--info__item.is-current {
+  color: var(--u-color-info);
 }
-.u-steps__finished--disabled {
-  --finished-color: var(--u-color-disabled);
+.u-steps__finished--disabled__item.is-finished {
+  color: var(--u-color-disabled);
 }
-.u-steps__current--disabled {
-  --current-color: var(--u-color-disabled);
+.u-steps__current--disabled__item.is-current {
+  color: var(--u-color-disabled);
 }
-.u-steps__finished--default {
-  --finished-color: var(--u-color-default);
+.u-steps__finished--default__item.is-finished {
+  color: var(--u-color-default);
 }
-.u-steps__current--default {
-  --current-color: var(--u-color-default);
+.u-steps__current--default__item.is-current {
+  color: var(--u-color-default);
 }
 .u-steps {
   /** 步骤项 */
@@ -69,12 +68,6 @@
   font-weight: 600;
   color: var(--u-text-color-placeholder);
 }
-.u-steps__item.is-finished {
-  color: var(--finished-color);
-}
-.u-steps__item.is-current {
-  color: var(--current-color);
-}
 .u-steps__node {
   position: relative;
 }

package/dist/components/switch/style2.css

@@ -16,9 +16,6 @@
 */
 /** 暗色：data-theme 与系统偏好，与 UITheme.injectBuiltInThemes 选择器策略一致 */
 .u-switch {
-  --u-switch-height-small: 18px;
-  --u-switch-height-default: 20px;
-  --u-switch-height-large: 24px;
   display: inline-flex;
   align-items: center;
   cursor: pointer;

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

@@ -1 +1 @@
-{"version":3,"file":"di.js","names":[],"sources":["../../../src/components/table/di.ts"],"sourcesContent":["import type { VirtualReturned } from '@veltra/compositions'\nimport type { BEM } from '@veltra/utils'\nimport type { InjectionKey, ShallowRef, Slots } from 'vue'\n\nimport type {\n  TableProps,\n  TableColumnSlotsScope,\n  TableColumnRenderContext,\n  TableRow,\n  RenderReturn,\n  TableColumn,\n  TableRowSlotsScope\n} from '../../types'\nimport type { ColumnNode } from './node/col'\nimport type { ColumnConfig } from './use-columns'\n\nexport const TableDIKey: InjectionKey<\n  {\n    /** 表格属性 */\n    tableProps: TableProps\n    /** 表格插槽 */\n    tableSlots: Slots\n    /** 类 */\n    cls: BEM<'table'>\n    /** 行 */\n    rows: ShallowRef<TableRow[]>\n    /** 选中行 */\n    checkedRows: ShallowRef<Set<TableRow>>\n    /** 结构化列 */\n    columnConfig: ColumnConfig\n    /** 事件处理方法 */\n    handleRowClick: (row: TableRow, ev: MouseEvent) => void\n    /** 单元格点击 */\n    handleCellClick: (row: TableRow, column: TableColumn, ev: MouseEvent) => void\n    /** 表格列插槽node */\n    getColumnSlotsNode: (ctx: TableColumnSlotsScope | TableColumnRenderContext) => RenderReturn\n    /** 展开行插槽node */\n    getExpandRowSlotsNode: (ctx: TableRowSlotsScope) => RenderReturn\n    /** 表头插槽node */\n    getHeaderSlotsNode: (ctx: { column: ColumnNode }) => RenderReturn\n\n    /** 展开/隐藏子节点 */\n    toggleTreeRowExpand: (row: TableRow) => void\n\n    /** 获取单元格的类 */\n    getCellClass: (column: ColumnNode) => string\n\n    /** 获取表头单元格的类 */\n    getHeaderCellClass: (column: ColumnNode) => string\n\n    /** 获取单元格上下文 */\n    getCellCtx: (\n      row: TableRow,\n      column: ColumnNode\n    ) => TableColumnSlotsScope | TableColumnRenderContext\n  } & VirtualReturned\n> = Symbol('TableDIKey')\n\nexport const TableResizeKey: InjectionKey<{\n  handleResizeMousedown: (e: MouseEvent, resizeColumn: ColumnNode) => void\n  headerRef: ShallowRef<HTMLElement | undefined>\n}> = Symbol('TableResizeKey')\n"],"mappings":";AAgBA,MAAa,aAwCT,OAAO,aAAa;AAExB,MAAa,iBAGR,OAAO,iBAAiB"}
+{"version":3,"file":"di.js","names":[],"sources":["../../../src/components/table/di.ts"],"sourcesContent":["import type { VirtualItem } from '@veltra/compositions'\nimport type { BEM } from '@veltra/utils'\nimport type { ComputedRef, InjectionKey, ShallowRef, Slots } from 'vue'\n\nimport type {\n  TableProps,\n  TableColumnSlotsScope,\n  TableColumnRenderContext,\n  TableRow,\n  RenderReturn,\n  TableColumn,\n  TableRowSlotsScope\n} from '../../types'\nimport type { ColumnNode } from './node/col'\nimport type { ColumnConfig } from './use-columns'\n\nexport const TableDIKey: InjectionKey<\n  {\n    /** 表格属性 */\n    tableProps: TableProps\n    /** 表格插槽 */\n    tableSlots: Slots\n    /** 类 */\n    cls: BEM<'table'>\n    /** 行 */\n    rows: ShallowRef<TableRow[]>\n    /** 选中行 */\n    checkedRows: ShallowRef<Set<TableRow>>\n    /** 结构化列 */\n    columnConfig: ColumnConfig\n    /** 事件处理方法 */\n    handleRowClick: (row: TableRow, ev: MouseEvent) => void\n    /** 单元格点击 */\n    handleCellClick: (row: TableRow, column: TableColumn, ev: MouseEvent) => void\n    /** 表格列插槽node */\n    getColumnSlotsNode: (ctx: TableColumnSlotsScope | TableColumnRenderContext) => RenderReturn\n    /** 展开行插槽node */\n    getExpandRowSlotsNode: (ctx: TableRowSlotsScope) => RenderReturn\n    /** 表头插槽node */\n    getHeaderSlotsNode: (ctx: { column: ColumnNode }) => RenderReturn\n\n    /** 展开/隐藏子节点 */\n    toggleTreeRowExpand: (row: TableRow) => void\n\n    /** 获取单元格的类 */\n    getCellClass: (column: ColumnNode) => string\n\n    /** 获取表头单元格的类 */\n    getHeaderCellClass: (column: ColumnNode) => string\n\n    /** 获取单元格上下文 */\n    getCellCtx: (\n      row: TableRow,\n      column: ColumnNode\n    ) => TableColumnSlotsScope | TableColumnRenderContext\n\n    /**\n     * 当前渲染窗口的虚拟项列表。\n     *\n     * 由 `useVirtualizer` 拆分出的 `items` shallowRef：仅在底层 `items`\n     * 引用变化时才更新，`isScrolling` / 纯尺寸变化不会导致此 ref 更新。\n     */\n    virtualList: ShallowRef<VirtualItem[]>\n    /** 是否启用虚拟列表 */\n    virtualEnabled: ComputedRef<boolean>\n    /**\n     * 测量行元素尺寸（参数顺序与底层 `Virtualizer.measureElement` 一致）。\n     *\n     * 元素卸载（`el === null`）时会从底层解绑，避免被移除的 `<tr>` 继续触发\n     * size=0 测量回调。\n     */\n    measureElement: (index: number, el: Element | null) => void\n  }\n> = Symbol('TableDIKey')\n\nexport const TableResizeKey: InjectionKey<{\n  handleResizeMousedown: (e: MouseEvent, resizeColumn: ColumnNode) => void\n  headerRef: ShallowRef<HTMLElement | undefined>\n}> = Symbol('TableResizeKey')\n"],"mappings":";AAgBA,MAAa,aAyDT,OAAO,aAAa;AAExB,MAAa,iBAGR,OAAO,iBAAiB"}

package/dist/components/table/node/row.d.ts

@@ -16,7 +16,16 @@ declare class TableRowNode<Data extends Record<string, any> = Record<string, any
   isCurrent: boolean;
   /** 是否选中 */
   checked: boolean;
-  uid: number | string;
+  /**
+   * 行的稳定唯一标识。
+   *
+   * E2 不变式：`uid` 在单个 `TableRowNode` 实例的生命周期内不可变更。
+   * `useVirtualizer` 的 `getItemKey: i => rows[i].uid` 依赖该不变式来复用测量缓存；
+   * 若 uid 在运行时变更，虚拟列表的尺寸表会错配导致滚动抖动。
+   * 当前代码路径（`createRow` / `copy`）始终为每个新节点分配一次 uid，
+   * 所以该不变式天然成立；此处使用 `readonly` 做编译期锁定。
+   */
+  readonly uid: number | string;
   children?: TableRowNode<Data>[];
   /**
    *

package/dist/components/table/node/row.js

@@ -19,6 +19,15 @@ var TableRowNode = class TableRowNode extends TreeNode {
 	isCurrent = false;
 	/** 是否选中 */
 	checked = false;
+	/**
+	* 行的稳定唯一标识。
+	*
+	* E2 不变式：`uid` 在单个 `TableRowNode` 实例的生命周期内不可变更。
+	* `useVirtualizer` 的 `getItemKey: i => rows[i].uid` 依赖该不变式来复用测量缓存；
+	* 若 uid 在运行时变更，虚拟列表的尺寸表会错配导致滚动抖动。
+	* 当前代码路径（`createRow` / `copy`）始终为每个新节点分配一次 uid，
+	* 所以该不变式天然成立；此处使用 `readonly` 做编译期锁定。
+	*/
 	uid;
 	children = void 0;
 	/**

package/dist/components/table/node/row.js.map

@@ -1 +1 @@
-{"version":3,"file":"row.js","names":[],"sources":["../../../../src/components/table/node/row.ts"],"sourcesContent":["import { TreeNode } from '@cat-kit/core'\nimport { isReactive, shallowReactive } from 'vue'\n\n/**\n * TODO: 优化参数，对大数据量来说，对象字面量参数会使内存占用过高\n */\nexport class TableRowNode<Data extends Record<string, any> = Record<string, any>> extends TreeNode<\n  Data,\n  TableRowNode<Data>\n> {\n  /** 索引路径 */\n  get indexes(): number[] {\n    if (!this.parent) return [this.index]\n    return this.parent.indexes.concat(this.index)\n  }\n\n  isExpandRow = false\n\n  /** 是否操作中 */\n  operating = false\n\n  /** 是否展开 */\n  expanded = false\n\n  /** 是否为当前的点击行 */\n  isCurrent = false\n\n  /** 是否选中 */\n  checked = false\n\n  uid: number | string\n\n  override children?: TableRowNode<Data>[] = undefined\n\n  /**\n   *\n   * @param data 一个普通对象或者一个响应式对象\n   * @param index 索引值\n   * @param depth 深度（根为 0）\n   * @param parent 父行节点\n   * @param uid 行唯一标识\n   * @returns\n   */\n  constructor(options: {\n    data: Data\n    index: number\n    depth: number\n    parent?: TableRowNode<Data>\n    uid: number | string\n  }) {\n    const { data, index, depth, parent, uid } = options\n\n    if (!data) {\n      super(data as Data, index, depth, parent)\n    } else {\n      super(isReactive(data) ? data : shallowReactive(data), index, depth, parent)\n    }\n    this.uid = uid\n    return shallowReactive(this)\n  }\n\n  copy() {\n    const row = new TableRowNode({\n      data: this.data,\n      index: this.index,\n      depth: this.depth,\n      parent: this.parent ?? undefined,\n      uid: `expand_${this.uid}`\n    })\n\n    row.isExpandRow = true\n\n    return row\n  }\n}\n"],"mappings":";;;;;;AAMA,IAAa,eAAb,MAAa,qBAA6E,SAGxF;;CAEA,IAAI,UAAoB;AACtB,MAAI,CAAC,KAAK,OAAQ,QAAO,CAAC,KAAK,MAAM;AACrC,SAAO,KAAK,OAAO,QAAQ,OAAO,KAAK,MAAM;;CAG/C,cAAc;;CAGd,YAAY;;CAGZ,WAAW;;CAGX,YAAY;;CAGZ,UAAU;CAEV;CAEA,WAA2C,KAAA;;;;;;;;;;CAW3C,YAAY,SAMT;EACD,MAAM,EAAE,MAAM,OAAO,OAAO,QAAQ,QAAQ;AAE5C,MAAI,CAAC,KACH,OAAM,MAAc,OAAO,OAAO,OAAO;MAEzC,OAAM,WAAW,KAAK,GAAG,OAAO,gBAAgB,KAAK,EAAE,OAAO,OAAO,OAAO;AAE9E,OAAK,MAAM;AACX,SAAO,gBAAgB,KAAK;;CAG9B,OAAO;EACL,MAAM,MAAM,IAAI,aAAa;GAC3B,MAAM,KAAK;GACX,OAAO,KAAK;GACZ,OAAO,KAAK;GACZ,QAAQ,KAAK,UAAU,KAAA;GACvB,KAAK,UAAU,KAAK;GACrB,CAAC;AAEF,MAAI,cAAc;AAElB,SAAO"}
+{"version":3,"file":"row.js","names":[],"sources":["../../../../src/components/table/node/row.ts"],"sourcesContent":["import { TreeNode } from '@cat-kit/core'\nimport { isReactive, shallowReactive } from 'vue'\n\n/**\n * TODO: 优化参数，对大数据量来说，对象字面量参数会使内存占用过高\n */\nexport class TableRowNode<Data extends Record<string, any> = Record<string, any>> extends TreeNode<\n  Data,\n  TableRowNode<Data>\n> {\n  /** 索引路径 */\n  get indexes(): number[] {\n    if (!this.parent) return [this.index]\n    return this.parent.indexes.concat(this.index)\n  }\n\n  isExpandRow = false\n\n  /** 是否操作中 */\n  operating = false\n\n  /** 是否展开 */\n  expanded = false\n\n  /** 是否为当前的点击行 */\n  isCurrent = false\n\n  /** 是否选中 */\n  checked = false\n\n  /**\n   * 行的稳定唯一标识。\n   *\n   * E2 不变式：`uid` 在单个 `TableRowNode` 实例的生命周期内不可变更。\n   * `useVirtualizer` 的 `getItemKey: i => rows[i].uid` 依赖该不变式来复用测量缓存；\n   * 若 uid 在运行时变更，虚拟列表的尺寸表会错配导致滚动抖动。\n   * 当前代码路径（`createRow` / `copy`）始终为每个新节点分配一次 uid，\n   * 所以该不变式天然成立；此处使用 `readonly` 做编译期锁定。\n   */\n  readonly uid: number | string\n\n  override children?: TableRowNode<Data>[] = undefined\n\n  /**\n   *\n   * @param data 一个普通对象或者一个响应式对象\n   * @param index 索引值\n   * @param depth 深度（根为 0）\n   * @param parent 父行节点\n   * @param uid 行唯一标识\n   * @returns\n   */\n  constructor(options: {\n    data: Data\n    index: number\n    depth: number\n    parent?: TableRowNode<Data>\n    uid: number | string\n  }) {\n    const { data, index, depth, parent, uid } = options\n\n    if (!data) {\n      super(data as Data, index, depth, parent)\n    } else {\n      super(isReactive(data) ? data : shallowReactive(data), index, depth, parent)\n    }\n    this.uid = uid\n    return shallowReactive(this)\n  }\n\n  copy() {\n    const row = new TableRowNode({\n      data: this.data,\n      index: this.index,\n      depth: this.depth,\n      parent: this.parent ?? undefined,\n      uid: `expand_${this.uid}`\n    })\n\n    row.isExpandRow = true\n\n    return row\n  }\n}\n"],"mappings":";;;;;;AAMA,IAAa,eAAb,MAAa,qBAA6E,SAGxF;;CAEA,IAAI,UAAoB;AACtB,MAAI,CAAC,KAAK,OAAQ,QAAO,CAAC,KAAK,MAAM;AACrC,SAAO,KAAK,OAAO,QAAQ,OAAO,KAAK,MAAM;;CAG/C,cAAc;;CAGd,YAAY;;CAGZ,WAAW;;CAGX,YAAY;;CAGZ,UAAU;;;;;;;;;;CAWV;CAEA,WAA2C,KAAA;;;;;;;;;;CAW3C,YAAY,SAMT;EACD,MAAM,EAAE,MAAM,OAAO,OAAO,QAAQ,QAAQ;AAE5C,MAAI,CAAC,KACH,OAAM,MAAc,OAAO,OAAO,OAAO;MAEzC,OAAM,WAAW,KAAK,GAAG,OAAO,gBAAgB,KAAK,EAAE,OAAO,OAAO,OAAO;AAE9E,OAAK,MAAM;AACX,SAAO,gBAAgB,KAAK;;CAG9B,OAAO;EACL,MAAM,MAAM,IAAI,aAAa;GAC3B,MAAM,KAAK;GACX,OAAO,KAAK;GACZ,OAAO,KAAK;GACZ,QAAQ,KAAK,UAAU,KAAA;GACvB,KAAK,UAAU,KAAK;GACrB,CAAC;AAEF,MAAI,cAAc;AAElB,SAAO"}

package/dist/components/table/style.js

@@ -1 +1,8 @@
+import "../icon/style.js";
+import "../button/style.js";
+import "../tip/style.js";
+import "../scroll/style.js";
+import "../checkbox/style.js";
+import "../empty/style.js";
+import "../radio/style.js";
 import "./style2.css";

package/dist/components/table/style2.css

@@ -15,47 +15,6 @@
 * --u-height-small: 24px;
 */
 /** 暗色：data-theme 与系统偏好，与 UITheme.injectBuiltInThemes 选择器策略一致 */
-.u-table {
-  --u-table-border-color: #e9e9e9;
-  --u-table-header-bg: #f4f5f7;
-  --u-table-header-color: var(--u-text-color-title);
-  --u-table-stripe-bg: #f8fafc;
-  --u-table-stripe-color: inherit;
-  --u-table-hover-bg: var(--u-bg-color-hover);
-  --u-table-hover-color: inherit;
-  --u-table-current-bg: var(--u-bg-color-hover);
-  --u-table-current-color: inherit;
-  --u-table-checked-bg: var(--u-color-primary-light-9);
-  --u-table-checked-color: inherit;
-}
-html[data-theme=dark] .u-table {
-  --u-table-border-color: #404040;
-  --u-table-header-bg: #2a2a2a;
-  --u-table-header-color: var(--u-text-color-main);
-  --u-table-stripe-bg: #2a2a2a;
-  --u-table-stripe-color: var(--u-text-color-main);
-  --u-table-hover-bg: #333333;
-  --u-table-hover-color: var(--u-text-color-title);
-  --u-table-current-bg: var(--u-bg-color-hover);
-  --u-table-current-color: inherit;
-  --u-table-checked-bg: var(--u-color-primary-dark-1);
-  --u-table-checked-color: inherit;
-}
-@media (prefers-color-scheme: dark) {
-  html:not([data-theme=light]) .u-table {
-    --u-table-border-color: #404040;
-    --u-table-header-bg: #2a2a2a;
-    --u-table-header-color: var(--u-text-color-main);
-    --u-table-stripe-bg: #2a2a2a;
-    --u-table-stripe-color: var(--u-text-color-main);
-    --u-table-hover-bg: #333333;
-    --u-table-hover-color: var(--u-text-color-title);
-    --u-table-current-bg: var(--u-bg-color-hover);
-    --u-table-current-color: inherit;
-    --u-table-checked-bg: var(--u-color-primary-dark-1);
-    --u-table-checked-color: inherit;
-  }
-}
 .u-table {
   width: 100%;
   position: relative;